Calculation/app/public/js/measure_material.js

'use strict';

/**
 * 期计量 - 期列表页面 js
 *
 * @author Mai
 * @date 2018/12/7
 * @version
 */
$(function () {
    // 获取审批流程
    $('a[data-target="#sp-list" ]').on('click', function () {
        const data = {
            order: $(this).attr('m-order'),
        };
        postData('/tender/' + tenderId + '/measure/material/auditors', data, function (result) {
            const { auditHistory, auditors, user } = result
            let auditorsHTML = ''
            let historyHTML = ''
            auditors.forEach((auditor, idx) => {
                if (idx === 0) {
                    auditorsHTML += `<li class="list-group-item">
                        <i class="fa fa fa-play-circle fa-rotate-90"></i> ${auditor.name}
                        <small class="text-muted">${auditor.role}</small>
                        <span class="pull-right">原报</span>
                    </li>`
                } else if(idx === auditors.length -1 && idx !== 0) {
                    auditorsHTML += `<li class="list-group-item">
                        <i class="fa fa fa-stop-circle"></i> ${auditor.name}
                        <small class="text-muted">${auditor.role}</small>
                        <span class="pull-right">终审</span>
                    </li>`
                } else {
                    auditorsHTML += `<li class="list-group-item">
                        <i class="fa fa-chevron-circle-down"></i> ${auditor.name}
                        <small class="text-muted">${auditor.role}</small>
                        <span class="pull-right">${transFormToChinese(idx)}审</span>
                    </li>`
                }
            })
            $('#auditor-list').empty()
            $('#auditor-list').append(auditorsHTML)
            const leftAuditors = auditors;
            auditHistory.forEach((auditors, idx) => {
                if(idx === auditHistory.length - 1 && auditHistory.length !== 1) {
                    historyHTML += `<div class="text-right"><a href="javascript: void(0);" id="fold-btn" data-target="show"
                    >展开历史审批流程</a></div>`
                }
                historyHTML += `<div class="${idx < auditHistory.length - 1 ? 'fold-card' : ''}">
                <div class="text-center text-muted">${idx + 1}#</div>
                <ul class="timeline-list list-unstyled mt-2">`
                auditors.forEach((auditor, index) => {
                    if (index === 0) {
                        historyHTML += `<li class="timeline-list-item pb-2">
                            <div class="timeline-item-date">
                                ${formatDate(auditor.begin_time)}
                            </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="card">
                                    <div class="card-body p-3">
                                        <div class="card-text">
                                            <p class="mb-1"><span
                                                    class="h5">${user.name}</span><span
                                                    class="pull-right text-success">${idx !== 0 ? '重新' : ''}上报审批</span>
                                            </p>
                                            <p class="text-muted mb-0">${user.role}</p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </li>
                        <li class="timeline-list-item pb-2">
                            <div class="timeline-item-date">
                                ${formatDate(auditor.end_time)}
                            </div>`

                            if(index < auditors.length - 1) {
                                historyHTML += `<div class="timeline-item-tail"></div>`
                            }
                            if(auditor.status === auditConst.status.checked) {
                                historyHTML += `<div class="timeline-item-icon bg-success text-light">
                                    <i class="fa fa-check"></i>
                                </div>`

                            } else if(auditor.status === auditConst.status.checkNo || auditor.status === auditConst.status.checkNoPre) {
                                historyHTML += `<div class="timeline-item-icon bg-warning text-light">
                                    <i class="fa fa-level-up"></i>
                                </div>`
                            } else if(auditor.status === auditConst.status.checking) {
                                historyHTML += `<div class="timeline-item-icon bg-warning text-light">
                                    <i class="fa fa-ellipsis-h"></i>
                                </div>`
                            } else {
                                historyHTML += `<div class="timeline-item-icon bg-secondary text-light"></div>`

                            }
                            historyHTML += `<div class="timeline-item-content">
                                <div class="card">
                                    <div class="card-body p-3">
                                        <div class="card-text">
                                            <p class="mb-1"><span class="h5">${auditor.name}</span><span
                                                    class="pull-right ${auditConst.statusClass[auditor.status]}">${auditConst.statusString[auditor.status]}</span>
                                            </p>
                                            <p class="text-muted mb-0">${auditor.role}</p>
                                        </div>
                                    </div>`
                            if (auditor.opinion) {
                            historyHTML += `<div class="card-body p-3 border-top">
                                    <p style="margin: 0;">${auditor.opinion}</p>
                                </div>`
                            }
                            historyHTML += `</div></div></li>`
                    } else {
                        historyHTML += `<li class="timeline-list-item pb-2">
                        <div class="timeline-item-date">
                            ${formatDate(auditor.end_time)}
                        </div>`

                        if(index < auditors.length - 1) {
                            historyHTML += `<div class="timeline-item-tail"></div>`
                        }
                        if(auditor.status === auditConst.status.checked) {
                            historyHTML += `<div class="timeline-item-icon bg-success text-light">
                                <i class="fa fa-check"></i>
                            </div>`
                        } else if(auditor.status === auditConst.status.checkNo || auditor.status === auditConst.status.checkNoPre) {
                            historyHTML += `<div class="timeline-item-icon bg-warning text-light">
                                <i class="fa fa-level-up"></i>
                            </div>`

                        } else if(auditor.status === auditConst.status.checking) {
                            historyHTML += `<div class="timeline-item-icon bg-warning text-light">
                                <i class="fa fa-ellipsis-h"></i>
                            </div>`
                        } else {
                            historyHTML += `<div class="timeline-item-icon bg-secondary text-light"></div>`
                        }
                        historyHTML += `<div class="timeline-item-content">
                        <div class="card">
                            <div class="card-body p-3">
                                <div class="card-text">
                                    <p class="mb-1"><span class="h5">${auditor.name}</span>
                                        <span
                                            class="pull-right
                                                            ${auditConst.statusClass[auditor.status]}">${auditor.status !== auditConst.status.uncheck ? auditConst.statusString[auditor.status] : ''}
                                            ${auditor.status === auditConst.status.checkNo ? user.name : ''}
                                            ${auditor.status === auditConst.status.checkNoPre ? (leftAuditors.find(item => item.order === auditor.sort-1) ? leftAuditors.find(item => item.order === auditor.sort-1).name : '') : ''}
                                        </span>
                                    </p>
                                    <p class="text-muted mb-0">${auditor.role}</p>
                                </div>
                            </div>`

                        if (auditor.opinion) {
                        historyHTML += `<div class="card-body p-3 border-top">
                            <p style="margin: 0;">${auditor.opinion} </p>
                        </div>`
                        }
                        historyHTML += `</div></div></li>`
                    }
                })
                historyHTML += '</ul></div>'

            })
            $('#audit-list').empty()
            $('#audit-list').append(historyHTML)
        });
    });

    // 展开/收起历史审核记录
    $('#audit-list').on('click', 'a', function() {
        const type = $(this).data('target')
        const auditCard = $(this).parent().parent()
        console.log('auditCard', auditCard)
        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('展开历史审核记录')
            })
        }
    });

    function formatDate(date) {
        if (!date) return '';
        date = new Date(date)
        const year = date.getFullYear();
        let mon = date.getMonth() + 1;
        let day = date.getDate();
        let hour = date.getHours();
        let minute = date.getMinutes();
        let scond = date.getSeconds();
        if (mon < 10) {
            mon = '0' + mon.toString();
        }
        if (day < 10) {
            day = '0' + day.toString();
        }
        if (hour < 10) {
            hour = '0' + hour.toString();
        }
        if (minute < 10) {
            minute = '0' + minute.toString();
        }
        if (scond < 10) {
            scond = '0' + scond.toString();
        }
        return `${year}<span>${mon}-${day}</span><span>${hour}:${minute}:${scond}</span>`;
    };

    // 计量期选中
    $('.select-stage-order').on('click', function () {
        const stageList = $('.select-stage-order:checked');
        if (stageList.length === 0) {
            $('#show_order').hide();
            $('#s_order').val('');
        } else {
            const order_array = [];
            for (let s = 0; s < stageList.length; s++) {
                order_array.push(stageList.eq(s).data('order'));
                // console.log(stageList.eq(s));
            }
            $('#show_order').html('第<b class="mx-2">' + order_array.join('，') + '</b>期');
            $('#show_order').show();
            $('#s_order').val(order_array.join(','));
        }
    });

    // 提交表单判断
    $('#addMaterial').click(function () {
        $(this).attr('disabled', true);
        if ($('#s_order').val() == '') {
            toastr.error('请选择计量期');
            $(this).removeAttr('disabled');
            return false;
        }
        $(this).text('正在生成新一期数据中，请勿刷新本页！...');
        $(this).parents('form').submit();
    })
});