部位台账，计量单元/计量清单，数据筛选demo

app/public/js/ledger_bwtz.js

@@ -22,12 +22,43 @@ $(document).ready(() => {
     if (thousandth) sjsSettingObj.setTpThousandthFormat(xmjSpreadSetting);
     SpreadJsObj.initSheet(unitSheet, unitSpreadSetting);
 
+    const filterUnitTree = createNewPathTree('filter', {
+        id: 'ledger_id',
+        pid: 'ledger_pid',
+        order: 'order',
+        level: 'level',
+        rootId: -1,
+        fullPath: 'full_path',
+    });
+
     const unitTreeObj = {
+        getFilterUnitTree: function (unitTree) {
+            const filter = $('#unit-filter').val();
+            if (!filter || unitTree.nodes.length === 0) return unitTree;
+            filterUnitTree.clearDatas();
+            const filterPath = [];
+            for (const node of unitTree.nodes) {
+                if ((node.code && node.code.indexOf(filter) >= 0) || (node.b_code && node.b_code.indexOf(filter) >= 0)
+                    || (node.name && node.name.indexOf(filter) >= 0) || (node.pos_name && node.pos_name.indexOf(filter) >= 0))
+                    filterPath.push(node.full_path);
+            }
+            for (const node of unitTree.nodes) {
+                for (const fp of filterPath) {
+                    if (fp.indexOf(node.full_path) >= 0 || node.full_path.indexOf(fp) >= 0) {
+                        filterUnitTree.addData(node, ['id', 'ledger_id', 'ledger_pid', 'order', 'level', 'full_path', 'pos_name',
+                            'code', 'b_code', 'name', 'unit', 'unit_price', 'quantity', 'total_price', 'drawing_code_merge', 'memo_merge']);
+                        break;
+                    }
+                }
+            }
+            filterUnitTree.sortTreeNode();
+            return filterUnitTree;
+        },
         loadCurUnitData: function () {
             const node = SpreadJsObj.getSelectObject(xmjSheet);
             SpreadJsObj.resetTopAndSelect(unitSheet);
             if (node && node.unitTree) {
-                SpreadJsObj.loadSheetData(unitSheet, SpreadJsObj.DataType.Tree, node.unitTree);
+                SpreadJsObj.loadSheetData(unitSheet, SpreadJsObj.DataType.Tree, unitTreeObj.getFilterUnitTree(node.unitTree));
             } else {
                 SpreadJsObj.initSheet(unitSheet, unitSpreadSetting);
             }
@@ -55,7 +86,6 @@ $(document).ready(() => {
                 n.unitTree.loadDatas(n.unitTreeData);
             }
         }
-        console.log(xmjTree);
         SpreadJsObj.loadSheetData(xmjSheet, SpreadJsObj.DataType.Tree, xmjTree);
         unitTreeObj.loadCurUnitData();
     });
@@ -170,6 +200,10 @@ $(document).ready(() => {
         xmjSpread.refresh();
         unitSpread.refresh();
     });
+    $('#unit-filter').bind('keydown', function (e) {
+        const evt = window.event || e;
+        if (e.keyCode == 13) unitTreeObj.loadCurUnitData();
+    })
 
     // 显示层次
     (function (select, sheet) {

app/view/ledger/bwtz.ejs

@@ -44,6 +44,21 @@
                             <li class="nav-item">
                                 <a class="nav-link active" data-toggle="tab" href="#jldyjlqd" role="tab">计量单元/计量清单</a>
                             </li>
+                            <% if (ctx.app.config.is_debug) {%>
+                            <li class="nav-item">
+                                <div class="d-inline-block">
+                                    <div class="input-group input-group-sm ml-2">
+                                        <div class="input-group-prepend">
+                                            <span class="input-group-text" id="basic-addon1">数据筛选</span>
+                                        </div>
+                                        <input type="text" class="form-control form-control-sm m-0" id="unit-filter" placeholder="可根据 计量单元/清单编号/名称 筛选数据" style="width: 300px">
+                                    </div>
+                                </div>
+                                <div class="d-inline-block ml-2">
+                                    <div class="alert-warning p-1"><i class="fa Example of exclamation-circle fa-exclamation-circle "></i> 父项/子项任一符合，均显示</div>
+                                </div>
+                            </li>
+                            <% } %>
                         </ul>
                     </div>
                     <div class="sp-wrap" id="unit-spread">