ソースを参照

Stat trees - report columns - make easier to have complex columns

Vijayakrishnan 3 年 前
コミット
d32e7b8aed
1 ファイル変更63 行追加14 行削除
  1. 63 14
      resources/views/app/stat-tree/stat-trees/sub/edit.blade.php

+ 63 - 14
resources/views/app/stat-tree/stat-trees/sub/edit.blade.php

@@ -389,19 +389,46 @@
                                                     <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">
+                                                    <form class="border p-2">
+                                                        <div class="mb-1 d-flex align-items-baseline">
+                                                            <span class="text-secondary mr-1 text-nowrap width-70px">Label:</span>
+                                                            <div class="flex-grow-1 position-relative">
+                                                                <input required type="text"
+                                                                       name="label"
+                                                                       class="form-control form-control-sm">
+                                                            </div>
                                                         </div>
-                                                    </div>
+                                                        <div class="mb-1 d-flex align-items-baseline">
+                                                            <span class="text-secondary mr-1 text-nowrap width-70px">Column:</span>
+                                                            <div class="flex-grow-1 position-relative">
+                                                                <input required type="text"
+                                                                       name="display_key"
+                                                                       class="form-control form-control-sm"
+{{--                                                                       stag-suggest stag-suggest-left--}}
+{{--                                                                       stag-suggest-ep="/column-suggest"--}}
+{{--                                                                       stag-suggest-extra="table={{$statTree->model}}"--}}
+                                                                       autocomplete="off">
+                                                            </div>
+                                                        </div>
+                                                        <div class="mb-1 d-flex align-items-baseline">
+                                                            <span class="text-secondary mr-1 text-nowrap width-70px">Type:</span>
+                                                            <div class="flex-grow-1 position-relative">
+                                                                <select required class="form-control form-control-sm min-width-unset" name="type" required>
+                                                                    <option value="">-- select --</option>
+                                                                    <option value="numeric">Number</option>
+                                                                    <option value="date">Date</option>
+                                                                    <option value="text">String</option>
+                                                                    <option value="bool">Boolean</option>
+                                                                </select>
+                                                            </div>
+                                                        </div>
+                                                        <div class="mb-1 d-flex align-items-baseline">
+                                                            <span class="text-secondary mr-1 text-nowrap width-70px"></span>
+                                                            <div class="flex-grow-1 position-relative">
+                                                                <button class="btn btn-sm btn-primary add-column">Add Column</button>
+                                                            </div>
+                                                        </div>
+                                                    </form>
                                                     <table class="table table-sm table-bordered table-striped">
                                                         <thead>
                                                         <tr>
@@ -1256,7 +1283,29 @@
                                 },
                             };
 
-                            linePropsColumn.find('input[stag-suggest][name="displayKey"]')
+                            $(document)
+                                .off('click', '.add-column')
+                                .on('click', '.add-column', function() {
+                                    let form = $(this).closest('form');
+                                    if(!form[0].checkValidity()) {
+                                        form[0].reportValidity();
+                                        return false;
+                                    }
+                                    let columns = StatTree.getSelectedNodeColumns();
+                                    columns.push({
+                                        label: form.find('[name="label"]').val(),
+                                        display_key: form.find('[name="display_key"]').val(),
+                                        type: form.find('[name="type"]').val(),
+                                    });
+                                    StatTree.setSelectedNodeColumns(columns);
+                                    StatTree.onSelected();
+                                    StatTree.setDirty();
+                                    form[0].reset();
+                                    form.find('[name="label"]').focus();
+                                    return false;
+                                });
+
+                            /*linePropsColumn.find('input[stag-suggest][name="displayKey"]')
                                 .off('stag-suggest-selected')
                                 .on('stag-suggest-selected', (_e, _input, _data) => {
                                     let columns = StatTree.getSelectedNodeColumns();
@@ -1270,7 +1319,7 @@
                                     StatTree.onSelected();
                                     StatTree.setDirty();
                                     return false;
-                                });
+                                });*/
 
                             $(document)
                                 .off('click', '.move-column-up')