Calculation/app/public/js/budget_list.js

'use strict';

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

const budgetNameChange = function (obj) {
    if (obj.value.length > 100) {
        obj.classList.add('is-invalid');
    } else {
        obj.classList.remove('is-invalid');
    }
};

const addBudget = function () {
    const name = $('#add-budget-name').val();
    if (!name || name.length > 100) return;
    const std_id = parseInt($('[name=std_id]:checked').val());
    postData('/budget/add', { name, std_id }, function () {
        window.location.reload();
    });
};

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

const saveBudget = function () {
    const name = $('#modify-budget-name').val();
    if (!name || name.length > 100) return;
    postData('/budget/save', { id: curBudget.id, name}, function () {
        window.location.reload();
    })
};

const delBudget = function () {
    postData('/budget/del', { id: curBudget.id }, function () {
        window.location.reload();
    });
};


$(document).ready(() => {
    autoFlashHeight();
    $('#modify-budget').on('show.bs.modal', () => {
        $('#modify-budget-name').val(curBudget.name);
    });
    $('#del-budget').on('show.bs.modal', () => {
        $('#del-budget-name').text(curBudget.name);
    });

    let timer = null;
    let oldSearchVal = null;
    $('#member-search').bind('input propertychange', function(e) {
        oldSearchVal = e.target.value;
        timer && clearTimeout(timer);
        timer = setTimeout(() => {
            const newVal = $('#member-search').val();
            let html = '';
            if (newVal && newVal === oldSearchVal) {
                accountList
                    .filter(item => item && (item.name.indexOf(newVal) !== -1 || (item.mobile && item.mobile.indexOf(newVal) !== -1)))
                    .forEach(item => {
                        html += `<dd class="border-bottom p-2 mb-0 " data-id="${item.id}" >
                        <p class="mb-0 d-flex"><span class="text-primary">${item.name}</span><span
                                class="ml-auto">${item.mobile || ''}</span></p>
                        <span class="text-muted">${item.role || ''}</span></dd>`
                    });
                $('.book-list').empty();
                $('.book-list').append(html);
            } else {
                if (!$('.acc-btn').length) {
                    accountGroup.forEach((group, idx) => {
                        if (!group) return;
                        html += `<dt><a href="javascript: void(0);" class="acc-btn" data-groupid="${idx}" data-type="hide"><i class="fa fa-plus-square"></i>
                        </a> ${group.groupName}</dt>
                        <div class="dd-content" data-toggleid="${idx}">`;
                        group.groupList.forEach(item => {
                            html += `<dd class="border-bottom p-2 mb-0 " data-id="${item.id}" >
                                    <p class="mb-0 d-flex"><span class="text-primary">${item.name}</span><span
                                            class="ml-auto">${item.mobile || ''}</span></p>
                                    <span class="text-muted">${item.role || ''}</span>
                                </dd>`
                        });
                        html += '</div>';
                    });
                    $('.book-list').empty();
                    $('.book-list').append(html);
                }
            }
        }, 400);
    });
    $('.book-list').on('click', 'dt', function () {
        const idx = $(this).find('.acc-btn').attr('data-groupid')
        const type = $(this).find('.acc-btn').attr('data-type')
        if (type === 'hide') {
            $(this).parent().find(`div[data-toggleid="${idx}"]`).show(() => {
                $(this).children().find('i').removeClass('fa-plus-square').addClass('fa-minus-square-o')
                $(this).find('.acc-btn').attr('data-type', 'show')

            })
        } else {
            $(this).parent().find(`div[data-toggleid="${idx}"]`).hide(() => {
                $(this).children().find('i').removeClass('fa-minus-square-o').addClass('fa-plus-square')
                $(this).find('.acc-btn').attr('data-type', 'hide')
            })
        }
        return false
    });
    let orgMembers, newMembers;
    const generateMemberHtml = function () {
        const html = [];
        for (const mem of newMembers) {
            html.push('<tr>');
            html.push(`<td>${mem.name}</td>`);
            html.push(`<td>${mem.role}</td>`);
            // const view = mem.permission.indexOf(permissionConst.view.value) >= 0;
            // html.push(`<td><div class="custom-control custom-checkbox mb-2">
            //             <input type="checkbox" id="view${mem.uid}" ptype="view" uid="${mem.uid}" class="custom-control-input" ${(view ? 'checked' : '')}>
            //             <label class="custom-control-label" for="view${mem.uid}"></label></div></td>`);
            const edit = mem.permission.indexOf(permissionConst.edit.value) >= 0;
            html.push(`<td><div class="custom-control custom-checkbox mb-2">
                        <input type="checkbox" id="edit${mem.uid}" ptype="edit" uid="${mem.uid}" class="custom-control-input" ${(edit ? 'checked' : '')}>
                        <label class="custom-control-label" for="edit${mem.uid}"></label></div></td>`);
            html.push(`<td><a href="javascript: void(0);" class="btn btn-outline-danger btn-sm ml-1" name="del-member" uid="${mem.uid}">移除</a></td>`);
            html.push('</tr>');
        }
        $('#member-list').html(html.join(''));
    };
    $('[data-target="#member"]').click(function(){
        const tr = this.parentNode.parentNode;
        curBudget.id = tr.getAttribute('bid');
        curBudget.name = tr.getAttribute('bname');
        curBudget.rela_tender = tr.getAttribute('rela-tender');
        postData(window.location.pathname + '/member', curBudget, function (result) {
            orgMembers = result;
            newMembers = result;
            generateMemberHtml();
            $('#member').modal('show');
        });
    });
    $('dl').on('click', 'dd', function () {
        const auditorId = parseInt($(this).data('id'));
        const user = accountList.find(x => { return x.id === auditorId; });
        const check = $(`tr[uid=${auditorId}]`, '#member-list');
        if (check.length > 0) {
            toastr.error('请勿重复添加成员');
            return;
        }
        newMembers.push({
            uid: user.id,
            name: user.name,
            role: user.role,
            permission: [1],
        });
        generateMemberHtml();
    });
    $('#member').on('click', 'a[name="del-member"]', function () {
        const id = parseInt(this.getAttribute('uid'));
        newMembers.splice(newMembers.findIndex(x => { return x.uid === id}), 1);
        generateMemberHtml();
    });
    $('#member-ok').click(() => {
        postData(window.location.pathname + '/member-save', {id: curBudget.id, member: newMembers}, function () {
            $('#member').modal('hide');
        })
    });
    $('#member-list').on('click', 'input', function () {
        const id = parseInt(this.getAttribute('uid'));
        const mem = newMembers.find(x => { return x.uid === id});
        if (this.checked) {
            mem.permission.push(parseInt(permissionConst[this.getAttribute('ptype')].value));
        } else {
            mem.permission.splice(mem.permission.indexOf(permissionConst[this.getAttribute('ptype')].value), 1);
        }
    });

    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('/budget/save', { id: curBudget.id, rela_tender: rela.join(',') }, function () {
                    $(`[bid=${curBudget.id}]`)[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(`/budget/rela?id=${curBudget.id}`, {}, tenders => {
                const rela = curBudget.rela_tender ? curBudget.rela_tender.split(',') : [];
                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) {
                    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();
    });
});