二开案例-差旅报销单参考长途交通费弹框增加实现二开字段原创
金蝶云社区-ice0_o
ice0_o
9人赞赏了该文章 253次浏览 未经作者许可,禁止转载编辑于2023年06月23日 17:36:39

一、二开需求

新增二开字段显示格式与原有字段长途交通费弹框需要相同。

image.png

二、配置步骤

1、差旅报销单分录增加二开字段

餐饮费:cyExpense;不含税餐饮费:cyExpenseWithoutTax;餐饮费税额:cyExpenseTax;餐饮费税率:cyExpenseTaxRate

image.png

image.png

2、扩展方案差旅报销单分录引入二开餐饮费字段

image.png

3、引入后二开餐饮费字段配置隐藏列

image.png

4、分录表格添加自定义列,自定义列重命名,如:cyExpenseInfo,用于绑定弹框;并且配置编辑器:cyExpenseEditor

image.png

image.png

5、由于标准的长途交通费、市内交通费等弹框是隐藏,需要设置显示出来参考配置,按F12打开控制台,打开travelAccountBill_open_edit.css文件,搜索bussesExpenseColumn找到截图位置,注释让其显示

image.png

6、点增加列,配置

a)      元素id配置为:cyExpenseColumn(用于后续餐饮费编辑器调用打开);

b)      样式配置:position: fixed;z-index: 2000;background-color: white;border: 2px solid #34BEFF;(此配置会隐藏当前列,可最后配置)

c)       高级配置隐藏:是。

image.png


image.png

image.png

7、进行配置餐饮费弹框,增加数字控件,在列中配置含税、不含税、税率、税额字段

记录四个控件元素id:

含税:eCyExpense;不含税:eCyExpenseWithoutTax;税率(%):eCyExpenseTaxRate;税额:eCyExpenseTax

image.png

image.png

8、编写餐饮费编辑器对应脚本

image.png

cyExpenseEditor:对应第4步骤的编辑器名称

waf.defineCustomeClass("celleditor.cyExpenseEditor", celleditor.defaultEditor, {         
              show: function() {              
                     var entryDom = waf("#entries");
                     var rowid = entryDom.wafGrid("getSelectedRow");
                  var eCyExpense = entryDom.wafGrid("getCell", rowid, "cyExpense")||0.00;
            var eCyExpenseWithoutTax = entryDom.wafGrid("getCell", rowid, "cyExpenseWithoutTax")||0.00;
            var eCyExpenseTax = entryDom.wafGrid("getCell", rowid, "cyExpenseTax")||0.00;
            var eCyExpenseTaxRate = entryDom.wafGrid("getCell", rowid, "cyExpenseTaxRate")||0.00;
                     waf("#eCyExpense").wafNumberField("setValue",eCyExpense,false);
                     waf("#eCyExpenseWithoutTax").wafNumberField("setValue",eCyExpenseWithoutTax,false);
                     //先用税率计算数额,防止出现税率为0税额有值,把税额反写成了0 该问题只有初始化第一次点击才有这个为,所以第一次点击,改为不触发change事件
                     waf("#eCyExpenseTaxRate").wafNumberField("setValue",eCyExpenseTaxRate,false);           
                  waf("#eCyExpenseTax").wafNumberField("setValue",eCyExpenseTax,false);
                    
                  var isWithTax = waf("#isWithTax").wafCheckbox("isChecked");
                  if (isWithTax) {
                         waf("#eCyExpense").wafNumberField('enable', true);
                waf("#eCyExpenseWithoutTax").wafNumberField('disable', true);                
                     } else {                               
                waf("#eCyExpense").wafNumberField('disable', true);
                            waf("#eCyExpenseWithoutTax").wafNumberField('enable', true);                         
                     }
                 
                     var columnWidth = this.cell.width();
                     var cyExpenseColumn = waf("#cyExpenseColumn");
                     cyExpenseColumn.attr("infoDiv","true");
                     var table = this.table;
                     cyExpenseColumn.width(columnWidth);
                     cyExpenseColumn.show();               
                     cyExpenseColumn.position($.extend({of: this.cell}, {my: "left top", at: "left top"}));
                     $(cyExpenseColumn).css({
                            "background":"#FFFFFF",
                            "box-shadow": "0 0 13px 0 rgba(0,0,0,0.20)",
                            "border-radius": "2px",
                            "border":"none",
                            "width":"270px",
                            "min-width":"270px"
                     })
                    
              },
              clear: function() {
                     waf("#cyExpenseColumn").hide();
                     celleditor.defaultEditor.prototype.clear.call(this);
              },
              getValue: function(){
                     var self = this,
                   div = self.div,
                   table = waf(self.table),
                   rowId = table.wafGrid("getRowId", self.iRow),
                   entryDom = waf("#entries");                 
                  
                var eCyExpense = waf("#eCyExpense").wafNumberField("getValue") || 0.00,
                      eCyExpenseWithoutTax = waf("#eCyExpenseWithoutTax").wafNumberField("getValue") || 0.00,
                      eCyExpenseTax = waf("#eCyExpenseTax").wafNumberField("getValue") || 0.00,
                    eCyExpenseTaxRate = waf("#eCyExpenseTaxRate").wafNumberField("getValue") || 0.00;
               
                entryDom.wafGrid("setCell", rowId, "cyExpense", eCyExpense);
                entryDom.wafGrid("setCell", rowId, "cyExpenseWithoutTax", eCyExpenseWithoutTax); 
                entryDom.wafGrid("setCell", rowId, "cyExpenseTax", eCyExpenseTax);
                entryDom.wafGrid("setCell", rowId, "cyExpenseTaxRate", eCyExpenseTaxRate);         
          }
       });

9、配置弹框中输入含税或不含税等字段进行联动计算

a)      含税增加触发事件:cyExpense

image.png

image.png

if (TravelAccountBill_Edit_Open.isFirstLoad || !TravelAccountBill_Edit_Open.needChangeEvent) return;
var isWithTax = waf("#isWithTax").wafCheckbox("isChecked");                
if (isWithTax) {
       var eExpense = waf("#eCyExpense").wafNumberField("getValue")||0;                                  
var eExpenseTaxRate = waf("#eCyExpenseTaxRate").wafNumberField("getValue")||0;
       var eExpenseWithoutTax = _self.setPrecision(eExpense /_self.addBigDecimal(1, eExpenseTaxRate/100)) ||0;                            
//税额 = 含税金额 - 不含税金额
       var eExpenseTax = _self.setPrecision(_self.subtractBigDecimal(eExpense, eExpenseWithoutTax));
       //setValue加false参数可以不触发对应值改变事件
       waf("#eCyExpenseWithoutTax").wafNumberField("setValue",eExpenseWithoutTax,false);
       waf("#eCyExpenseTax").wafNumberField("setValue",eExpenseTax,false);
}

b)      不含税增加触发事件:cyExpenseWithoutTax

image.png

image.png

if (TravelAccountBill_Edit_Open.isFirstLoad || !TravelAccountBill_Edit_Open.needChangeEvent) return;
    var isWithTax = waf("#isWithTax").wafCheckbox("isChecked");
       if (!isWithTax) {
              var eExpenseWithoutTax = waf("#eCyExpenseWithoutTax").wafNumberField("getValue")||0;
              var eExpenseTaxRate = waf("#eCyExpenseTaxRate").wafNumberField("getValue")||0;
              var eExpenseTax = _self.setPrecision(eExpenseWithoutTax * eExpenseTaxRate / 100)||0;                   var eExpense = _self.setPrecision(_self.addBigDecimal(eExpenseWithoutTax, eExpenseTax))||0;
              waf("#eCyExpense").wafNumberField("setValue",eExpense,false);
              waf("#eCyExpenseTax").wafNumberField("setValue",eExpenseTax,false);
}

c)      税率增加触发事件:cyExpenseTaxRate

image.png

image.png

if (TravelAccountBill_Edit_Open.isFirstLoad || !TravelAccountBill_Edit_Open.needChangeEvent) return;
    var isWithTax = waf("#isWithTax").wafCheckbox("isChecked");
      var eExpenseTaxRate = waf("#eCyExpenseTaxRate").wafNumberField("getValue");
      if(eExpenseTaxRate < 0) {
          eExpenseTaxRate = 0.00;
          waf("#eCyExpenseTaxRate").wafNumberField("setValue",eExpenseTaxRate);
        }
                     if (isWithTax) {
                            var eExpense = waf("#eCyExpense").wafNumberField("getValue")||0;
                            var eExpenseWithoutTax = _self.setPrecision(eExpense /_self.addBigDecimal(1, eExpenseTaxRate/100))||0;                      
                            var eExpenseTax = _self.setPrecision(_self.subtractBigDecimal(eExpense, eExpenseWithoutTax));
                            waf("#eCyExpenseTax").wafNumberField("setValue",eExpenseTax,false);
       waf("#eCyExpenseWithoutTax").wafNumberField("setValue",eExpenseWithoutTax,false);
                     }else{
                            var eExpenseWithoutTax = waf("#eCyExpenseWithoutTax").wafNumberField("getValue")||0;     
                           var eExpenseTax =  _self.setPrecision(eExpenseWithoutTax * eExpenseTaxRate / 100)||0;
                           var eExpense = _self.setPrecision(_self.addBigDecimal(eExpenseWithoutTax, eExpenseTax));
                         waf("#eCyExpenseTax").wafNumberField("setValue",eExpenseTax,false);
                         waf("#eCyExpense").wafNumberField("setValue",eExpense,false);
                     }

d)      税额增加触发事件:cyExpenseTax

image.png

image.png

if (TravelAccountBill_Edit_Open.isFirstLoad || !TravelAccountBill_Edit_Open.needChangeEvent) return;
               var isWithTax = waf("#isWithTax").wafCheckbox("isChecked");
               var eExpenseTax = waf("#eCyExpenseTax").wafNumberField("getValue")||0;
               if (isWithTax) {
                      var eExpense = waf("#eCyExpense").wafNumberField("getValue")||0;
                   var eExpenseWithoutTax =  _self.setPrecision(_self.subtractBigDecimal(eExpense, eExpenseTax))||0;
                   waf("#eCyExpenseWithoutTax").wafNumberField("setValue",eExpenseWithoutTax,false);
               }else{
                      var eExpenseWithoutTax = waf("#eCyExpenseWithoutTax").wafNumberField("getValue")||0;
                   var eExpense =  _self.setPrecision(_self.addBigDecimal(eExpenseWithoutTax, eExpenseTax))||0;
                   waf("#eCyExpense").wafNumberField("setValue",eExpense,false);
               }

10、实现效果

image.png

11、给餐饮费增加格式化样式

image.png

a)      增加格式化样式事件

方法名称:cyExpenseFormatter

方法参数:cellvalue, options, rowObject, act, iRow

image.png

image.png

b)      脚本

image.png

return bizCollBillBase.travelAmountFormatter("cyExpense","cyExpenseTax","cyExpenseTaxRate",options,rowObject);

c)      含税、不含税、税额字段配置显示合计

image.png

d)      效果

image.png

图标赞 9
9人点赞
还没有人点赞,快来当第一个点赞的人吧!
图标打赏
0人打赏
还没有人打赏,快来当第一个打赏的人吧!