编辑 | blame | 历史 | 原始文档

安装依赖

npm install

启动

npm run serve
```

📢 如果启动报错请检查错误信息看看是否是依赖版本和当前所安装的 node 版本不兼容,自行安装兼容版本的依赖

👍 启动成功后访问 http://localhost:88 即可打开页面

image-20220720094501757

操作教程

工作区

点击工作区,进入审批列表,按分组可以进行展开折叠

image-20220724225022126

发起审批

点击对应项可弹出提交表单窗口

image-20220724225156405

管理后台

从首页进入管理后台,展示出来的是所有已经设计好的审批列表

审批列表

审批列表按分组展示,点击每个分组右侧可对分组进行编辑及删除,如果分组内有表单,则删除分组后内部表单会被移动到其他分组(默认)

image-20220724225423708

分组及表单拖拽排序

分组排序

image-20220724225749669

image-20220724225853154

表单排序

image-20220724230032985

表单流程设计器

点击新建表单/编辑 进入审批表单流程设计器

基础设置

image-20220724231222926

表单设计

表单设计是用来设计发起审批流程时填写的表单的,拖拽式交互

从左侧组件库选取组件放置到中间设计区域,点击设计区组件,可在右侧面板配置组件的设置项

image-20220724222124900

分栏布局

普通组件是独占一行的,假设我们要让2个组件并排显示,就需要使用分栏了

image-20220724233902503

image-20220724231814888

❗ 注意事项:分栏组件会自动按每2个组件为一行进行布局,假设分栏组件内放了5个子组件,那么前四个会两两占用一列,**剩下多的一个会独占一行**

分栏组件内可以放置其他组件,也可以放置分栏组件进行嵌套!!!!!

image-20220724233253171

明细表

有时候我们需要提交一系列数据,这些数据有表格的性质,这时候可以使用明细表组件

明细表类似分栏容器,可以在内部放置其他组件

image-20220724234359498

审批流程设计

审批流程设计,顾名思义,用来设计用户提交的表单流程,需要经过哪些人的审批流转

image-20220724234519380

支持多种类型节点

发起人

也就是发起,提交这个流程的人员

审批人

当任务流转到审批人时,这个节点设置的相关人员需要对这个提交的流程进行审批(同意/驳回)

抄送人

当流程到达抄送人节点时,将会通知到相关人员

条件分支

有时候我们的流程需要动态的情况,根据一些条件进行不同的处理流程,这时候就可以添加条件分支,设置进入每个流程分支的条件

image-20220724235146294

并行分支

有时候我们需要审批流程不需要条件选择,同时进行几个步骤,这时候可以利用并行分支,当所有分支的步骤都结束后才会进行到下一步

image-20220724235422400

延时处理

有时候我们需要让整个流程卡在某个地方,等待一段时间再继续,这时候可以在需要等待的地方插入延时处理节点

触发器

本节点属于扩展功能,流程在到达此处时会触发一个动作,应当由开发人员使用,用来打通与其他系统的交互

通过Http请求,来动态修改表单数据或者将表单数据传递给外部系统