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 (const prjAccount of PRJ_ACCOUNT_LIST) {
            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 onclick="rptSignatureHelper.drawEsignature(' + keyIdx + ')" 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="' + keyIdx + '">' + 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 = 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
            let list = rptSignatureHelper.currentSelectedESignAccDom.childNodes;
            if (list && list.length > 0) {
                for (let domIdx = list.length - 1; domIdx >= 0; domIdx--) {
                    rptSignatureHelper.currentSelectedESignAccDom.removeChild(list[domIdx]);
                }
            }
            // 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>');
            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);
            $(rptSignatureHelper.currentSelectedESignAccDom).append(elementsStrArr.join(' '));
            //*/
            // 2.2 date-picker
        }
    },
    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 = [];
            const canvasWidth = 60;
            const canvasHeight = 30;

            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) {
                    elementsStrArr.push('<p class=" d-flex justify-content-between m-0"><canvas id="signCanvas' + scIdx + '" width="' + canvasWidth + '" height="' + canvasHeight + '"></canvas><a onclick="rptSignatureHelper.removeSignature(this)" class="text-danger"><i class="fa fa-remove" title="移除签名"></i></a></p>');
                    let imgObj = new Image();
                    if (sCell.path) {
                        imgObj.src = sCell.path;
                    } else {
                        imgObj.src = sCell.pic;
                    }
                    imgObj.onload = function(){
                        let canvasNode = document.getElementById('signCanvas' + scIdx);
                        let ctx = canvasNode.getContext('2d');
                        ctx.drawImage(this, 0, 0, canvasWidth, canvasHeight);
                    }
                } 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(' '));
        }
    },
    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 = dom.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 = '';
                    }
                }
            }
        }
    },
    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.style.display === 'none') {
            dom.nextElementSibling.style.display = '';
        } else {
            dom.nextElementSibling.style.display = 'none';
        }
    },
    createNewRole: function (dom) {
        //acc_role_name fa fa-remove
    }
}