洲聚零代码开放平台
开放平台简介
后端API
表单
单点登录
SAMl2.0协议
OIDC协议
CAS协议
开发指南
获取token
Rsa加密公钥
Des加密公钥
通用
执行sql
数据缓存
组织岗位
应用功能
前端API
开发指南
通用
系统
用户信息
模态
网络
消息管理
常用方法
业务服务
调用sql
个性化样式
个性化配置
数据处理
定义函数
表单
打开表单
表单属性监听
流程
流程处理
主列表
子列表
页面
自定义Vue组件
zj-cli安装使用
自定义 Vue 组件开发规范
自定义Vue组件调试
脚本示例
列表脚本示例
表单脚本示例
全局脚本示例
UI组件动态加载
其他UI框架如何引入
表单地址说明
场景示例
综合示例
列表按钮打开表单存值
点击按钮调用API回写表单
按钮
修改平台默认按钮名称
点击子表自定义按钮弹出流传表单
数据库结构
操作日志表 t_operation_log
单点登录
单点登录(Authcode)配置
单点登录第三方系统集成
异常处理
vs code 环节异常
技术参数
连接器示例
人员信息加/解密自定义接口示例
本文档使用 MrDoc 发布
-
+
首页
综合示例
# 综合示例 ## advanceSearchCodes注意点 * 脚本必须使用ES5以下的语法规则编写 ## 表单(适用于主子表表单) ``` // 使用对象 dataForm // 获取表单信息 getDataFormInfo() // 获取所有子表组件 getAllSubTable() // 获取子表组件,subCode表示子表code getSubTable(subCode) /** * 添加表单字段监听 * code: 表单字段code * callback: 子表字段值改变的回调 */ addFieldListening(code, callback) /** * 添加子表监听 * code: 子表code * callback: 回调 */ addSubTableListening(code, callback) // 获取字段结构,code为表单字段code getDataItem(code) // 获取表单字段的值,code为表单字段code getDataItemValue(code) // 设置表单字段的值,code为表单字段code setDataItemValue(code, value) /** * 获取业务规则结果 * rule: 规则字符串 * 返回值: Promise对象 */ getBusinessRuleResult(rule) /** * 添加按钮前置 * title: 按钮名称 * callback: 回调 */ addButtonBefore(title, callback) /** * 隐藏表单字段或子表列 * 当隐藏表单字段时,code为字段code * 当隐藏子表列时,code为[子表code].[子表列code] */ hideComponentByCode(code, isHidden) // 隐藏显示表单按钮 isHiddenButton(title, isHidden) // 刷新子表,subCode为子表code refreshSubTable(subCode) // 添加表单按钮加载完成的回调 addformBtnLoadedListening(callback) // 关闭表单 closeView() // 设置某个字段的附属属性 setExtendAttributeByCode(code, key, value) /** * 执行按钮动作(仅在铁四院质量分支可用) */ executeFormButtonAction(title) // 效验表单数据(仅在铁四院质量分支可用) validateData() ``` ## 子表 ``` // 使用对象 subTable // 添加子表加载完成的回调 addLoadedCallback() /** * 显示或隐藏操作按钮 * title: 按钮名称 * isHidden: 是否隐藏 */ isHiddenButton(title, isHidden) /** * 添加按钮前置 * title: 按钮名称 * callback: 回调 */ addButtonBefore(title, callback) /** * 添加按钮后置 * title: 按钮名称 * callback: 回调 */ addButtonAfter(title, callback) /** * 列表数据拷贝 * code: 拷贝的列 * targetCode: 赋值的列 */ columnDataCopy(code, targetCode) ``` ## 主表 ``` // 使用对象 dataTable /** * 添加按钮前置 * title: 按钮名称 * callback: 回调 */ addButtonBefore(title, callback(datas, resolve)) /** * 添加按钮后置-仅支持'删除'按钮 * title: 按钮名称 * callback: 回调 */ addButtonAfter(title, callback) /** * 获取选中的数据 */ getSelectedItems() /** * 设置列表的高级搜索值 * value,必须为一对象,key为组件code * 如 {f_2b8984cbcd: '男','f_2b8984abcd':'一年级'} * 数字控件:必须为一数字区间,例 :{f_3da0dd965a: [4,7]} * 日期组件,CreatedTime,ModifiedTime,必须为一时间区间,例 : f_61834d2e76: ['2020-09-01 00:00:00','2020-10-01 23:59:59'] * 下拉,多选,单选,必须为一数组 f_8d60829d65 :[{ * name: "选项2", * selectionId: "选项2" * },{ * name: "选项1", * selectionId: "选项1" * }] * 如果下拉关联其它数据源,则为: f_8d60829d65:[{ * name: "湖北", * value: '01', * },{ * name: "湖南", * value: '02', * }], * 如果为状态,则为一数组:'State':[{code: '0', name: '草稿'}] * * isSearchImmediate 是否设置后立即刷新列表 */ setSearchConditionValue(value,isSearchImmediate) ``` ## 公共组件 ``` // 使用对象 dataForm、subTable、dataTable /** * element提供的公共组件 * 请参考element文档[https://element.eleme.cn/#/zh-CN/component/message-box] */ $message、$alert // message目前支持warning,error,info dataForm.$message({ type: "warning", message: "保存失败", }); dataForm.$alert('保存失败,是否继续', '提示', { confirmButtonText: '确定', cancelButtonText: '取消', showCancelButton: true }).then(function () { // 确定回调 }).catch(function () { // 取消回调 }); // 是否是移动端 dataForm.$isMobile ``` ## 公共接口 ### 网络请求 ● $axios: 项目中公共的网络请求对象,具体使用参考axios文档[https://github.com/axios/axios],例: ``` dataForm.$axios.get('http://localhost:8080/user?ID=12345') .then(function (response) { // handle success console.log(response); }) .catch(function (error) { // handle error console.log(error); }); dataForm.$axios.post('http://localhost:8080/user', { firstName: 'Fred', lastName: 'Flintstone' }) .then(function (response) { console.log(response); }) .catch(function (error) { console.log(error); }); // response结构 { // 接口返回的数据 data: {}, // 来自服务器响应的HTTP状态码 status: 200, } ``` ### 注意:禁止设置$axios.defaults.baseURL * $http: 基于axios的封装,用于平台的接口请求,例: ``` // 用户登录 dataForm.$http.GET('api/Organization/LoginByCode/' + code) .then(function (response) { if (response.Status !== 1) { dataForm.$message({ type: "error", message: response.Message || '登录失败', }); return; } console.log('登录信息', response.Result); }).catch(function (error) { console.log(error); }); // 获取表单信息 dataForm.$http.POST('api/Form/GetFormInfo', parameters) .then(function (response) { if (response.Status !== 1) { dataForm.$message({ type: "error", message: response.Message || '获取表单信息错误', }); return; } console.log('表单信息', response.Result); }).catch(function (error) { console.log(error); }); // response结构 { // 状态,1表示成功 Status: 1, // 数据 Result: {}, // 消息 Message: '', } ``` ### 获取当前登录人信息 ``` var userInfo = dataForm.$getUserInfo(); console.log('当前登录人姓名:', userInfo.Name); console.log('当前登录人UserID:', userInfo.ObjectID); console.log('当前登录人Code:', userInfo.Code); console.log('当前登录人所在部门:', userInfo.ParentName); console.log('当前登录人所在部门ID:', userInfo.ParentID); ``` ## 脚本占位符 脚本里的 ##keyName## 形式的字符串会被替换成全局配置字段keyName的内容。 ``` console.log('##RESTfulUrl##'); dataForm.$axios('##RESTfulUrl##/api/getUserInfo').then(function(res) { // do something }); ``` ## 实例 ## 实例一:统计行编辑子表的某个字段为是的数据数量 ``` // 监听子表 dataForm.addSubTableListening(subCode, function() { var formInfo = dataForm.getDataFormInfo(); //var subCode = 'f213aa231d'; // 统计数据条数 var rule1 = "ExecuteSql(\"select count(*) from d_gdgl_lcjl_cs where ParentObjectID='" + formInfo.dataId + "'\")"; dataForm.getBusinessRuleResult(rule1).then(function(res) { if (!res.Success) return; // 返回值必须经常两次JSON装换 var count = JSON.parse(JSON.parse(res.Result)); dataForm.setDataItemValue('f_zhuangt', count) }); // 统计f_7ab2df8515值为1的数据条数 var rule2 = "ExecuteSql(\"select count(*) from d_gdgl_lcjl_cs where ParentObjectID='" + formInfo.dataId + "' and cesjb='1'\")"; dataForm.getBusinessRuleResult(rule2).then(function(res) { if (!res.Success) return; // 返回值必须经常两次JSON装换 var count = JSON.parse(JSON.parse(res.Result)); dataForm.setDataItemValue('f_yongh', count) }); // 统计f_9c767352a2的合计 var rule3 = "ExecuteSql(\"select sum(f_cesjb) from d_gdgl_lcjl_cs where ParentObjectID='" + formInfo.dataId + "'\")"; dataForm.getBusinessRuleResult(rule3).then(function(res) { if (!res.Success) return; // 返回值必须经常两次JSON装换 var count = JSON.parse(JSON.parse(res.Result)); dataForm.setDataItemValue('f_dongz', count) }) }); ```  ## 实例二:在特定节点监听选人控件赋值 ``` // 获取表单信息 var formInfo = dataForm.getDataFormInfo(); // 判断当前表单是审批节点且不是查看模式 if (formInfo.formExtensionInfo.CurrentActivityName === '审批' && formInfo.formViewType !== 'view') { // 回调 var callback = function callback() { var rule = 'ExecuteSQLForObject("select name,code from t_user where ObjectID=\'{0}\'",{f_d48c24dac2_Id})'; // 获取业务规则结果 dataForm.getBusinessRuleResult(rule).then(function (res) { if (!res.Success) return; // 业务规则返回的是字符串,需要装换成自己需要的结构,比如字典或者数组 var obj = JSON.parse(res.Result); // 设置表单字段的值 dataForm.setDataItemValue('f_aa4c70edad', obj.name); dataForm.setDataItemValue('f_539d6ad0be', obj.code); }); }; // 获取人员控件是否有值,如果有值手动调用回调 var value = dataForm.getDataItemValue('f_d48c24dac2'); if (typeof value === 'string' && value.length > 0) { callback(); } // 监听人员控件 dataForm.addFieldListening('f_d48c24dac2', callback); } ```  ## 实例三:主表字段控制子表按钮 ``` // 获取子表组件 var table1 = dataForm.getSubTable('8fb1958f70'); var table2 = dataForm.getSubTable('6e22eaa41f'); var table3 = dataForm.getSubTable('195e075ebc'); // 添加主表字段监听 dataForm.addFieldListening('f_2b0901480f', function (val) { // 隐藏子表按钮 table1.isHiddenButton('新建', val === '1'); table2.isHiddenButton('新建', val === '1'); table2.isHiddenButton('插入', val === '1'); table3.isHiddenButton('新建', val === '1'); table1.isHiddenButton('百度', val === '2'); table2.isHiddenButton('谷歌', val === '2'); }); // 添加主表字段监听 dataForm.addFieldListening('f_09607846f4', function (val) { // 隐藏子表按钮 table1.isHiddenButton('查看', val === '1'); table3.isHiddenButton('查看', val === '1'); table1.isHiddenButton('编辑', val === '2'); table3.isHiddenButton('编辑', val === '2'); table1.isHiddenButton('删除', val === '3'); table2.isHiddenButton('删除', val === '3'); table3.isHiddenButton('删除', val === '3'); }); ``` ## 实例四:表单提交效验字段是否填值 ``` // 添加保存按钮前置 dataForm.addButtonBefore('保存', function (resolve) { // 获取表单字段的值 var value = dataForm.getDataItemValue('f_e60d3a48cd'); // 判断值是否为空 if (typeof value !== 'string' || value.length <= 0) { // 弹出提示 目前message的type只支持error,warning,info dataForm.$message({ type: "error", message: "字段a不能为空", }); } else { // 不为空,继续后面的处理 resolve(); } }); ``` ## 实例五:子表删除按钮的前置和后置处理 ``` var subTable1 = dataForm.getSubTable('83be1068e6'); // 添加删除按钮前置处理,同步处理,必须手动调用resolve才能让删除继续 subTable1.addButtonBefore('删除', function (data, resolve) { // data为key-value的格式 console.log('subTable1 delete before: ', data['f_123afsb2']); setTimeout(function () { resolve(); }, 1000); }); // 添加删除按钮后置处理,异步处理,不会等待回调处理 subTable1.addButtonAfter('删除', function (data) { // data为key-value的格式 console.log('subTable1 delete after: ', data['f_123afsb2']); }); ``` ## 实例六:隐藏表单字段和子表列 ``` // 添加字段监听 dataForm.addFieldListening('f_57b8661128', function(val) { // 当监听的字段的值为1和3时隐藏字段`f_33aa1a4410` dataForm.hideComponentByCode('f_33aa1a4410', val === '1' || val === '3'); // 当监听的字段的值为2和3时隐藏字段`f_5968a4e8c7` dataForm.hideComponentByCode('f_5968a4e8c7', val === '2' || val === '3'); // 当监听的字段的值为1和3时隐藏子表`9411739038`的`f_33aa1a4410`列 dataForm.hideComponentByCode('9411739038.f_28cbf99d7e', val === '1' || val === '3'); // 当监听的字段的值为2和3时隐藏子表`9411739038`的`f_5968a4e8c7`列 dataForm.hideComponentByCode('9411739038.f_8b4bb9ea39', val === '2' || val === '3') }); ``` ## 实例七:隐藏表单按钮 ``` var callback = function callback() { // 获取字段 f_81f0821c4e 的值 var value = dataForm.getDataItemValue('f_81f0821c4e'); // 隐藏按钮 dataForm.isHiddenButton('保存', value === '1'); dataForm.isHiddenButton('百度', value === '2'); }; // 添加表单按钮加载完成的回调 dataForm.addformBtnLoadedListening(callback); // 添加字段 f_81f0821c4e 的监听 dataForm.addFieldListening('f_81f0821c4e', callback); ``` ## 实例八:移动端在某个流程节点下只能查看不能审批或编辑 ``` // 获取表单信息 var formInfo = dataForm.getDataFormInfo(); // 获取表单状态,新增、查看、编辑 var formViewType = formInfo.formViewType; // 获取当前流程节点 var activityName = formInfo.formExtensionInfo.CurrentActivityName; // 判断是否是移动端,表单的流程节点是审批且不是查看模式 if (dataForm.$isMobile && activityName == '审批' && formViewType !== 'view') { // 提示 dataForm.$alert('此流程无法在移动端上处理,请使用PC端处理',{ callback:function callback(){ // 关闭表单 dataForm.closeView(); } }); } ``` ## 实例九:根据某个字段的值设置数据范围的组是否显示 ``` // 设置阅读范围控件的属性的方法 var setReadRangeGroup = function setReadRangeGroup(value) { if (value === '是') { // 设置数据范围的组显示 dataForm.setExtendAttributeByCode('ReadRange', 'isReadRangeGroup', true); // 设置扩展的部门范围 dataForm.setExtendAttributeByCode('ReadRange', 'extendScopeUnitIds', ['68901fc4-eaeb-4d60-9944-2f5b2be6e690', '374f3843-e91c-4621-92ab-b915a0014907']); // 设置扩展的组织类型 dataForm.setExtendAttributeByCode('ReadRange', 'extendCategories', ['bu', 'ke']) } else if (value === '否') { // 设置数据范围的组不显示 dataForm.setExtendAttributeByCode('ReadRange', 'isReadRangeGroup', false); // 清空扩展的部门范围 dataForm.setExtendAttributeByCode('ReadRange', 'extendScopeUnitIds', null); // 清空扩展的组织类型 dataForm.setExtendAttributeByCode('ReadRange', 'extendCategories', null) } }; // 获取字段的值 var value = dataForm.getDataItemValue('f_0862164c8e'); // 根据字段的值设置阅读范围的组 setReadRangeGroup(value); // 监听字段的值 dataForm.addFieldListening('f_0862164c8e', setReadRangeGroup); ``` ## 实例十:主列表按钮前置验证及传值 ``` // 控制非完成状态的行数据无法启动 /** * datas:列表选中的行数据 * resolve:回调函数 */ dataTable.addButtonBefore('启动', function (datas,resolve) { // 判断某值是否符合要求 if (datas[0]["f_f585b8afa7"]!=='已完成') { // 弹出提示 目前message的type只支持error,warning,info dataTable.$message({ type: "warning", message: "非完成状态无法启动", }); } else { // 继续后面的处理 resolve(); } }); ``` ## 实例十一:子表行编辑模式保存前置验证及传值 ``` // 验证机构代码是否可用 var subTable1 = dataForm.getSubTable('68dc4a6640'); //行编辑模式:保存前置 subTable1.addButtonBefore('保存', function(data, resolve) { // data为key-value的格式 const bh = data['f_b954f24e4c'] if (bh === '010') { subTable1.$message({ type: "warning", message: "该机构代码不可用!", }); resolve(false); // 验证不通过,返回false } else { resolve(true); // 验证通过,返回true。或写:resolve() } }); ``` ## 实例十二:获取字段权限 ``` var dataItem = dataForm.getDataItem('f_b954f24e4c'); console.log('dataItem') ``` ## 实例十三:字段赋值 ``` // 单行文本、多行文本赋值 dataForm.setDataItemValue('f_xxx', 'xxx'); // 选人、选部门、多选控件赋值 dataForm.setDataItemValue('f_xxx', [{ Name: '张三', ObjectID: 'xxxx-xxxx' }]); ``` ## 实例十四:执行表单按钮动作(仅在铁四院质量分支可用) ``` // 执行提交按钮的动作 dataForm.executeFormButtonAction('提交').then(function(resolve) { // 提交成功的回调 ... // 直接调用会完成平台的后续操作 resolve(); }); ``` ## 实例十五:效验表单数据(仅在铁四院质量分支可用) ``` dataForm.validateData().then(function(result) { // result为true时,表示效验通过 }); ``` ## 实例十六:按钮前置打开列表选择数据(目前仅在release_honda_qianjia分支可用) ``` dataForm.addButtonBefore("openlist", function(resolve) { var modal = dataForm.$showListModal( { AppItemCode: "b33d6585867c50ed", SearchCondition: [] }, { isSelectMode: true, isMultipleSelectMode: true, pagingSize: 20, isAdvanceSearch: true, advanceSearchCodes :["f_aaa","f_bbb"], width: "80%", title: "选择数据" }, function(data) { //单选为选中的数据,多选为选中的数据数组 console.log(data); modal.close(); } ); }); ``` ## 实例十七:根据不同用户组显示不同按钮 ``` debugger; dataForm.isHiddenButton('网安提请打印', true) //网安提请打印 dataForm.isHiddenButton('网安提请打印-派出所', true) //网安提请打印 dataForm.isHiddenButton('技侦提请打印', true) //技侦提请打印 dataForm.isHiddenButton('经侦提请打印', true) //经侦提请打印 dataForm.isHiddenButton('刑侦提请打印', true) //刑侦提请打印 var formInfo = dataForm.getDataFormInfo(); var userInfo = dataForm.$getUserInfo(); var OUGroup = userInfo.OUGroups; var USCode = userInfo.Code; if (OUGroup != null) { var JingZBool = OUGroup.includes('警种支撑岗'); var FenjBool = OUGroup.includes('分局支撑岗'); var WABool = userInfo.ParentName.includes("网络安全");//判断是否包含 var JZBool = userInfo.ParentName.includes("技术侦察"); var JJBool = userInfo.ParentName.includes("经济犯罪"); var XZBool = userInfo.ParentName.includes("刑事侦查"); if (WABool === true && JingZBool === true) { dataForm.isHiddenButton('网安提请打印', false) //网安提请打印 dataForm.isHiddenButton('网安提请打印-派出所', false) //网安提请打印 } else if (JZBool === true && JingZBool === true) { dataForm.isHiddenButton('技侦提请打印', false) //技侦提请打印 } else if (USCode == '011568' || JJBool === true && JingZBool === true) { dataForm.isHiddenButton('经侦提请打印', false) //经侦提请打印 console.log("666") } else if (XZBool === true && JingZBool === true) { dataForm.isHiddenButton('刑侦提请打印', false) //刑侦提请打印 } else if (WABool === true && FenjBool === true) { dataForm.isHiddenButton('网安提请打印', false) //网安提请打印 dataForm.isHiddenButton('网安提请打印-派出所', false) //网安提请打印 } } ```
fanfy
2025年7月29日 16:10
转发文档
收藏文档
上一篇
下一篇
手机扫码
复制链接
手机扫一扫转发分享
复制链接
Markdown文件
PDF文档(打印)
分享
链接
类型
密码
更新密码