|
|
@@ -1,78 +1,46 @@
|
|
|
-@extends('app.stat-tree.stat-trees.single')
|
|
|
-@section('page')
|
|
|
+@extends ('layouts/template')
|
|
|
+@section('content')
|
|
|
<link rel="stylesheet" href="/jstree/themes/default/style.min.css" />
|
|
|
-
|
|
|
- <div id="statTreeEdit-{{$statTree->id}}">
|
|
|
- <div id="statTreeView" class="row">
|
|
|
-
|
|
|
- <!-- clauses -->
|
|
|
- <div class="col-3 pr-0">
|
|
|
- <div class="d-flex align-items-baseline mb-2">
|
|
|
- <h6 class="font-weight-bold m-0">Available Clauses</h6>
|
|
|
- <div moe relative wide class="ml-3">
|
|
|
- <a href="#" start show>+ Add</a>
|
|
|
- <form url="{{ route("practice-management.api.clause.create") }}" class="frm-clause-add-edit" hook="reloadClausesTree">
|
|
|
- @csrf
|
|
|
- <div class="mb-2">
|
|
|
- <label class="text-secondary text-sm mb-1">Model</label>
|
|
|
- <input type="text" class="form-control form-control-sm" name="model" readonly value="{{$statTree->model}}">
|
|
|
- </div>
|
|
|
- <div class="mb-2">
|
|
|
- <label class="text-secondary text-sm mb-1">Question</label>
|
|
|
- <input type="text" class="form-control form-control-sm" name="question" autofocus>
|
|
|
- </div>
|
|
|
- <div class="mb-2">
|
|
|
- <label class="text-secondary text-sm mb-1">Answer</label>
|
|
|
- <input type="text" class="form-control form-control-sm" name="answer">
|
|
|
- </div>
|
|
|
- <div class="mb-2">
|
|
|
- <label class="text-secondary text-sm mb-1">Label</label>
|
|
|
- <input type="text" class="form-control form-control-sm" name="label" readonly>
|
|
|
- </div>
|
|
|
- <div class="mb-2">
|
|
|
- <label class="text-secondary text-sm mb-1">Clause Text</label>
|
|
|
- <input type="text" class="form-control form-control-sm" name="clauseText">
|
|
|
- </div>
|
|
|
- <div class="d-flex align-items-center">
|
|
|
- <button class="btn btn-sm btn-primary mr-2" type="button" submit>Save</button>
|
|
|
- <button class="btn btn-sm btn-default mr-2 border" type="button" cancel>Cancel</button>
|
|
|
- </div>
|
|
|
- </form>
|
|
|
- </div>
|
|
|
- <a href="#" class="clause-expand-all ml-3" title="Expand All"><i class="fa fa-angle-double-down text-secondary"></i></a>
|
|
|
- <a href="#" class="clause-collapse-all ml-2" title="Collapse All"><i class="fa fa-angle-double-up text-secondary"></i></a>
|
|
|
- </div>
|
|
|
- <div class="mb-3 overflow-auto clauses-view pb-5" id="clauses-view-{{$statTree->id}}"></div>
|
|
|
-
|
|
|
- <!-- hidden moes invoked due to context actions -->
|
|
|
- <div class="border mb-3 p-2 position-absolute" style="left: -10000px; top: -10000px;">
|
|
|
- <div class="d-inline-flex align-items-baseline">
|
|
|
-
|
|
|
- <!-- edit clause -->
|
|
|
- <div moe center relative wide class="ml-3 mr-2" id="edit-clause-moe">
|
|
|
- <a href="#" start show><i class="text-sm fa fa-edit on-hover-opaque"></i></a>
|
|
|
- <form url="{{ route("practice-management.api.clause.update") }}" class="frm-clause-add-edit" center hook="reloadClausesTree">
|
|
|
+ <script src="/jstree/jstree.min.js"></script>
|
|
|
+ <div class="mcp-theme-1">
|
|
|
+ <div class="card border-0 rounded-0 d-flex flex-column body-height">
|
|
|
+ <div class="card-header">
|
|
|
+ <div class="d-flex align-items-center justify-content-between">
|
|
|
+ <div class="d-flex align-items-center">
|
|
|
+ <div class="mr-3">
|
|
|
+ <span>Name:</span>
|
|
|
+ <span class="font-weight-bold">{{ $statTree->name }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="mr-3">
|
|
|
+ <span>Model:</span>
|
|
|
+ <span class="font-weight-bold">{{ $statTree->model }}</span>
|
|
|
+ </div>
|
|
|
+ <div class="mr-3">
|
|
|
+ <span>Slug:</span>
|
|
|
+ <span class="font-weight-bold">{{ $statTree->slug }}</span>
|
|
|
+ </div>
|
|
|
+ <div moe relative wide class="ml-auto">
|
|
|
+ <a href="#" start show class="btn btn-sm btn-primary text-white">Edit</a>
|
|
|
+ <form url="{{ route("practice-management.api.statTree.updateBasic") }}">
|
|
|
@csrf
|
|
|
- <input type="hidden" name="uid">
|
|
|
+ <input type="hidden" name="uid" value="{{$statTree->uid}}">
|
|
|
<div class="mb-2">
|
|
|
- <label class="text-secondary text-sm mb-1">Model</label>
|
|
|
- <input type="text" class="form-control form-control-sm" name="model" readonly>
|
|
|
+ <label class="text-secondary text-sm mb-1">Name *</label>
|
|
|
+ <input type="text" class="form-control form-control-sm" name="name" value="{{$statTree->name}}" autofocus required>
|
|
|
</div>
|
|
|
<div class="mb-2">
|
|
|
- <label class="text-secondary text-sm mb-1">Question</label>
|
|
|
- <input type="text" class="form-control form-control-sm" name="question">
|
|
|
+ <label class="text-secondary text-sm mb-1">Model *</label>
|
|
|
+ <input type="text" class="form-control form-control-sm" data-option-list="model-options" autocomplete="off" name="model" value="{{$statTree->model}}" required>
|
|
|
+ <div id="model-options" class="data-option-list">
|
|
|
+ <?php $models = \Illuminate\Support\Facades\DB::select('SELECT distinct(model) as m FROM clause order by model'); ?>
|
|
|
+ @foreach($models as $m)
|
|
|
+ <div>{!! $m->m !!}</div>
|
|
|
+ @endforeach
|
|
|
+ </div>
|
|
|
</div>
|
|
|
<div class="mb-2">
|
|
|
- <label class="text-secondary text-sm mb-1">Answer</label>
|
|
|
- <input type="text" class="form-control form-control-sm" name="answer">
|
|
|
- </div>
|
|
|
- <div class="mb-2">
|
|
|
- <label class="text-secondary text-sm mb-1">Label</label>
|
|
|
- <input type="text" class="form-control form-control-sm" name="label" readonly>
|
|
|
- </div>
|
|
|
- <div class="mb-2">
|
|
|
- <label class="text-secondary text-sm mb-1">Clause Text</label>
|
|
|
- <input type="text" class="form-control form-control-sm" name="clauseText">
|
|
|
+ <label class="text-secondary text-sm mb-1">Slug *</label>
|
|
|
+ <input type="text" class="form-control form-control-sm" name="slug" value="{{$statTree->slug}}" required>
|
|
|
</div>
|
|
|
<div class="d-flex align-items-center">
|
|
|
<button class="btn btn-sm btn-primary mr-2" type="button" submit>Save</button>
|
|
|
@@ -80,859 +48,949 @@
|
|
|
</div>
|
|
|
</form>
|
|
|
</div>
|
|
|
-
|
|
|
- <!-- remove clause -->
|
|
|
- <div moe relative center id="remove-clause-moe">
|
|
|
- <a href="#" start show><i class="text-sm fa fa-trash-alt on-hover-opaque text-danger"></i></a>
|
|
|
- <form url="{{ route("practice-management.api.clause.remove") }}" center hook="reloadClausesTree">
|
|
|
- @csrf
|
|
|
- <input type="hidden" name="uid">
|
|
|
- <p>Are you sure?</p>
|
|
|
- <div class="d-flex align-items-center">
|
|
|
- <button class="btn btn-sm btn-danger mr-2" type="button" submit>Remove</button>
|
|
|
- <button class="btn btn-sm btn-default mr-2 border" type="button" cancel>Cancel</button>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <a href="{{route('practice-management.statTrees.list')}}" class="btn btn-sm btn-primary text-white"><i class="fas fa-network-wired"></i> View All Stat Trees</a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="card-body p-0 flex-grow-1">
|
|
|
+ <div id="statTreeEdit-{{$statTree->id}}" class="row m-0 h-100">
|
|
|
+
|
|
|
+ <!-- clauses -->
|
|
|
+ <div class="col-3 p-0 h-100">
|
|
|
+
|
|
|
+ <div class="d-flex flex-column h-100">
|
|
|
+ <div class="d-flex align-items-center pl-2 height-35px border-bottom bg-light">
|
|
|
+ <h6 class="font-weight-bold m-0 text-secondary">Available Clauses</h6>
|
|
|
+ <div moe relative wide class="ml-3">
|
|
|
+ <a href="#" start show>+ Add</a>
|
|
|
+ <form url="{{ route("practice-management.api.clause.create") }}" class="frm-clause-add-edit" hook="reloadClausesTree">
|
|
|
+ @csrf
|
|
|
+ <div class="mb-2">
|
|
|
+ <label class="text-secondary text-sm mb-1">Model</label>
|
|
|
+ <input type="text" class="form-control form-control-sm" name="model" readonly value="{{$statTree->model}}">
|
|
|
+ </div>
|
|
|
+ <div class="mb-2">
|
|
|
+ <label class="text-secondary text-sm mb-1">Question</label>
|
|
|
+ <input type="text" class="form-control form-control-sm" name="question" autofocus>
|
|
|
+ </div>
|
|
|
+ <div class="mb-2">
|
|
|
+ <label class="text-secondary text-sm mb-1">Answer</label>
|
|
|
+ <input type="text" class="form-control form-control-sm" name="answer">
|
|
|
+ </div>
|
|
|
+ <div class="mb-2">
|
|
|
+ <label class="text-secondary text-sm mb-1">Label</label>
|
|
|
+ <input type="text" class="form-control form-control-sm" name="label" readonly>
|
|
|
+ </div>
|
|
|
+ <div class="mb-2">
|
|
|
+ <label class="text-secondary text-sm mb-1">Clause Text</label>
|
|
|
+ <input type="text" class="form-control form-control-sm" name="clauseText">
|
|
|
+ </div>
|
|
|
+ <div class="d-flex align-items-center">
|
|
|
+ <button class="btn btn-sm btn-primary mr-2" type="button" submit>Save</button>
|
|
|
+ <button class="btn btn-sm btn-default mr-2 border" type="button" cancel>Cancel</button>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
</div>
|
|
|
- </form>
|
|
|
+ <a href="#" class="clause-expand-all ml-3" title="Expand All"><i class="fa fa-angle-double-down text-secondary"></i></a>
|
|
|
+ <a href="#" class="clause-collapse-all ml-2" title="Collapse All"><i class="fa fa-angle-double-up text-secondary"></i></a>
|
|
|
+ </div>
|
|
|
+ <div class="flex-grow-1 overflow-overlay-on-hover pl-1">
|
|
|
+ <div class="overflow-auto clauses-view pb-5" id="clauses-view-{{$statTree->id}}"></div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
|
|
|
- <!-- add clause arg -->
|
|
|
- <div moe relative center id="add-clause-arg-moe">
|
|
|
- <a href="#" start show><i class="text-sm fa fa-trash-alt on-hover-opaque text-danger"></i></a>
|
|
|
- <form url="{{ route("practice-management.api.clauseArg.create") }}" center hook="reloadClausesTree">
|
|
|
- @csrf
|
|
|
- <input type="hidden" name="clauseId">
|
|
|
- <div class="mb-2">
|
|
|
- <label class="text-secondary text-sm mb-1">Arg Text</label>
|
|
|
- <input type="text" class="form-control form-control-sm" name="argText" required>
|
|
|
+ <!-- hidden moes invoked due to context actions -->
|
|
|
+ <div class="border mb-3 p-2 position-absolute" style="left: -10000px; top: -10000px;">
|
|
|
+ <div class="d-inline-flex align-items-baseline">
|
|
|
+
|
|
|
+ <!-- edit clause -->
|
|
|
+ <div moe center relative wide class="ml-3 mr-2" id="edit-clause-moe">
|
|
|
+ <a href="#" start show><i class="text-sm fa fa-edit on-hover-opaque"></i></a>
|
|
|
+ <form url="{{ route("practice-management.api.clause.update") }}" class="frm-clause-add-edit" center hook="reloadClausesTree">
|
|
|
+ @csrf
|
|
|
+ <input type="hidden" name="uid">
|
|
|
+ <div class="mb-2">
|
|
|
+ <label class="text-secondary text-sm mb-1">Model</label>
|
|
|
+ <input type="text" class="form-control form-control-sm" name="model" readonly>
|
|
|
+ </div>
|
|
|
+ <div class="mb-2">
|
|
|
+ <label class="text-secondary text-sm mb-1">Question</label>
|
|
|
+ <input type="text" class="form-control form-control-sm" name="question">
|
|
|
+ </div>
|
|
|
+ <div class="mb-2">
|
|
|
+ <label class="text-secondary text-sm mb-1">Answer</label>
|
|
|
+ <input type="text" class="form-control form-control-sm" name="answer">
|
|
|
+ </div>
|
|
|
+ <div class="mb-2">
|
|
|
+ <label class="text-secondary text-sm mb-1">Label</label>
|
|
|
+ <input type="text" class="form-control form-control-sm" name="label" readonly>
|
|
|
+ </div>
|
|
|
+ <div class="mb-2">
|
|
|
+ <label class="text-secondary text-sm mb-1">Clause Text</label>
|
|
|
+ <input type="text" class="form-control form-control-sm" name="clauseText">
|
|
|
+ </div>
|
|
|
+ <div class="d-flex align-items-center">
|
|
|
+ <button class="btn btn-sm btn-primary mr-2" type="button" submit>Save</button>
|
|
|
+ <button class="btn btn-sm btn-default mr-2 border" type="button" cancel>Cancel</button>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
</div>
|
|
|
- <div class="mb-2">
|
|
|
- <label class="text-secondary text-sm mb-1">Field Type</label>
|
|
|
- <select class="form-control form-control-sm" name="fieldType" required>
|
|
|
- <option value="">-- select --</option>
|
|
|
- <option value="number">Number</option>
|
|
|
- <option value="date">Date</option>
|
|
|
- <option value="string">String</option>
|
|
|
- <option value="bool">Boolean</option>
|
|
|
- </select>
|
|
|
- </div>
|
|
|
- <div class="d-flex align-items-center">
|
|
|
- <button class="btn btn-sm btn-primary mr-2" type="button" submit>Save</button>
|
|
|
- <button class="btn btn-sm btn-default mr-2 border" type="button" cancel>Cancel</button>
|
|
|
- </div>
|
|
|
- </form>
|
|
|
- </div>
|
|
|
|
|
|
- <!-- edit clause arg -->
|
|
|
- <div moe relative center id="edit-clause-arg-moe">
|
|
|
- <a href="#" start show><i class="text-sm fa fa-trash-alt on-hover-opaque text-danger"></i></a>
|
|
|
- <form url="{{ route("practice-management.api.clauseArg.update") }}" center hook="reloadClausesTree">
|
|
|
- @csrf
|
|
|
- <input type="hidden" name="id">
|
|
|
- <div class="mb-2">
|
|
|
- <label class="text-secondary text-sm mb-1">Arg Text</label>
|
|
|
- <input type="text" class="form-control form-control-sm" name="argText" required>
|
|
|
+ <!-- remove clause -->
|
|
|
+ <div moe relative center id="remove-clause-moe">
|
|
|
+ <a href="#" start show><i class="text-sm fa fa-trash-alt on-hover-opaque text-danger"></i></a>
|
|
|
+ <form url="{{ route("practice-management.api.clause.remove") }}" center hook="reloadClausesTree">
|
|
|
+ @csrf
|
|
|
+ <input type="hidden" name="uid">
|
|
|
+ <p>Are you sure?</p>
|
|
|
+ <div class="d-flex align-items-center">
|
|
|
+ <button class="btn btn-sm btn-danger mr-2" type="button" submit>Remove</button>
|
|
|
+ <button class="btn btn-sm btn-default mr-2 border" type="button" cancel>Cancel</button>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
</div>
|
|
|
- <div class="mb-2">
|
|
|
- <label class="text-secondary text-sm mb-1">Field Type</label>
|
|
|
- <select class="form-control form-control-sm" name="fieldType" required>
|
|
|
- <option value="">-- select --</option>
|
|
|
- <option value="number">Number</option>
|
|
|
- <option value="date">Date</option>
|
|
|
- <option value="string">String</option>
|
|
|
- <option value="bool">Boolean</option>
|
|
|
- </select>
|
|
|
+
|
|
|
+ <!-- add clause arg -->
|
|
|
+ <div moe relative center id="add-clause-arg-moe">
|
|
|
+ <a href="#" start show><i class="text-sm fa fa-trash-alt on-hover-opaque text-danger"></i></a>
|
|
|
+ <form url="{{ route("practice-management.api.clauseArg.create") }}" center hook="reloadClausesTree">
|
|
|
+ @csrf
|
|
|
+ <input type="hidden" name="clauseId">
|
|
|
+ <div class="mb-2">
|
|
|
+ <label class="text-secondary text-sm mb-1">Arg Text</label>
|
|
|
+ <input type="text" class="form-control form-control-sm" name="argText" required>
|
|
|
+ </div>
|
|
|
+ <div class="mb-2">
|
|
|
+ <label class="text-secondary text-sm mb-1">Field Type</label>
|
|
|
+ <select class="form-control form-control-sm" name="fieldType" required>
|
|
|
+ <option value="">-- select --</option>
|
|
|
+ <option value="number">Number</option>
|
|
|
+ <option value="date">Date</option>
|
|
|
+ <option value="string">String</option>
|
|
|
+ <option value="bool">Boolean</option>
|
|
|
+ </select>
|
|
|
+ </div>
|
|
|
+ <div class="d-flex align-items-center">
|
|
|
+ <button class="btn btn-sm btn-primary mr-2" type="button" submit>Save</button>
|
|
|
+ <button class="btn btn-sm btn-default mr-2 border" type="button" cancel>Cancel</button>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
</div>
|
|
|
- <div class="d-flex align-items-center">
|
|
|
- <button class="btn btn-sm btn-primary mr-2" type="button" submit>Save</button>
|
|
|
- <button class="btn btn-sm btn-default mr-2 border" type="button" cancel>Cancel</button>
|
|
|
+
|
|
|
+ <!-- edit clause arg -->
|
|
|
+ <div moe relative center id="edit-clause-arg-moe">
|
|
|
+ <a href="#" start show><i class="text-sm fa fa-trash-alt on-hover-opaque text-danger"></i></a>
|
|
|
+ <form url="{{ route("practice-management.api.clauseArg.update") }}" center hook="reloadClausesTree">
|
|
|
+ @csrf
|
|
|
+ <input type="hidden" name="id">
|
|
|
+ <div class="mb-2">
|
|
|
+ <label class="text-secondary text-sm mb-1">Arg Text</label>
|
|
|
+ <input type="text" class="form-control form-control-sm" name="argText" required>
|
|
|
+ </div>
|
|
|
+ <div class="mb-2">
|
|
|
+ <label class="text-secondary text-sm mb-1">Field Type</label>
|
|
|
+ <select class="form-control form-control-sm" name="fieldType" required>
|
|
|
+ <option value="">-- select --</option>
|
|
|
+ <option value="number">Number</option>
|
|
|
+ <option value="date">Date</option>
|
|
|
+ <option value="string">String</option>
|
|
|
+ <option value="bool">Boolean</option>
|
|
|
+ </select>
|
|
|
+ </div>
|
|
|
+ <div class="d-flex align-items-center">
|
|
|
+ <button class="btn btn-sm btn-primary mr-2" type="button" submit>Save</button>
|
|
|
+ <button class="btn btn-sm btn-default mr-2 border" type="button" cancel>Cancel</button>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
</div>
|
|
|
- </form>
|
|
|
- </div>
|
|
|
|
|
|
- <!-- remove clause arg -->
|
|
|
- <div moe relative center id="remove-clause-arg-moe">
|
|
|
- <a href="#" start show><i class="text-sm fa fa-trash-alt on-hover-opaque text-danger"></i></a>
|
|
|
- <form url="{{ route("practice-management.api.clauseArg.remove") }}" center hook="reloadClausesTree">
|
|
|
- @csrf
|
|
|
- <input type="hidden" name="id">
|
|
|
- <p>Are you sure?</p>
|
|
|
- <div class="d-flex align-items-center">
|
|
|
- <button class="btn btn-sm btn-danger mr-2" type="button" submit>Remove</button>
|
|
|
- <button class="btn btn-sm btn-default mr-2 border" type="button" cancel>Cancel</button>
|
|
|
+ <!-- remove clause arg -->
|
|
|
+ <div moe relative center id="remove-clause-arg-moe">
|
|
|
+ <a href="#" start show><i class="text-sm fa fa-trash-alt on-hover-opaque text-danger"></i></a>
|
|
|
+ <form url="{{ route("practice-management.api.clauseArg.remove") }}" center hook="reloadClausesTree">
|
|
|
+ @csrf
|
|
|
+ <input type="hidden" name="id">
|
|
|
+ <p>Are you sure?</p>
|
|
|
+ <div class="d-flex align-items-center">
|
|
|
+ <button class="btn btn-sm btn-danger mr-2" type="button" submit>Remove</button>
|
|
|
+ <button class="btn btn-sm btn-default mr-2 border" type="button" cancel>Cancel</button>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
</div>
|
|
|
- </form>
|
|
|
- </div>
|
|
|
|
|
|
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
|
|
|
|
|
|
- <!-- tree -->
|
|
|
- <div class="col-5 pr-0 pl-3 border-left tree-column">
|
|
|
- <div class="d-flex align-items-baseline mb-2">
|
|
|
- <h6 class="font-weight-bold m-0">{{$statTree->name}}</h6>
|
|
|
- <span class="text-danger d-none if-changed ml-2 text-sm">(modified *)</span>
|
|
|
- <a href="#" id="refresh-counts" class="ml-3">Refresh Counts</a>
|
|
|
- <a href="#" class="tree-expand-all ml-3" title="Expand All"><i class="fa fa-angle-double-down text-secondary"></i></a>
|
|
|
- <a href="#" class="tree-collapse-all ml-2" title="Collapse All"><i class="fa fa-angle-double-up text-secondary"></i></a>
|
|
|
- <div class="ml-auto mr-2 d-none if-changed">
|
|
|
- <a href="#" class="btn btn-sm btn-primary text-white" id="btn-save-tree">Save</a>
|
|
|
- <a href="#" class="ml-2 btn btn-sm btn-default border text-dark" onclick="return fastReload()">Reset</a>
|
|
|
+ <!-- tree -->
|
|
|
+ <div class="col-5 p-0 h-100 border-left tree-column">
|
|
|
+ <div class="d-flex flex-column h-100">
|
|
|
+ <div class="d-flex align-items-center pl-2 height-35px border-bottom bg-light">
|
|
|
+ <h6 class="font-weight-bold m-0 text-secondary">{{$statTree->name}}</h6>
|
|
|
+ <span class="text-danger d-none if-changed ml-2 text-sm">(modified *)</span>
|
|
|
+ <a href="#" id="refresh-counts" class="ml-3">Refresh Counts</a>
|
|
|
+ <a href="#" class="tree-expand-all ml-3" title="Expand All"><i class="fa fa-angle-double-down text-secondary"></i></a>
|
|
|
+ <a href="#" class="tree-collapse-all ml-2" title="Collapse All"><i class="fa fa-angle-double-up text-secondary"></i></a>
|
|
|
+ <div class="ml-auto mr-2 d-none if-changed">
|
|
|
+ <a href="#" class="btn btn-sm btn-primary text-white" id="btn-save-tree">Save</a>
|
|
|
+ <a href="#" class="ml-2 btn btn-sm btn-default border text-dark" onclick="return fastReload()">Reset</a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="flex-grow-1 overflow-overlay-on-hover">
|
|
|
+ <div class="stat-tree-view overflow-auto" id="stat-tree-view-{{$statTree->id}}"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div class="stat-tree-view mb-3 overflow-auto mr-2 min-height-300px" id="stat-tree-view-{{$statTree->id}}"></div>
|
|
|
- @if(!$statTree->rootLines || !count($statTree->rootLines))
|
|
|
- <p class="text-sm text-secondary font-italic">Drag clauses from the left and drop it above to begin.</p>
|
|
|
- @endif
|
|
|
- <div class="d-flex align-items-baseline">
|
|
|
- <a href="#" class="log-tree mr-2">Log</a>
|
|
|
- </div>
|
|
|
-
|
|
|
- </div>
|
|
|
|
|
|
|
|
|
- <!-- selected line properties -->
|
|
|
- <div class="col-4 pl-3 border-left setup-column">
|
|
|
- <div id="line-properties-column" class="d-none">
|
|
|
- <div class="mb-3 d-flex align-items-baseline pb-2 border-bottom font-weight-bold">
|
|
|
- <span line-label></span>
|
|
|
- </div>
|
|
|
- <div class="d-flex align-items-baseline mb-2">
|
|
|
- <h6 class="font-weight-bold m-0 text-secondary">Argument Values</h6>
|
|
|
- <!--<a href="#" class="ml-3 text-sm" onclick="$('.parent-arg').toggle(); return false;">Toggle Parent Clause Args</a>-->
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <table class="table table-sm table-bordered table-striped">
|
|
|
- <thead>
|
|
|
- <tr>
|
|
|
- <th class="border-bottom-0 w-35">Arg</th>
|
|
|
- <th class="border-bottom-0 w-35">Value</th>
|
|
|
- <th class="border-bottom-0">Access</th>
|
|
|
- </tr>
|
|
|
- </thead>
|
|
|
- <tbody line-args>
|
|
|
- </tbody>
|
|
|
- </table>
|
|
|
- </div>
|
|
|
- <div class="d-flex align-items-baseline mb-2 border-top pt-3">
|
|
|
- <h6 class="font-weight-bold m-0 text-secondary">Report Columns</h6>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- <div class="mb-2 d-flex align-items-baseline">
|
|
|
- <span class="text-secondary mr-1 text-nowrap">Quick Add:</span>
|
|
|
- <div class="flex-grow-1 position-relative">
|
|
|
- <input type="text"
|
|
|
- name="displayKey"
|
|
|
- class="form-control form-control-sm"
|
|
|
- placeholder="Column name"
|
|
|
- stag-suggest stag-suggest-left
|
|
|
- stag-suggest-ep="/column-suggest"
|
|
|
- stag-suggest-extra="table={{$statTree->model}}"
|
|
|
- autocomplete="off">
|
|
|
+ <!-- selected line properties -->
|
|
|
+ <div class="col-4 p-0 h-100 border-left setup-column d-none" id="line-properties-column">
|
|
|
+ <div class="d-flex flex-column h-100">
|
|
|
+ <div class="d-flex align-items-center pl-2 height-35px border-bottom bg-light">
|
|
|
+ <h6 class="font-weight-bold m-0 text-secondary">Selected Line Properties</h6>
|
|
|
+ </div>
|
|
|
+ <div class="flex-grow-1 overflow-overlay-on-hover">
|
|
|
+ <div class="mb-3 d-flex align-items-baseline p-2 border-bottom font-weight-bold">
|
|
|
+ <span line-label></span>
|
|
|
+ </div>
|
|
|
+ <div class="d-flex align-items-baseline mb-2 px-2">
|
|
|
+ <h6 class="font-weight-bold m-0 text-secondary">Argument Values</h6>
|
|
|
+ <!--<a href="#" class="ml-3 text-sm" onclick="$('.parent-arg').toggle(); return false;">Toggle Parent Clause Args</a>-->
|
|
|
+ </div>
|
|
|
+ <div class="px-2">
|
|
|
+ <table class="table table-sm table-bordered table-striped">
|
|
|
+ <thead>
|
|
|
+ <tr>
|
|
|
+ <th class="border-bottom-0 w-35">Arg</th>
|
|
|
+ <th class="border-bottom-0 w-35">Value</th>
|
|
|
+ <th class="border-bottom-0">Access</th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <tbody line-args>
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
+ <div class="d-flex align-items-baseline mb-2 border-top pt-3 px-2">
|
|
|
+ <h6 class="font-weight-bold m-0 text-secondary">Report Columns</h6>
|
|
|
+ </div>
|
|
|
+ <div class="px-2">
|
|
|
+ <div class="mb-2 d-flex align-items-baseline">
|
|
|
+ <span class="text-secondary mr-1 text-nowrap">Quick Add:</span>
|
|
|
+ <div class="flex-grow-1 position-relative">
|
|
|
+ <input type="text"
|
|
|
+ name="displayKey"
|
|
|
+ class="form-control form-control-sm"
|
|
|
+ placeholder="Column name"
|
|
|
+ stag-suggest stag-suggest-left
|
|
|
+ stag-suggest-ep="/column-suggest"
|
|
|
+ stag-suggest-extra="table={{$statTree->model}}"
|
|
|
+ autocomplete="off">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <table class="table table-sm table-bordered table-striped">
|
|
|
+ <thead>
|
|
|
+ <tr>
|
|
|
+ <th class="border-bottom-0 width-30px">#</th>
|
|
|
+ <th class="border-bottom-0 w-35">Label</th>
|
|
|
+ <th class="border-bottom-0">Column</th>
|
|
|
+ <th class="border-bottom-0 width-60px"></th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <tbody line-columns>
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <table class="table table-sm table-bordered table-striped">
|
|
|
- <thead>
|
|
|
- <tr>
|
|
|
- <th class="border-bottom-0 width-30px">#</th>
|
|
|
- <th class="border-bottom-0 w-35">Label</th>
|
|
|
- <th class="border-bottom-0">Column</th>
|
|
|
- <th class="border-bottom-0 width-60px"></th>
|
|
|
- </tr>
|
|
|
- </thead>
|
|
|
- <tbody line-columns>
|
|
|
- </tbody>
|
|
|
- </table>
|
|
|
</div>
|
|
|
+
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ <script>
|
|
|
+ (function() {
|
|
|
+ function init() {
|
|
|
+
|
|
|
+ let linePropsColumn = $('#line-properties-column');
|
|
|
+
|
|
|
+ function fillAndInvokeMoe(_id, _node) {
|
|
|
+ let moe = $(_id);
|
|
|
+ moe.find('input[name], select[name]').each(function() {
|
|
|
+ let name = $(this).attr('name');
|
|
|
+ if(!!_node.data[name]) {
|
|
|
+ $(this).val(!!_node.data[name] ? _node.data[name] : '');
|
|
|
+ }
|
|
|
+ });
|
|
|
+ moe.find('a[start]').trigger('click');
|
|
|
+ }
|
|
|
|
|
|
- </div>
|
|
|
+ // clauses tree
|
|
|
+ let ClausesTree = {
|
|
|
+ el: $('#clauses-view-{{$statTree->id}}'),
|
|
|
+ load: function() {
|
|
|
|
|
|
- </div>
|
|
|
- <script src="/jstree/jstree.min.js"></script>
|
|
|
- <script>
|
|
|
- (function() {
|
|
|
- function init() {
|
|
|
-
|
|
|
- let linePropsColumn = $('#line-properties-column');
|
|
|
-
|
|
|
- function fillAndInvokeMoe(_id, _node) {
|
|
|
- let moe = $(_id);
|
|
|
- moe.find('input[name], select[name]').each(function() {
|
|
|
- let name = $(this).attr('name');
|
|
|
- if(!!_node.data[name]) {
|
|
|
- $(this).val(!!_node.data[name] ? _node.data[name] : '');
|
|
|
- }
|
|
|
- });
|
|
|
- moe.find('a[start]').trigger('click');
|
|
|
- }
|
|
|
-
|
|
|
- // clauses tree
|
|
|
- let ClausesTree = {
|
|
|
- el: $('#clauses-view-{{$statTree->id}}'),
|
|
|
- load: function() {
|
|
|
-
|
|
|
- // destroy if existing
|
|
|
- try {
|
|
|
- this.el.jstree('destroy');
|
|
|
- }
|
|
|
- catch (e) {}
|
|
|
-
|
|
|
- // get data
|
|
|
- $.get('{{ route('practice-management.statTrees.view.clausesJSON', $statTree) }}', _data => {
|
|
|
-
|
|
|
- // init tree with data
|
|
|
- this.el
|
|
|
- .jstree({
|
|
|
- "core": {
|
|
|
- "multiple": false,
|
|
|
- "animation": 0,
|
|
|
- 'data': _data
|
|
|
- },
|
|
|
- "dnd": {
|
|
|
- "is_draggable": function(_node, _e) {
|
|
|
- return _node[0].data.type === 'clause';
|
|
|
- }
|
|
|
- },
|
|
|
- "contextmenu": {
|
|
|
- show_at_node: false,
|
|
|
- items: function (node) {
|
|
|
- if(node.data.type === 'clause') { // clause
|
|
|
- return {
|
|
|
- "edit": {
|
|
|
- "label": "<span class='text-sm'>Edit Clause</span>",
|
|
|
- "action": function (obj) {
|
|
|
- fillAndInvokeMoe('#edit-clause-moe', node);
|
|
|
- }
|
|
|
- },
|
|
|
- "remove": {
|
|
|
- "label": "<span class='text-sm'>Remove Clause</span>",
|
|
|
- "action": function (obj) {
|
|
|
- fillAndInvokeMoe('#remove-clause-moe', node);
|
|
|
- }
|
|
|
- },
|
|
|
- "add_arg": {
|
|
|
- "label": "<span class='text-sm'>Add Clause Arg</span>",
|
|
|
- "action": function (obj) {
|
|
|
- fillAndInvokeMoe('#add-clause-arg-moe', node);
|
|
|
- }
|
|
|
+ // destroy if existing
|
|
|
+ try {
|
|
|
+ this.el.jstree('destroy');
|
|
|
+ }
|
|
|
+ catch (e) {}
|
|
|
+
|
|
|
+ // get data
|
|
|
+ $.get('{{ route('practice-management.statTrees.view.clausesJSON', $statTree) }}', _data => {
|
|
|
+
|
|
|
+ // init tree with data
|
|
|
+ this.el
|
|
|
+ .jstree({
|
|
|
+ "core": {
|
|
|
+ "multiple": false,
|
|
|
+ "animation": 0,
|
|
|
+ 'data': _data
|
|
|
+ },
|
|
|
+ "dnd": {
|
|
|
+ "is_draggable": function(_node, _e) {
|
|
|
+ return _node[0].data.type === 'clause';
|
|
|
}
|
|
|
- }
|
|
|
- }
|
|
|
- else if(node.data.type === 'clause_arg') { // clause
|
|
|
- return {
|
|
|
- "edit": {
|
|
|
- "label": "<span class='text-sm'>Edit Arg</span>",
|
|
|
- "action": function (obj) {
|
|
|
- fillAndInvokeMoe('#edit-clause-arg-moe', node);
|
|
|
+ },
|
|
|
+ "contextmenu": {
|
|
|
+ show_at_node: false,
|
|
|
+ items: function (node) {
|
|
|
+ if(node.data.type === 'clause') { // clause
|
|
|
+ return {
|
|
|
+ "edit": {
|
|
|
+ "label": "<span class='text-sm'>Edit Clause</span>",
|
|
|
+ "action": function (obj) {
|
|
|
+ fillAndInvokeMoe('#edit-clause-moe', node);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ "remove": {
|
|
|
+ "label": "<span class='text-sm'>Remove Clause</span>",
|
|
|
+ "action": function (obj) {
|
|
|
+ fillAndInvokeMoe('#remove-clause-moe', node);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ "add_arg": {
|
|
|
+ "label": "<span class='text-sm'>Add Clause Arg</span>",
|
|
|
+ "action": function (obj) {
|
|
|
+ fillAndInvokeMoe('#add-clause-arg-moe', node);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
- },
|
|
|
- "remove": {
|
|
|
- "label": "<span class='text-sm'>Remove Arg</span>",
|
|
|
- "action": function (obj) {
|
|
|
- fillAndInvokeMoe('#remove-clause-arg-moe', node);
|
|
|
+ else if(node.data.type === 'clause_arg') { // clause
|
|
|
+ return {
|
|
|
+ "edit": {
|
|
|
+ "label": "<span class='text-sm'>Edit Arg</span>",
|
|
|
+ "action": function (obj) {
|
|
|
+ fillAndInvokeMoe('#edit-clause-arg-moe', node);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ "remove": {
|
|
|
+ "label": "<span class='text-sm'>Remove Arg</span>",
|
|
|
+ "action": function (obj) {
|
|
|
+ fillAndInvokeMoe('#remove-clause-arg-moe', node);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ };
|
|
|
}
|
|
|
- }
|
|
|
- };
|
|
|
- }
|
|
|
- },
|
|
|
- },
|
|
|
- "plugins": [
|
|
|
- "wholerow",
|
|
|
- "dnd",
|
|
|
- "contextmenu",
|
|
|
- "state"
|
|
|
- ]
|
|
|
- });
|
|
|
- }, 'json');
|
|
|
- }
|
|
|
- };
|
|
|
-
|
|
|
- // stat tree
|
|
|
- let StatTree = {
|
|
|
- el: $('#stat-tree-view-{{$statTree->id}}'),
|
|
|
- changed: false,
|
|
|
-
|
|
|
- setDirty: function(_changed = true) {
|
|
|
- this.changed = _changed;
|
|
|
- if(_changed) {
|
|
|
- $('.if-changed').removeClass('d-none');
|
|
|
- }
|
|
|
- else {
|
|
|
- $('.if-changed').addClass('d-none');
|
|
|
- }
|
|
|
- },
|
|
|
+ },
|
|
|
+ },
|
|
|
+ "plugins": [
|
|
|
+ "wholerow",
|
|
|
+ "dnd",
|
|
|
+ "contextmenu",
|
|
|
+ "state"
|
|
|
+ ]
|
|
|
+ });
|
|
|
+ }, 'json');
|
|
|
+ }
|
|
|
+ };
|
|
|
|
|
|
- load: function() {
|
|
|
+ // stat tree
|
|
|
+ let StatTree = {
|
|
|
+ el: $('#stat-tree-view-{{$statTree->id}}'),
|
|
|
+ changed: false,
|
|
|
|
|
|
- // destroy if existing
|
|
|
- try {
|
|
|
- this.el.jstree('destroy');
|
|
|
- }
|
|
|
- catch (e) {}
|
|
|
-
|
|
|
- this.el = $('#stat-tree-view-{{$statTree->id}}');
|
|
|
-
|
|
|
- // get data
|
|
|
- showMask();
|
|
|
- $.get('{{ route('practice-management.statTrees.view.linesJSON', $statTree) }}', _data => {
|
|
|
-
|
|
|
- // init tree with data
|
|
|
- this.el
|
|
|
- .on('move_node.jstree', (_e, _data) => { StatTree.dropped(_e, _data); })
|
|
|
- .on('copy_node.jstree', (_e, _data) => { StatTree.dropped(_e, _data); })
|
|
|
- .on('select_node.jstree', () => { StatTree.onSelected(); })
|
|
|
- .on('deselect_node.jstree', () => { StatTree.onDeselected(); })
|
|
|
- .on('redraw.jstree', () => { StatTree.dropVisualize(); })
|
|
|
- .jstree({
|
|
|
- "core": {
|
|
|
- "check_callback": true,
|
|
|
- "multiple": false,
|
|
|
- "animation": 0,
|
|
|
- 'data': _data
|
|
|
- },
|
|
|
- "dnd": {
|
|
|
- "is_draggable": function(_node, _e) {
|
|
|
- return _node[0].data && _node[0].data.type === 'stat_tree_line';
|
|
|
- }
|
|
|
- },
|
|
|
- "contextmenu": {
|
|
|
- show_at_node: false,
|
|
|
- items: function (node) {
|
|
|
- if(node.data.type === 'stat_tree_line') { // stat_tree_line
|
|
|
- return {
|
|
|
-
|
|
|
- "data": {
|
|
|
- "label": "<span class='text-sm'>View Data</span>",
|
|
|
- "action": function (obj) {
|
|
|
- openDynamicStagPopup('/practice-management/stat-tree-lines/view-data/' + node.data.uid,
|
|
|
- null,
|
|
|
- node.data.displayLabel,
|
|
|
- false,
|
|
|
- 'medium');
|
|
|
- },
|
|
|
- separator_after: true,
|
|
|
- },
|
|
|
- "cut": {
|
|
|
- "label": "<span class='text-sm'>Cut</span>",
|
|
|
- "action": function (obj) {
|
|
|
- let selected = StatTree.selectedNode();
|
|
|
- if(selected) {
|
|
|
- StatTree.el.jstree(true).cut(selected.id);
|
|
|
- }
|
|
|
- },
|
|
|
- },
|
|
|
- "copy": {
|
|
|
- "label": "<span class='text-sm'>Copy</span>",
|
|
|
- "action": function (obj) {
|
|
|
- let selected = StatTree.selectedNode();
|
|
|
- if(selected) {
|
|
|
- StatTree.el.jstree(true).copy(selected.id);
|
|
|
+ setDirty: function(_changed = true) {
|
|
|
+ this.changed = _changed;
|
|
|
+ if(_changed) {
|
|
|
+ $('.if-changed').removeClass('d-none');
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ $('.if-changed').addClass('d-none');
|
|
|
+ }
|
|
|
+ },
|
|
|
|
|
|
- // put into localStorage for paste_ext
|
|
|
- let node = StatTree.el.jstree(true).get_json(selected.id);
|
|
|
- localStorage.stPasteBuffer = JSON.stringify(StatTree.getPasteBufferForNode(node));
|
|
|
+ load: function() {
|
|
|
|
|
|
- }
|
|
|
- },
|
|
|
- },
|
|
|
- "paste": {
|
|
|
- "label": "<span class='text-sm'>Paste</span>",
|
|
|
- "_disabled": !StatTree.el.jstree(true).can_paste(),
|
|
|
- "action": function (obj) {
|
|
|
- let selected = StatTree.selectedNode();
|
|
|
- if(selected && StatTree.el.jstree(true).can_paste()) {
|
|
|
- StatTree.el.jstree(true).paste(selected.id, 'last');
|
|
|
- }
|
|
|
- },
|
|
|
- },
|
|
|
- "paste_ext": {
|
|
|
- "label": "<span class='text-sm'>Paste (external)</span>",
|
|
|
- "_disabled": !localStorage.stPasteBuffer,
|
|
|
- "action": function (obj) {
|
|
|
- let selected = StatTree.selectedNode();
|
|
|
- if(selected && !!localStorage.stPasteBuffer) {
|
|
|
- try {
|
|
|
- let parsed = JSON.parse(localStorage.stPasteBuffer);
|
|
|
- StatTree.el.jstree(true).create_node(selected.id, parsed);
|
|
|
- StatTree.el.jstree(true).open_node(selected.id);
|
|
|
- }
|
|
|
- catch (e) {
|
|
|
- console.error(e);
|
|
|
- console.error('Unable to paste. Invalid buffer.')
|
|
|
+ // destroy if existing
|
|
|
+ try {
|
|
|
+ this.el.jstree('destroy');
|
|
|
+ }
|
|
|
+ catch (e) {}
|
|
|
+
|
|
|
+ this.el = $('#stat-tree-view-{{$statTree->id}}');
|
|
|
+
|
|
|
+ // get data
|
|
|
+ showMask();
|
|
|
+ $.get('{{ route('practice-management.statTrees.view.linesJSON', $statTree) }}', _data => {
|
|
|
+
|
|
|
+ // init tree with data
|
|
|
+ this.el
|
|
|
+ .on('move_node.jstree', (_e, _data) => { StatTree.dropped(_e, _data); })
|
|
|
+ .on('copy_node.jstree', (_e, _data) => { StatTree.dropped(_e, _data); })
|
|
|
+ .on('select_node.jstree', () => { StatTree.onSelected(); })
|
|
|
+ .on('deselect_node.jstree', () => { StatTree.onDeselected(); })
|
|
|
+ .on('redraw.jstree', () => { StatTree.dropVisualize(); })
|
|
|
+ .jstree({
|
|
|
+ "core": {
|
|
|
+ "check_callback": true,
|
|
|
+ "multiple": false,
|
|
|
+ "animation": 0,
|
|
|
+ 'data': _data
|
|
|
+ },
|
|
|
+ "dnd": {
|
|
|
+ "is_draggable": function(_node, _e) {
|
|
|
+ return _node[0].data && _node[0].data.type === 'stat_tree_line';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ "contextmenu": {
|
|
|
+ show_at_node: false,
|
|
|
+ items: function (node) {
|
|
|
+ if(node.data.type === 'stat_tree_line') { // stat_tree_line
|
|
|
+ return {
|
|
|
+
|
|
|
+ "data": {
|
|
|
+ "label": "<span class='text-sm'>View Data</span>",
|
|
|
+ "action": function (obj) {
|
|
|
+ openDynamicStagPopup('/practice-management/stat-tree-lines/view-data/' + node.data.uid,
|
|
|
+ null,
|
|
|
+ node.data.displayLabel,
|
|
|
+ false,
|
|
|
+ 'medium');
|
|
|
+ },
|
|
|
+ separator_after: true,
|
|
|
+ },
|
|
|
+ "cut": {
|
|
|
+ "label": "<span class='text-sm'>Cut</span>",
|
|
|
+ "action": function (obj) {
|
|
|
+ let selected = StatTree.selectedNode();
|
|
|
+ if(selected) {
|
|
|
+ StatTree.el.jstree(true).cut(selected.id);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ "copy": {
|
|
|
+ "label": "<span class='text-sm'>Copy</span>",
|
|
|
+ "action": function (obj) {
|
|
|
+ let selected = StatTree.selectedNode();
|
|
|
+ if(selected) {
|
|
|
+ StatTree.el.jstree(true).copy(selected.id);
|
|
|
+
|
|
|
+ // put into localStorage for paste_ext
|
|
|
+ let node = StatTree.el.jstree(true).get_json(selected.id);
|
|
|
+ localStorage.stPasteBuffer = JSON.stringify(StatTree.getPasteBufferForNode(node));
|
|
|
+
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ "paste": {
|
|
|
+ "label": "<span class='text-sm'>Paste</span>",
|
|
|
+ "_disabled": !StatTree.el.jstree(true).can_paste(),
|
|
|
+ "action": function (obj) {
|
|
|
+ let selected = StatTree.selectedNode();
|
|
|
+ if(selected && StatTree.el.jstree(true).can_paste()) {
|
|
|
+ StatTree.el.jstree(true).paste(selected.id, 'last');
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ "paste_ext": {
|
|
|
+ "label": "<span class='text-sm'>Paste (external)</span>",
|
|
|
+ "_disabled": !localStorage.stPasteBuffer,
|
|
|
+ "action": function (obj) {
|
|
|
+ let selected = StatTree.selectedNode();
|
|
|
+ if(selected && !!localStorage.stPasteBuffer) {
|
|
|
+ try {
|
|
|
+ let parsed = JSON.parse(localStorage.stPasteBuffer);
|
|
|
+ StatTree.el.jstree(true).create_node(selected.id, parsed);
|
|
|
+ StatTree.el.jstree(true).open_node(selected.id);
|
|
|
+ }
|
|
|
+ catch (e) {
|
|
|
+ console.error(e);
|
|
|
+ console.error('Unable to paste. Invalid buffer.')
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ separator_after: true,
|
|
|
+ },
|
|
|
+ "remove": {
|
|
|
+ "label": "<span class='text-sm'>Remove</span>",
|
|
|
+ "action": function (obj) {
|
|
|
+ let selected = StatTree.selectedNode();
|
|
|
+ if(selected) {
|
|
|
+ StatTree.el.jstree(true).delete_node(selected.id);
|
|
|
+ StatTree.setDirty();
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
- },
|
|
|
- separator_after: true,
|
|
|
- },
|
|
|
- "remove": {
|
|
|
- "label": "<span class='text-sm'>Remove</span>",
|
|
|
- "action": function (obj) {
|
|
|
- let selected = StatTree.selectedNode();
|
|
|
- if(selected) {
|
|
|
- StatTree.el.jstree(true).delete_node(selected.id);
|
|
|
- StatTree.setDirty();
|
|
|
- }
|
|
|
}
|
|
|
+ },
|
|
|
+ },
|
|
|
+ "plugins": [
|
|
|
+ "wholerow",
|
|
|
+ "dnd",
|
|
|
+ "contextmenu",
|
|
|
+ "state"
|
|
|
+ ]
|
|
|
+ });
|
|
|
+ }, 'json').then(hideMask);
|
|
|
+ },
|
|
|
+
|
|
|
+ dropVisualize: function() {
|
|
|
+ console.log('redrawn')
|
|
|
+ function calculateDropPercent(node, parent = null) {
|
|
|
+ let realNode = StatTree.el.jstree(true).get_node(node.id);
|
|
|
+ if(!realNode.data) return;
|
|
|
+ if(parent && parent.data.lastRefreshCount !== null) {
|
|
|
+ if(node.data.lastRefreshCount !== null) {
|
|
|
+ realNode.data.dropPercent = (((parent.data.lastRefreshCount - node.data.lastRefreshCount) / parent.data.lastRefreshCount) * 100);
|
|
|
+ if(realNode.data.dropPercent) {
|
|
|
+ let element = StatTree.el.jstree(true).get_node(node.id, true), cssClass = '';
|
|
|
+ if(realNode.data.dropPercent > 75) {
|
|
|
+ cssClass = 'drop-76-100';
|
|
|
+ }
|
|
|
+ else if(realNode.data.dropPercent > 50 && realNode.data.dropPercent <= 75) {
|
|
|
+ cssClass = 'drop-51-75';
|
|
|
+ }
|
|
|
+ else if(realNode.data.dropPercent > 25 && realNode.data.dropPercent <= 50) {
|
|
|
+ cssClass = 'drop-26-50';
|
|
|
+ }
|
|
|
+ else if(realNode.data.dropPercent > 0 && realNode.data.dropPercent <= 25) {
|
|
|
+ cssClass = 'drop-0-25';
|
|
|
}
|
|
|
+ element.find('>a.jstree-anchor')
|
|
|
+ .addClass('has-drop-visualization')
|
|
|
+ .addClass(cssClass)
|
|
|
+ .attr('data-drop-percent', (realNode.data.dropPercent.toFixed(1)) + '% ⤵');
|
|
|
}
|
|
|
}
|
|
|
- },
|
|
|
- },
|
|
|
- "plugins": [
|
|
|
- "wholerow",
|
|
|
- "dnd",
|
|
|
- "contextmenu",
|
|
|
- "state"
|
|
|
- ]
|
|
|
- });
|
|
|
- }, 'json').then(hideMask);
|
|
|
- },
|
|
|
-
|
|
|
- dropVisualize: function() {
|
|
|
- console.log('redrawn')
|
|
|
- function calculateDropPercent(node, parent = null) {
|
|
|
- let realNode = StatTree.el.jstree(true).get_node(node.id);
|
|
|
- if(!realNode.data) return;
|
|
|
- if(parent && parent.data.lastRefreshCount !== null) {
|
|
|
- if(node.data.lastRefreshCount !== null) {
|
|
|
- realNode.data.dropPercent = (((parent.data.lastRefreshCount - node.data.lastRefreshCount) / parent.data.lastRefreshCount) * 100);
|
|
|
- if(realNode.data.dropPercent) {
|
|
|
- let element = StatTree.el.jstree(true).get_node(node.id, true), cssClass = '';
|
|
|
- if(realNode.data.dropPercent > 75) {
|
|
|
- cssClass = 'drop-76-100';
|
|
|
}
|
|
|
- else if(realNode.data.dropPercent > 50 && realNode.data.dropPercent <= 75) {
|
|
|
- cssClass = 'drop-51-75';
|
|
|
+ for (let i = 0; i < node.children.length; i++) {
|
|
|
+ calculateDropPercent(node.children[i], node);
|
|
|
}
|
|
|
- else if(realNode.data.dropPercent > 25 && realNode.data.dropPercent <= 50) {
|
|
|
- cssClass = 'drop-26-50';
|
|
|
+ }
|
|
|
+ let raw = this.el.jstree('get_json');
|
|
|
+ for (let i = 0; i < raw.length; i++) {
|
|
|
+ calculateDropPercent(raw[i]);
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ dropped: function(_e, _data) {
|
|
|
+
|
|
|
+ if(_data.original && _data.original.data &&
|
|
|
+ _data.original.data.type === 'clause') {
|
|
|
+ _data.node.data = {
|
|
|
+ type: "stat_tree_line",
|
|
|
+ displayLabel: _data.original.data.label,
|
|
|
+ columns: [],
|
|
|
+ clause: {
|
|
|
+ clause_id: _data.original.data.clauseId,
|
|
|
+ clause_label: _data.original.data.label,
|
|
|
+ args: _data.original.data.args
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ // delete args and query children (from the clauses tree)
|
|
|
+ this.el.jstree(true).delete_node(_data.node.children);
|
|
|
+
|
|
|
+ // open new parent to reveal dropped node
|
|
|
+ this.el.jstree(true).open_node(_data.parent);
|
|
|
+
|
|
|
+ // select the new node
|
|
|
+ this.el.jstree(true).deselect_all();
|
|
|
+ this.el.jstree(true).select_node(_data.node.id);
|
|
|
+ }
|
|
|
+ else if(_e.type === 'copy_node' && _data.original && _data.original.data &&
|
|
|
+ _data.original.data.type === 'stat_tree_line') {
|
|
|
+
|
|
|
+ function recursiveCopyData(src, target) {
|
|
|
+ src = StatTree.el.jstree(true).get_node(src);
|
|
|
+ target = StatTree.el.jstree(true).get_node(target);
|
|
|
+ target.data = JSON.parse(JSON.stringify(src.data));
|
|
|
+ if(src.children.length === target.children.length) {
|
|
|
+ for (let i = 0; i < target.children.length; i++) {
|
|
|
+ recursiveCopyData(src.children[i], target.children[i])
|
|
|
+ }
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ console.log('Child count not the same!', src.text, target.text);
|
|
|
+ }
|
|
|
}
|
|
|
- else if(realNode.data.dropPercent > 0 && realNode.data.dropPercent <= 25) {
|
|
|
- cssClass = 'drop-0-25';
|
|
|
+
|
|
|
+ recursiveCopyData(_data.original.id, _data.node.id);
|
|
|
+
|
|
|
+ // open new parent to reveal dropped node
|
|
|
+ this.el.jstree(true).open_node(_data.parent);
|
|
|
+
|
|
|
+ // select the new node
|
|
|
+ this.el.jstree(true).deselect_all();
|
|
|
+ this.el.jstree(true).select_node(_data.node.id);
|
|
|
+ }
|
|
|
+
|
|
|
+ this.setDirty();
|
|
|
+ },
|
|
|
+
|
|
|
+ save: function() {
|
|
|
+ setTimeout(() => {
|
|
|
+ $.post('{{ route("practice-management.api.statTree.replaceAllLinesJSON") }}', {
|
|
|
+ uid: "{{ $statTree->uid }}",
|
|
|
+ data: StatTree.payload()
|
|
|
+ }, function (response) {
|
|
|
+ if(!hasResponseError(response)) {
|
|
|
+ toastr.success('All changes saved!');
|
|
|
+ StatTree.setDirty(false);
|
|
|
+ StatTree.load();
|
|
|
+ }
|
|
|
+ }, 'json');
|
|
|
+ }, 0);
|
|
|
+ },
|
|
|
+
|
|
|
+ log: function() {
|
|
|
+ let raw = this.el.jstree('get_json');
|
|
|
+ for (let i = 0; i < raw.length; i++) {
|
|
|
+ this.logNode(raw[i].id, "");
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ logNode: function(_id, _indent) {
|
|
|
+ let node = this.el.jstree('get_node', _id);
|
|
|
+ let s = [], css = false;
|
|
|
+ if(!node.data) css = true;
|
|
|
+ s.push($('<div/>').html(node.text).text().substr(0, 10) + '...');
|
|
|
+ s.push(node.data ? 'data:' + node.data.type: '%cdata:X');
|
|
|
+ console.log("ALIX: " + _indent + s.join(' '), css ? 'color:red' : '');
|
|
|
+ for (let i = 0; i < node.children.length; i++) {
|
|
|
+ this.logNode(node.children[i], _indent + "\t");
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ getPasteBufferForNode(_node) {
|
|
|
+ let children = [];
|
|
|
+ for (let i = 0; i < _node.children.length; i++) {
|
|
|
+ children.push(this.getPasteBufferForNode(_node.children[i]));
|
|
|
+ }
|
|
|
+ return {
|
|
|
+ "text": _node.text,
|
|
|
+ "state": {
|
|
|
+ "opened": true,
|
|
|
+ "disabled": false,
|
|
|
+ "selected": false,
|
|
|
+ },
|
|
|
+ "children": children,
|
|
|
+ "data": _node.data
|
|
|
+ };
|
|
|
+ },
|
|
|
+
|
|
|
+ payload: function() {
|
|
|
+ let raw = this.el.jstree('get_json');
|
|
|
+ let nodes = [];
|
|
|
+ for (let i = 0; i < raw.length; i++) {
|
|
|
+ nodes.push(this.nodePayload(raw[i].id));
|
|
|
+ }
|
|
|
+ return JSON.stringify(nodes);
|
|
|
+ },
|
|
|
+
|
|
|
+ nodePayload: function(_id) {
|
|
|
+ let node = this.el.jstree('get_node', _id);
|
|
|
+ let payload = {};
|
|
|
+ if(node.data.type === 'stat_tree_line') {
|
|
|
+ payload = {
|
|
|
+ displayLabel: node.data.displayLabel,
|
|
|
+ clause: node.data.clause,
|
|
|
+ columns: node.data.columns,
|
|
|
+ };
|
|
|
+ let children = [];
|
|
|
+ for (let i = 0; i < node.children.length; i++) {
|
|
|
+ children.push(this.nodePayload(node.children[i]));
|
|
|
}
|
|
|
- element.find('>a.jstree-anchor')
|
|
|
- .addClass('has-drop-visualization')
|
|
|
- .addClass(cssClass)
|
|
|
- .attr('data-drop-percent', (realNode.data.dropPercent.toFixed(1)) + '% ⤵');
|
|
|
+ payload.children = children;
|
|
|
}
|
|
|
- }
|
|
|
- }
|
|
|
- for (let i = 0; i < node.children.length; i++) {
|
|
|
- calculateDropPercent(node.children[i], node);
|
|
|
- }
|
|
|
- }
|
|
|
- let raw = this.el.jstree('get_json');
|
|
|
- for (let i = 0; i < raw.length; i++) {
|
|
|
- calculateDropPercent(raw[i]);
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- dropped: function(_e, _data) {
|
|
|
-
|
|
|
- if(_data.original && _data.original.data &&
|
|
|
- _data.original.data.type === 'clause') {
|
|
|
- _data.node.data = {
|
|
|
- type: "stat_tree_line",
|
|
|
- displayLabel: _data.original.data.label,
|
|
|
- columns: [],
|
|
|
- clause: {
|
|
|
- clause_id: _data.original.data.clauseId,
|
|
|
- clause_label: _data.original.data.label,
|
|
|
- args: _data.original.data.args
|
|
|
- }
|
|
|
- };
|
|
|
+ return payload;
|
|
|
+ },
|
|
|
|
|
|
- // delete args and query children (from the clauses tree)
|
|
|
- this.el.jstree(true).delete_node(_data.node.children);
|
|
|
+ selectedNode: function() {
|
|
|
+ let selected = this.el.jstree('get_selected', true);
|
|
|
+ if(selected && selected.length) {
|
|
|
+ return selected[0];
|
|
|
+ }
|
|
|
+ return false;
|
|
|
+ },
|
|
|
|
|
|
- // open new parent to reveal dropped node
|
|
|
- this.el.jstree(true).open_node(_data.parent);
|
|
|
+ getSelectedNodeClauseArgs: function() {
|
|
|
+ let selected = this.selectedNode();
|
|
|
+ if(selected) {
|
|
|
+ return selected.data.clause.args;
|
|
|
+ }
|
|
|
+ return [];
|
|
|
+ },
|
|
|
|
|
|
- // select the new node
|
|
|
- this.el.jstree(true).deselect_all();
|
|
|
- this.el.jstree(true).select_node(_data.node.id);
|
|
|
- }
|
|
|
- else if(_e.type === 'copy_node' && _data.original && _data.original.data &&
|
|
|
- _data.original.data.type === 'stat_tree_line') {
|
|
|
-
|
|
|
- function recursiveCopyData(src, target) {
|
|
|
- src = StatTree.el.jstree(true).get_node(src);
|
|
|
- target = StatTree.el.jstree(true).get_node(target);
|
|
|
- target.data = JSON.parse(JSON.stringify(src.data));
|
|
|
- if(src.children.length === target.children.length) {
|
|
|
- for (let i = 0; i < target.children.length; i++) {
|
|
|
- recursiveCopyData(src.children[i], target.children[i])
|
|
|
+ getSelectedNodeColumns: function() {
|
|
|
+ let selected = this.selectedNode();
|
|
|
+ if(selected) {
|
|
|
+ return selected.data.columns;
|
|
|
}
|
|
|
- }
|
|
|
- else {
|
|
|
- console.log('Child count not the same!', src.text, target.text);
|
|
|
- }
|
|
|
- }
|
|
|
+ return [];
|
|
|
+ },
|
|
|
+
|
|
|
+ setSelectedNodeColumns: function(columns) {
|
|
|
+ let selected = this.selectedNode();
|
|
|
+ if(selected) {
|
|
|
+ selected.data.columns = columns;
|
|
|
+ this.setDirty();
|
|
|
+ }
|
|
|
+ return [];
|
|
|
+ },
|
|
|
|
|
|
- recursiveCopyData(_data.original.id, _data.node.id);
|
|
|
+ onDeselected: function(_e, _data) {
|
|
|
+ linePropsColumn.addClass('d-none');
|
|
|
+ },
|
|
|
|
|
|
- // open new parent to reveal dropped node
|
|
|
- this.el.jstree(true).open_node(_data.parent);
|
|
|
+ onSelected: function(_e, _data) {
|
|
|
+ let selected = this.selectedNode();
|
|
|
|
|
|
- // select the new node
|
|
|
- this.el.jstree(true).deselect_all();
|
|
|
- this.el.jstree(true).select_node(_data.node.id);
|
|
|
- }
|
|
|
+ if(selected) console.log(selected.data)
|
|
|
|
|
|
- this.setDirty();
|
|
|
- },
|
|
|
-
|
|
|
- save: function() {
|
|
|
- setTimeout(() => {
|
|
|
- $.post('{{ route("practice-management.api.statTree.replaceAllLinesJSON") }}', {
|
|
|
- uid: "{{ $statTree->uid }}",
|
|
|
- data: StatTree.payload()
|
|
|
- }, function (response) {
|
|
|
- if(!hasResponseError(response)) {
|
|
|
- toastr.success('All changes saved!');
|
|
|
- StatTree.setDirty(false);
|
|
|
- StatTree.load();
|
|
|
- }
|
|
|
- }, 'json');
|
|
|
- }, 0);
|
|
|
- },
|
|
|
-
|
|
|
- log: function() {
|
|
|
- let raw = this.el.jstree('get_json');
|
|
|
- for (let i = 0; i < raw.length; i++) {
|
|
|
- this.logNode(raw[i].id, "");
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- logNode: function(_id, _indent) {
|
|
|
- let node = this.el.jstree('get_node', _id);
|
|
|
- let s = [], css = false;
|
|
|
- if(!node.data) css = true;
|
|
|
- s.push($('<div/>').html(node.text).text().substr(0, 10) + '...');
|
|
|
- s.push(node.data ? 'data:' + node.data.type: '%cdata:X');
|
|
|
- console.log("ALIX: " + _indent + s.join(' '), css ? 'color:red' : '');
|
|
|
- for (let i = 0; i < node.children.length; i++) {
|
|
|
- this.logNode(node.children[i], _indent + "\t");
|
|
|
- }
|
|
|
- },
|
|
|
+ if(!(selected && selected.data && selected.data.type === 'stat_tree_line')) return;
|
|
|
|
|
|
- getPasteBufferForNode(_node) {
|
|
|
- let children = [];
|
|
|
- for (let i = 0; i < _node.children.length; i++) {
|
|
|
- children.push(this.getPasteBufferForNode(_node.children[i]));
|
|
|
- }
|
|
|
- return {
|
|
|
- "text": _node.text,
|
|
|
- "state": {
|
|
|
- "opened": true,
|
|
|
- "disabled": false,
|
|
|
- "selected": false,
|
|
|
- },
|
|
|
- "children": children,
|
|
|
- "data": _node.data
|
|
|
- };
|
|
|
- },
|
|
|
-
|
|
|
- payload: function() {
|
|
|
- let raw = this.el.jstree('get_json');
|
|
|
- let nodes = [];
|
|
|
- for (let i = 0; i < raw.length; i++) {
|
|
|
- nodes.push(this.nodePayload(raw[i].id));
|
|
|
- }
|
|
|
- return JSON.stringify(nodes);
|
|
|
- },
|
|
|
-
|
|
|
- nodePayload: function(_id) {
|
|
|
- let node = this.el.jstree('get_node', _id);
|
|
|
- let payload = {};
|
|
|
- if(node.data.type === 'stat_tree_line') {
|
|
|
- payload = {
|
|
|
- displayLabel: node.data.displayLabel,
|
|
|
- clause: node.data.clause,
|
|
|
- columns: node.data.columns,
|
|
|
+ linePropsColumn.removeClass('d-none');
|
|
|
+ linePropsColumn.find('[line-label]').text(selected.data.displayLabel);
|
|
|
+
|
|
|
+ // fill args
|
|
|
+ let tbody = linePropsColumn.find('[line-args]');
|
|
|
+ let clause = selected.data.clause;
|
|
|
+ tbody.empty();
|
|
|
+ if(clause) {
|
|
|
+ let edit = true;
|
|
|
+ let args = clause.args ? clause.args : [];
|
|
|
+ // $('<tr/>').addClass(edit ? '' : 'opacity-60 parent-arg').append($('<td/>').attr('colspan', 3).addClass('font-weight-bold text-sm ' + (edit ? '' : 'text-secondary')).text(clause.clause_label)).appendTo(tbody);
|
|
|
+ if(!args.length) {
|
|
|
+ $('<tr/>').addClass(edit ? '' : 'opacity-60 parent-arg').append($('<td/>').attr('colspan', 3).addClass('pl-3 text-secondary text-sm').text('No args')).appendTo(tbody);
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ for (let i = 0; i < args.length; i++) {
|
|
|
+ $('<tr/>')
|
|
|
+ .addClass(edit ? '' : 'opacity-60 parent-arg')
|
|
|
+ .append(
|
|
|
+ $('<td/>')
|
|
|
+ .addClass('pl-3')
|
|
|
+ .html(args[i].arg_text + ' <span class="text-secondary text-sm">(' + args[i].field_type + ')</span>')
|
|
|
+ )
|
|
|
+ .append(
|
|
|
+ $('<td/>')
|
|
|
+ .text(args[i].default_value)
|
|
|
+ .append(edit ? '<a href="#" class="edit-arg-value ml-2" data-index="' + i + '"><i class="fa fa-edit text-primary text-sm on-hover-opaque"></i></a>': '')
|
|
|
+ )
|
|
|
+ .append(
|
|
|
+ $('<td/>')
|
|
|
+ .text(args[i].access_level)
|
|
|
+ .append(edit ? '<a href="#" class="edit-arg-access-level ml-2" data-index="' + i + '"><i class="fa fa-edit text-primary text-sm on-hover-opaque"></i></a>': '')
|
|
|
+ )
|
|
|
+ .appendTo(tbody);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // fill columns
|
|
|
+ tbody = linePropsColumn.find('[line-columns]');
|
|
|
+ let columns = StatTree.getSelectedNodeColumns();
|
|
|
+ tbody.empty();
|
|
|
+ if(columns && columns.length) {
|
|
|
+ for (let i = 0; i < columns.length; i++) {
|
|
|
+ $('<tr/>')
|
|
|
+ .append($('<td/>').text(i + 1))
|
|
|
+ .append($('<td/>').text(columns[i].label))
|
|
|
+ .append($('<td/>').text(columns[i].display_key))
|
|
|
+ .append(
|
|
|
+ $('<td/>')
|
|
|
+ .addClass('text-right text-nowrap')
|
|
|
+ .append(i > 0 ? '<a href="#" class="move-column-up mr-2" data-index="' + i + '"><i class="fa fa-arrow-up text-primary on-hover-opaque"></i></a>': '')
|
|
|
+ .append(i < columns.length - 1 ? '<a href="#" class="move-column-down mr-2" data-index="' + i + '"><i class="fa fa-arrow-down text-primary on-hover-opaque"></i></a>': '')
|
|
|
+ .append('<a href="#" class="remove-column" data-index="' + i + '"><i class="fa fa-trash-alt text-danger on-hover-opaque"></i></a>')
|
|
|
+ )
|
|
|
+ .appendTo(tbody);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ },
|
|
|
};
|
|
|
- let children = [];
|
|
|
- for (let i = 0; i < node.children.length; i++) {
|
|
|
- children.push(this.nodePayload(node.children[i]));
|
|
|
- }
|
|
|
- payload.children = children;
|
|
|
- }
|
|
|
- return payload;
|
|
|
- },
|
|
|
|
|
|
- selectedNode: function() {
|
|
|
- let selected = this.el.jstree('get_selected', true);
|
|
|
- if(selected && selected.length) {
|
|
|
- return selected[0];
|
|
|
- }
|
|
|
- return false;
|
|
|
- },
|
|
|
+ linePropsColumn.find('input[stag-suggest][name="displayKey"]')
|
|
|
+ .off('stag-suggest-selected')
|
|
|
+ .on('stag-suggest-selected', (_e, _input, _data) => {
|
|
|
+ let columns = StatTree.getSelectedNodeColumns();
|
|
|
+ columns.push({
|
|
|
+ label: _data.label,
|
|
|
+ display_key: _data.text
|
|
|
+ });
|
|
|
+ $(_input).val('').focus();
|
|
|
+ StatTree.setSelectedNodeColumns(columns);
|
|
|
+ StatTree.onSelected();
|
|
|
+ StatTree.setDirty();
|
|
|
+ return false;
|
|
|
+ });
|
|
|
|
|
|
- getSelectedNodeClauseArgs: function() {
|
|
|
- let selected = this.selectedNode();
|
|
|
- if(selected) {
|
|
|
- return selected.data.clause.args;
|
|
|
- }
|
|
|
- return [];
|
|
|
- },
|
|
|
+ $(document)
|
|
|
+ .off('click', '.move-column-up')
|
|
|
+ .on('click', '.move-column-up', function() {
|
|
|
+ let columns = StatTree.getSelectedNodeColumns();
|
|
|
+ let index = +($(this).attr('data-index'));
|
|
|
+ if(index > 0) {
|
|
|
+ let x = columns[index - 1];
|
|
|
+ columns[index - 1] = columns[index];
|
|
|
+ columns[index] = x;
|
|
|
+ }
|
|
|
+ StatTree.setSelectedNodeColumns(columns);
|
|
|
+ StatTree.onSelected();
|
|
|
+ StatTree.setDirty();
|
|
|
+ return false;
|
|
|
+ });
|
|
|
|
|
|
- getSelectedNodeColumns: function() {
|
|
|
- let selected = this.selectedNode();
|
|
|
- if(selected) {
|
|
|
- return selected.data.columns;
|
|
|
- }
|
|
|
- return [];
|
|
|
- },
|
|
|
-
|
|
|
- setSelectedNodeColumns: function(columns) {
|
|
|
- let selected = this.selectedNode();
|
|
|
- if(selected) {
|
|
|
- selected.data.columns = columns;
|
|
|
- this.setDirty();
|
|
|
- }
|
|
|
- return [];
|
|
|
- },
|
|
|
+ $(document)
|
|
|
+ .off('click', '.move-column-down')
|
|
|
+ .on('click', '.move-column-down', function() {
|
|
|
+ let columns = StatTree.getSelectedNodeColumns();
|
|
|
+ let index = +($(this).attr('data-index'));
|
|
|
+ if(index < columns.length - 1) {
|
|
|
+ let x = columns[index + 1];
|
|
|
+ columns[index + 1] = columns[index];
|
|
|
+ columns[index] = x;
|
|
|
+ }
|
|
|
+ StatTree.setSelectedNodeColumns(columns);
|
|
|
+ StatTree.onSelected();
|
|
|
+ StatTree.setDirty();
|
|
|
+ return false;
|
|
|
+ });
|
|
|
|
|
|
- onDeselected: function(_e, _data) {
|
|
|
- linePropsColumn.addClass('d-none');
|
|
|
- },
|
|
|
+ $(document)
|
|
|
+ .off('click', '.remove-column')
|
|
|
+ .on('click', '.remove-column', function() {
|
|
|
+ let columns = StatTree.getSelectedNodeColumns();
|
|
|
+ columns.splice(+($(this).attr('data-index')), 1);
|
|
|
+ StatTree.setSelectedNodeColumns(columns);
|
|
|
+ StatTree.onSelected();
|
|
|
+ StatTree.setDirty();
|
|
|
+ return false;
|
|
|
+ });
|
|
|
|
|
|
- onSelected: function(_e, _data) {
|
|
|
- let selected = this.selectedNode();
|
|
|
+ $(document)
|
|
|
+ .off('click', '.edit-arg-value')
|
|
|
+ .on('click', '.edit-arg-value', function() {
|
|
|
+ let args = StatTree.getSelectedNodeClauseArgs();
|
|
|
+ let value = window.prompt('New value:', args[+($(this).attr('data-index'))].default_value || '');
|
|
|
+ if(value !== null) {
|
|
|
+ args[+($(this).attr('data-index'))].default_value = value;
|
|
|
+ StatTree.onSelected();
|
|
|
+ StatTree.setDirty();
|
|
|
+ }
|
|
|
+ return false;
|
|
|
+ });
|
|
|
|
|
|
- if(selected) console.log(selected.data)
|
|
|
+ $(document)
|
|
|
+ .off('click', '.edit-arg-access-level')
|
|
|
+ .on('click', '.edit-arg-access-level', function() {
|
|
|
+ let args = StatTree.getSelectedNodeClauseArgs();
|
|
|
+ let accessLevel = window.prompt('New access level (USER, PRO or ADMIN):', args[+($(this).attr('data-index'))].access_level || '');
|
|
|
+ if(accessLevel !== null) {
|
|
|
+ args[+($(this).attr('data-index'))].access_level = accessLevel;
|
|
|
+ StatTree.onSelected();
|
|
|
+ StatTree.setDirty();
|
|
|
+ }
|
|
|
+ return false;
|
|
|
+ });
|
|
|
|
|
|
- if(!(selected && selected.data && selected.data.type === 'stat_tree_line')) return;
|
|
|
+ $(document)
|
|
|
+ .off('click', '.clause-expand-all')
|
|
|
+ .on('click', '.clause-expand-all', function() {
|
|
|
+ $('#clauses-view-{{$statTree->id}}').jstree('open_all');
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+ $(document)
|
|
|
+ .off('click', '.clause-collapse-all')
|
|
|
+ .on('click', '.clause-collapse-all', function() {
|
|
|
+ $('#clauses-view-{{$statTree->id}}').jstree('close_all');
|
|
|
+ return false;
|
|
|
+ });
|
|
|
|
|
|
- linePropsColumn.removeClass('d-none');
|
|
|
- linePropsColumn.find('[line-label]').text(selected.data.displayLabel);
|
|
|
+ $(document)
|
|
|
+ .off('click', '.tree-expand-all')
|
|
|
+ .on('click', '.tree-expand-all', function() {
|
|
|
+ $('#stat-tree-view-{{$statTree->id}}').jstree('open_all');
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+ $(document)
|
|
|
+ .off('click', '.tree-collapse-all')
|
|
|
+ .on('click', '.tree-collapse-all', function() {
|
|
|
+ $('#stat-tree-view-{{$statTree->id}}').jstree('close_all');
|
|
|
+ return false;
|
|
|
+ });
|
|
|
|
|
|
- // fill args
|
|
|
- let tbody = linePropsColumn.find('[line-args]');
|
|
|
- let clause = selected.data.clause;
|
|
|
- tbody.empty();
|
|
|
- if(clause) {
|
|
|
- let edit = true;
|
|
|
- let args = clause.args ? clause.args : [];
|
|
|
- // $('<tr/>').addClass(edit ? '' : 'opacity-60 parent-arg').append($('<td/>').attr('colspan', 3).addClass('font-weight-bold text-sm ' + (edit ? '' : 'text-secondary')).text(clause.clause_label)).appendTo(tbody);
|
|
|
- if(!args.length) {
|
|
|
- $('<tr/>').addClass(edit ? '' : 'opacity-60 parent-arg').append($('<td/>').attr('colspan', 3).addClass('pl-3 text-secondary text-sm').text('No args')).appendTo(tbody);
|
|
|
- }
|
|
|
- else {
|
|
|
- for (let i = 0; i < args.length; i++) {
|
|
|
- $('<tr/>')
|
|
|
- .addClass(edit ? '' : 'opacity-60 parent-arg')
|
|
|
- .append(
|
|
|
- $('<td/>')
|
|
|
- .addClass('pl-3')
|
|
|
- .html(args[i].arg_text + ' <span class="text-secondary text-sm">(' + args[i].field_type + ')</span>')
|
|
|
- )
|
|
|
- .append(
|
|
|
- $('<td/>')
|
|
|
- .text(args[i].default_value)
|
|
|
- .append(edit ? '<a href="#" class="edit-arg-value ml-2" data-index="' + i + '"><i class="fa fa-edit text-primary text-sm on-hover-opaque"></i></a>': '')
|
|
|
- )
|
|
|
- .append(
|
|
|
- $('<td/>')
|
|
|
- .text(args[i].access_level)
|
|
|
- .append(edit ? '<a href="#" class="edit-arg-access-level ml-2" data-index="' + i + '"><i class="fa fa-edit text-primary text-sm on-hover-opaque"></i></a>': '')
|
|
|
- )
|
|
|
- .appendTo(tbody);
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
+ $(document)
|
|
|
+ .off('click', '#btn-save-tree')
|
|
|
+ .on('click', '#btn-save-tree', function() {
|
|
|
+ StatTree.save();
|
|
|
+ return false;
|
|
|
+ });
|
|
|
|
|
|
- // fill columns
|
|
|
- tbody = linePropsColumn.find('[line-columns]');
|
|
|
- let columns = StatTree.getSelectedNodeColumns();
|
|
|
- tbody.empty();
|
|
|
- if(columns && columns.length) {
|
|
|
- for (let i = 0; i < columns.length; i++) {
|
|
|
- $('<tr/>')
|
|
|
- .append($('<td/>').text(i + 1))
|
|
|
- .append($('<td/>').text(columns[i].label))
|
|
|
- .append($('<td/>').text(columns[i].display_key))
|
|
|
- .append(
|
|
|
- $('<td/>')
|
|
|
- .addClass('text-right text-nowrap')
|
|
|
- .append(i > 0 ? '<a href="#" class="move-column-up mr-2" data-index="' + i + '"><i class="fa fa-arrow-up text-primary on-hover-opaque"></i></a>': '')
|
|
|
- .append(i < columns.length - 1 ? '<a href="#" class="move-column-down mr-2" data-index="' + i + '"><i class="fa fa-arrow-down text-primary on-hover-opaque"></i></a>': '')
|
|
|
- .append('<a href="#" class="remove-column" data-index="' + i + '"><i class="fa fa-trash-alt text-danger on-hover-opaque"></i></a>')
|
|
|
- )
|
|
|
- .appendTo(tbody);
|
|
|
- }
|
|
|
- }
|
|
|
+ $(document)
|
|
|
+ .off('click', '.log-tree')
|
|
|
+ .on('click', '.log-tree', function() {
|
|
|
+ StatTree.log();
|
|
|
+ return false;
|
|
|
+ });
|
|
|
|
|
|
- },
|
|
|
- };
|
|
|
-
|
|
|
- linePropsColumn.find('input[stag-suggest][name="displayKey"]')
|
|
|
- .off('stag-suggest-selected')
|
|
|
- .on('stag-suggest-selected', (_e, _input, _data) => {
|
|
|
- let columns = StatTree.getSelectedNodeColumns();
|
|
|
- columns.push({
|
|
|
- label: _data.label,
|
|
|
- display_key: _data.text
|
|
|
- });
|
|
|
- $(_input).val('').focus();
|
|
|
- StatTree.setSelectedNodeColumns(columns);
|
|
|
- StatTree.onSelected();
|
|
|
- StatTree.setDirty();
|
|
|
- return false;
|
|
|
- });
|
|
|
-
|
|
|
- $(document)
|
|
|
- .off('click', '.move-column-up')
|
|
|
- .on('click', '.move-column-up', function() {
|
|
|
- let columns = StatTree.getSelectedNodeColumns();
|
|
|
- let index = +($(this).attr('data-index'));
|
|
|
- if(index > 0) {
|
|
|
- let x = columns[index - 1];
|
|
|
- columns[index - 1] = columns[index];
|
|
|
- columns[index] = x;
|
|
|
- }
|
|
|
- StatTree.setSelectedNodeColumns(columns);
|
|
|
- StatTree.onSelected();
|
|
|
- StatTree.setDirty();
|
|
|
- return false;
|
|
|
- });
|
|
|
-
|
|
|
- $(document)
|
|
|
- .off('click', '.move-column-down')
|
|
|
- .on('click', '.move-column-down', function() {
|
|
|
- let columns = StatTree.getSelectedNodeColumns();
|
|
|
- let index = +($(this).attr('data-index'));
|
|
|
- if(index < columns.length - 1) {
|
|
|
- let x = columns[index + 1];
|
|
|
- columns[index + 1] = columns[index];
|
|
|
- columns[index] = x;
|
|
|
- }
|
|
|
- StatTree.setSelectedNodeColumns(columns);
|
|
|
- StatTree.onSelected();
|
|
|
- StatTree.setDirty();
|
|
|
- return false;
|
|
|
- });
|
|
|
-
|
|
|
- $(document)
|
|
|
- .off('click', '.remove-column')
|
|
|
- .on('click', '.remove-column', function() {
|
|
|
- let columns = StatTree.getSelectedNodeColumns();
|
|
|
- columns.splice(+($(this).attr('data-index')), 1);
|
|
|
- StatTree.setSelectedNodeColumns(columns);
|
|
|
- StatTree.onSelected();
|
|
|
- StatTree.setDirty();
|
|
|
- return false;
|
|
|
- });
|
|
|
-
|
|
|
- $(document)
|
|
|
- .off('click', '.edit-arg-value')
|
|
|
- .on('click', '.edit-arg-value', function() {
|
|
|
- let args = StatTree.getSelectedNodeClauseArgs();
|
|
|
- let value = window.prompt('New value:', args[+($(this).attr('data-index'))].default_value || '');
|
|
|
- if(value !== null) {
|
|
|
- args[+($(this).attr('data-index'))].default_value = value;
|
|
|
- StatTree.onSelected();
|
|
|
- StatTree.setDirty();
|
|
|
- }
|
|
|
- return false;
|
|
|
- });
|
|
|
-
|
|
|
- $(document)
|
|
|
- .off('click', '.edit-arg-access-level')
|
|
|
- .on('click', '.edit-arg-access-level', function() {
|
|
|
- let args = StatTree.getSelectedNodeClauseArgs();
|
|
|
- let accessLevel = window.prompt('New access level (USER, PRO or ADMIN):', args[+($(this).attr('data-index'))].access_level || '');
|
|
|
- if(accessLevel !== null) {
|
|
|
- args[+($(this).attr('data-index'))].access_level = accessLevel;
|
|
|
- StatTree.onSelected();
|
|
|
- StatTree.setDirty();
|
|
|
- }
|
|
|
- return false;
|
|
|
- });
|
|
|
-
|
|
|
- $(document)
|
|
|
- .off('click', '.clause-expand-all')
|
|
|
- .on('click', '.clause-expand-all', function() {
|
|
|
- $('#clauses-view-{{$statTree->id}}').jstree('open_all');
|
|
|
- return false;
|
|
|
- });
|
|
|
- $(document)
|
|
|
- .off('click', '.clause-collapse-all')
|
|
|
- .on('click', '.clause-collapse-all', function() {
|
|
|
- $('#clauses-view-{{$statTree->id}}').jstree('close_all');
|
|
|
- return false;
|
|
|
- });
|
|
|
-
|
|
|
- $(document)
|
|
|
- .off('click', '.tree-expand-all')
|
|
|
- .on('click', '.tree-expand-all', function() {
|
|
|
- $('#stat-tree-view-{{$statTree->id}}').jstree('open_all');
|
|
|
- return false;
|
|
|
- });
|
|
|
- $(document)
|
|
|
- .off('click', '.tree-collapse-all')
|
|
|
- .on('click', '.tree-collapse-all', function() {
|
|
|
- $('#stat-tree-view-{{$statTree->id}}').jstree('close_all');
|
|
|
- return false;
|
|
|
- });
|
|
|
-
|
|
|
- $(document)
|
|
|
- .off('click', '#btn-save-tree')
|
|
|
- .on('click', '#btn-save-tree', function() {
|
|
|
- StatTree.save();
|
|
|
- return false;
|
|
|
- });
|
|
|
-
|
|
|
- $(document)
|
|
|
- .off('click', '.log-tree')
|
|
|
- .on('click', '.log-tree', function() {
|
|
|
- StatTree.log();
|
|
|
- return false;
|
|
|
- });
|
|
|
-
|
|
|
- $(document)
|
|
|
- .off('input change paste', '.frm-clause-add-edit input[name="question"], .frm-clause-add-edit input[name="answer"]')
|
|
|
- .on('input change paste', '.frm-clause-add-edit input[name="question"], .frm-clause-add-edit input[name="answer"]', function() {
|
|
|
- let form = $(this).closest('.frm-clause-add-edit');
|
|
|
- let label = $.trim(form.find('input[name="question"]').val()) + ' ' +
|
|
|
- $.trim(form.find('input[name="answer"]').val());
|
|
|
- form.find('input[name="label"]').val(label);
|
|
|
- });
|
|
|
-
|
|
|
- $('#refresh-counts')
|
|
|
- .off('click')
|
|
|
- .on('click', function() {
|
|
|
- if(StatTree.changed) {
|
|
|
- window.alert('Cannot refresh counts while the tree has unsaved changes.');
|
|
|
- return;
|
|
|
- }
|
|
|
- showMask();
|
|
|
- $.post("{{ route('practice-management.api.statTree.refreshTreeCountQueries') }}", {
|
|
|
- statTreeID: "{{ $statTree->id }}"
|
|
|
- }, function (response) {
|
|
|
- if(!hasResponseError(response)) {
|
|
|
- fastReload();
|
|
|
- }
|
|
|
- }, 'json').then(hideMask);
|
|
|
- return false;
|
|
|
- });
|
|
|
+ $(document)
|
|
|
+ .off('input change paste', '.frm-clause-add-edit input[name="question"], .frm-clause-add-edit input[name="answer"]')
|
|
|
+ .on('input change paste', '.frm-clause-add-edit input[name="question"], .frm-clause-add-edit input[name="answer"]', function() {
|
|
|
+ let form = $(this).closest('.frm-clause-add-edit');
|
|
|
+ let label = $.trim(form.find('input[name="question"]').val()) + ' ' +
|
|
|
+ $.trim(form.find('input[name="answer"]').val());
|
|
|
+ form.find('input[name="label"]').val(label);
|
|
|
+ });
|
|
|
|
|
|
- ClausesTree.load();
|
|
|
- StatTree.load();
|
|
|
- initMoes();
|
|
|
+ $('#refresh-counts')
|
|
|
+ .off('click')
|
|
|
+ .on('click', function() {
|
|
|
+ if(StatTree.changed) {
|
|
|
+ window.alert('Cannot refresh counts while the tree has unsaved changes.');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ showMask();
|
|
|
+ $.post("{{ route('practice-management.api.statTree.refreshTreeCountQueries') }}", {
|
|
|
+ statTreeID: "{{ $statTree->id }}"
|
|
|
+ }, function (response) {
|
|
|
+ if(!hasResponseError(response)) {
|
|
|
+ fastReload();
|
|
|
+ }
|
|
|
+ }, 'json').then(hideMask);
|
|
|
+ return false;
|
|
|
+ });
|
|
|
|
|
|
- addMCHook('reloadClausesTree', function() {
|
|
|
- ClausesTree.load();
|
|
|
- });
|
|
|
+ ClausesTree.load();
|
|
|
+ StatTree.load();
|
|
|
+ initMoes();
|
|
|
|
|
|
- }
|
|
|
- addMCInitializer('stat-tree-edit-page', init, '#statTreeEdit-{{$statTree->id}}');
|
|
|
- }).call(window);
|
|
|
- </script>
|
|
|
+ addMCHook('reloadClausesTree', function() {
|
|
|
+ ClausesTree.load();
|
|
|
+ });
|
|
|
|
|
|
+ }
|
|
|
+ addMCInitializer('stat-tree-edit-page', init, '#statTreeEdit-{{$statTree->id}}');
|
|
|
+ }).call(window);
|
|
|
+ </script>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
@endsection
|
