Calculation/app/public/js/shares/phase_pay_audit.js

'use strict';

/**
 *
 *
 * @author Mai
 * @date 2019/2/27
 * @version
 */

// 检查上报情况
function checkAuditorFrom () {
    if ($('#auditors li').length === 0) {
        if(shenpi_status === shenpiConst.sp_status.gdspl) {
            toastr.error('请联系管理员添加审批人');
        } else {
            toastr.error('请先选择审批人，再上报数据');
        }
        return false;
    }
    $('#hide-all').show();
    return true;
}
// 点击验证码
function codeSuccess(btn) {
    let counter = 60;
    btn.addClass('disabled').text('重新获取 ' + counter + 'S');
    btn.parent().siblings('input').removeAttr('readonly').attr('placeholder', '输入短信中的6位验证码');
    const bindBtn = $("#bind-btn");
    bindBtn.removeClass('btn-secondary disabled').addClass('btn-primary');

    const countDown = setInterval(function() {
        const countString = counter - 1 <= 0 ? '' : ' ' + (counter - 1) + 'S';
        // 倒数结束后
        if (countString === '') {
            clearInterval(countDown);
            btn.removeClass('disabled');
        }
        const text = '重新获取' + countString;
        btn.text(text);
        counter -= 1;
    }, 1000);
}

$(document).ready(function () {
    let timer = null;
    let oldSearchVal = null;

    // 搜索审批人
    $('#gr-search').bind('input propertychange', function(e) {
        oldSearchVal = e.target.value;
        timer && clearTimeout(timer);
        timer = setTimeout(() => {
            const newVal = $('#gr-search').val();
            let html = '';
            if (newVal && newVal === oldSearchVal) {
                accountList.filter(item => item && phaseUserId !== item.id && (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><spanclass="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 => {
                            if (item.id !== phaseUserId) {
                                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);
    });

    // 添加审批流程按钮逻辑
    $('body').on('click', '.book-list 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
    });

    // 添加到审批流程
    $('#book-list').on('click', 'dd', function () {
        const id = parseInt($(this).data('id'));
        if (id !== 0) {
            postData('audit/add', { auditorId: id }, (datas) => {
                const html = [];
                // 如果是重新上报，添加到重新上报列表中
                const auditorshtml = [];
                for (const [index, data] of datas.entries()) {
                    if (index !== 0) {
                        html.push('<li class="list-group-item d-flex" auditorId="'+ data[0].audit_id +'">');
                        html.push(`<div class="col-auto">${index}</div>`);
                        html.push('<div class="col">');
                        for (const auditor of data) {
                            html.push(`<div class="d-inline-block mx-1"><i class="fa fa-user text-muted"></i> ${auditor.name} <small class="text-muted">${auditor.role}</small></div>`);
                        }
                        html.push('</div>');
                        html.push('<div class="col-auto">');
                        // todo 添加会签或签时
                        // html.push('<span class="badge badge-pill badge-primary badge-bg-small"><small></small></span>');
                        if (shenpi_status === shenpiConst.sp_status.sqspr || (shenpi_status === shenpiConst.sp_status.gdzs && index+1 !== datas.length)) {
                            html.push('<a href="javascript: void(0)" class="text-danger pull-right">移除</a>');
                        }
                        html.push('</div>');
                        html.push('</li>');
                    }
                    auditorshtml.push('<li class="list-group-item" data-auditorid="' + data.audit_id + '">');
                    auditorshtml.push('<i class="fa ' + (index+1 === datas.length ? 'fa-stop-circle' : 'fa-chevron-circle-down') + '"></i> ');
                    auditorshtml.push(data.name + ' <small class="text-muted">' + data.role + '</small>');
                    if (index === 0) {
                        auditorshtml.push('<span class="pull-right">原报</span>');
                    } else if (index+1 === datas.length) {
                        auditorshtml.push('<span class="pull-right">终审</span>');
                    } else {
                        auditorshtml.push('<span class="pull-right">'+ transFormToChinese(index) +'审</span>');
                    }
                    auditorshtml.push('</li>');
                }
                $('#auditors').html(html.join(''));
                $('#auditors-list').html(auditorshtml.join(''));
            });
        }
    });
    // 删除审批人
    $('body').on('click', '#auditors li a', function () {
        const li = $(this).parents('li');
        const data = {
            auditorId: parseInt(li.attr('auditorId')),
        };
        postData('audit/delete', data, (result) => {
            li.remove();
            for (const rst of result) {
                const aLi = $('li[auditorId=' + rst.audit_id + ']');
                $('span', aLi).text(rst.order + ' ' + rst.name + ' ');
            }

            // 如果是重新上报
            // 令最后一个图标转换
            $('#auditors-list li[data-auditorid="' + data.auditorId + '"]').remove();
            if ($('#auditors-list li').length !== 0 && !$('#auditors-list li i').hasClass('fa-stop-circle')) {
                $('#auditors-list li').eq($('#auditors-list li').length-1).children('i')
                    .removeClass('fa-chevron-circle-down').addClass('fa-stop-circle');
            }
            for (let i = 0; i < $('#auditors-list li').length; i++) {
                $('#auditors-list li').eq(i).find('.pull-right').text(i === 0 ? '原报' : (i+1 === $('#auditors-list li').length ? '终' : transFormToChinese(i)) + '审');
                // $('#auditors-list2 li').eq(i).find('.pull-right').text((i+1 === $('#auditors-list2 li').length ? '终' : transFormToChinese(i+1)) + '审');
            }
        });
    });
    // 退回选择修改审批人流程
    $('#hideSp').click(function () {
        $('#sp-list').modal('hide');
    });
    $('a[f-target]').click(function () {
        $($(this).attr('f-target')).modal('show');
    });

    // 多层modal关闭后的滚动bug修复
    $('#sp-list').on('hidden.bs.modal', function (e) {
        $(document.body).addClass('modal-open');
    });

    // 重新审批获取手机验证码
    // 获取验证码
    let isPosting = false;
    $("#get-code").click(function() {
        if (isPosting) return false;

        const btn = $(this);
        $.ajax({
            url: '/profile/code',
            type: 'post',
            data: { mobile: authMobile, type: 'shenpi' },
            dataTye: 'json',
            error: function() {
                isPosting = false;
                let csrfToken = Cookies.get('csrfToken_j');
                xhr.setRequestHeader('x-csrf-token', csrfToken);
            },
            beforeSend: function() {
                isPosting = true;
            },
            success: function(response) {
                isPosting = false;
                if (response.err === 0) {
                    codeSuccess(btn);
                    $("input[name='code']").removeAttr('readonly');
                    $("#re-shenpi-btn").removeAttr('disabled');
                } else {
                    toast(response.msg, 'error');
                }
            }
        });
    });

    // 管理员更改审批流程js部分
    let timer2 = null;
    let oldSearchVal2 = null;
    $('body').on('input propertychange', '.gr-search', function(e) {
        oldSearchVal2 = e.target.value;
        timer2 && clearTimeout(timer2);
        timer2 = setTimeout(() => {
            const newVal = $(this).val();
            const code = $(this).attr('data-code');
            let html = '';
            if (newVal && newVal === oldSearchVal2) {
                accountList.filter(item => item && item.id !== phaseUserId && (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>`
                });
                $('#' + code + '_dropdownMenu .book-list').empty();
                $('#' + code + '_dropdownMenu .book-list').append(html);
            } else {
                if (!$('#' + code + '_dropdownMenu .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 => {
                            if (item.id !== phaseUserId) {
                                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>';
                    });
                    $('#' + code + '_dropdownMenu .book-list').empty();
                    $('#' + code + '_dropdownMenu .book-list').append(html);
                }
            }
        }, 400);
    });

    const getAdminEditShenpiListHtml = function(auditGroup) {
        const html = [];
        for (const [i, group] of auditGroup.entries()) {
            if (i === 0) continue;
            for (const [j, auditor] of group.entries()) {
                html.push('<tr>');
                if (j === 0) {
                    const auditTypeHtml = auditor.type === auditType.key.common ? '' : `<span class="ml-2 badge badge-pill badge-${auditType.info[auditor.audit_type].class} p-1"><small>${auditType.info[auditor.audit_type].short}</small></span>`;
                    html.push(`<td class="text-left d-flex">${i + '审'}${auditTypeHtml}</td>`);
                } else {
                    html.push(`<td class="text-left d-flex"></td>`);
                }
                html.push(`<td></span> ${auditor.name} <small class="text-muted">${auditor.role}</small></td>`);
                html.push(`<td style="text-align: center"><span class="${auditConst.auditStringClass[auditor.audit_status]}">${ auditor.audit_status !== auditConst.status.uncheck ? auditConst.auditString[auditor.audit_status] : '待审批' }</span></td>`);
                html.push('<td style="text-align: center">');
                if (auditor.audit_status === auditConst.status.checking && j === group.length - 1) {
                    html.push('<span class="dropdown mr-2">',
                        `<a href="javascript: void(0)" class="add-audit" id="${auditor.audit_id}_add_dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">增加</a>`,
                        makeSelectAudit(auditor.audit_id+'_add', auditor.audit_id, 'add'),'</div>', '</span>');
                }
                if (auditor.audit_status === auditConst.status.uncheck) {
                    if (j === group.length - 1) {
                        html.push('<span class="dropdown mr-2">',
                            `<a href="javascript: void(0)" class="add-audit" id="${auditor.audit_id}_add_dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">增加</a>`,
                            makeSelectAudit(auditor.audit_id+'_add', auditor.audit_id, 'add'),'</div>', '</span>');
                        if (auditor.audit_type !== auditType.key.common) {
                            html.push('<span class="dropdown mr-2">',
                                `<a href="javascript: void(0)" class="add-audit" id="${auditor.audit_id}_add_dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">平级</a>`,
                                makeSelectAudit(auditor.audit_id+'_add-sibling', auditor.audit_id, 'add-sibling'),'</div>', '</span>');
                        }
                    }
                    html.push('<span class="dropdown mr-2">',
                        `<a href="javascript: void(0)" class="add-audit" id="${auditor.audit_id}_add_dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">更换</a>`,
                        makeSelectAudit(auditor.audit_id+'_change', auditor.audit_id, 'change'),'</div>', '</span>');
                    html.push(`<span class="dropdown">
                                    <a href="javascript: void(0)" class="text-danger" title="移除" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">移除</a>
                                    <div class="dropdown-menu">
                                        <span class="dropdown-item" href="javascript:void(0);">确认移除审批人？</span>
                                        <div class="dropdown-divider"></div>
                                        <div class="px-2 py-1 text-center">
                                            <button class="remove-audit btn btn-sm btn-danger" data-id="${auditor.audit_id}">移除</button>
                                            <button class="btn btn-sm btn-secondary">取消</button>
                                        </div>
                                    </div>
                                    </span>`);
                }
                html.push('</td>');
                html.push('</tr>');
            }
        }
        return html.join('');
    };

    $('body').on('click', '#admin-edit-shenpi dl dd', function () {
        const id = parseInt($(this).attr('data-id'));
        if (!id) return;

        let this_aid = parseInt($(this).parents('.book-list').attr('data-aid'));
        let this_operate = $(this).parents('.book-list').attr('data-operate');
        const user = _.find(accountList, function (item) {
            return item.id === id;
        });
        const auditorIndex = _.findIndex(auditorList, { audit_id: id });
        if (auditorIndex !== -1) {
            toastr.warning('该审核人已存在，请勿重复添加');
            return;
        }
        const prop = {
            operate: this_operate,
            old_aid: this_aid,
            new_aid: user.id,
        };
        postData('audit/save', prop, (datas) => {
            $('#admin-edit-shenpi-list').html(getAdminEditShenpiListHtml(datas));
            changeLiucheng(datas);
        });
    });

    // 管理员移除审批人
    $('body').on('click', '.remove-audit', function () {
        const id = parseInt($(this).attr('data-id'));
        const prop = {
            operate: 'del',
            old_aid: id,
        };
        postData('audit/save', prop, (datas) => {
            $('#admin-edit-shenpi-list').html(getAdminEditShenpiListHtml(datas));
            changeLiucheng(datas);
        });
    });

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

    function changeLiucheng(datas) {
        const auditorshtml = [];
        let lastAuditorHtml = [];
        for (const [index,data] of datas.entries()) {
            auditorshtml.push('<li class="list-group-item d-flex justify-content-between align-items-center">');
            if (index === 0) {
                auditorshtml.push('<span class="mr-1"><i class="fa fa fa-play-circle fa-rotate-90"></i></span>');
            } else if (index+1 === datas.length) {
                auditorshtml.push('<span class="mr-1"><i class="fa fa fa-stop-circle"></i></span>');
            } else {
                auditorshtml.push('<span class="mr-1"><i class="fa fa-chevron-circle-down"></i></span>');
            }
            auditorshtml.push('<span class="text-muted">');
            for (const u of data) {
                auditorshtml.push(`<small class="d-inline-block text-dark mx-1" title="${u.role}" data-auditorId="${u.audit_id}">${u.name}</small>`);
            }
            auditorshtml.push('</span>');
            auditorshtml.push('<div class="d-flex ml-auto">');
            if (data[0].audit_type !== auditType.key.common) auditorshtml.push(`<span class="badge badge-pill badge-${auditType.info[data[0].audit_type].class} p-1"><small>${auditType.info[data[0].audit_type].short}</small></span>`);
            if (index === 0) {
                auditorshtml.push('<span class="badge badge-light badge-pill ml-auto"><small>原报</small></span>');
            } else if (index+1 === datas.length) {
                auditorshtml.push('<span class="badge badge-light badge-pill"><small>终审</small></span>');
            } else {
                auditorshtml.push('<span class="badge badge-light badge-pill"><small>'+ transFormToChinese(index) +'审</small></span>');
            }
            auditorshtml.push('</div>');
            auditorshtml.push('</li>');
            if (data[0].audit_status === sam_auditConst.status.uncheck) {
                lastAuditorHtml.push('<li class="timeline-list-item pb-2 is_uncheck">');
                if (index < datas.length - 1) {
                    lastAuditorHtml.push('<div class="timeline-item-tail"></div>');
                }
                lastAuditorHtml.push('<div class="timeline-item-icon bg-secondary text-light"></div>');

                lastAuditorHtml.push('<div class="timeline-item-content">');
                lastAuditorHtml.push(`<div class="py-1">
                        <span class="text-black-50">
                        ${ !index === datas.length - 1 ? data[0].audit_order + '' : '终' }审 ${getAuditTypeText(data[0].audit_type)}
                        </span>
                    </div>`);
                lastAuditorHtml.push('<div class="card"><div class="card-body px-3 py-0">');
                for (const [i, auditor] of data.entries()) {
                    lastAuditorHtml.push(`<div class="card-text p-2 py-3 row ${ ( i > 0 ? 'border-top' : '') }">`);
                    lastAuditorHtml.push(`<div class="col"><span class="h6">${auditor.name}</span><span class="text-muted ml-1">${auditor.role}</span></div>`);
                    lastAuditorHtml.push('<div class="col">');
                    lastAuditorHtml.push('</div>');
                    lastAuditorHtml.push('</div>');
                }
                lastAuditorHtml.push('</div></div>');
                lastAuditorHtml.push('</div>');
                lastAuditorHtml.push('</li>');
            }
        }
        $('.last-auditor-list .is_uncheck').remove();
        $('.last-auditor-list').append(lastAuditorHtml.join(''));
        $('.auditors-list').html(auditorshtml.join(''));

    }

    // 审批流程-选择审批人html 生成
    function makeSelectAudit(code, aid, status) {
        let divhtml = '';
        accountGroup.forEach((group, idx) => {
            let didivhtml = '';
            if(group) {
                group.groupList.forEach(item => {
                    didivhtml += item.id !== phaseUserId ? '<dd class="border-bottom p-2 mb-0 " data-id="' + item.id + '" >\n' +
                        '<p class="mb-0 d-flex"><span class="text-primary">' + item.name + '</span><span\n' +
                        '                                                                                class="ml-auto">' + item.mobile + '</span></p>\n' +
                        '                                                                    <span class="text-muted">' + item.role + '</span>\n' +
                        '                                                                    </dd>\n' : '';
                });
                divhtml += '<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>\n' +
                    '                                                                <div class="dd-content" data-toggleid="' + idx + '">\n' + didivhtml +
                    '                                                                </div>\n';
            }
        });
        let html = '<div class="dropdown-menu dropdown-menu-right" id="' + code + '_dropdownMenu" aria-labelledby="' + code + '_dropdownMenuButton" style="width:220px">\n' +
            '                                                        <div class="mb-2 p-2"><input class="form-control form-control-sm gr-search"\n' +
            '                                                                                     placeholder="姓名/手机 检索" autocomplete="off" data-code="' + code + '"></div>\n' +
            '                                                        <dl class="list-unstyled book-list" data-aid="'+ aid +'" data-operate="'+ status +'">\n' + divhtml +
            '                                                        </dl>\n' +
            '                                                    </div>\n' +
            '                                                </div>\n' +
            '                                            </span>\n' +
            '                                        </span>\n' +
            '                                        </li>';
        return html;
    }
});