Calculation/app/public/js/shares/cs_tools.js

'use strict';

/**
 * cs_errorList：错误列表
 * 使用范围：
 *    台账分解（原报）、台账修订（原报）、计量台账（所有角色）
 *
 * posSearch & billsSearch：台账搜索相关
 * 使用范围：
 *    0号台账：台账分解、台账审批、台账修订、部位台账；
 *    期计量：计量台账、部位台账
 *
 * 所有工具均基于spreadjs，请放在gc.spread.sheets.all.10.0.1.min.js/spreadjs_zh.js之后
 *
 * @author Mai
 * @date
 * @version
 */

const showSideTools = function (show) {
    const left = $('#left-view'), right = $('#right-view'), parent = left.parent();
    if (show) {
        right.show();
        autoFlashHeight();
        /**
         * right.show()后, parent被撑开成2倍left.height, 导致parent.width减少了10px
         * 第一次left.width调整后，parent的缩回left.height, 此时parent.width又增加了10px
         * 故需要通过最终的parent.width再计算一次left.width
         *
         * Q: 为什么不通过先计算left.width的宽度，以避免计算两次left.width?
         * A: 右侧工具栏不一定显示，当右侧工具栏显示过一次后，就必须使用parent和right来计算left.width
         *
         */
            //left.css('width', parent.width() - right.outerWidth());
            //left.css('width', parent.width() - right.outerWidth());
        const percent = 100 - right.outerWidth() /parent.width() * 100;
        left.css('width', percent + '%');
    } else {
        left.width(parent.width());
        right.hide();
    }
};

(function($){
    /**
     * 错误列表
     * @param setting
     * {
     *      tabSelector: 'a[content=#error-list]',
     *      selector: '#error-list',
     *      relaSpread: ledgerSpread,
     *      storeKey: 'ledger-error-' + tenderId,
     * }
     * @returns {{spread: *}}
     */
    $.cs_errorList = function (setting) {
        if (!setting.selector || !setting.relaSpread) return;
        if (!setting.spreadSetting) {
            setting.spreadSetting = {
                cols: [
                    {title: '行号', field: 'serialNo', width: 80, formatter: '@'},
                    {title: '清单编号', field: 'b_code', width: 150, formatter: '@'},
                    {title: '清单名称', field: 'name', width: 230, formatter: '@'},
                ],
                emptyRows: 0,
                headRows: 1,
                headRowHeight: [32],
                defaultRowHeight: 21,
                headerFont: '12px 微软雅黑',
                font: '12px 微软雅黑',
                selectedBackColor: '#fffacd',
                readOnly: true,
            };
        }

        const resultId = setting.id + '-spread';
        const obj = $(setting.selector);
        obj.html(
            '                        <div id="' + resultId + '" class="sjs-sh">\n' +
            '                        </div>'
        );
        autoFlashHeight();

        const spread = SpreadJsObj.createNewSpread($('#' + resultId)[0]);
        const sheet = spread.getActiveSheet();
        SpreadJsObj.initSheet(sheet, setting.spreadSetting);
        SpreadJsObj.forbiddenSpreadContextMenu('#' + resultId, spread);

        spread.getActiveSheet().bind(spreadNS.Events.CellDoubleClick, function (e, info) {
            const sheet = info.sheet;
            const data = sheet.zh_data;
            if (!data) { return }

            const curBills = data[info.row];
            if (!curBills) { return }

            SpreadJsObj.locateTreeNode(setting.relaSpread.getActiveSheet(), curBills.ledger_id, true);
            console.log(curBills);
            if (setting.afterLocated) {
                setting.afterLocated();
            }
        });

        const loadErrorData = function (data, his = false) {
            SpreadJsObj.loadSheetData(sheet, SpreadJsObj.DataType.Data, data);
            if (!his && setting.storeKey) {
                setLocalCache(setting.storeKey, JSON.stringify(data));
            }
            $(setting.tabSelector).show();
        };
        const clearErrorData = function () {
            if (setting.storeKey) removeLocalCache(setting.storeKey);
        };
        if (setting.storeKey) {
            const storeStr = getLocalCache(setting.storeKey);
            const storeData = storeStr ? JSON.parse(storeStr) : [];
            if (storeData.length > 0) loadErrorData(storeData, true);
        }
        const showErrorList = function () {
            const tab = $(setting.tabSelector), tabPanel = $(tab.attr('content'));
            $('a', '#side-menu').removeClass('active');
            tab.addClass('active');
            $('.tab-content .tab-pane').removeClass('active');
            tabPanel.addClass('active');
            showSideTools(true);
            spread.refresh();
            if (setting.afterShow) setting.afterShow();
        };
        return {spread: spread, loadErrorData: loadErrorData, clearErrorData: clearErrorData, show: showErrorList};
    };

    $.posSearch = function (setting) {
        if (!setting.selector || !setting.searchSpread) return;
        const searchHtml =
            '                                <div class="ml-2">\n' +
            '                                    <div class="input-group input-group-sm">\n' +
            '                                        <input type="text" class="form-control" placeholder="输入名称查找" id="pos-keyword">\n' +
            '                                        <div class="input-group-append">\n' +
            '                                            <span class="input-group-text" id="pos-search-hint">结果：0</span>\n' +
            '                                        </div>\n' +
            '                                        <div class="input-group-append" >\n' +
            '                                            <button class="btn btn-outline-secondary" type="button" title="上一个" id="search-pre-pos"><i class="fa fa-angle-double-left"></i></button>\n' +
            '                                            <button class="btn btn-outline-secondary" type="button" title="下一个" id="search-next-pos"><i class="fa fa-angle-double-right"></i></button>\n' +
            '                                        </div>\n' +
            '                                    </div>\n' +
            '                                </div>\n';
        $(setting.selector).html(searchHtml);
        const sheet = setting.searchSpread.getActiveSheet();
        const searchObj = (function () {
            let resultArr = [];
            const search = function (keyword) {
                if (keyword && keyword !== '') {
                    resultArr = [];
                    const sortData = sheet.zh_data;
                    if (sortData) {
                        for (let i = 0, iLength = sortData.length; i < iLength; i++) {
                            const sd = sortData[i];
                            if (sd.name && sd.name.indexOf(keyword) > -1) {
                                resultArr.push({index: i, data: sd});
                            }
                        }
                    }
                } else {
                    resultArr = [];
                }
                $('#pos-search-hint').html('结果：' + resultArr.length);
            };
            const searchAndLocate = function (keyword) {
                search(keyword);
                if (resultArr.length > 0) {
                    const sel = sheet.getSelections()[0];
                    const curRow = sel ? sel.row : 0;
                    const pos = resultArr[0];
                    if (pos.index !== curRow) {
                        sheet.setSelection(pos.index, sel ? sel.col : 0, 1, 1);
                        sheet.getParent().focus();
                        sheet.showRow(pos.index, spreadNS.VerticalPosition.center);
                    }
                }
            };
            const locateNext = function () {
                if (resultArr.length > 0) {
                    const sel = sheet.getSelections()[0];
                    const curRow = sel ? sel.row : 0;
                    let next = _.find(resultArr, function (d) {
                        return d.index > curRow;
                    });
                    if (!next) next = resultArr[0];
                    if (next.index !== curRow) {
                        sheet.setSelection(next.index, sel ? sel.col : 0, 1, 1);
                        sheet.getParent().focus();
                        sheet.showRow(next.index, spreadNS.VerticalPosition.center);
                    }
                }
            };
            const locatePre = function () {
                if (resultArr.length > 0) {
                    const sel = sheet.getSelections()[0];
                    const curRow = sel ? sel.row : 0;
                    let next = _.findLast(resultArr, function (d) {
                        return d.index < curRow;
                    });
                    if (!next) next = resultArr[resultArr.length - 1];
                    if (next.index !== curRow) {
                        sheet.setSelection(next.index, sel ? sel.col : 0, 1, 1);
                        sheet.getParent().focus();
                        sheet.showRow(next.index, spreadNS.VerticalPosition.center);
                    }
                }
            };
            return {search, searchAndLocate, locateNext, locatePre};
        })();
        // $('#pos-keyword').bind('input propertychange', function () {
        //     posSearch.search(this.value);
        // });
        $('#pos-keyword').bind('keydown', function(e){
            if (e.keyCode == 13) searchObj.searchAndLocate(this.value);
        });
        $('#search-pre-pos').click(function () {
            searchObj.locatePre();
        });
        $('#search-next-pos').click(function () {
            searchObj.locateNext();
        });
        return searchObj;
    };
    $.billsSearch = 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);
        obj.html(
            '                        <div class="sjs-bar">\n' +
            '                            <div class="input-group input-group-sm pb-1">\n' +
            '                                <div class="input-group-prepend">\n' +
            (setting.searchOver ? '                                    <div class="input-group-text"><input type="radio" name="searchType" id="over"> 超计</div>\n' : '') +
            (setting.searchEmpty ? '                                    <div class="input-group-text"><input type="radio" name="searchType" id="empty"> 漏计</div>\n' : '') +
            '                                </div>' +
            '                                <input id="searchKeyword" type="text" class="form-control" 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);
        SpreadJsObj.forbiddenSpreadContextMenu('#' + resultId, resultSpread);
        const searchSheet = setting.searchSpread.getActiveSheet();
        let searchResult = [];
        const searchBills = function () {
            const keyword = $('#searchKeyword', obj).val();
            searchResult = [];
            const sortData = SpreadJsObj.getSortData(searchSheet);
            for (const node of sortData) {
                if ((node.code && node.code.indexOf(keyword) > -1) ||
                    node.b_code && node.b_code.indexOf(keyword) > -1 ||
                    node.name && node.name.indexOf(keyword) > -1) {
                    const data = JSON.parse(JSON.stringify(node));
                    data.visible = true;
                    searchResult.push(data);
                }
            }
            SpreadJsObj.loadSheetData(resultSpread.getActiveSheet(), 'data', searchResult);
        };
        const calculateCompletePercent = function (searchResult) {
            if (!searchResult) return;
            for (const sr of searchResult) {
                const base = ZhCalc.add(sr.total_price, sr.end_qc_tp);
                sr.complete_percent = base !== 0 ? ZhCalc.mul(ZhCalc.div(sr.end_gather_tp, base), 100, 2) : 0;
            }
        };
        const searchOver = function () {
            searchResult = [];
            const sortData = SpreadJsObj.getSortData(searchSheet);
            for (const node of sortData) {
                if (node.children && node.children.length > 0) continue;
                if (setting.checkOver && setting.checkOver(node)) {
                    const data = JSON.parse(JSON.stringify(node));
                    data.visible = true;
                    searchResult.push(data);
                }
            }
            calculateCompletePercent(searchResult);
            SpreadJsObj.loadSheetData(resultSpread.getActiveSheet(), 'data', searchResult);
        };
        const searchEmpty = function () {
            searchResult = [];
            const sortData = SpreadJsObj.getSortData(searchSheet);
            for (const node of sortData) {
                if (node.children && node.children.length > 0) continue;
                if (setting.checkEmpty && setting.checkEmpty(node)) {
                    const data = JSON.parse(JSON.stringify(node));
                    data.visible = true;
                    searchResult.push(data);
                }
            }
            calculateCompletePercent(searchResult);
            SpreadJsObj.loadSheetData(resultSpread.getActiveSheet(), 'data', searchResult);
        };
        const searchLess = function () {
            searchResult = [];
            const sortData = SpreadJsObj.getSortData(searchSheet);
            for (const node of sortData) {
                if (node.children && node.children.length > 0) continue;
                if (setting.checkLess && setting.checkLess(node)) {
                    const data = JSON.parse(JSON.stringify(node));
                    data.visible = true;
                    searchResult.push(data);
                }
            }
            calculateCompletePercent(searchResult);
            SpreadJsObj.loadSheetData(resultSpread.getActiveSheet(), 'data', searchResult);
        };

        $('input', obj).bind('keydown', function (e) {
            if (e.keyCode == 13) searchBills();
        });
        $('button', obj).bind('click', () => {searchBills()});
        $('#over', obj).bind('change', () => {searchOver()});
        $('#empty', obj).bind('change', () => {searchLess()});
        resultSpread.getActiveSheet().bind(spreadNS.Events.CellDoubleClick, function (e, info) {
            const sheet = info.sheet;
            const data = sheet.zh_data;
            if (!data) { return }

            const curBills = data[info.row];
            if (!curBills) { return }

            SpreadJsObj.locateTreeNode(searchSheet, curBills.ledger_id, true);
            if (setting.afterLocated) {
                setting.afterLocated();
            }
        });
        return {spread: resultSpread};
    };
})(jQuery);