Calculation/app/public/report/js/rpt_signature.js

/**
 * Created by Tony on 2019/9/25.
 */

'use strict'

let rptSignatureHelper = {
    currentSelectedESignAccDom: null,
    currentSelectedESignAccName: null,
    buildSelectableAccount: function () {
        //PRJ_ACCOUNT_LIST
        //1. 清理所有选择项
        // $("#project_account_select_div").empty();
        let accDiv = $('#project_account_select_div');
        let accSelect = $('#project_account_select_dom'); //绑定成员
        accDiv.empty();
        accSelect.empty();
        //2. 一个个加可选用户项
        const prj_accounts = [];
        const prj_sel_option_accounts = [];
        const acc_role_keys = [];
        for (let accIdx = 0; accIdx < PRJ_ACCOUNT_LIST.length; accIdx++) {
            const prjAccount = PRJ_ACCOUNT_LIST[accIdx];
            let companyKey = prjAccount.company;
            let roleKey = prjAccount.role;
            if (companyKey === '') {
                companyKey = '其他单位';
            }
            if (roleKey === '') {
                roleKey = '工程师';
            }
            let keyIdx = acc_role_keys.indexOf(companyKey);
            if (keyIdx < 0) {
                acc_role_keys.push(companyKey);
                prj_accounts.push([]);
                prj_sel_option_accounts.push([]);
                keyIdx = prj_accounts.length - 1;
                //这里先push一些 html prefix，在后面统一在push html suffix
                prj_accounts[keyIdx].push('<ul class="list-group">');
                prj_accounts[keyIdx].push('<li class="px-2 text-muted"><i class="fa fa-caret-down"></i> ' + companyKey + '</li>');
                prj_sel_option_accounts[keyIdx].push('<optgroup label=" ' + companyKey + '">');
            }
            //push item
            prj_accounts[keyIdx].push('<li class="add-sign-list-item"><a href="javascript:void(0)" onclick="rptSignatureHelper.createEsignatureByAccIdx(' + accIdx + ')" class="btn-link pull-right" title="添加" data-dismiss="modal"><i class="fa fa-plus"></i></a>' +
                prjAccount.name + '-<small class="text-muted">' + roleKey + '</small></li>');
            prj_sel_option_accounts[keyIdx].push('<option value="' + accIdx + '">' + prjAccount.name + '-' + roleKey + '</option>');
        }
        for (const prjAccList of prj_accounts) {
            prjAccList.push('</ul>');
        }
        for (const prjAccList of prj_sel_option_accounts) {
            prjAccList.push('</optgroup>');
        }
        for (let idx = 0; idx < prj_accounts.length; idx++) {
            prj_accounts[idx] = prj_accounts[idx].join('');
            prj_sel_option_accounts[idx] = prj_sel_option_accounts[idx].join('');
        }
        accDiv.append(prj_accounts.join(''));
        accSelect.append(prj_sel_option_accounts.join(''));
    },
    drawEsignature: function (accIdx) {
        let dftSignSrc = '/public/images/user-sign.PNG';
        if (PRJ_ACCOUNT_LIST[accIdx].sign_path !== '') {
            dftSignSrc = '/public/images/' + PRJ_ACCOUNT_LIST[accIdx].sign_path;
        }
        //找到相关签名地方，stamp!
        if (rptSignatureHelper.currentSelectedESignAccName !== null) {
            for (const page of zTreeOprObj.currentRptPageRst.items) {
                if (page.signature_cells) {
                    for (const sCell of page.signature_cells) {
                        if (sCell.signature_name === rptSignatureHelper.currentSelectedESignAccName) {
                            sCell.pre_path = dftSignSrc;
                        }
                    }
                }
            }
            // 1. 删除不需要的child dom
            $(rptSignatureHelper.currentSelectedESignAccDom).empty();
            // 2. 创建已选择签名相关 dom
            const canvasWidth = 60;
            const canvasHeight = 30;
            // 2.1 canvas / X
            const elementsStrArr = [];
            elementsStrArr.push('<p class=" d-flex justify-content-between m-0"><canvas id="signCanvas' + accIdx + '" width="' + canvasWidth + '" height="' + canvasHeight + '"></canvas><a onclick="rptSignatureHelper.removeSignature(this)" class="text-danger"><i class="fa fa-remove" title="移除签名"></i></a></p>');
            $(rptSignatureHelper.currentSelectedESignAccDom).append(elementsStrArr.join(' '));
            let imgObj = new Image();
            imgObj.src = dftSignSrc;
            imgObj.onload = function(){
                let canvasNode = document.getElementById('signCanvas' + accIdx);
                let ctx = canvasNode.getContext('2d');
                ctx.drawImage(this, 0, 0, canvasWidth, canvasHeight);
            }
            //.appendChild(pNode);
            //*/
            // 2.2 date-picker
        }
    },
    createEsignatureByAccIdx: function (accIdx) {
        rptSignatureHelper.createPreSelectedSignature(PRJ_ACCOUNT_LIST[accIdx], null);
    },
    createEsignatureByRoleIdx: function (roleIdx) {
        rptSignatureHelper.createPreSelectedSignature(null, ROLE_LIST[roleIdx]);
    },
    createPreSelectedSignature: function (directAcc, roleAcc) {
        let dftSignSrc = '/public/images/user-sign.PNG';
        let userAcc = directAcc;
        if (roleAcc) {
            userAcc = rptSignatureHelper.getUserAccount(roleAcc.bind_acc_id);
        }
        if (userAcc.sign_path !== '') {
            dftSignSrc = '/public/images/' + userAcc.sign_path;
        }
        if (rptSignatureHelper.currentSelectedESignAccName !== null) {
            for (const page of zTreeOprObj.currentRptPageRst.items) {
                if (page.signature_cells) {
                    for (const sCell of page.signature_cells) {
                        if (sCell.signature_name === rptSignatureHelper.currentSelectedESignAccName) {
                            sCell.pre_path = dftSignSrc;
                        }
                    }
                }
            }
            // 1. 删除不需要的child dom
            $(rptSignatureHelper.currentSelectedESignAccDom).empty();
            // 2. 创建已选择签名相关 dom
            rptSignatureHelper.cleanOldSignature(rptSignatureHelper.currentSelectedESignAccName);
            // 2.1 dom element
            const elementsStrArr = [];
            if (directAcc) {
                rptSignatureHelper.pushDomElementByUser(elementsStrArr, userAcc.name, userAcc.role);
                // 还有ROLE_REL_LIST
                let roleRelObj = {};
                roleRelObj.signature_name = rptSignatureHelper.currentSelectedESignAccName;
                roleRelObj.sign_path = dftSignSrc;
                roleRelObj.user_name = userAcc.name;
                roleRelObj.type = '用户';
                roleRelObj.role = (userAcc.role === '')?"工程师":userAcc.role;
                ROLE_REL_LIST.push(roleRelObj);
            } else if (roleAcc) {
                // 创建相关dom元素
                rptSignatureHelper.pushDomElementByRole(elementsStrArr, roleAcc.name, userAcc.name);
                // 还有ROLE_REL_LIST
                let roleRelObj = {};
                roleRelObj.signature_name = rptSignatureHelper.currentSelectedESignAccName;
                roleRelObj.sign_path = dftSignSrc;
                roleRelObj.user_name = userAcc.name;
                roleRelObj.type = '角色';
                roleRelObj.role = (userAcc.role === '')?"工程师":userAcc.role;
                roleRelObj.role_name = roleAcc.name;
                ROLE_REL_LIST.push(roleRelObj);
            }
            // elementsStrArr.push('');
            $(rptSignatureHelper.currentSelectedESignAccDom).append(elementsStrArr.join(' '));
            //.appendChild(pNode);
            //*/
            // 2.2 date-picker
        }
    },
    cleanOldSignature: function (signature_name) {
        // 清掉ROLE_REL_LIST原有的签名
        for (let idx = ROLE_REL_LIST.length - 1; idx >= 0 ; idx--) {
            if (ROLE_REL_LIST[idx].signature_name === signature_name) {
                ROLE_REL_LIST.splice(idx, 1);
            }
        }
    },
    resetESignature: function (pageRst) {
        let body = $('#eSignatureBodyDiv');
        body.empty();
        const signature_cells = [];
        const singatureNameArr = [];
        for (const page of pageRst.items) {
            if (page.signature_cells) {
                for (const sCell of page.signature_cells) {
                    if (singatureNameArr.indexOf(sCell.signature_name) < 0) {
                        signature_cells.push(sCell);
                        singatureNameArr.push(sCell.signature_name);
                    }
                }
            }
        }
        if (signature_cells.length > 0) {
            const elementsStrArr = [];
            for (let scIdx = 0; scIdx < signature_cells.length; scIdx++) {
                const sCell = signature_cells[scIdx];
                elementsStrArr.push('<div class="form-group row">');
                elementsStrArr.push('<label for="staticEmail" class="col-sm-3 col-form-label pr-0">' + sCell.signature_name + '</label>');
                elementsStrArr.push('<div class="col-sm-9">');
                elementsStrArr.push('<ul class="list-group">');
                elementsStrArr.push('<li class="list-group-item">');
                if (sCell.path || sCell.pic) {
                    for (const role_rel of ROLE_REL_LIST) {
                        if (role_rel.signature_name === sCell.signature_name) {
                            if (role_rel.type === '用户') {
                                rptSignatureHelper.pushDomElementByUser(elementsStrArr, role_rel.user_name, role_rel.role);
                            } else {
                                //角色
                                rptSignatureHelper.pushDomElementByRole(elementsStrArr, role_rel.role_name, role_rel.user_name);
                            }
                            break;
                        }
                    }
                } else {
                    elementsStrArr.push('<a href="#add-sign" onclick="rptSignatureHelper.currentSelectedESignAccDom = this.parentNode; rptSignatureHelper.currentSelectedESignAccName = \'' + sCell.signature_name + '\'" data-toggle="modal" data-target="#add-sign"><i class="fa fa-plus"></i> 添加签名</a>');
                }
                elementsStrArr.push('</li>');
                elementsStrArr.push('</ul>');
                elementsStrArr.push('</div>');
                elementsStrArr.push('</div>');
            }
            body.append(elementsStrArr.join(' '));
        }
    },
    pushDomElementByUser: function (elementsStrArr, userName, userRole) {
        elementsStrArr.push('<p class=" d-flex justify-content-between m-0"><span>' + userName +
            '-<small class="text-muted">' + ((userRole === '')?"工程师":userRole) +
            '</small></span><a onclick="rptSignatureHelper.removeSignature(this)" class="text-danger"><i class="fa fa-remove" title="移除签名"></i></a></p>')
    },
    pushDomElementByRole: function (elementsStrArr, roleName, userName) {
        elementsStrArr.push('<p class=" d-flex justify-content-between m-0"><span><i class="fa fa-user" title="角色"> ' + roleName +
            '</i>-<small class="text-muted">' + userName +
            '</small></span><a onclick="rptSignatureHelper.removeSignature(this)" class="text-danger"><i class="fa fa-remove" title="移除签名"></i></a></p>')
    },
    removeSignature: function (dom) {
        let accTxtName = $(dom.parentNode.parentNode.parentNode.parentNode.parentNode).find('label')[0].innerText;
        let jDom = $(dom.parentNode.parentNode);
        jDom.empty();
        jDom.append('<a href="#add-sign" onclick="rptSignatureHelper.currentSelectedESignAccDom = this.parentNode; rptSignatureHelper.currentSelectedESignAccName = \'' +
            accTxtName + '\'" data-toggle="modal" data-target="#add-sign"><i class="fa fa-plus"></i> 添加签名</a>');
        // 要记得清空相关pre_path属性
        for (const page of zTreeOprObj.currentRptPageRst.items) {
            if (page.signature_cells) {
                for (const sCell of page.signature_cells) {
                    if (sCell.signature_name === accTxtName) {
                        sCell.pre_path = '';
                    }
                }
            }
        }
        // 还有ROLE_REL_LIST
        for (let idx = 0; idx < ROLE_REL_LIST.length; idx++) {
            //
        }
    },
    removeSelectSignature: function () {
        for (const page of zTreeOprObj.currentRptPageRst.items) {
            if (page.signature_cells) {
                for (const sCell of page.signature_cells) {
                    if (sCell.hasOwnProperty('pre_path')) {
                        delete sCell.pre_path;
                    }
                }
            }
        }
        zTreeOprObj.showPage(zTreeOprObj.currentPage, zTreeOprObj.canvas);
    },
    setupAfterSelectSignature: function () {
        for (const page of zTreeOprObj.currentRptPageRst.items) {
            if (page.signature_cells) {
                for (const sCell of page.signature_cells) {
                    if (sCell.hasOwnProperty('pre_path')) {
                        sCell.path = sCell.pre_path;
                        delete sCell.pre_path;
                    }
                }
            }
        }
        zTreeOprObj.showPage(zTreeOprObj.currentPage, zTreeOprObj.canvas);
    },
    switchAddRoleDiv: function (dom) {
        if (dom.nextElementSibling.children[0].style.display === 'none') {
            dom.nextElementSibling.children[0].style.display = '';
        } else {
            dom.nextElementSibling.children[0].style.display = 'none';
        }
    },
    createNewRole: function (dom) {
        if ($('#acc_role_name')[0].value !== '') {
            const params = {};
            params.name = $('#acc_role_name')[0].value;
            const selectedAcc = PRJ_ACCOUNT_LIST[$('#project_account_select_dom')[0].selectedOptions[0].value];
            const roleName = (selectedAcc.role === '')?'工程师':selectedAcc.role;
            params.bind_acc_id = selectedAcc.id;
            params.prj_id = PROJECT_ID;
            params.tender_id = TENDER_ID;
            CommonAjax.postXsrfEx("/tender/report_api/createSignatureRole", params, 10000, true, getCookie('csrfToken'),
                function(result){
                    console.log(result);
                    const domArr = [];
                    domArr.push('<li class="add-sign-list-item">');
                    //1. apply签名
                    domArr.push('<a href="javascript:void(0)" onclick="rptSignatureHelper.drawEsignature(' + $('#project_account_select_dom')[0].selectedIndex + ')" class="btn-link pull-right" title="添加" data-dismiss="modal">');
                    domArr.push('<i class="fa fa-plus"></i>');
                    domArr.push('</a>');
                    //2. 编辑角色(暂缓)
                    // domArr.push('<a href="" class="btn-link pull-right mr-1" title="编辑">');
                    // domArr.push('<i class="fa fa-pencil-square-o"></i>');
                    // domArr.push('</a>');
                    //3. 显示名称
                    domArr.push('<i class="fa fa-user"></i> ' + $('#acc_role_name')[0].value + '<p>' + selectedAcc.name + '-<small class="text-muted">' + roleName + '</small></p>');
                    $('#existed_roles_ul').append(domArr.join(' '));
                }, function(err){
                    // hintBox.unWaitBox();
                }, function(ex){
                    // hintBox.unWaitBox();
                }
            );
        } else {
            alert('请输入合适的名称！');
        }
    },
    buildRoleDom: function (roleList) {
        const ulDom = $('#existed_roles_ul');
        ulDom.empty();
        for (let domIdx = 0; domIdx < roleList.length; domIdx++) {
            const role = roleList[domIdx];
            const domArr = [];
            domArr.push('<li class="add-sign-list-item">');
            //1. apply签名
            domArr.push('<a href="javascript:void(0)" onclick="rptSignatureHelper.createEsignatureByRoleIdx(' + domIdx + ')" class="btn-link pull-right" title="添加" data-dismiss="modal">');
            domArr.push('<i class="fa fa-plus"></i>');
            domArr.push('</a>');
            //2. 编辑角色(暂缓)
            domArr.push('<a href="javascript:void(0)" onclick="" class="btn-link pull-right mr-1" title="编辑">');
            domArr.push('<i class="fa fa-pencil-square-o"></i>');
            domArr.push('</a>');
            //3. 显示名称
            let acc = rptSignatureHelper.getUserAccount(role.bind_acc_id);
            domArr.push('<i class="fa fa-user"></i> ' + role.name + '<p>' + acc.name + '-<small class="text-muted">' + ((acc.role === '')?"工程师":acc.role) + '</small></p>');
            ulDom.append(domArr.join(' '));
        }
    },
    getUserAccount: function (accId) {
        let rst = null;
        for (const acc of PRJ_ACCOUNT_LIST) {
            if (acc.id === accId) {
                rst = acc;
                break;
            }
        }
        return rst;
    }
}