业务开发

流程分为两种场景，单业务审批流程和分类业务审批流程

单业务：业务数据操作只涉及一张表的数据，如 角色，或者涉及其他表，但是不根据其他表的数据来区分流程；此场景下，业务数据对应唯一一个审批流程；

分类业务：业务数据操作涉及其他表的数据，如 文章，文章数据会关联栏目数据；此场景下，文章根据所属栏目去区分，业务数据对应多个流程。

新增业务流程配置

以文章和角色两种场景来演示

新增流程类别字典

新增流程配置

新闻文章审批配置

分类业务场景下，同一张表业务数据对应多个流程的流程类别必须一致

角色审批配置

表单项流程配置json结构说明

JSON结构说明

fields字段说明

{
  "fields": [{
    "field": "CONTENT_DATETIME",
    "name": "发布时间",
    "type": "date",
    "fmt": "YYYY-MM-DD HH:mm:ss"
  },{
    "field": "CONTENT_TYPE",
    "name": "文章类型",
    "key": "value",
    "type": "select",
    "multiple": "false",
    "options": [
      {
        "value": "c",
        "label": "推荐"
      },
      {
        "value": "f",
        "label": "幻灯"
      },
      {
        "value": "h",
        "label": "头条"
      },
      {
        "value": "p",
        "label": "图片"
      }]
  },{
    "field": "CATEGORY_ID",
    "name": "所属栏目",
    "type": "select",
    "multiple": "false",
    "options": [{
      "value": "1499198773946273794",
      "label": "文化"
    }, {
      "value": "1546662562244468738",
      "label": "动漫"
    }, {
      "value": "1546662842281369601",
      "label": "综艺"
    }]
  }]
}

流程设计效果展示，通过下拉选择的方式简单设置条件

审批表单

介绍：在提交、办理审批时，展示业务数据；审批表单路径为一个控制层视图请求或路由(如 /basic/role/form.do)，审批表单相较于新增数据表单，是禁止修改、隐藏操作按钮，只展示数据

设置了审批表单，在办理审批时，左侧会根据配置的路径展示业务数据

没有设置审批表单，在办理审批时，不会展示业务数据

审批表单方案1：复用业务数据表单

在展示审批表单时会默认传递isReadonly=true 和 业务数据id2个参数，可通过ms-flow组件的customProps属性自定义传递参数，业务表单接收参数去实现审批表单展示效果，

...
<el-header class="ms-header ms-tr" height="50px" >
    <el-button type="primary" class="iconfont icon-baocun" size="default" @click="save()" :loading="saveDisabled" v-if="!isReadonly">保存
    </el-button>
    <el-button size="default" class="iconfont icon-fanhui" plain @click="back()" v-if="!isReadonly">返回</el-button>
</el-header>
...
<el-form ref="form" :model="form" :rules="rules" label-width="100px" size="default" :disabled="isReadonly">
...
</el-form>
...
<!--单体项目 ftl文件 vue js start-->
data: function () {
    return {
        ...
        isReadonly: false,  // 是否只读
        id: '',  // 业务数据id
        ...
    }
}

created: function () {
    // 接收通过url传递的参数
    this.isReadonly = ms.util.getParameter("isReadonly");
    this.id = ms.util.getParameter("id");
    if (this.id) {
        this.get(this.id);
    }
}
<!--单体项目 ftl文件 vue js end-->

<!--vue脚手架 vue文件 vue js start-->
// 接收通过component动态组件传递的props参数
props:["isReadonly","id"],

created: function () {
    if (this.id) {
        this.get(this.id);
    }
}
<!--vue脚手架 vue文件 vue js end-->

审批表单方案2：自定义表单

创建一个新的表单页，单独用来展示审批时的业务数据，需要对应新增控制层视图请求或路由

监听器配置

在流程办理的过程中，可以通过监听器监听流程办理过程中的不同时期，达到增强的目的，需要二次开发

参考文档流程监听器

流程绑定

分类业务场景

分类表添加流程编码字段

ALTER TABLE YOUR_TABLE
 ADD COLUMN FLOW_CODE VARCHAR(255) DEFAULT '' COMMENT '流程编码';

业务分类数据控制层新增、更新方法添加@EnableFlow注解

前端分类数据表单页使用绑定流程分类组件<ms-flow-category>

<ms-flow-category>组件参数说明

功能：根据category获取已发布的流程列表

<ms-flow-category>集成代码示例

...
<!-- 头部添加组件引入 -->
<#include "flow/components/ms-flow-category.ftl"/>
...

...
<!-- 组件使用 -->
<ms-flow-category v-if="!form.id || form.leaf" :form-data="form" :data-id="form.id" category="文章审批"></ms-flow-category>
...

<!-- vue js -->
var categoryForm = Vue.defineComponent({
    components:{
        ...
        // 注册组件
        MsFlowCategory
        ...
    },
...
})

业务无分类场景

场景说明：一张表的业务数据共用一个流程，在提交时通过flowCode参数去指定流程

业务数据

业务数据添加流程字段

-- 如果业务数据原本有审批状态字段，执行下面的sql ，实体类需要通过@FlowConfig注解的statusColumn属性指定审批字段名
ALTER TABLE YOUR_TABLE
ADD COLUMN FLOW_INSTANCE_ID varchar(25) CHARACTER SET utf8mb3 COLLATE utf8mb3_general_ci NULL DEFAULT NULL COMMENT '流程实例id' AFTER DEL,
ADD COLUMN FLOW_NODE_CODE varchar(100) CHARACTER SET utf8mb3 COLLATE utf8mb3_general_ci NULL DEFAULT NULL COMMENT '节点编码' AFTER FLOW_INSTANCE_ID,
ADD COLUMN FLOW_NODE_NAME varchar(100) CHARACTER SET utf8mb3 COLLATE utf8mb3_general_ci NULL DEFAULT NULL COMMENT '流程节点名称' AFTER FLOW_NODE_CODE,
ADD COLUMN FLOW_NODE_TYPE int NULL DEFAULT NULL COMMENT '节点类型（0开始节点 1中间节点 2结束节点 3互斥网关 4并行网关）' AFTER FLOW_NODE_NAME;

有审批属性的业务实体对象继承BaseFlowEntity，并在@FlowConfig注解中指定原审批状态字段名，同时忽略flowStatus字段

-- 如果新产生审批的业务，执行下面的sql
ALTER TABLE YOUR_TABLE
ADD COLUMN FLOW_STATUS varchar(25) CHARACTER SET utf8mb3 COLLATE utf8mb3_general_ci NULL DEFAULT NULL COMMENT '流程状态' AFTER DEL,
ADD COLUMN FLOW_INSTANCE_ID varchar(25) CHARACTER SET utf8mb3 COLLATE utf8mb3_general_ci NULL DEFAULT NULL COMMENT '流程实例id' AFTER FLOW_STATUS,
ADD COLUMN FLOW_NODE_CODE varchar(100) CHARACTER SET utf8mb3 COLLATE utf8mb3_general_ci NULL DEFAULT NULL COMMENT '节点编码' AFTER FLOW_INSTANCE_ID,
ADD COLUMN FLOW_NODE_NAME varchar(100) CHARACTER SET utf8mb3 COLLATE utf8mb3_general_ci NULL DEFAULT NULL COMMENT '流程节点名称' AFTER FLOW_NODE_CODE,
ADD COLUMN FLOW_NODE_TYPE int NULL DEFAULT NULL COMMENT '节点类型（0开始节点 1中间节点 2结束节点 3互斥网关 4并行网关）' AFTER FLOW_NODE_NAME;

新产生审批业务实体对象继承BaseFlowEntity

业务实体使用@FlowConfig注解

业务数据流程配置

业务数据控制层使用@ManagerFlowStatus注解

在业务数据的新增和更新方法上添加@ManagerFlowStatus注解，在新增、更新业务数据时，会自动设置流程状态值，业务实体必须要继承BaseFlowEntity

功能介绍：

• 新增场景
  • 业务流程为发布状态时，新增业务数据审批状态为0，如果FlowConfig注解有配置flowStatusOption，那么为0对应的值；否则为0，页面上通过ms-flow-column-status格式化0为待提交
  • 业务流程为未发布状态且显示审批状态列时，新增业务数据审批状态为8，如果FlowConfig注解有配置flowStatusOption，那么为8对应的值；否则为8，页面上通过ms-flow-column-status格式化8为已完成
• 编辑场景，业务有启用的流程根据流程配置json中的updateStrategy决定处理方式；没有启用中的流程，可任意编辑
  • reject(默认)，禁止更新流程中的业务数据
  • continue，允许更新，并以新数据继续执行流程
  • rollback，允许更新，终止当前流程，回滚到待提交状态

业务数据列表审批状态格式化组件ms-flow-column-status

内置默认审批状态，默认状态下，状态值 0、1、8、撤销、审批不通过 分别对应显示为“待提交”、“审批中”、“已完成”、“撤销”和“审批不通过”;可通过@FlowConfig注解的flowStatusOption参数自定义

组件参数说明

...
<!-- 头部添加组件引入 -->
<#include "flow/components/ms-flow-column-status.ftl">
...

<ms-flow-column-status label="审核状态" ref="msFlowColumnStatusRef" :key="flowCode"
                       :flow-code="flowCode"
                       category="栏目文章"
                       :always-show="true">
  <template #header>审核状态
    <el-popover placement="top-start" title="提示" trigger="hover" >
      提交审核的文章需要在待审文章列表中审核，待审核的文章不能编辑或删除
      <template #reference>
        <i class="el-icon-question"></i>
      </template>
    </el-popover>
  </template>
</ms-flow-column-status>


<!--vue js-->
components: {
    // 注册组件
    MsFlowColumnStatus,
},

业务数据列表页审批相关操作集合组件ms-flow

ms-flow 是一个集成多个审批操作的复合组件；如需单独使用某项审批功能，可参考 ms-flow 内部对相关子组件的调用方式

组件参数说明

...
<!-- 头部添加组件引入 -->
<#include "flow/components/ms-flow.ftl"/>
...

<!--下方 以文章管理列表页操作列为例-->
<el-table-column label="操作" width="120" align="center" fixed="right">
  ...
  <template #default="scope" >
    ...
    <!--工作流审批-->
    <!-- flowEnable、statusOptions、statusColumn 通过ms-flow-column-status组件的ref获取 -->
    <ms-flow
            :flow-enable="$refs.msFlowColumnStatusRef?.enable"
            :flow-code="flowCode"
            category="栏目文章"
            :data-title="scope.row.contentTitle"
            :flow-obj="scope.row"
            :custom-props="{
                                id: scope.row.id,
                                isReadonly: true,
                                categoryType: '1',
                                categoryId: scope.row.categoryId
                            }"
            :status-options="$refs.msFlowColumnStatusRef?.flowStatusOptions"
            :status-column="$refs.msFlowColumnStatusRef?.statusColumn"
            @callback="list"
    ></ms-flow>
    ...
  </template>
</el-table-column>

<!--vue js-->
components: {
    // 注册组件
    MsFlow,
},

审批相关操作权限添加

权限结构："flow:" + 流程类别 + ":approve|:forcePass"

抄送

定义：抄送功能，是指流程执行过程中，节点可设置抄送人，节点执行完成时，将节点的审批结果进行抄送，抄送的通知方式需要自行实现

流程图设计

监听器中处理节点抄送人

抄送消息内容和抄送通知方式按需处理

流程设计器接口权限控制

shiroConfig中进行接口权限控制