Calculation/app/public/js/tender_cert.js

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

    // 打开添加用户加载数据
    $('#import').on('show.bs.modal', function (e) {
        let html = '';
        for (const tc of tenderCertList) {
            let certHtml = '';
            for (const c of tc.account_info.certs) {
                certHtml += `<option value="${c.id}" ${c.id === tc.cert_id ? 'selected': ''}>${showCol4ObjArray(certRegConst, c.registration, 'value', 'name')}</option>`;
            }
            html += `<tr class="text-center" data-insert="0" data-id="${tc.id}" data-certid="${tc.cert_id}" data-remove="0">
                        <td>${tc.account_info.name}</td>
                        <td>${tc.account_info.role}</td>
                        <td>
                            <select class="form-control form-control-sm">
                                ${certHtml}
                            </select>
                        </td>
                        <td class="text-danger">移除</td>
                    </tr>`;
        }
        $('#select-certs-table').html(html);
    });

    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 && (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>`
                })
                $('.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 => {
                            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', '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
    });

    // 添加到审批流程中
    $('dl').on('click', 'dd', function () {
        const auditorId = parseInt($(this).data('id'))
        if (auditorId) {
            console.log(auditorId);
            const userInfo = _.find(accountList, { id: auditorId });
            const certList = _.filter(allCertList, { uid: parseInt(auditorId) });
            console.log(certList);
            let certHtml = '';
            for (const c of certList) {
                certHtml += `<option value="${c.id}">${showCol4ObjArray(certRegConst, c.registration, 'value', 'name')}</option>`;
            }
            const html = `<tr class="text-center" data-insert="1" data-remove="0" data-uid="${userInfo.id}" data-certid="${certList.length > 0 ? certList[0].id : 0}">
                        <td>${userInfo.name}</td>
                        <td>${userInfo.role}</td>
                        <td>
                            <select class="form-control form-control-sm">
                                ${certHtml}
                            </select>
                        </td>
                        <td class="text-danger">移除</td>
                    </tr>`;
            $('#select-certs-table').append(html);
        }
    });

    $('body').on('click', '#select-certs-table .text-danger', function () {
        $(this).parent().addClass('bg-gray').attr('data-remove', 1);
        $(this).siblings('td').find('select').prop('disabled', true);
        $(this).removeClass('text-danger').text('已移除');
    });

    $('body').on('change', '#select-certs-table select', function () {
        $(this).parents('tr').attr('data-certid', $(this).val());
    });

    $('#add_cert_btn').click(function () {
        // 判断增删改
        const insertList = [];
        if ($('#select-certs-table tr[data-insert="1"][data-remove="0"]').length > 0) {
            $('#select-certs-table tr[data-insert="1"][data-remove="0"]').each(function () {
                insertList.push({
                    uid: parseInt($(this).attr('data-uid')),
                    cert_id: parseInt($(this).attr('data-certid'))
                });
            });
        }
        const removeList = [];
        if ($('#select-certs-table tr[data-insert="0"][data-remove="1"]').length > 0) {
            $('#select-certs-table tr[data-insert="0"][data-remove="1"]').each(function () {
                removeList.push(parseInt($(this).attr('data-id')));
            });
        }
        const updateList = [];
        if ($('#select-certs-table tr[data-insert="0"][data-remove="0"]').length > 0) {
            $('#select-certs-table tr[data-insert="0"][data-remove="0"]').each(function () {
                const cert_id = parseInt($(this).attr('data-certid'))
                const id = parseInt($(this).attr('data-id'));
                const tcInfo = _.find(tenderCertList, { id });
                if (tcInfo.cert_id !== cert_id) {
                    updateList.push({
                        id,
                        cert_id
                    });
                }
            });
        }
        console.log(insertList, removeList, updateList);
        postData('/tender/' + tid + '/cert/save', { type: 'save_user', list: { insertList, removeList, updateList} }, function (result) {
            tenderCertList = result;
            SpreadJsObj.loadSheetData(certSpread.getActiveSheet(), SpreadJsObj.DataType.Data, tenderCertList);
            $('#import').modal('hide');
        });
    });

    // sjs展示
    const certSpread = SpreadJsObj.createNewSpread($('#cert-spread')[0]);
    const certSpreadSetting = {
        emptyRows: 0,
        headRows: 2,
        headRowHeight: [25, 32],
        defaultRowHeight: 21,
        headerFont: '12px 微软雅黑',
        font: '12px 微软雅黑',
    };
    const certSpreadSettingCols = [
        {title: '姓名', colSpan: '1', rowSpan: '2', field: 'name', hAlign: 0, width: 80, formatter: '@', readOnly: true, getValue: 'getValue.name'},
        {title: '技术职称', colSpan: '1', rowSpan: '2', field: 'job_title', hAlign: 0, width: 100, formatter: '@', readOnly: true, getValue: 'getValue.job_title'},
        {title: '所在部门', colSpan: '1', rowSpan: '2', field: 'department', hAlign: 0, width: 100, formatter: '@'},
        {title: '职务', colSpan: '1', rowSpan: '2', field: 'role', hAlign: 0, width: 80, formatter: '@', readOnly: true, getValue: 'getValue.role'},
        {title: '在岗时间', colSpan: '1', rowSpan: '2', field: 'job_time', hAlign: 0, width: 150, formatter: '@'},
        {title: '持证情况|证件名称', colSpan: '4|1', rowSpan: '1|1', field: 'cert_reg', hAlign: 0, width: 150, readOnly: true, getValue: 'getValue.cert_reg'},
        {title: '|证书编号', colSpan: '|1', rowSpan: '|1', field: 'cert_code', hAlign: 0, width: 150, readOnly: true, getValue: 'getValue.cert_code'},
        {title: '|注册单位', colSpan: '|1', rowSpan: '|1', field: 'reg_unit', hAlign: 0, width: 150, readOnly: true, getValue: 'getValue.reg_unit'},
        {title: '|证书附件', colSpan: '|1', rowSpan: '|1', field: 'file_path', hAlign: 1, width: 55, readOnly: true, cellType: 'imageBtn',
            normalImg: '#file_clip', hoverImg: '#file_clip_hover' , showImage: function (data) { return data && data.cert_info && data.cert_info.file_path; }},
        {title: '继续教育情况|培训时间', colSpan: '3|1', rowSpan: '1｜1', field: 'jx_date', hAlign: 0, width: 150, readOnly: true, getValue: 'getValue.jx_date'},
        {title: '|培训单位', colSpan: '|1', rowSpan: '|1', field: 'jx_unit', hAlign: 0, width: 150, readOnly: true, getValue: 'getValue.jx_unit'},
        {title: '|培训证明', colSpan: '|1', rowSpan: '|1', field: 'jx_path', hAlign: 1, width: 55, readOnly: true, cellType: 'imageBtn',
            normalImg: '#file_clip', hoverImg: '#file_clip_hover', showImage: function (data) { return data && data.cert_info && data.cert_info.eduInfo && data.cert_info.eduInfo.file_path; }},
        {title: '备注', colSpan: '1', rowSpan: '2', field: 'remark', hAlign: 0, width: 100},
    ];
    certSpreadSetting.cols = certSpreadSettingCols;

    certSpreadSetting.imageClick = function (data, info) {
        const col = info.sheet.zh_setting.cols[info.col];
        if (col.field === 'file_path' && data && data.cert_info && data.cert_info.file_path) {
            window.open(fujianOssPath + data.cert_info.file_path);
        } else if (col.field === 'jx_path' && data && data.cert_info && data.cert_info.eduInfo && data.cert_info.eduInfo.file_path) {
            window.open(fujianOssPath + data.cert_info.eduInfo.file_path);
        }
    };

    const certCol = {
        getValue: {
            name: function (data) {
                return data.account_info ? data.account_info.name : '';
            },
            job_title: function (data) {
                return data.cert_info ? data.cert_info.job_title : '';
            },
            role: function (data) {
                return data.account_info ? data.account_info.role : '';
            },
            cert_reg: function (data) {
                return data.cert_info ? showCol4ObjArray(certRegConst, data.cert_info.registration, 'value', 'name') : '';
            },
            cert_code: function (data) {
                return data.cert_info ? data.cert_info.code : '';
            },
            reg_unit: function (data) {
                return data.cert_info ? data.cert_info.reg_unit : '';
            },
            file_path: function (data) {
                // return data.cert_info ? fujianOssPath + data.cert_info.file_path : '';
            },
            jx_date: function (data) {
                return data.cert_info && data.cert_info.eduInfo ? data.cert_info.eduInfo.date : '';
            },
            jx_unit: function (data) {
                return data.cert_info && data.cert_info.eduInfo ? data.cert_info.eduInfo.unit : '';
            },
            jx_path: function (data) {
                // return data.cert_info && data.cert_info.eduInfo ? fujianOssPath + data.cert_info.eduInfo.file_path : '';
            }
        },
        readOnly: {
        },
    };

    SpreadJsObj.initSpreadSettingEvents(certSpreadSetting, certCol);
    SpreadJsObj.initSheet(certSpread.getActiveSheet(), certSpreadSetting);
    SpreadJsObj.loadSheetData(certSpread.getActiveSheet(), SpreadJsObj.DataType.Data, tenderCertList);

    const certSpreadObj = {
        certSheetReset: function (redo = false) {

            const newCertData = _.cloneDeep(tenderCertList);
            if (redo) {
                certSpread.getActiveSheet().reset();
                SpreadJsObj.initSpreadSettingEvents(certSpreadSetting, certCol);
                SpreadJsObj.initSheet(certSpread.getActiveSheet(), certSpreadSetting);
            }
            SpreadJsObj.loadSheetData(certSpread.getActiveSheet(), SpreadJsObj.DataType.Data, newCertData);
        },
        editEnded: function (e, info) {
            if (info.sheet.zh_setting) {
                const select = SpreadJsObj.getSelectObject(info.sheet);
                const col = info.sheet.zh_setting.cols[info.col];
                // 未改变值则不提交
                let validText = col.type === 'Number' && is_numeric(info.editingText) ? parseFloat(info.editingText) : (info.editingText ? trimInvalidChar(info.editingText) : null);
                const orgValue = select[col.field];
                if (orgValue == validText || ((!orgValue || orgValue === '') && (validText === ''))) {
                    SpreadJsObj.reLoadRowData(info.sheet, info.row);
                    return;
                }
                const update_data = {
                    id: select.id,
                }
                update_data[col.field] = validText;
                select[col.field] = validText;
                // delete select.waitingLoading;

                console.log(select);

                // 更新至服务器
                postData('/tender/' + tid + '/cert/save', { type: 'update_cert', update_data }, function (result) {
                    SpreadJsObj.reLoadRowData(info.sheet, info.row);
                }, function () {
                    select[col.field] = orgValue;
                    SpreadJsObj.reLoadRowData(info.sheet, info.row);
                });
            }
        },
        deletePress: function (sheet) {
            return;
        },
        clipboardPasted(e, info) {
            const hint = {
                cellError: {type: 'error', msg: '粘贴内容超出了表格范围'},
            };
            const range = info.cellRange;
            const sortData = info.sheet.zh_data || [];
            if (info.cellRange.row + info.cellRange.rowCount > sortData.length) {
                toastMessageUniq(hint.cellError);
                // SpreadJsObj.loadSheetData(materialSpread.getActiveSheet(), SpreadJsObj.DataType.Data, materialBillsData);
                SpreadJsObj.reLoadSheetHeader(certSpread.getActiveSheet());
                SpreadJsObj.reLoadSheetData(certSpread.getActiveSheet());
                return;
            }
            if (sortData.length > 0 && range.col + range.colCount > 13) {
                toastMessageUniq(hint.cellError);
                SpreadJsObj.reLoadSheetHeader(certSpread.getActiveSheet());
                SpreadJsObj.reLoadSheetData(certSpread.getActiveSheet());
                return;
            }
            const data = [];
            // const rowData = [];
            for (let iRow = 0; iRow < range.rowCount; iRow++) {
                let bPaste = true;
                const curRow = range.row + iRow;
                // const materialData = JSON.parse(JSON.stringify(sortData[curRow]));
                const certData = { id: sortData[curRow].id };
                const hintRow = range.rowCount > 1 ? curRow : '';
                let sameCol = 0;
                for (let iCol = 0; iCol < range.colCount; iCol++) {
                    const curCol = range.col + iCol;
                    const colSetting = info.sheet.zh_setting.cols[curCol];
                    if (!colSetting) continue;

                    let validText = info.sheet.getText(curRow, curCol);
                    validText = colSetting.type === 'Number' && is_numeric(validText) ? parseFloat(validText) : (validText ? trimInvalidChar(validText) : null);
                    const orgValue = sortData[curRow][colSetting.field];
                    if (orgValue == validText || ((!orgValue || orgValue === '') && (validText === ''))) {
                        sameCol++;
                        if (range.colCount === sameCol)  {
                            bPaste = false;
                        }
                        continue;
                    }
                    certData[colSetting.field] = validText;
                    sortData[curRow][colSetting.field] = validText;
                }
                if (bPaste) {
                    data.push(certData);
                } else {
                    SpreadJsObj.reLoadRowData(info.sheet, curRow);
                }
            }
            if (data.length === 0) {
                SpreadJsObj.reLoadRowData(info.sheet, info.cellRange.row, info.cellRange.rowCount);
                return;
            }
            console.log(data);
            // 更新至服务器
            postData('/tender/' + tid + '/cert/save', { type: 'paste_cert', update_data: data }, function (result) {
                tenderCertList = result;
                certSpreadObj.certSheetReset();
            }, function () {
                SpreadJsObj.reLoadRowData(info.sheet, info.cellRange.row, info.cellRange.rowCount);
                return;
            });
        },
    }

    certSpread.bind(spreadNS.Events.ClipboardPasted, certSpreadObj.clipboardPasted);
    SpreadJsObj.addDeleteBind(certSpread, certSpreadObj.deletePress);
    certSpread.bind(spreadNS.Events.EditEnded, certSpreadObj.editEnded);

    function showCol4ObjArray(arr, col, key, showKey) {
        const obj = _.find(arr, { [key]: col });
        return obj ? obj[showKey] : '';
    }
});