Calculation/app/public/js/budget_list.js

'use strict';

/**
 *
 *
 * @author Mai
 * @date
 * @version
 */
let curBudget = {};

const showModal = function (obj) {
    const tr = obj.parentNode.parentNode;
    curBudget.id = tr.getAttribute('tree_id');
    curBudget.bid = tr.getAttribute('bid');
    curBudget.name = tr.getAttribute('bname');
    curBudget.rela_tender = tr.getAttribute('rela-tender');
    $(obj.getAttribute('data-target')).modal('show');
};

$(document).ready(() => {
    autoFlashHeight();
    const budgetTreeObj = (function(setting){
        const budgetTree = createDragTree(setting.treeSetting);
        budgetTree.loadDatas(setting.source);
        const TableObj = $(setting.table);

        const Utils = {
            getRowTdHtml: function (node, tree) {
                const html = [];
                // 名称
                html.push('<td width="20%" class="in-' + node.tree_level + '">');
                if (node.is_folder) {
                    if (node.children.length > 0) {
                        html.push('<span onselectstart="return false" style="{-moz-user-select:none}" class="fold-switch mr-1" title="收起" cid="'+ node.sort_id +'"><i class="fa fa-minus-square-o"></i></span> <i class="fa fa-folder-o"></i> ', node.name);
                    } else {
                        html.push('<i class="fa fa-folder-o"></i> ', node.name);
                    }
                } else {
                    html.push(`<span class="text-muted mr-2">${tree.isLastSibling(node) ? '└' : '├'}</span>`);
                    html.push(`<a href="/budget/${node.budget_id}/compare" name="name" id="${node.id}">`, node.name, '</a>');
                }
                html.push('</td>');
                // 概预算标准
                if (node.is_folder) {
                    html.push(`<td class="text-center"></td>`);
                } else {
                    html.push(`<td class="text-center">${node.std_name}</td>`);
                }
                // 创建时间
                if (node.is_folder) {
                    html.push(`<td class="text-center"></td>`);
                } else {
                    html.push(`<td class="text-center">${moment(node.create_time).format('YYYY-MM-DD')}</td>`);
                }
                // 金额
                html.push(`<td class="text-right">${node.gu_tp || ''}</td>`);
                html.push(`<td class="text-right">${node.gai_tp || ''}</td>`);
                html.push(`<td class="text-right">${node.yu_tp || ''}</td>`);
                // 操作
                if (node.is_folder) {
                    html.push(`<td></td>`);
                } else {
                    html.push(`<td>`);
                    html.push('<button class="btn btn-outline-primary btn-sm" data-target="#select-rela" name="del" onclick="showModal(this);">关联标段</button>');
                    html.push('</td>');
                }
                return html.join('');
            },
            getNodeTrHtml: function (node, tree) {
                const html = [];
                html.push(`<tr tree_id="${node.id}" bid="${node.budget_id}" bname="${node.name}" rela-tender="${node.rela_tender}">`);
                html.push(Utils.getRowTdHtml(node, tree));
                html.push(`</tr>`);
                return html.join('');
            },
            reloadTable: function () {
                const html = [];
                for (const node of budgetTree.nodes) {
                    html.push(Utils.getNodeTrHtml(node, budgetTree));
                }
                TableObj.html(html.join(''));
            },
            getSelectNode: function() {
                const selectId = $('tr.table-active').attr('tree_id');
                return selectId ? budgetTree.getItems(selectId) : null;
            },
            getSelectNodeId: function() {
                const selectId = $('tr.table-active').attr('tree_id');
                return selectId || setting.treeSetting.rootId;
            },
        };

        Utils.reloadTable();
        return { budgetTree, TableObj, ...Utils };
    })({
        treeSetting: { id: 'id', pid: 'tree_pid', level: 'tree_level', order: 'tree_order', rootId: '-1' },
        source: budgetList,
        table: '#budgetList',
    });

    class srObject {
        constructor() {
            const self = this;
            this.selectTree = null;
            const srSpreadSetting = {
                cols: [
                    {title: '选择', field: 'selected', hAlign: 1, width: 40, formatter: '@', cellType: 'checkbox'},
                    {title: '名称', field: 'name', hAlign: 0, width: 180, formatter: '@', cellType: 'tree'},
                    {title: '期数', field: 'lastStageOrder', hAlign: 1, width: 60, formatter: '@'},
                    {title: '审批状态', field: 'lastStageStatus', hAlign: 1, width: 60, formatter: '@'},
                ],
                emptyRows: 0,
                headRows: 1,
                headRowHeight: [32],
                defaultRowHeight: 21,
                headerFont: '12px 微软雅黑',
                font: '12px 微软雅黑',
                headColWidth: [30],
                selectedBackColor: '#fffacd',
                readOnly: true,
            };
            this.spread = SpreadJsObj.createNewSpread($('#sr-spread')[0]);
            this.sheet = this.spread.getActiveSheet();
            SpreadJsObj.initSheet(this.sheet, srSpreadSetting);

            this.spread.bind(spreadNS.Events.ButtonClicked, function (e, info) {
                if (!info.sheet.zh_setting) return;

                const col = info.sheet.zh_setting.cols[info.col];
                if (col.field !== 'selected') return;

                const node = SpreadJsObj.getSelectObject(info.sheet);
                self.selectNode(node, !node[col.field]);
                SpreadJsObj.reloadColData(info.sheet, 0);
            });



            $('#sr-select-all').click(function () {
                if (!self.selectTree) return;
                for (const n of self.selectTree.nodes) {
                    n.selected = this.checked;
                }
                SpreadJsObj.reloadColData(self.sheet, 0);
            });
            $('#select-rela-ok').click(() => {
                const rela = self.getSelects();
                postData('/subproj/save', { id: curBudget.id, rela_tender: rela.join(',') }, function () {
                    $(`[bid=${curBudget.bid}]`)[0].setAttribute('rela-tender', rela.join(','));
                    $('#select-rela').modal('hide');
                });
            });
        }
        selectNode(node, select) {
            const posterity = this.selectTree.getPosterity(node);
            posterity.unshift(node);
            for (const p of posterity) {
                p.selected = select;
            }
        }
        getSelects() {
            const select = [];
            for (const n of this.selectTree.nodes) {
                if ((!n.children || n.children.length === 0) && n.selected) select.push(n.tid);
            }
            return select;
        }
        init() {
            $('#sr-select-all')[0].checked = false;
            const self = this;
            postData(`/subproj/rela?id=${curBudget.id}`, {}, tenders => {
                const rela = curBudget.rela_tender ? curBudget.rela_tender.split(',') : [];
                console.log(rela);
                self.selectTree = Tender2Tree.convert(category, tenders, null, null, function (node, source) {
                    node.lastStageOrder = `第${source.lastStageOrder}期`;
                    node.lastStageStatus = source.lastStageStatus;
                });
                for (const node of self.selectTree.nodes) {
                    console.log(node);
                    node.selected = rela.indexOf(node.tid + '') >= 0;
                }
                SpreadJsObj.loadSheetData(this.sheet, SpreadJsObj.DataType.Tree, this.selectTree);
            });
        }
    }
    let srSelect;
    $('#select-rela').on('shown.bs.modal', () => {
        if (!srSelect) srSelect = new srObject();
        srSelect.init();
    });
});