Calculation/app/public/js/change_plan.js

'use strict';

/**
 *
 *
 * @author Mai
 * @date 2018/8/21
 * @version
 */
// 向后端请求中间计量号
function getNewCode() {
    postData('/tender/'+ tenderId +'/change/newCode', { type: rulesType }, function (code) {
        if (code !== '') {
            $('#bj-code').val(code);
        }
    });
}

class codeRuleSet {
    constructor (obj) {
        this.body = obj;
        // 切换规则组件类型
        $('.rule-change', obj).change(function () {
            const codeType = this.selectedIndex-1;
            if (codeType === ruleConst.ruleType.addNo) {
                $('#format', obj).show();
                $('#text', obj).show();
                $('#text>label', obj).text('起始编号');
                $('#text>input', obj).val('001');
                const s = '0000000000' + 1;
                $('#text>input', obj).val(s.substr(s.length - $('#format>input', obj).val()));
            } else if (codeType === ruleConst.ruleType.text) {
                $('#format', obj).hide();
                $('#text', obj).show();
                $('#text>label', obj).text('文本');
                $('#text>input', obj).val('').attr('placeholder', '请在这里输入需要的文本');
            } else {
                $('#format', obj).hide();
                $('#text', obj).hide();
            }
        });
        // 修改编号位数
        $('#format>input', obj).change(function () {
            const s = '0000000000' + parseInt($('#text>input', obj).val());
            $('#text>input', obj).val(s.substr(s.length - $(this).val()));
        });

        // 修改连接符
        $('.connector-change', obj).change(function () {
            const connectorType = this.options[this.selectedIndex].text;
            const rules = $('span>span', obj), ruleText = [];
            for (const r of rules) {
                ruleText.push($.trim(r.innerText));
            }
            if (connectorType === '无') {
                $('#preview', obj).text(ruleText.join(''));
            } else {
                $('#preview', obj).text(ruleText.join(connectorType));
            }
            connectorRule = this.options[this.selectedIndex].value;
        });

        // 新增规则组件
        $('#addRule', obj).click(function () {
            const codeType = $('select', obj)[1].selectedIndex-1;
            const rule = {rule_type: codeType}, html = [];
            let preview;
            switch (codeType) {
                case ruleConst.ruleType.dealCode: {
                    if (dealCode === '') {
                        toastr.error('当前标段合同编号为空，请选择其他组件。');
                        return false;
                    }
                    preview = dealCode;
                    break;
                }
                case ruleConst.ruleType.tenderName: {
                    preview = tenderName;
                    break;
                }
                case ruleConst.ruleType.text: {
                    rule.text = $('#text>input', obj).val();
                    if (rule.text === '') {
                        toastr.error('文本内容不允许为空。');
                        return false;
                    }
                    preview = rule.text;
                    break;
                }
                case ruleConst.ruleType.inDate: {
                    preview = moment().format('YYYY');
                    break;
                }
                case ruleConst.ruleType.addNo: {
                    rule.format = parseInt($('#format>input', obj).val());
                    rule.start = parseInt($('#text>input', obj).val());
                    if ($('#text>input', obj).val().length !== rule.format) {
                        toastr.error('起始编号位数和自动编号位数不一致。');
                        return false;
                    }
                    const s = '0000000000';
                    preview = s.substr(s.length - rule.format);
                    break;
                }
                default: {
                    toastr.error('请选择组件再添加');
                    return false;
                }
            }
            // 更新规则
            codeRule.push(rule);
            // 更新规则显示
            html.push('<span class="badge badge-light" title="' + ruleConst.ruleString[codeType] + '" rule="' + JSON.stringify(rule) + '">');
            html.push('<span>' + preview + '</span>');
            html.push('<a href="javascript: void(0);" class="text-danger" title="移除"><i class="fa fa-remove"></i></a>');
            html.push('</span>');
            const part = $('#ruleParts', obj).append(html.join(''));
            // 更新规则预览
            const connectorType = connectorRule !== '' && parseInt(connectorRule) !== ruleConst.connectorType.nothing ? ruleConst.connectorString[connectorRule] : '';
            const previewtext = $.trim($('#preview', obj).text()) === '' ? preview : $.trim($('#preview', obj).text()) + connectorType + preview;
            $('#preview', obj).text(previewtext);
        });
        // 删除规则组件
        $($('#ruleParts', obj)).on('click', 'a', function () {
            const index = $('a', obj).index(this);
            codeRule.splice(index-1, 1);
            $(this).parent().remove();
            const rules = $('span>span', obj), ruleText = [];
            for (const r of rules) {
                ruleText.push($.trim(r.innerText));
            }
            const connectorType = connectorRule !== '' && parseInt(connectorRule) !== ruleConst.connectorType.nothing ? ruleConst.connectorString[connectorRule] : '';
            $('#preview', obj).text(ruleText.join(connectorType));
        });
    }
}
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>`;
};
$(document).ready(() => {

    $('#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('展开历史审核记录')
            })
        }
    });

    // 获取审批流程
    $('a[data-target="#sp-list" ]').on('click', function () {
        const data = {
            id: $(this).attr('c-id'),
        };
        postData('/tender/' + tenderId + '/change/plan/auditors', 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 || group.status === auditConst.status.cancelRevise) {
                        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 || group.status === auditConst.status.revise || group.status === auditConst.status.checkCancel) {
                        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 || group.status === auditConst.status.cancelRevise) {
                            historyHTML.push('<span class="pull-right text-success"><i class="fa fa-check-circle"></i></span>');
                        } else if (auditor.status === auditConst.status.checkNo || group.status === auditConst.status.revise || auditor.status === auditConst.status.checkCancel) {
                            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(''));
        });
    });

    // 首次进入设置
    let showNoNeed = false;
    if (cRuleFirst) {
        codeRule = [];
        showNoNeed = true;
        $('#setting').modal('show');
    }
    // else if ($('#changeList').children.length === 0) {
    //     $('#add-bj').modal('show');
    // }
    // 设置
    const ruleSet = new codeRuleSet($('div.modal-body', '#setting'));
    $('#setRule', '#setting').bind('click', function () {
        const data = {
            rule: ruleType,
            type: rulesType,
            connector: connectorRule,
            data: JSON.stringify(codeRule),
        };
        if (codeRule.length !== 0) {
            $('#autoCodeShow').show();
        }
        postData('/tender/rule', data, function () {
            if (cRuleFirst && showNoNeed) {
                $('#changeFirst').click();
                $('.ml-auto a[href="#add-bj"]').click();
                // $('#add-bj-modal').modal('show');
            } else {
                $('#setting').modal('hide');
            }
        });
    })
    $('.ml-auto').on('click', 'a', function () {
        const content = $(this).attr('href');
        if (content === '#add-bj') {
            $('#add-bj-modal').modal('show')
            getNewCode();
            if ($('#changeList').children.length === 0) {
                $('#addCancel').hide();
            } else {
                $('#addCancel').show();
            }
            $('#bj-code').removeClass('is-invalid');
        }
    });

    // 获取最新可用变更令号
    $('#autoCode').click(getNewCode);
    // 新增变更令 确认
    $('#addOk').click(function () {
        $(this).attr('disabled', true);
        if (!openChangeApply && $('#bj-name').val().length === 0) {
            $('#bj-name').addClass('is-invalid');
            $('#name_error_msg').show();
            $('#name_error_msg').text('变更工程名称不能为空。');
            $(this).attr('disabled', false);
            setTimeout(function () {
                $('#bj-name').removeClass('is-invalid');
                $('#name_error_msg').hide();
            }, 2000);
            return;
        }
        if (!openChangeApply && $('#bj-name').val().length > 100) {
            $('#bj-name').addClass('is-invalid');
            $('#name_error_msg').show();
            $('#name_error_msg').text('名称超过100个字，请缩减名称。');
            $(this).attr('disabled', false);
            setTimeout(function () {
                $('#bj-name').removeClass('is-invalid');
                $('#name_error_msg').hide();
            }, 2000);
            return;
        }
        const data = {
            code: $('#bj-code').val(),
            apply_code: $('#apply-code').val(),
            name: $('#bj-name').val(),
        };
        if (data.code || data.code !== '') {
            postData('/tender/'+ tenderId +'/change/plan/add', data, function (rst) {
                $('#bj-code').removeClass('is-invalid');
                $('#mj-add').modal('hide');
                $(this).attr('disabled', false);
                window.location.href = '/tender/'+ tenderId +'/change/plan/' + rst.id + '/information';
            }, function () {
                $('#mj-code').addClass('is-invalid');
                $('#mj-Hint').show();
                $(this).attr('disabled', false);
            });
        }
    });

    $('#apply-code').change(function () {
        if ($(this).val() === '') {
            $('#bj-name').val('');
        } else {
            const info = _.find(changeApplyList, { code: $(this).val() });
            $('#bj-name').val(info.name);
        }
    });

    //状态切换
    $('#status_select a').on('click', function () {
        const status = $(this).data('val');
        let url = '/tender/'+ tenderId +'/change/plan';
        if (status !== 0) {
            url += '/status/'+ status;
        }
        const filterString = setChangeFilterData('change-plan-'+ tenderId +'-list-order');
        if (filterString) url = url + filterString;
        window.location.href = url;
    });
    // 不再显示首次使用
    $('#changeFirst').click(function () {
        showNoNeed = false;
        $('#changeFirst').remove();
        $('#hide_modal').show();
        $('#setting').modal('hide');
        postData('/tender/'+ tenderId +'/rule/first', { type: rulesType }, function () {
        });
    });

    // 弹出删除变更框赋值
    $('.delete-cpid-modal').on('click', function () {
        $('#delete-cpid').val($(this).attr('cpid'));
    });

    // 排序初始化
    let orderSetting = getLocalCache('change-plan-'+ tenderId +'-list-order');
    if (!orderSetting) orderSetting = 'time|desc';
    const orders = orderSetting.split('|');
    $("#sort-radio input[value='"+ orders[0] +"']").prop('checked', true);
    $("#order-radio input[value='"+ orders[1] +"']").prop('checked', true);
    if (orders[0] === 'time') {
        $('#bpaixu').text('排序：创建时间');
    } else {
        $('#bpaixu').text('排序：变更方案编号');
    }
    // let sortSetting = getLocalCache('change-'+ $('#tenderId').val() +'-list-sort');
    // if (sortSetting && parseInt(sortSetting) === 1) {
    //     $('#bpaixu').click();
    // }
    // $('#sort-dropdown').on('shown.bs.dropdown', function () {
    //     setLocalCache('change-'+ $('#tenderId').val() +'-list-sort', 1);
    // });
    // $('#sort-dropdown').on('hidden.bs.dropdown', function () {
    //     setLocalCache('change-'+ $('#tenderId').val() +'-list-sort', 0);
    // });

    $('#sort-radio input[name="paizhi"]').click(function () {
        const orderStr = $(this).val() + '|' + $('#order-radio input[name="paixu"]:checked').val();
        setLocalCache('change-plan-'+ tenderId +'-list-order', orderStr);
        // setLocalCache('change-'+ $('#tenderId').val() +'-list-sort', 1);
        let link = window.location.origin + window.location.pathname + '?sort='+ $(this).val() + '&order=' + $('#order-radio input[name="paixu"]:checked').val();
        if (getLocalCache('account-pageSize')) {
            link += '&pageSize=' + getLocalCache('account-pageSize');
        }
        window.location.href = link;
    });
    $('#order-radio input[name="paixu"]').click(function () {
        const orderStr = $('#sort-radio input[name="paizhi"]:checked').val() + '|' + $(this).val();
        setLocalCache('change-plan-'+ tenderId +'-list-order', orderStr);
        // setLocalCache('change-'+ $('#tenderId').val() +'-list-sort', 1);
        let link = window.location.origin + window.location.pathname + '?sort='+ $('#sort-radio input[name="paizhi"]:checked').val() + '&order=' + $(this).val();
        if (getLocalCache('account-pageSize')) {
            link += '&pageSize=' + getLocalCache('account-pageSize');
        }
        window.location.href = link;
    })

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