清单对比，新增查找定位

app/public/js/ledger_gather.js

@@ -106,7 +106,7 @@ $(document).ready(() => {
     let gclGatherData;
     // 获取项目节数据
     function loadLeafXmjData(iGclRow) {
-        const gcl = gclGatherData[iGclRow];
+        const gcl = iGclRow ? gclGatherData[iGclRow] : SpreadJsObj.getSelectObject(gclSheet);
         SpreadJsObj.resetTopAndSelect(leafXmjSheet);
         if (gcl) {
             SpreadJsObj.loadSheetData(leafXmjSheet, SpreadJsObj.DataType.Data, gcl.leafXmjs);
@@ -192,15 +192,47 @@ $(document).ready(() => {
         // SpreadJsObj.reloadRowsBackColor(gclSheet, rows);
         SpreadJsObj.reLoadSheetData(gclSheet);
     });
+    const searchBills = $.listSearch({
+        selector: '#search',
+        searchSpread: gclSpread,
+        searchRangeStr: '清单编号/名称',
+        resultSpreadSetting: {
+            cols: [
+                {title: '清单编号', field: 'b_code', hAlign: 0, width: 100, formatter: '@'},
+                {title: '名称', field: 'name', width: 230, hAlign: 0, formatter: '@'},
+                {title: '单位', field: 'unit', width: 60, hAlign: 1, formatter: '@'},
+                {title: '单价', field: 'unit_price', hAlign: 2, width: 60},
+            ],
+            emptyRows: 0,
+            headRows: 1,
+            headRowHeight: [32],
+            headColWidth: [30],
+            defaultRowHeight: 21,
+            headerFont: '12px 微软雅黑',
+            font: '12px 微软雅黑',
+            selectedBackColor: '#fffacd',
+            readOnly: true,
+        },
+        check: function(data, keyword) {
+            return !keyword ||
+                (data.b_code && data.b_code.indexOf(keyword) > -1) ||
+                (data.name && data.name.indexOf(keyword) > -1);
+        },
+        afterLocated: function () {
+            loadLeafXmjData();
+        }
+    });
     // 展开收起附件
-    $('a', '.right-nav').bind('click', function () {
+    $('a', '#side-menu').bind('click', function (e) {
+        e.preventDefault();
         const tab = $(this), tabPanel = $(tab.attr('content'));
         if (!tab.hasClass('active')) {
-            $('a', '.side-menu').removeClass('active');
-            $('.tab-content .tab-select-show').removeClass('active');
+            $('a', '#side-menu').removeClass('active');
+            $('.tab-content .tab-pane.active').removeClass('active');
             tab.addClass('active');
             tabPanel.addClass('active');
             showTools(tab.hasClass('active'));
+            if (tab.attr('content') === '#search') searchBills.spread.refresh();
         } else {
             tab.removeClass('active');
             tabPanel.removeClass('active');

app/public/js/shares/cs_tools.js

@@ -605,6 +605,101 @@ const showSelectTab = function(select, spread, afterShow) {
         });
         return {spread: resultSpread};
     };
+    $.listSearch = function (setting) {
+        if (!setting.selector || !setting.searchSpread || !setting.resultSpreadSetting) return;
+        if (!setting.searchRangeStr) setting.searchRangeStr = '清单编号/名称';
+        const resultId = setting.id + '-search-result';
+        const obj = $(setting.selector);
+        let filter = [];
+        if (setting.searchOver || setting.searchEmpty) {
+            filter.push('<select class="input-group-text" id="search-filter">');
+            filter.push('<option value="">台账</option>');
+            if (setting.customSearch) {
+                for (const cs of setting.customSearch) {
+                    if (cs.valid) filter.push('<option value="' + cs.key + '">' + cs.title + '</option>');
+                }
+            }
+            filter.push('</select>');
+        }
+        obj.html(
+            '                        <div class="sjs-bar">\n' +
+            '                            <div class="input-group input-group-sm pb-1">\n' +
+            '                                <div class="input-group-prepend">\n' +
+            filter.join('') +
+            '                                </div>' +
+            '                                <input id="searchKeyword" type="text" class="form-control" autocomplete="off" placeholder="可查找 ' + setting.searchRangeStr + '" aria-label="Recipient\'s username" aria-describedby="button-addon2">\n' +
+            '                                <div class="input-group-append">\n' +
+            '                                    <button class="btn btn-outline-secondary" type="button"">搜索</button>\n' +
+            '                                </div>\n' +
+            '                            </div>\n' +
+            '                        </div>\n' +
+            '                        <div id="' + resultId + '" class="sjs-sh">\n' +
+            '                        </div>'
+        );
+        autoFlashHeight();
+        const resultSpread = SpreadJsObj.createNewSpread($('#' + resultId)[0]);
+        SpreadJsObj.initSheet(resultSpread.getActiveSheet(), setting.resultSpreadSetting);
+        const searchSheet = setting.searchSpread.getActiveSheet();
+        let searchResult = [];
+        const search = function () {
+            const filter = $('#search-filter').val();
+            if (filter) {
+                searchCustom(filter);
+            } else {
+                searchList();
+            }
+        };
+        const searchList = function () {
+            const keyword = $('#searchKeyword', obj).val();
+            searchResult = [];
+            const sortData = SpreadJsObj.getSortData(searchSheet);
+            for (const [i, node] of sortData.entries()) {
+                if (setting.check(node, keyword)) {
+                    const data = JSON.parse(JSON.stringify(node));
+                    data.searchIndex = i;
+                    data.visible = true;
+                    searchResult.push(data);
+                }
+            }
+            SpreadJsObj.loadSheetData(resultSpread.getActiveSheet(), 'data', searchResult);
+        };
+        const getCheckFun = function (key) {
+            const cs = setting.customSearch.find(function (x) {return x.key === key});
+            return cs ? cs.check : null;
+        };
+        const searchCustom = function (key) {
+            const keyword = $('#searchKeyword', obj).val();
+            const checkFun = getCheckFun(key);
+            searchResult = [];
+            const sortData = SpreadJsObj.getSortData(searchSheet);
+            for (const [i, node] of sortData.entries()) {
+                if (checkFun && checkFun(node)) {
+                    if (setting.check(node, keyword)) {
+                        const data = JSON.parse(JSON.stringify(node));
+                        data.searchIndex = i;
+                        data.visible = true;
+                        searchResult.push(data);
+                    }
+                }
+            }
+            SpreadJsObj.loadSheetData(resultSpread.getActiveSheet(), 'data', searchResult);
+        };
+
+        $('input', obj).bind('keydown', function (e) {
+            if (e.keyCode == 13) search();
+        });
+        $('button', obj).bind('click', () => {search()});
+        resultSpread.getActiveSheet().bind(spreadNS.Events.CellDoubleClick, function (e, info) {
+            const cur = SpreadJsObj.getSelectObject(info.sheet);
+            if (!cur) return;
+
+            SpreadJsObj.locateRow(searchSheet, cur.searchIndex);
+            if (setting.afterLocated) {
+                setting.afterLocated();
+            }
+        });
+        return {spread: resultSpread};
+    };
 
     $.billsTag = function (setting) {
         if (!setting.selector || !setting.relaSpread) return;

app/public/js/spreadjs_rela/spreadjs_zh.js

@@ -1083,12 +1083,21 @@ const SpreadJsObj = {
     locateData: function (sheet, data) {
         if (!sheet.zh_data) { return }
         const index = sheet.zh_data.indexOf(data);
+        if (index < 0) return;
+
         const sels = sheet.getSelections();
         sheet.setSelection(index, sels[0].col, 1, 1);
         SpreadJsObj.reloadRowsBackColor(sheet, [index, sels[0].row]);
         sheet.getParent().focus();
         sheet.showRow(index, spreadNS.VerticalPosition.center);
     },
+    locateRow: function (sheet, row) {
+        const sels = sheet.getSelections();
+        sheet.setSelection(row, sels[0].col, 1, 1);
+        SpreadJsObj.reloadRowsBackColor(sheet, [row, sels[0].row]);
+        sheet.getParent().focus();
+        sheet.showRow(row, spreadNS.VerticalPosition.center);
+    },
     saveTopAndSelect: function (sheet, cacheKey) {
         const sel = sheet.getSelections()[0];
         const top = sheet.getViewportTopRow(1);

app/view/ledger/gather.ejs

@@ -51,6 +51,8 @@
                             </table>
                         </div>
                     </div>
+                    <div id="search" class="tab-pane">
+                    </div>
                 </div>
             </div>
         </div>
@@ -61,6 +63,9 @@
                 <li class="nav-item">
                     <a class="nav-link active" content="#chapter" href="javascript: void(0);">章节合计</a>
                 </li>
+                <li class="nav-item">
+                    <a class="nav-link" content="#search" href="javascript: void(0);">查找定位</a>
+                </li>
             </ul>
         </div>
     </div>

config/web.js

@@ -218,6 +218,7 @@ const JsFiles = {
                     '/public/js/div_resizer.js',
                     '/public/js/spreadjs_rela/spreadjs_zh.js',
                     '/public/js/shares/sjs_setting.js',
+                    '/public/js/shares/cs_tools.js',
                     '/public/js/zh_calc.js',
                     '/public/js/path_tree.js',
                     '/public/js/gcl_gather.js',