Calculation/app/public/js/financial_pay_tender.js

'use strict';

const tenderListSpec = (function(){
    function getTenderNodeHtml(node, arr, pid) {
        const html = [];
        html.push('<tr pid="' + pid + '" data-tid="'+ (!node.cid ? node.id : -1) +'"' + (!node.cid ? 'class="tender-info" data-id="'+ node.id +'" style="cursor: pointer;"' : '') + '>');
        // 名称
        html.push('<td style="min-width: 150px;" class="in-' + node.level + '">');
        if (node.cid) {
            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> ');
            html.push((node.level === 1 ? '<b>' : ''), node.name, (node.level === 1 ? '</b>' : ''));
        } else {
            html.push('<span class="text-muted mr-2">');
            html.push(arr.indexOf(node) === arr.length - 1 ? '└' : '├');
            html.push('</span>');
            html.push(node.name);
        }
        html.push('</td>');
        // 累计划拨
        html.push('<td class="text-right" style="width: 15%">');
        if (!node.cid) {
            html.push(node.transfer_amount ? node.transfer_amount : '');
        }
        html.push('</td>');
        // 累计支付
        html.push('<td class="text-right" style="width: 15%">');
        if (!node.cid) {
            html.push(node.pay_amount ? node.pay_amount : '');
        }
        html.push('</td>');
        // 支付次数
        html.push('<td class="text-center" style="width: 15%">');
        if (!node.cid) {
            html.push(node.pay_num ? node.pay_num : '');
        }
        html.push('</td>');
        html.push('</tr>');
        return html.join('');
    }
    function getTenderTreeHeaderHtml() {
        const html = [];
        const left = $('#sub-menu').css('display') === 'none' ? 56 : 176;
        html.push('<table class="table table-hover table-bordered" id="progress-table">')
        html.push('<thead style="position: sticky;left:'+ left +'px;top: 0;">', '<tr>');
        html.push('<th class="text-center" style="min-width: 150px;">', '标段名称', '</th>');
        html.push('<th class="text-center" style="width: 15%">', '累计划拨', '</th>');
        html.push('<th class="text-center" style="width: 15%">', '累计支付', '</th>');
        html.push('<th class="text-center" style="width: 15%">', '支付次数', '</th>');
        html.push('</tr>', '</thead>');
        return html.join('');
    }
    return { getTenderNodeHtml, getTenderTreeHeaderHtml }
})();



let auditUtils;
$(function () {
    autoFlashHeight();

    $('#company_select').change(function () {
        const company_id = parseInt($(this).val()) || 0;
        setSelectValue('company', company_id);
    });

    $('#order_select').change(function () {
        const qi = parseInt($(this).val()) || 0;
        setSelectValue('qi', qi);
    });

    function setSelectValue(select, value) {
        const routes = [];
        const company_id = select === 'company' ? value : parseInt($('#company_select').val());
        if (company_id) {
            const companyInfo = _.find(userCompanyList, { id: company_id });
            if (companyInfo) routes.push('company=' + companyInfo.name);
        }
        const qi = select === 'qi' ? value : parseInt($('#order_select').val());
        if (qi) {
            routes.push('qi=' + qi);
        }
        if (getLocalCache('account-pageSize')) {
            routes.push('pageSize=' + getLocalCache('account-pageSize'));
        }
        window.location.href = `/sp/${spid}/financial/pay/stage` + (routes.length ? '?' + routes.join('&') : '');
    }

    $('body').on('click', '.c-body .tender-info', function () {
        $('.c-body .tender-info').removeClass('table-warning');
        $(this).addClass('table-warning');
        const tid = parseInt($(this).attr('data-id'));
        if (!tid) {
            toastr.warning('未选择标段');
            return;
        }
        console.log(tid);
        const tenderPays = _.filter(pays, { tid });
        console.log(tenderPays);
        $('#qi_select').val('0');
        const qi_options = ['<option value="0">筛选期数</option>'];
        // 只取order大于0的并去除重复并倒序排序
        const qis = _.orderBy(_.uniq(_.map(tenderPays, 'order')).filter(o => o > 0), null, 'desc');
        for (const order of qis) {
            qi_options.push('<option value="' + order + '">第' + order + '期</option>');
        }
        $('#qi_select').html(qi_options.join(''));
        $('#used_selected').text('资金用途：全部');
        // used_select清除如果存在用途为'<a class="dropdown-item to-log-link" data-val="" href="javascript:void(0);">全部</a>'这条remove掉
        $('#used_select').find('a.to-log-link[data-val=""]').remove();
        payListHtml(tenderPays, 0);
    });

    $('body').on('change', '#qi_select', function () {
        const order = parseInt($(this).val());
        const tid = parseInt($('.c-body .tender-info.table-warning').attr('data-id'));
        if (!tid) {
            toastr.warning('未选择标段');
            return;
        }
        const tenderPays = _.filter(pays, { tid });
        let newTenderPays = tenderPays;
        if (order !== 0) {
            newTenderPays = _.filter(tenderPays, { order });
        }
        const used = $('#used_selected').attr('data-val') || '';
        if (used !== '') {
            newTenderPays = _.filter(newTenderPays, { used });
        }
        const status = parseInt($('#status_selected').attr('data-val')) || 0;
        payListHtml(newTenderPays, status);
    });

    $('body').on('click', '#used_select .to-log-link', function () {
        const used = $(this).attr('data-val') || '';
        $('#used_selected').attr('data-val', used);
        $('#used_selected').text('资金用途：' + (used === '' ? '全部' : used));
        if (used !== '' && $('#used_select').find('a.to-log-link[data-val=""]').length === 0) {
            $('#used_select').prepend('<a class="dropdown-item to-log-link" data-val="" href="javascript:void(0);">全部</a>');
        } else if (used === '') {
            $('#used_select').find('a.to-log-link[data-val=""]').remove();
        }
        const tid = parseInt($('.c-body .tender-info.table-warning').attr('data-id'));
        if (!tid) {
            toastr.warning('未选择标段');
            return;
        }
        let tenderPays = _.filter(pays, { tid });
        const order = parseInt($('#qi_select').val()) || 0;
        if (order !== 0) {
            tenderPays = _.filter(tenderPays, { order });
        }
        if (used !== '') {
            tenderPays = _.filter(tenderPays, { used });
        }
        const status = parseInt($('#status_selected').attr('data-val')) || 0;
        payListHtml(tenderPays, status);
    });

    $('body').on('click', '#status_select .to-log-link', function () {
        const status = parseInt($(this).attr('data-val')) || 0;
        const tid = parseInt($('.c-body .tender-info.table-warning').attr('data-id'));
        if (!tid) {
            toastr.warning('未选择标段');
            return;
        }
        let tenderPays = _.filter(pays, { tid });
        const order = parseInt($('#qi_select').val()) || 0;
        if (order !== 0) {
            tenderPays = _.filter(tenderPays, { order });
        }
        const used = $('#used_selected').attr('data-val') || '';
        if (used !== '') {
            tenderPays = _.filter(tenderPays, { used });
        }
        payListHtml(tenderPays, status);
    });

    function payListHtml(tenderPays, status = 0) {
        const status_options = [];
        for (const fs in filter.status) {
            const f = filter.status[fs];
            let num = 0;
            switch(f) {
                case filter.status.pending:
                    num = _.filter(tenderPays, function (item) {
                        return (item.status === auditConst.status.checking && item.curAuditors && item.curAuditors.findIndex(x => { return x.aid === user_id; }) >= 0 && item.curAuditors.find(x => { return x.aid === user_id; }).status === auditConst.status.checking) || (item.uid === user_id && (item.status === auditConst.status.uncheck || item.status === auditConst.status.checkNo));
                    }).length;
                    break;
                case filter.status.uncheck:
                    num = _.filter(tenderPays, function (item) {
                        return item.status === auditConst.status.uncheck || item.status === auditConst.status.checkNo;
                    }).length;
                    break;
                case filter.status.checking:
                    num = _.filter(tenderPays, function (item) {
                        return item.status === auditConst.status.checking;
                    }).length;
                    break;
                case filter.status.checked:
                    num = _.filter(tenderPays, function (item) {
                        return item.status === auditConst.status.checked;
                    }).length;
                    break;
                default:
                    break;
            }
            if (status !== f) status_options.push('<a class="dropdown-item to-log-link" data-val="' + f + '" href="javascript:void(0);">' + filter.statusString[f] + '（' + num + '）</a>');
        }
        if (status !== 0) status_options.unshift('<a class="dropdown-item to-log-link" data-val="0" href="javascript:void(0);">全部</a>');
        $('#status_select').html(status_options.join(''));
        $('#status_selected').attr('data-val', status);
        $('#status_selected').text('审批状态：' + (status === 0 ? '全部' : filter.statusString[status]));
        let newTenderPays = tenderPays;
        if (status !== 0) {
            newTenderPays = _.filter(tenderPays, function (item) {
                switch(status) {
                    case filter.status.pending:
                        return (item.status === auditConst.status.checking && item.curAuditors && item.curAuditors.findIndex(x => { return x.aid === user_id; }) >= 0 && item.curAuditors.find(x => { return x.aid === user_id; }).status === auditConst.status.checking) || (item.uid === user_id && (item.status === auditConst.status.uncheck || item.status === auditConst.status.checkNo));
                    case filter.status.uncheck:
                        return item.status === auditConst.status.uncheck || item.status === auditConst.status.checkNo;
                    case filter.status.checking:
                        return item.status === auditConst.status.checking;
                    case filter.status.checked:
                        return item.status === auditConst.status.checked;
                    default:
                        return true;
                }
            });
        }
        let html = '';
        for (const pay of newTenderPays) {
            let statusHtml = '';
            if (pay.status === auditConst.status.checked && pay.final_auditor_str) {
                statusHtml = `<a href="#sp-list" data-toggle="modal" data-target="#sp-list" c-id="${pay.id}">${pay.final_auditor_str}</a>`;
            } else if (pay.curAuditors.length > 0) {
                if (pay.curAuditors[0].audit_type === auditType.key.common) {
                    statusHtml = `<a href="#sp-list" data-toggle="modal" data-target="#sp-list" c-id="${pay.id}">${pay.curAuditors[0].name}${ pay.curAuditors[0].role !== '' && pay.curAuditors[0].role !== null? '-' + pay.curAuditors[0].role : ''}</a>`;
                } else {
                    statusHtml = `<a href="#sp-list" data-toggle="modal" data-target="#sp-list" c-id="${pay.id}">${transFormToChinese(pay.curAuditors[0].audit_order) + '审'}</a>`;
                }
            }
            let operationHtml = '';
            if (pay.status === auditConst.status.uncheck && pay.uid === user_id) {
                operationHtml = `<a href="/sp/${spid}/financial/pay/${pay.id}/detail?from=tender" class="btn ${auditConst.statusButtonClass[pay.status]} btn-sm">${auditConst.statusButton[pay.status]}</a>`;
            } else if (pay.status === auditConst.status.checkNo && pay.curAuditors && pay.uid === user_id) {
                operationHtml = `<a href="/sp/${spid}/financial/pay/${pay.id}/detail?from=tender" class="btn ${auditConst.statusButtonClass[pay.status]} btn-sm">${auditConst.statusButton[pay.status]}</a>`;
            } else if (pay.status === auditConst.status.checking && pay.curAuditors && pay.curAuditors.findIndex(x => { return x.aid === user_id; }) >= 0) {
                const curAudit = pay.curAuditors.find(x => { return x.aid === user_id });
                if (curAudit.status === auditConst.status.checking) {
                    operationHtml = `<a href="/sp/${spid}/financial/pay/${pay.id}/detail?from=tender" class="btn ${auditConst.statusButtonClass[pay.status]} btn-sm">${auditConst.statusButton[pay.status]}</a>`;
                } else {
                    operationHtml = `<span class="${auditConst.auditStringClass[curAudit.status]}">${auditConst.auditString[curAudit.status]}</span>`;
                }
            } else {
                operationHtml = `<span class="${auditConst.auditStringClass[pay.status]}">${auditConst.auditString[pay.status]}</span>`;
            }
            html += `<tr class="text-center" data-tid="${pay.order}">
                            <td class="">${pay.stage ? '<a href="/sp/'+ spid + '/financial/pay/stage/' + pay.stage.id + '?from=tender" class="account-page-size">第' + pay.stage.order + '期</a>' : '' }</td>
                            <td class=""><a href="/sp/${spid}/financial/pay/${pay.id}/detail?from=tender">${pay.code}</td>
                            <td class="">${moment(pay.create_time).format('YYYY-MM-DD')}</td>
                            <td class="">${pay.username}</td>
                            <td class="">${pay.used}</td>
                            <td class="">${pay.entities}</td>
                            <td class="text-right">${pay.total_price}</td>
                            <td class="text-left ${auditConst.auditProgressClass[pay.status]}">
                                ${statusHtml}
                                ${auditConst.auditProgress[pay.status]}
                            </td>
                            <td>
                                ${operationHtml}
                            </td>
                        </tr>`;
        }
        $('#pay-list').html(html);
    }

    setTimeout(function () {
        $('.c-body .tender-info').eq(0).click();// 需要延时加载
    }, 500);

    $('#audit-list').on('click', 'a', function() {
        const type = $(this).data('target')
        const auditCard = $(this).parent().parent()
        if (type === 'show') {
            $(this).data('target', 'hide')
            auditCard.find('.fold-card').slideDown('swing', () => {
                auditCard.find('#end-target').text($(this).data('idx') + '#')
                auditCard.find('#fold-btn').text('收起历史审核记录')
            })
        } else {
            $(this).data('target', 'show')
            auditCard.find('.fold-card').slideUp('swing', () => {
                auditCard.find('#end-target').text('1#')
                auditCard.find('#fold-btn').text('展开历史审核记录')
            })
        }
    });

    // 获取审批流程
    $('body').on('click', 'a[data-target="#sp-list" ]', function () {
        const data = {
            type: 'get-auditors',
            id: $(this).attr('c-id'),
        };
        postData(`/sp/${spid}/financial/pay/save`, data, function (result) {
            const { auditHistory, auditors2, user } = result;
            let auditorsHTML = [];
            auditors2.forEach((group, idx) => {
                if (idx === 0) {
                    auditorsHTML.push(`<li class="list-group-item d-flex justify-content-between align-items-center">
                        <span class="mr-1"><i class="fa fa fa-play-circle fa-rotate-90"></i></span>
                    <span class="text-muted">${getGroupAuditHtml(group)}</span>
                    <span class="badge badge-light badge-pill ml-auto"><small>原报</small></span>
                    </li>`);
                } else if(idx === auditors2.length -1 && idx !== 0) {
                    auditorsHTML.push(`<li class="list-group-item d-flex justify-content-between align-items-center">
                        <span class="mr-1"><i class="fa fa fa-stop-circle fa-rotate-90"></i></span>
                    <span class="text-muted">${getGroupAuditHtml(group)}</span>
                    <div class="d-flex ml-auto">
                    ${getAuditTypeHtml(group[0].audit_type)}
                    <span class="badge badge-light badge-pill ml-auto"><small>终审</small></span>
                    </div>
                    </li>`);
                } else {
                    auditorsHTML.push(`<li class="list-group-item d-flex justify-content-between align-items-center">
                        <span class="mr-1"><i class="fa fa fa-chevron-circle-down"></i></span>
                    <span class="text-muted">${getGroupAuditHtml(group)}</span>
                    <div class="d-flex ml-auto">
                    ${getAuditTypeHtml(group[0].audit_type)}
                    <span class="badge badge-light badge-pill"><small>${transFormToChinese(idx)}审</small></span>
                    </div>
                    </li>`);
                }
            });
            $('#auditor-list').empty();
            $('#auditor-list').append(auditorsHTML.join(''));

            let historyHTML = [];
            auditHistory.forEach((his, idx) => {
                if (idx === auditHistory.length - 1 && auditHistory.length !== 1) {
                    historyHTML.push(`<div class="text-right"><a href="javascript: void(0);" id="fold-btn" data-target="show">展开历史审批流程</a></div>`);
                }
                historyHTML.push(`<div class="${idx < auditHistory.length - 1 ? 'fold-card' : ''}">`);
                historyHTML.push(`<div class="text-center text-muted">${idx+1}#</div>`);
                historyHTML.push(`<ul class="timeline-list list-unstyled mt-2 ${ idx === auditHistory.length - 1 && auditHistory.length !== 1 ? 'last-auditor-list' : '' }">`);
                his.forEach((group, index) => {
                    if (index === 0) {
                        historyHTML.push(`<li class="timeline-list-item pb-2">
                                            <div class="timeline-item-date">
                                                ${group.beginYear}
                                                <span>${group.beginDate}</span>
                                                <span>${group.beginTime}</span>
                                            </div>
                                            <div class="timeline-item-tail"></div>
                                            <div class="timeline-item-icon bg-success text-light"><i class="fa fa-caret-down"></i></div>
                                            <div class="timeline-item-content">
                                                <div class="py-1">
                                                    <span class="text-black-50">原报</span>
                                                    <span class="pull-right text-success">${idx !== 0 ? '重新' : '' }上报审批</span>
                                                </div>
                                                <div class="card">
                                                    <div class="card-body px-3 py-0">
                                                        <div class="card-text p-2 py-3 row">
                                                            <div class="col">
                                                                <span class="h6">${user.name}</span>
                                                                <span class="text-muted ml-1">${user.role}</span>
                                                            </div>
                                                            <div class="col">
                                                                <span class="pull-right text-success"><i class="fa fa-check-circle"></i></span>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </li>`);
                    }
                    historyHTML.push(`<li class="timeline-list-item pb-2 ${ group.status === auditConst.status.uncheck && idx === auditHistory.length - 1 && auditHistory.length !== 1 ? 'is_uncheck' : ''}">`);
                    if (group.endYear) {
                        historyHTML.push(`<div class="timeline-item-date">${group.endYear}<span>${group.endDate}</span><span>${group.endTime}</span></div>`);
                    }
                    if (index < his.length - 1) {
                        historyHTML.push('<div class="timeline-item-tail"></div>');
                    }
                    if (group.status === auditConst.status.checked) {
                        historyHTML.push('<div class="timeline-item-icon bg-success text-light"><i class="fa fa-check"></i></div>');
                    } else if (group.status === auditConst.status.checkNo) {
                        historyHTML.push('<div class="timeline-item-icon bg-warning text-light"><i class="fa fa-level-up"></i></div>');
                    } else if (group.status === auditConst.status.checking) {
                        historyHTML.push('<div class="timeline-item-icon bg-warning text-light"><i class="fa fa-ellipsis-h"></i></div>');
                    } else if (group.status === auditConst.status.checkAgain) {
                        historyHTML.push('<div class="timeline-item-icon bg-warning text-light"><i class="fa fa-check"></i></div>');
                    } else {
                        historyHTML.push('<div class="timeline-item-icon bg-secondary text-light"></div>');
                    }

                    historyHTML.push('<div class="timeline-item-content">');
                    historyHTML.push('<div class="py-1">');
                    const statuStr = group.status !== auditConst.status.uncheck ?
                        `<span class="pull-right ${auditConst.statusClass[group.status]}">${auditConst.statusString[group.status]}</span>` : '';
                    historyHTML.push(`
                    <span class="text-black-50">
                    ${ group.audit_order === 0 ? '原报' : !group.is_final ? group.audit_order + '审' : '终审' } ${getAuditTypeText(group.audit_type)}
                    </span>
                    ${statuStr}`);
                    historyHTML.push('</div>');
                    historyHTML.push('<div class="card"><div class="card-body px-3 py-0">');
                    for (const [i, auditor] of group.auditors.entries()) {
                        historyHTML.push(`<div class="card-text p-2 py-3 row ${ ( i > 0 ? 'border-top' : '') }">`);
                        historyHTML.push(`<div class="col"><span class="h6">${auditor.name}</span><span class="text-muted ml-1">${auditor.role}</span></div>`);
                        historyHTML.push('<div class="col">');
                        if (auditor.status === auditConst.status.checked) {
                            historyHTML.push('<span class="pull-right text-success"><i class="fa fa-check-circle"></i></span>');
                        } else if (auditor.status === auditConst.status.checkNo) {
                            historyHTML.push('<span class="pull-right text-warning"><i class="fa fa-share-square fa-rotate-270"></i></span>');
                        } else if (auditor.status === auditConst.status.checking) {
                            historyHTML.push('<span class="pull-right text-warning"><i class="fa fa-commenting"></i></span>');
                        } else if (auditor.status === auditConst.status.checkAgain) {
                            historyHTML.push('<span class="pull-right text-warning"><i class="fa fa-check"></i></span>');
                        }
                        historyHTML.push('</div>');
                        if (auditor.opinion) {
                            historyHTML.push(`<div class="col-12 py-1 bg-light"><i class="fa fa-commenting-o mr-1"></i>${auditor.opinion}</div>`);
                        }
                        historyHTML.push('</div>');
                    }
                    historyHTML.push('</div></div>');
                    historyHTML.push('</div>');
                    historyHTML.push('</li>');
                });
                historyHTML.push('</div>');
                historyHTML.push('</ul>');
            });
            $('#audit-list').empty();
            $('#audit-list').append(historyHTML.join(''));
        });
    });

    $.subMenu({
        menu: '#sub-menu', miniMenu: '#sub-mini-menu', miniMenuList: '#mini-menu-list',
        toMenu: '#to-menu', toMiniMenu: '#to-mini-menu',
        key: 'menu.1.0.0',
        miniHint: '#sub-mini-hint', hintKey: 'menu.hint.1.0.1',
        callback: function (info) {
            if (info.mini) {
                $('.panel-title').addClass('fluid');
                $('#sub-menu').removeClass('panel-sidebar');
            } else {
                $('.panel-title').removeClass('fluid');
                $('#sub-menu').addClass('panel-sidebar');
            }
            autoFlashHeight();
        }
    });
});
const getGroupAuditHtml = function (group) {
    return group.map(u => { return `<small class="d-inline-block text-dark mx-1" title="${u.role}" data-auditorId="${u.aid}">${u.name}</small>`; }).join('');
};

const getAuditTypeHtml = function (type) {
    if (type === auditType.key.common) return '';
    return `<div class="li-subscript"><span class="badge badge-pill badge-${auditType.info[type].class} p-1 badge-bg-small"><small>${auditType.info[type].short}</small></span></div>`;
};

const getAuditTypeText = function (type) {
    if (type === auditType.key.common) return '';
    return `<span class="text-${auditType.info[type].class}">${auditType.info[type].long}</span>`;
};