泛微OA_E9之明细表当前行check框选中，其余明细行check框置灰，并将当前明细行中某字段赋值到主表字段

本文介绍: 明细表当前行check框选中，其余明细行check框置灰，并将当前明细行中某字段赋值到主表字段。

1、描述及效果

1.1 描述

在泛微OA流程引擎中，明细表字段不能够做为出口条件进行判断，所以我们要将明细行中，需要判断的字段值赋予到主表中，才能在出口条件进行判断。

明细表是不确定因素，为什么说明细表是不确定因素呢？明细表在终端和系统支持的情况下，基本是可以无限量增加或删减，这就代表着，明细表有着无限可能。

既然明细表有着无限可能，那我们就把明细表的无限变成唯一。

我们先来看一下需求流程图及流程表单。

流程图：

在这里插入图片描述
流程表单：

1.2 效果

1.2.1 当前明细行check框选中后，其余明细行check框置灰

示例图1-1：
在这里插入图片描述

1.2.2 如果当前明细行“单价”字段未填写，在当前明细行选中check框时，提醒 填写且清空 check框所有值

示例图1-2：
在这里插入图片描述

1.2.3 当前明细行check 框选中，并将当前明细行“单价”字段值赋到主表 字段“单价”中

示例图1-3：
在这里插入图片描述

2、思路

无限变唯一：通过获取明细表所有行标示，循环遍历明细行，再以选中明细行的check框值进行判断，只要不是等于当前明细行标示，check框都变成置灰。

有了唯一值，赋值到主表中，轻而易举。

3、步骤

3.1 本次使用E9流程表单 前端 接口API介绍

具体《E9流程表单前端接口API》详情，请参考泛微官方文献，本篇只介绍需要用到的API。

3.1.1 明细字段值变化触发 事件

绑定后对新添加的明细行字段以及加载的已有行明细字段，值变更触发所绑定的事件

bindDetailFieldChangeEvent: function(fieldMarkStr,funobj)

参数说明

参数	参数类型	必须	说明
fieldMa rkStr	St r in g	是	绑定的明细字段标示，不能有下划线标示，可多个拼接逗号隔开，例如：field110,field111
funobj	Funct ion	是	字段值变更触发自定义函数，函数默认传递以下三个参数，参数1：字段标示(field27583)，参数2：行标示，参数3：修改后的值

样例：

jQuery(document).ready(function(){
    WfForm.bindDetailFieldChangeEvent("field27583,field27584",function(id,rowIndex,value){
        console.log("WfForm.bindDetailFieldChangeEvent--",id,rowIndex,value);
    });
});

3.1.2 获取单个字段值

getFieldValue: function(fieldMark)

参数说明

参数	参数类型	必须	说明
fieldMa rk	Str in g	是	字段标示，格式 field${字段ID}

样例：

var fieldvalue = WfForm.getFieldValue("field110");

3.1.3 获取明细行所有行标示

getDetailAllRowIndexStr： function(detailMark)

参数说明

参数	参数类型	必须	说明
detailMark	Str in g	是	明细表标示，明细1就是detail_1，以此递增类推

样例：

console.log(WfForm.getDetailAllRowIndexStr("detail_2"));    //输出1，3...等等

特别注意：

//遍历明细行的写法

var rowArr = WfForm.getDetailAllRowIndexStr("detail_1").split(",");
for(var i=0; i<rowArr.length; i++){
    var rowIndex = rowArr[i];
    if(rowIndex !== ""){
        var fieldMark = "field111_"+rowIndex;    //遍历明细行字段
    }
}

3.1.4 系统 样式的Confirm 确认框

说明：兼容移动端，可自定义确认内容及按钮名称

showConfirm: function(content, okEvent, cancelEvent, otherInfo={})

参数说明

参数	参数类型	必须	说明
content	String	是	确认信息
okEvent	Func ti on	是	点击确认事件
cancelEvent	Func ti on	是	点击取消事件
otherInfo	Object	是	自定义信息(按钮名称)

样例：

WfForm.showConfirm("确认删除吗？", function(){
    alert("删除成功"); 
});

WfForm.showConfirm("请问你是否需要技术协助？",function(){
    alert("点击确认调用的事件");
},function(){
    alert("点击取消调用的事件");
},{
    title:"信息确认",       //弹确认框的title，仅PC端有效
    okText:"需要",          //自定义确认按钮名称
    cancelText:"不需要"     //自定义取消按钮名称
});

3.2 上代码前准备：明细表ch ec k框字段加“id”值

说明：在明细表ch ec k框字段加上“id”值，是为了在添加或移除 ch ec k框样式时，不会影响到主表或明细表其他的ch ec k框。
在这里插入图片描述

3.3 上代码

WfForm.bindDetailFieldChangeEvent("field35274",function(id,rowIndex,value){
	//无限变唯一  
    var rowArr = WfForm.getDetailAllRowIndexStr("detail_1").split(",");//获取明细行所有行标示
    for(var i = 0; i < rowArr.length; i++){//遍历明细行
      if(i !== rowIndex &amp;&amp; value == 1){//当i不等于当前明细行标示，且明细行check框选中时，其他明细行check框置灰并清空选中样式
     	//“.ant-checkbox-disabled”为check框置灰样式；
        //“.ant-checkbox-checked”、“.ant-checkbox-checked-1”这两个为check框选中样式
        $("#checkedYes span").addClass("ant-checkbox-disabled").removeClass("ant-checkbox-checked ant-checkbox-checked-1");
      }else{
        $("#checkedYes span").removeClass("ant-checkbox-disabled");
        WfForm.changeFieldValue("field34427", {value:""});
      };
    };
	//赋值主表
	var unitPrice = WfForm.getFieldValue("field35273_" + rowIndex);//获取当前选中明细行的“单价”字段值
    if(value == "1" &amp;&amp; unitPrice == ""){//当前明细行check框已选中时，当前明细行的“单价”字段值为空时，进行提醒并清空选中check框
      WfForm.showConfirm("请填写“单价”", function(){//确认事件
        WfForm.changeFieldValue("field35274_" + rowIndex, {value:""});//清空明细行选中的check框值
      },function(){//取消事件，不添加取消事件，当用户点击“取消”按钮时，会无事件触发效果
        WfForm.changeFieldValue("field35274_" + rowIndex, {value:""});//清空明细行选中的check框值
      });
    }else if(value == "1"){//明细行check框已选中时，将当前选中明细行“单价”字段值带到主表"单价”字段中
      $("#field30612").val(unitPrice);
    }else{//明细行check框取消选中时，主表"单价”字段清空值
      WfForm.changeFieldValue("field30612", {value:""});
    };
  });