Calculation/app/public/js/advance_audit.js

'use strict';

/**
 *
 *
 * @author lanjianrong
 * @date 2020/8/7
 * @version
 */

$(document).ready(function () {
    autoFlashHeight()
    let oldVal = null
    let timer = null
    let oldSearchVal = null
    handleFileList(fileList)
    // 控制上报弹窗的文案
    function checkModal(isHide) {
        if (isHide) {
            $('#tm-fail').show()
            $('#tm-success').hide()
            $('#tm-submit').hide()
        } else {
            $('#tm-fail').hide()
            $('#tm-success').show()
            $('#tm-submit').show()
        }
    }

    $('#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.name.indexOf(newVal) !== -1 || item.mobile === newVal).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) {
                    console.log('accountGroup', accountGroup)
                    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', '.acc-btn', function () {
        const idx = $(this).attr('data-groupid')
        const type = $(this).attr('data-type')
        if (type === 'hide') {
            $(this).parent().parent().find(`div[data-toggleid="${idx}"]`).show(() => {
                $(this).children().removeClass('fa-plus-square').addClass('fa-minus-square-o')
                $(this).attr('data-type', 'show')

            })
        } else {
            $(this).parent().parent().find(`div[data-toggleid="${idx}"]`).hide(() => {
                $(this).children().removeClass('fa-minus-square-o').addClass('fa-plus-square')
                $(this).attr('data-type', 'hide')
            })
        }
        return false
    })

    // 添加到审批流程中
    $('dl').on('click', 'dd', function () {
        let id = $(this).data('id')
        id = parseInt(id)
        if (id !== 0) {
            postData(preUrl + '/audit/add', { auditorId: id }, (data) => {
                // <p class="m-0 ml-2"><small class="text-muted">中交第一公路工程局有限公司国道311线满别公路施工一分部</small></p>
                const html = []
                html.push('<li class="list-group-item" auditorId="'+ data.audit_id +'"><a href="javascript: void(0)" class="text-danger pull-right">移除</a>')
                html.push('<span>')
                html.push(data.order + ' ')
                html.push(data.name + ' ')
                html.push('</span>')
                html.push('<small class="text-muted">')
                html.push(data.role)
                html.push('</small>')
                html.push(`<p class="m-0 ml-2"><small class="text-muted">${data.company}</small></p></li>`)
                $('#auditors').append(html.join(''))

                if ($('.fa-stop-circle').length) {
                    $('.fa-stop-circle').removeClass('fa-stop-circle').addClass('fa-chevron-circle-down')
                }
                const auditorsHTML = `<li class="list-group-item" data-auditorId='${data.audit_id}'><i class="fa fa fa-stop-circle" ></i> ${data.name} <small class="text-muted">${data.role}</small></li>`
                $('#auditors2').append(auditorsHTML)

                if ($('#auditors')[0].children.length > 0) {
                    checkModal(false)
                }
            });
        }
    });

    // 删除审批人
    $('body').on('click', '#auditors li>a', function () {
        const li = $(this).parent()
        const data = {
            auditorId: parseInt(li.attr('auditorId')),
        };
        postData(preUrl + '/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 + ' ')
            }
            // 删除左边审核人
            $(`#auditors2 li[data-auditorId='${data.auditorId}']`).remove()
        })
    })

    $('#au-btn').on('click','a', function() {
        const content = $(this).data('target')
        switch (content) {
            case '#sub-sp':
                if ($('#auditors')[0].children.length) {
                    checkModal(false)
                }
                break;
            default:
                break;
        }
    })

    // 上报审批
    $('#tm-submit').click(function() {
        const pay_ratio = parseFloat($(`.pay-input[data-type=0]`).val())
        const cur_amount = parseFloat($(`.pay-input[data-type=1]`).val())
        if (!pay_ratio || !cur_amount) {
            return toastr.error('请填写本期金额!')
        }
        const prev_amount = prevAdvance && prevAdvance.prev_total_amount || 0
        const prev_total_amount = ZhCalc.add(cur_amount, prev_amount)
        const remark = filterText($('#ad-remark').val())
        const data = {pay_ratio, cur_amount, prev_amount, prev_total_amount, remark, status: auditConst.status.checking}
        postData(preUrl + '/audit/start', data, (data) => {
            window.location.reload()
        }, () => {
            window.location.reload()
        })
    })

    // 重新上报
    $('#sp-list2-btn').click(() => {
        $('#tm-submit').trigger('click')
    })
    // 转化成两位小数
    function fixedToSub(s, decimal = 2) {
        return parseFloat(parseFloat(s).toFixed(decimal))
    }
    // 自动转换支付比例和本期金额
    $('.pay-input').on('input propertychange', function(e) {
        let val = parseFloat(e.target.value)
        const p_amount = prevAdvance && prevAdvance.prev_total_amount || 0 // 截止本期金额
        const re_amount = ZhCalc.sub(advancePayTotal, p_amount) // 剩余未付款的总额
        const min = parseFloat($(this).attr('min'))
        const max = parseFloat($(this).attr('max'))
        const type = parseInt($(this).data('type'))
        let pay_ratio = null
        let cur_amount = null
        if (val < min) {
            // 限制最小值为min
            $(this).val(min)
            val = min
        }
        if (max && val > max) {
            // 限制最大值为max
            $(this).val(max)
            val = max
        }
        // 本期金额转化
        if (type === 1) {
            if (val > re_amount) {
                // 限制不能超过最大值
                val = re_amount
            }
            $(this).val(fixedToSub(val, decimal)) // 重新赋值限制只有两位小数
            const pay_a_input = $(`.pay-input[data-type=${reverse(type)}]`)
            pay_ratio = parseFloat(ZhCalc.mul(ZhCalc.div(val, advancePayTotal), 100).toFixed(2))
            cur_amount = val
            pay_a_input.val(pay_ratio)
            // 截止本期金额文案更新
            $('#p_total2').text(formatMoney(ZhCalc.add(val, p_amount), ',', decimal))
        } else {
            if (val.toFixed(1) === max.toFixed(1)) {
                val = max
            }
            // 支付比例转化
            $(this).val(fixedToSub(val)) // 重新赋值限制只有两位小数
            const cur_m_input = $(`.pay-input[data-type=${reverse(type)}]`)
            cur_amount = ZhCalc.mul(advancePayTotal, ZhCalc.div(val, 100))
            pay_ratio = val
            cur_m_input.val(cur_amount.toFixed(decimal))
            // 截止本期金额文案更新
            $('#p_total2').text(formatMoney(ZhCalc.add(cur_amount, p_amount), ',', decimal))
        }
        const data = {
            pay_ratio,
            cur_amount,
        }
        oldVal = {
            cur_amount: parseFloat($(`.pay-input[data-type=${1}]`).val()),
            remark: filterText($('#ad-remark').val())
        }
        clearTimeout(timer)
        timer = setTimeout(() => {
            if (checkInput()) {
                update(data)
                clearTimeout(timer)
            }
        }, 2000);
    })

    function checkInput() {
        const newVal = {
            cur_amount: parseFloat($(`.pay-input[data-type=${1}]`).val()),
            remark: filterText($('#ad-remark').val())
        }
        return newVal.cur_amount === oldVal.cur_amount && newVal.remark === oldVal.remark
    }

    $('#ad-remark').on('input propertychange', function(e) {
        const remark = filterText(e.target.value);
        oldVal = {
            pay_ratio: parseFloat($(`.pay-input[data-type=${0}]`).val()),
            cur_amount: parseFloat($(`.pay-input[data-type=${1}]`).val()),
            remark
        }
        const data = oldVal
        clearTimeout(timer)
        timer = setTimeout(() => {
            if (checkInput()) {
                update(data)
                clearTimeout(timer)
            }
        }, 2000);
    })

    function filterText(text) {
        if (!text) return null
        return text.replace(/(\r\n)|(\n)/g, '<br/>').replace(/\s/g, ' ')
    }
    function update(data) {
        postData(preUrl + '/update', data)
    }

    // $('#file-modal-target').click(function () {
    //     $('#file-modal').trigger('click')
    // })
    $('#file-ok').click(function () {
        const files = Array.from($('#file-modal')[0].files)
        const valiData = files.map(v => {
            const ext = v.name.substring(v.name.lastIndexOf('.') + 1)
            return {
                size: v.size,
                ext
            }
        })
        if (validateFiles(valiData)) {
            if (files.length) {
                const formData = new FormData()
                files.forEach(file => {
                    formData.append('name', file.name)
                    formData.append('size', file.size)
                    formData.append('file', file)
                })
                postDataWithFile(preUrl + '/file/upload', formData, function (result) {
                    handleFileList(result)
                    $('#file-cancel').click()
                });
            }
        }
    })
    function handleFileList(files = []) {
        $('#file-content').empty()
        const { uncheck, checkNo } = auditConst.status
        const newFiles = files.map(file => {
            let showDel = false;
            if (file.uid === cur_uid) {
                if (!curAuditor) {
                    advance.status === uncheck && cur_uid === advance.uid && (showDel = true)
                    advance.status === checkNo && cur_uid === advance.uid && (showDel = true)
                } else {
                    curAuditor.audit_id === cur_uid && (showDel = true)
                }
            }
            return {...file, showDel}
        })
        let html = `<tr><td colspan="3"><a href="#addfujian" data-toggle="modal" class="btn btn-sm btn-light text-primary" data-placement="bottom" title="" data-original-title="添加清单"><i class="fa fa-cloud-upload" aria-hidden="true"></i> 上传附件</a></td></tr>`
        newFiles.forEach((file, idx) => {
            if (file.showDel) {
                html += `<tr><td width="70">${idx + 1}</td><td><a href="/${file.filepath}" target="_blank">${file.filename}</a></td><td width="90"><a href="javascript: void(0);" class="text-danger file-del" data-id="${file.id}">移除</a></td></tr>`
            } else {
                html += `<tr><td width="70">${idx + 1}</td><td><a href="/${file.filepath}" target="_blank">${file.filename}</a></td><td width="90"></td></tr>`
            }
        })
        $('#file-content').append(html)
    }

    $('#file-content').on('click', 'a', function () {
        if ($(this).hasClass('file-del')) {
            const id = $(this).data('id')
            postData(preUrl + '/file/del', {id}, (result) => {
                handleFileList(result)
            })
        }
    })

})


/**
 * 校验文件大小、格式
 * @param {Array} files 文件数组
 */
function validateFiles(files) {
    if (files.length > 10) {
        toastr.error('至多同时上传10个文件');
        return false
    }
    return files.every(file => {
        if (file.size > 1024 * 1024 * 30) {
            toastr.error('文件大小限制为30MB');
            return false
        }
        if (whiteList.indexOf('.' + file.ext) === -1) {
            toastr.error('请上传正确的格式文件');
            return false
        }
        return true
    })
}

function reverse(num){
    return 1^num
}

function formatMoney(s, dot = ',', decimal = 2) {
    if (!s) {
        s = 0;
        return s.toFixed(decimal);
    }
    s = parseFloat((s + '').replace(/[^\d\.-]/g, '')).toFixed(decimal) + '';
    if (!decimal) {
        s += '.';
    }
    const l = s.split('.')[0].split('').reverse(),
        r = s.split('.')[1];
    let t = '';
    for (let i = 0; i < l.length; i++) {
        t += l[i] + ((i + 1) % 3 == 0 && (i + 1) != l.length ? dot : '');
    }
    return t.split('').reverse().join('') + (decimal === 0 ? '' : '.' + r);
}