电子签名角色处理 + code sync

app/public/report/js/rpt_main.js

@@ -32,8 +32,6 @@ let zTreeOprObj = {
     treeObj: null,
     prjFolderTreeObj: null,
     currentNode: null,
-    currentSelectedESignAccDom: null,
-    currentSelectedESignAccName: null,
     checkedRptTplNodes: null,
     currentRptPageRst: null,
     defReportPageCfg: null,
@@ -258,7 +256,7 @@ let zTreeOprObj = {
                         canvas.height = size[1] + 50;
                     }
                     // zTreeOprObj.resetESignature(zTreeOprObj.currentRptPageRst);
-                    me.buildSelectableAccount();
+                    rptSignatureHelper.buildSelectableAccount();
                     me.showPage(1, canvas);
                 } else {
                     //返回了无数据表
@@ -272,180 +270,6 @@ let zTreeOprObj = {
             }
         );
     },
-    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="zTreeOprObj.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="zTreeOprObj.currentSelectedESignAccDom = this.parentNode; zTreeOprObj.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(' '));
-        }
-    },
-    buildSelectableAccount: function () {
-        //PRJ_ACCOUNT_LIST
-        //1. 清理所有选择项
-        // $("#project_account_select_div").empty();
-        let accDiv = $('#project_account_select_div');
-        accDiv.empty();
-        //2. 一个个加可选用户项
-        const prj_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([]);
-                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>');
-            }
-            //push item
-            prj_accounts[keyIdx].push('<li class="add-sign-list-item"><a onclick="zTreeOprObj.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>');
-        }
-        for (const prjAccList of prj_accounts) {
-            prjAccList.push('</ul>');
-        }
-        for (let idx = 0; idx < prj_accounts.length; idx++) {
-            prj_accounts[idx] = prj_accounts[idx].join('');
-        }
-        accDiv.append(prj_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 (zTreeOprObj.currentSelectedESignAccName !== null) {
-            for (const page of zTreeOprObj.currentRptPageRst.items) {
-                if (page.signature_cells) {
-                    for (const sCell of page.signature_cells) {
-                        if (sCell.signature_name === zTreeOprObj.currentSelectedESignAccName) {
-                            sCell.pre_path = dftSignSrc;
-                        }
-                    }
-                }
-            }
-            // 1. 删除不需要的child dom
-            let list = zTreeOprObj.currentSelectedESignAccDom.childNodes;
-            if (list && list.length > 0) {
-                for (let domIdx = list.length - 1; domIdx >= 0; domIdx--) {
-                    zTreeOprObj.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="zTreeOprObj.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);
-            $(zTreeOprObj.currentSelectedESignAccDom).append(elementsStrArr.join(' '));
-            //*/
-            // 2.2 date-picker
-        }
-    },
-    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="zTreeOprObj.currentSelectedESignAccDom = dom.parentNode; zTreeOprObj.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);
-    },
     scaleReport: function (accScale) {
         let me = zTreeOprObj;
         let canvas = zTreeOprObj.canvas;

app/public/report/js/rpt_signature.js

@@ -0,0 +1,205 @@
+/**
+ * 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
+    }
+}

app/view/report/index.ejs

@@ -99,7 +99,7 @@
                             </div>
                             <div class="panel">
                                 <div class="panel-body">
-                                    <button class="btn btn-outline-primary btn-sm" type="button" data-toggle="modal" data-target="#eSignature" onclick="zTreeOprObj.resetESignature(zTreeOprObj.currentRptPageRst)">
+                                    <button class="btn btn-outline-primary btn-sm" type="button" data-toggle="modal" data-target="#eSignature" onclick="rptSignatureHelper.resetESignature(zTreeOprObj.currentRptPageRst)">
                                         <i class="fa fa-pencil"></i><br>
                                         电子签名
                                     </button>
@@ -171,6 +171,7 @@
 <script type="text/javascript" src="/public/report/js/jpc_output_value_define.js"></script>
 <script type="text/javascript" src="/public/report/js/jpc_output.js"></script>
 <script type="text/javascript" src="/public/report/js/rpt_print.js"></script>
+<script type="text/javascript" src="/public/report/js/rpt_signature.js"></script>
 
 <script type="text/javascript">
     const topTreeNodesValue = <%- rpt_tpl_data %>;

app/view/report/rpt_all_popup.ejs

@@ -201,8 +201,8 @@
             <div class="modal-body" id="eSignatureBodyDiv">
             </div>
             <div class="modal-footer">
-                <button type="button" class="btn btn-secondary" data-dismiss="modal" onclick="zTreeOprObj.removeSelectSignature()">取消</button>
-                <a onclick="zTreeOprObj.setupAfterSelectSignature()" class="btn btn-primary" data-dismiss="modal">确定</a>
+                <button type="button" class="btn btn-secondary" data-dismiss="modal" onclick="rptSignatureHelper.removeSelectSignature()">取消</button>
+                <a onclick="rptSignatureHelper.setupAfterSelectSignature()" class="btn btn-primary" data-dismiss="modal">确定</a>
             </div>
         </div>
     </div>
@@ -241,8 +241,8 @@
                         </div>
                     </div>
                     <div class="tab-pane fade" id="adst-2" role="tabpanel" aria-labelledby="profile-tab">
-                        <a href="" class="btn btn-sm btn-link">添加角色</a>
-                        <div class="modal-height-300">
+                        <a href="javascript:void(0)" onclick="rptSignatureHelper.switchAddRoleDiv(this)" class="btn btn-sm btn-link">添加角色</a>
+                        <div class="modal-height-300" id="role_select_acc_div" style="display:none">
                             <!--添加角色-->
                             <div class="card">
                                 <div class="p-2">
@@ -250,15 +250,16 @@
                                         <div class="input-group-prepend">
                                             <span class="input-group-text" id="inputGroup-sizing-sm">角色名称</span>
                                         </div>
-                                        <input type="text" class="form-control" placeholder="最多10个字符">
+                                        <input type="text" class="form-control" id="acc_role_name" placeholder="最多10个字符">
                                     </div>
                                     <div class="input-group input-group-sm mb-1">
                                         <div class="input-group-prepend">
                                             <span class="input-group-text" id="inputGroup-sizing-sm">绑定成员</span>
                                         </div>
-                                        <input type="text" class="form-control" placeholder="输入姓名检索">
+                                        <select class="form-control" id="project_account_select_dom">
+                                        </select>
                                     </div>
-                                    <a href="" class="btn btn-sm btn-primary">添加角色</a>
+                                    <a href="javascript:void(0)" onclick="rptSignatureHelper.createNewRole(this)" class="btn btn-sm btn-primary">添加角色</a>
                                 </div>
                             </div>
                             <ul class="list-group">