zoukankan      html  css  js  c++  java
  • 如何解耦业务表单与流程

    一、问题说明

    使用工作流的系统,例如OA,ERP等,都会遇到当流程到达某些环节的时候,业务表单的某些字段有值的验证要求或只在该环节显示、隐藏。

    二、解决方案

    1、一般方案

    在业务表单里使用流程环节的特征信息来对这些字段作控制,属于硬编码的方式,业务表单与流程的耦合度太高,污染了表单代码,会有点乱。可读性、可维护性、扩展性都会大大降低。

    2、更好的方案

    1)、环节移动相关的

    当前节点上的操作和数据决定了下一步怎么走,所以业务表单里的某些字段可能要拿来作判断的或临时提供一个选择器给用户,由用户来决定下一步该怎么走。可以把这种关系体现在流程图上的,通过添加判断节点和定义条件表达式的方式。

    示例:

    这里有两种方式:

    a、利用表单原有的字段来作判断

    上图“是否收了全款”节点的出线“已收”上定义了条件表达式:${receiveIn==receiveSum}(已收款是否等于应收款),该表达式上的两个变量就是业务表单里的字段名。环节提交时首先检查这两个字段值不能为空,然后设置到流程变量里面,后面的交给流程引擎来处理就可以了。

    b、动态构建临时选择器或临时输入框

    上图“客户是否满意”的出线“满意”上定义了条件表达式:${isSuccess==1},另一条出错定义了{isSuccess==0}。业务表单里没有定义isSuccess这个字段,但我们可以通过这些表达式可以动态创建出HTML,再动态添加到业务表单里,这样用户就可以在页面上作出选择操作,当表单提交时,再把这动态的字段与值设置到流程变量里。

    2)、节点上的验证

    不是决定下一步该怎么走,而是决定当前节点能不能办结,所以需要在当前节点上添加一些验证规则。而这种关系无法体现在流程图上,只能在流程外的解释工具上定义规则集,为了降低使用难度,规则集是一个描述性的JSON数据,解释工具再根据这些规则描述翻译成脚本,从而达到对表单的控制,控制表单是否能正常提交。

    例如:

    {rules:{'财务结账':'receiveIn==receiveSum || (reason.length>0 && reason_prove.length>0)'}},由于该表达式是或的关系,所以后面部分的reason,reason_prove字段一开始时是隐藏的,当前面条件(receiveIn==receiveSum)不满足时才显示。如果是与的关系,就可以同时显示。当表单提交时,先将这些变量设值(根据变量名找到表单对应的控件,再将控件的值赋值给变量),再用eval()方法来执行表达式,返回true即表单可以正常提交,否则停止提交操作,并提示给用户

  • 相关阅读:
    (组件、路由)懒加载
    vue.js实现用户评论、登录、注册、及修改信息功能
    vue 路由传参 params 与 query两种方式的区别
    WebSocket入门教程(五)-- WebSocket实例:简单多人聊天室
    js系列教程11-json、ajax(XMLHttpRequest)、comet、SSE、WebSocket全解
    回忆一下跨域
    Http,Socket,TCP/IP 协议简述
    Vue+WebSocket 实现页面实时刷新长连接
    微信小程序JS导出和导入
    Vue学习之路之登录注册实例代码
  • 原文地址:https://www.cnblogs.com/ptw-share/p/6703961.html
Copyright © 2011-2022 走看看