LogicFlow

# 审批流程

本文将介绍如何使用LogicFlow构建权限审批流程。主要包括的功能如下：

  • 创建流程内支持的审批节点
  • 审批流程配置
  • 审批流程主题设置
  • 审批流程进度预览

# 创建审批节点

审批节点包括发起申请、审核、判断、结束。 通过LogicFlow自定义节点，扩展审批流程需要的节点。

# 节点菜单Panel

节点菜单panel使用React组件实现，为组件绑定事件onMouseDown事件，拖拽panel组件进行节点创建。

# 自定义流程节点

  • 节点
    审批节点包括发起申请、审核、判断、结束。其中审核角色又分为直接上级、T3领导，T2领导，T1领导等。不同作用的节点，使用不同的形状、大小、颜色等进行区分。
  • 属性
    审批流程配置中除了节点信息之外，还需要配置各个审批节点和边上的一些属性，自定义实现属性配置。通过LogicFlow自定义属性，扩展审批流程需要的业务属性。
  • 连线规则
    在审批流配置过程中，需要有一些控制连接的规则保证流程的正确性，比如申请节点不能被其它节点连接、结束节点不能连接其他节点等，LogicFlow提供了自定义节点连线规则功能来实现这个需求。

# 审批流配置

# 创建节点

从菜单面板中拖拽节点到画布进行创建。

# 流程配置

通过节点锚点创建边，建立节点之间的联系；对齐线功能辅助调整位置，使得流程更加整齐美观；应用连线规则，保证流程的正确性。

# 审批流扩展

# 事件

LogicFlow提供了节点和边的交互事件，可以通过监听这些事件，拿到对应的节点和边的数据以及原生事件信息。事件的详细内容见事件API
审批中的流程进度预览，设置静默模式，监听节点hover，使用React组件展示审批详情。

# 审批流程主题设置

可以通过主题设置的方式，统一修改节点和边的样式，优化流程展示，适配与宿主系统UI。主题详情见主题API

←