跳过正文
  1. 工作笔记/
  2. 参考文档/

E9 流程表单前端 API 速查参考

·720 字·4 分钟
泛微 E9 流程表单 前端 API 参考文档 速查
作者
molefool
目录

整理目标:按场景快速找 WfForm API。本文保留接口名、常量、配置名和关键注意事项,省略原始截图、长演示和重复说明。

基本规则
#

  • 全局对象:window.WfForm,通常直接使用 WfForm
  • 移动端判断:WfForm.isMobile();后端可读请求参数 _ec_ismobile
  • 前端代码入口:模板代码块、路径基础设置的自定义页面、应用设置的全局自定义页面。
  • 路径级和全局自定义页面不要引入 init_wev8.js
  • 表单字段操作优先使用 WfForm API,不推荐 jQuery("#field111").val(),禁止原生 DOM 强改字段。
  • 字段标识:主字段一般是 field111,明细字段一般是 field111_0 这种带行标识格式。
  • viewAttr1 只读、2 可编辑、3 必填、4 隐藏字段标签和内容、5 隐藏字段所在行。

打开表单
#

场景写法备注
PC 新建请求window.open('/workflow/request/CreateRequestForward.jsp?workflowid=747')传路径 ID,系统计算活动版本。
PC 查看请求window.open('/workflow/request/ViewRequestForwardSPA.jsp?requestid=5963690')用户必须有查看权限。
移动端推荐window.openLink.openWorkflow(url, callbackFun, returnUrl)自研页面需引入 /spa/coms/openLink.js
移动端兜底window.open(url + '&returnUrl=' + encodeURIComponent(returnUrl))不推荐,手动返回场景不易监听。
移动端悬浮窗口window.showHoverWindow(url, baseRoute)非表单主界面,如明细编辑页打开链接。

动作事件
#

执行前拦截
#

WfForm.registerCheckEvent(type, fn) 在动作前执行。回调里必须调用 callback() 才继续,不调用就是阻断。

常量用途
WfForm.OPER_SAVE保存前。
WfForm.OPER_SUBMIT提交、批准、提交需反馈、不需反馈等。
WfForm.OPER_SUBMITCONFIRM提交至确认页;确认页点击确认触发 OPER_SUBMIT
WfForm.OPER_REJECT退回前。
WfForm.OPER_REMARK批注提交前。
WfForm.OPER_INTERVENE干预前。
WfForm.OPER_FORWARD转发前。
WfForm.OPER_TURNHANDLE转办前。
WfForm.OPER_TURNREAD传阅前。
WfForm.OPER_FORCEOVER强制归档前。
WfForm.OPER_TAKEBACK强制收回前。
WfForm.OPER_DELETE删除前。
WfForm.OPER_ADDROW + detailIndex添加明细行前,明细从 1 开始拼接。
WfForm.OPER_DELROW + detailIndex删除明细行前。
WfForm.OPER_PRINTPREVIEW打印预览前。
WfForm.OPER_WITHDRAW撤回前。
WfForm.OPER_CLOSE页面关闭前。
WfForm.OPER_SAVECOMPLETE保存后页面跳转前。
WfForm.OPER_ASKOPINION意见征询前。
WfForm.OPER_TAKFROWARD征询转办前。
WfForm.OPER_BEFORECLICKBTN点右键按钮前。
WfForm.OPER_BEFOREVERIFY必填校验前。
WfForm.OPER_EDITDETAILROW移动端编辑明细行前。
jQuery(function () {
  WfForm.registerCheckEvent(WfForm.OPER_SUBMIT, function (callback) {
    // 校验通过后继续
    callback();
  });
});

执行后钩子
#

WfForm.registerAction(actionName, fn) 在动作完成后执行。

常量用途
WfForm.ACTION_ADDROW + detailIndex添加明细行后。
WfForm.ACTION_DELROW + detailIndex删除明细行后。
WfForm.ACTION_EDITDETAILROW + detailIndex移动端编辑明细行。
WfForm.ACTION_SWITCHDETAILPAGING切换明细分页。
WfForm.ACTION_SWITCHTABLAYOUT切换模板布局标签页。
WfForm.registerAction(WfForm.ACTION_ADDROW + '1', function (index) {
  console.log('new row index:', index);
});

字段基础 API
#

要做什么API关键点
字段名转字段标识WfForm.convertFieldNameToId(fieldname, symbol?, prefix?)symbolmaindetail_1prefix=false 可只返回数字 ID。
取字段值WfForm.getFieldValue(fieldMark)浏览按钮默认取主键值。
取浏览按钮对象WfForm.getFieldValueObj(fieldMark)原示例用它取 specialobj,实际环境需验证大小写。
改字段值WfForm.changeFieldValue(fieldMark, valueInfo)不支持附件;会触发联动和格式化。
改显示属性WfForm.changeFieldAttr(fieldMark, viewAttr)4 隐藏字段,5 隐藏行。
同时改值和属性WfForm.changeSingleField(fieldMark, valueInfo, variableInfo)例如改值同时只读。
批量改值或属性WfForm.changeMoreField(changeDatas, changeVariable)多字段一次提交。
触发字段所有联动WfForm.triggerFieldAllLinkage(fieldMark)包含字段联动、SQL 联动、公式、规则、bindPropertyChange 等;归档调用无效。
取字段配置属性WfForm.getFieldInfo(fieldid)fieldid 不带 field;返回 htmltypedetailtypefieldnamefieldlabelviewattr
取实时显示属性WfForm.getFieldCurViewAttr(fieldMark)读取显示属性联动、接口变更、已办状态后的实时值。
const field = WfForm.convertFieldNameToId('zs');
WfForm.changeFieldValue(field, { value: '文本值' });

WfForm.changeFieldValue('field11_2', {
  value: '2,3',
  specialobj: [
    { id: '2', name: '张三' },
    { id: '3', name: '李四' }
  ]
});

字段事件与自定义渲染
#

要做什么API关键点
主字段变化WfForm.bindFieldChangeEvent(fieldMarkStr, fn)回调参数通常是 obj, id, value
明细字段变化WfForm.bindDetailFieldChangeEvent(fieldMarkStr, fn)回调参数通常是 id, rowIndex, value
字段区域动作WfForm.bindFieldAction(type, fieldids, fn)onfocusonclick 等绑定在单元格区域,不是只绑输入框。
代理单行文本字段WfForm.proxyFieldComp(fieldMark, el, range)仅单行文本框;range 可限制只读/可编辑/必填状态。
追加字段渲染WfForm.afterFieldComp(fieldMark, el, range)在标准字段后追加组件。
函数式代理字段内容WfForm.proxyFieldContentComp(fieldid, fn)优先级高于 proxyFieldCompafterFieldComp
强制重渲染字段WfForm.forceRenderField(fieldMark)在代码块/custompage 中代理字段后常用。
生成字段组件WfForm.generateFieldContentComp(fieldMark)搭配 ReactmobxReact.Provider 自定义布局。
取布局 StoreWfForm.getLayoutStore()getGlobalStore() 一起给自定义渲染注入 Store。
WfForm.bindFieldChangeEvent('field27555,field27556', function (obj, id, value) {
  console.log(id, value);
});

明细表 API
#

要做什么API关键点
添加明细行WfForm.addDetailRow(detailMark, initAddRowData)detailMarkdetail_1;可传初始字段值。
删除明细行WfForm.delDetailRow(detailMark, rowIndexMark)rowIndexMark 可传 all3,6
勾选明细行WfForm.checkDetailRow(detailMark, rowIndexMark, needClearBeforeChecked)可先清空再勾选。
获取所有行标识WfForm.getDetailAllRowIndexStr(detailMark)返回逗号分隔行标识。
获取已勾选行标识WfForm.getDetailCheckedRowIndexStr(detailMark)只返回当前勾选行。
禁用行勾选WfForm.controlDetailRowDisableCheck(detailMark, rowIndexMark, disableCheck)后台置灰行不支持用 API 控制。
隐藏/显示明细行WfForm.controlDetailRowDisplay(detailMark, rowIndexMark, needHide)只是界面隐藏,序号不会重排。
获取已有行数据库主键WfForm.getDetailRowKey(fieldMark)新增行或不存在行返回 -1
获取明细总行数WfForm.getDetailRowCount(detailMark)只表示总数,不等于可循环行号。
添加行默认复制最后一行WfForm.setDetailAddUseCopy(detailMark, needCopy)ready 后手动添加时生效;附件字段不复制。
获取明细显示序号WfForm.getDetailRowSerailNum(mark, rowIndex)接口名原文为 Serail
const rows = WfForm.getDetailAllRowIndexStr('detail_1');
(rows ? rows.split(',') : []).forEach(function (rowIndex) {
  const value = WfForm.getFieldValue('field222_' + rowIndex);
  console.log(value);
});

全局 API
#

要做什么API关键点
取请求基础信息WfForm.getBaseInfo()路径、节点、表单、主次账号等。
取全局 StoreWfForm.getGlobalStore()常用于调试右键菜单和自定义渲染。
取操作 StoreWfForm.getOperateStore()移动端定位右键菜单按钮类型。
消息提示WfForm.showMessage(msg, type, duration)type=2 可表示错误样式。
确认框WfForm.showConfirm(content, okEvent, cancelEvent, otherInfo)兼容移动端;PC 可自定义标题和按钮文案。
禁用顶部按钮/右键菜单WfForm.controlBtnDisabled(isDisabled)可恢复。
调用右键按钮WfForm.doRightBtnEvent(type)只可调用,不建议复写。
刷新表单WfForm.reloadPage(params)默认当前 requestid,可覆盖参数。
移动端悬浮链接window.showHoverWindow(url, baseRoute)明细编辑页打开外链时常用。
追加提交参数WfForm.appendSubmitParam(obj)自定义参数建议 cus_ 前缀,避免覆盖标准参数。
取第一个未必填字段WfForm.getFirstRequiredEmptyField()返回形如 field${fieldid}_${rowIndex}
触发必填验证WfForm.verifyFormRequired(mustAddDetail, fieldRequired)返回布尔结果并提示。

特定字段类型 API
#

要做什么API限定
扩展浏览按钮取数参数WfForm.appendBrowserDataUrlParam(fieldMark, jsonParam)非日期时间浏览按钮;后端浏览按钮接口配合读取 URL 参数。
获取浏览按钮显示名WfForm.getBrowserShowName(fieldMark, splitChar)多值按分隔符拼接。
移除选择框选项WfForm.removeSelectOption(fieldMark, optionKeys)选择框;多个 key 用逗号。
控制选择框可见选项WfForm.controlSelectOption(fieldMark, optionKeys)传空字符串可清空所有选项。
获取选择框显示名WfForm.getSelectShowName(fieldMark, splitChar)选择框。
空文本默认提示WfForm.setTextFieldEmptyShowContent(fieldMark, showContent)单行文本、整数、浮点数、千分位、多行文本非 HTML。
复写浏览按钮 propsWfForm.overrideBrowserProp(fieldMark, jsonParam)谨慎使用,会覆盖浏览按钮 props。
控制日期可选范围WfForm.controlDateRange(fieldMark, start, end)日期字段;start/end 可用偏移天数或日期字符串。
单选框打印只显示选中项文字WfForm.controlRadioPrintText(fieldid)选择框中的 radio 类型。
WfForm.appendBrowserDataUrlParam('field111', { cus_type: 'A' });
WfForm.controlDateRange('field222_0', '2019-05-01', '2019-05-31');

签字意见 API
#

要做什么API关键点
获取签字意见WfForm.getSignRemark()返回当前签字意见内容。
设置签字意见WfForm.setSignRemark(text, isClear=true, isAfter=true, callback)可覆盖、前插、后插。
扩展底部按钮WfForm.appendSignEditorBottomBar(comps=[])追加自定义 React 组件或元素。

历史 E8 兼容接口
#

旧方式建议替代备注
window.checkCustomize = function () {}WfForm.registerCheckEvent(...)返回 true 继续、false 阻断;新开发不要优先用。
jQuery('#field27563').bindPropertyChange(...)WfForm.bindFieldChangeEvent(...)旧方式依赖 DOM。
_customAddFun${groupid}(addIndexStr)WfForm.registerAction(WfForm.ACTION_ADDROW + detailIndex, ...)groupid0 开始,明细动作常量从 1 开始拼。
_customDelFun${groupid}()WfForm.registerAction(WfForm.ACTION_DELROW + detailIndex, ...)旧方式只为兼容。
window._writeBackData / _writeBackDataWfForm.changeFieldValue(...)新开发统一用 API 赋值浏览按钮。
直接 document.getElementById(...).valueWfForm 字段 API原生 DOM 会引发升级兼容问题。

常用系统配置
#

下列配置通常对当前 Ecology 系统全部流程生效,修改前确认影响范围。

目标配置名或入口
修改意见默认字体/api/workflow/index/updateWfConfig?name=signinput_default_fontfamily&value=仿宋_GB2312/FangSong_GB2312常见值:宋体/SimSun微软雅黑/Microsoft YaHeiArial/Arial, Helvetica, sans-serif 等。
修改意见默认字号/api/workflow/index/updateWfConfig?name=signinput_default_fontsize&value=36/36px支持 8/8px36/36px 等。
自定义浏览框缓存un_use_customize_browser_cache1 关闭,0 开启;清理页:/workflow/request/CustomizeBrowserCacheUtil.jsp
非 HTML 文本字段支持 HTMLsupport_html_textarea_fieldSQL 追加 field12345_1;老表单可能是 field12345_0;需重启 Resin。
显示底部耗时信息show_duration_log1 开启,0 关闭。
明细横向滚动时按钮行固定detail_locked_button_row1 锁定,0 取消锁定。
明细无行时合计给主字段colRule_noRow_empty1 赋零值,0 赋空值。
PC 手写签批按钮handwrittensign_switch1 开启,0 关闭。
移动端选择框单选显示成 radiomobile_show_radio1 开启,0 关闭。
移动端正文/附件签批MobileWFOfficeSign.propertiesmobileWFOffice=1mobilePDFSign=1/2/3

常用 CSS 场景
#

目标样式或配置备注
明细添加删除按钮靠左.detailButtonDiv{float:left}代码块中需包 <style>,CSS 文件不用。
单元格图片居中.imageCell_swap{background-position:center}单元格自定义属性 class:imageCell
单元格图片自适应.imageCell_swap{background-size:100% 100%}同上。
浏览按钮链接颜色跟随单元格browser_color_controlByCell=1通过 updateWfConfig 开启。
强制浏览按钮链接颜色.browserColorCell a{color:red !important}单元格 class:browserColorCell
主表选择框最小宽度.selectCell .wea-select{min-width:50px !important}单元格 class:selectCell

其他场景
#

  • 移动端异构系统提交表单后刷新流程列表:提交后跳转到 当前Ecology服务器地址 + '/workflow/workflow/WfRefreshList.jsp'
  • 移动端有反向代理时,服务器地址要使用代理后的可访问地址。

AI 检索关键词
#

  • 字段值:getFieldValuechangeFieldValuespecialobjchangeMoreField
  • 字段状态:changeFieldAttrgetFieldCurViewAttrviewAttr
  • 字段联动:triggerFieldAllLinkagebindFieldChangeEventbindDetailFieldChangeEvent
  • 明细行:addDetailRowdelDetailRowgetDetailAllRowIndexStrgetDetailRowCount
  • 浏览按钮:appendBrowserDataUrlParamgetBrowserShowNameoverrideBrowserProp
  • 选择框:removeSelectOptioncontrolSelectOptiongetSelectShowName
  • 签字意见:getSignRemarksetSignRemarkappendSignEditorBottomBar
  • 配置:updateWfConfigsupport_html_textarea_fieldMobileWFOfficeSign.properties

相关文章