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();
    });
};

const relaTender = function () {
    // todo 选择标段
    const rela = [];
    const select = $('[name=select-rela-check]:checked');
    for (const s of select) {
        rela.push(s.getAttribute('tid'));
    }
    postData('/budget/save', { id: curBudget.id, rela_tender: rela.join(',') }, function () {
        $(`[bid=${curBudget.id}]`)[0].setAttribute('brela', rela.join(','));
        $('#select-rela').modal('hide');
    });
};


$(document).ready(() => {
    autoFlashHeight();
    $('#del-budget').on('show.bs.modal', () => {
        $('#del-budget-name').text(curBudget.name);
    });
    $('#select-rela').on('show.bs.modal', () => {
        $('[name=select-rela-check]').removeAttr('checked');
        const rela = curBudget.rela_tender ? curBudget.rela_tender.split(',') : [];
        for (const r of rela) {
            $(`[tid=${r}]`).attr("checked", "checked");
        }
    });

    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.id === 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(permissionConst[this.getAttribute('ptype')].value);
        } else {
            mem.permission.splice(permissionConst[this.getAttribute('ptype')].value, 1);
        }
    });
});