UNPKG

@javaguns/flow-ui

Version:

``` <template> <a-spin :spinning="loading"> <FlowDesigner ref="flowDesigner" top="50px"> </FlowDesigner> </a-spin> </template> <script lang="ts" setup> import { ref, provide, onMounted } from 'vue'; import { FlowDesigner, LoadingKey } from '@j

1,141 lines (1,140 loc) 31.4 kB
import { getId as e } from "@javaguns/utils"; import { NodeType as o } from "../types/node.mjs"; const N = () => { const a = [ /* { name: '表单设计', value: 1, slot:'formDesigner' }, */ { name: "流程设计", value: 2, slot: "flowDesigner" } ], r = [ { nodeName: "审批节点", nodeType: o.APPROVER, icon: "Approve", color: "#ff6a00" }, { nodeName: "抄送节点", nodeType: o.COPYER, icon: "Cc", color: "#6368ea" }, { nodeName: "条件分支", nodeType: o.ROUTER, icon: "Branch", color: "#006ef8" }, { nodeName: "意见分支", nodeType: o.SUGGEST, icon: "Suggest", color: "#49f27e" }, { nodeName: "并行分支", nodeType: o.PARALLEL, icon: "Parallel", color: "rgb(43, 170, 177)" }, { nodeName: "子流程", nodeType: o.SUB_FLOW, icon: "Subflow", color: "##9AA477" }, { nodeName: "跳转节点", nodeType: o.JUMP, icon: "Jump", color: "#af14b1" }, { nodeName: "通知节点", nodeType: o.NOTICE, icon: "Notice", color: "#498ff2" } ]; return { navDatas: a, nodeItems: r, initNode: () => ({ nodeId: e(), nodeName: "开始节点", nodeType: o.START, // 流程节点状态(用于只读模式, 0:未进行 1:进行中 2:已完成) nodeStatus: -1, // 显示添加按钮 addable: !0, // 可删除 canDelete: !1, // 可删除提示 deletable: !1, // 是否激活 active: !1, // 是否可以拷贝 canCopy: !0, // 是否修改 update: !1, // 拖拽样式 dragClass: !1, // 拖拽工具 dragTool: !1, // 是否有错误 error: !1, // 显示内容 content: "", // 图标 icon: "Begin", iconUrl: "https://foruda.gitee.com/images/1689560270639636099/645bf20e_9837676.png", color1: "rgb(0, 184, 120)", color2: "rgb(0, 184, 120)", color3: "rgb(0, 215, 138)", childNode: { nodeId: e(), nodeName: "审批节点", nodeType: 1, // 流程节点状态(用于只读模式, 0:未进行 1:进行中 2:已完成) nodeStatus: -1, // 显示添加按钮 addable: !0, // 可删除 canDelete: !0, // 可删除提示 deletable: !1, // 是否激活 active: !1, // 是否可以拷贝 canCopy: !0, // 是否修改 update: !1, // 拖拽样式 dragClass: !1, // 拖拽工具 dragTool: !1, // 是否有错误 error: !1, // 显示内容 content: "", // 图标 icon: "Approve", iconUrl: "https://foruda.gitee.com/images/1689560287614227699/34dc2d66_9837676.png", color1: "rgb(250, 146, 0)", color2: "rgb(250, 146, 0)", color3: "rgb(255, 188, 88)", // 流程基础配置属性 attr: { // 审批类型 approvalMethod: 1, // 审批方式 approvalMode: 1, // 通过率 rate: 100, // 审批人与发起人为同一人时 starterAssignee: 1, // 相同审批人为同一人时 adjacent: 2, // 审批人为空时 emptyFlag: 5, // 允许退回人类型 allowBackType: 1, // 退回审批形式 backApprovalType: void 0, // 审批人为空时指定成员ID emptyApproverIds: [], // 审批人为空时指定成员名称 emptyApproverNames: [] }, // 审批设置 approverGroups: [ { nodeId: e(5), // 审批人模式 approverType: 1, // 审批名称 approverTypeName: "指定成员", // 层级模式 levelMode: 1, // 控件ID(人员控件、部门控件) controlIds: void 0, // 控件名称(人员控件、部门控件) controlNames: void 0, // 人员类型 assigneeType: 1, // 选择方式 selectMode: 1, // 选择范围 selectRange: 1, // 审批人ID approverIds: [], // 审批人名称 approverNames: [] } ], // 表单权限 privileges: [], // 高级配置 // configure: {}, // 流程基础通知属性 notice: { // 通知类型 noticeType: 1, // 通知主题 noticeTitle: "", // 通知内容 noticeContext: "" }, // 操作按钮 buttons: [ { buttonName: "同意", checked: !0, disabled: !1, content: "审批节点同意该审核之操作,审批通过,可在我已办查看", buttonCode: "agree", color: "success" }, { buttonName: "拒绝", checked: !0, disabled: !1, content: "节点负责人可以拒绝该流程(拒绝后流程直接结束,标记为已拒绝)", buttonCode: "reject", color: "error" }, { buttonName: "转交", checked: !0, disabled: !1, content: "转交给他人办理,依然在当前节点", buttonCode: "turn", color: "cyan" }, { buttonName: "退回", checked: !1, disabled: !1, content: "退回给申请人,申请人修改完成后,流程按节点开始走", buttonCode: "back", color: "default" }, { buttonName: "撤回", checked: !1, disabled: !1, content: "允许申请人对未进入流程(第一个流程节点为待处理状态)的申请进行撤回", buttonCode: "revoke", color: "default" }, { buttonName: "加签", checked: !1, disabled: !1, content: "这个事情我不能完全做主,需要某些人先处理,再右我处理", buttonCode: "addSign", color: "warning" }, { buttonName: "抄送", checked: !1, disabled: !1, content: "允许审批人进行抄送", buttonCode: "copyer", color: "warning" }, { buttonName: "征询", checked: !1, disabled: !1, content: "征询他人意见", buttonCode: "consult", color: "warning" } ] }, // 表单权限 privileges: [], // 流程基础通知属性 notice: { // 通知类型 noticeType: 1, // 通知主题 noticeTitle: "", // 通知内容 noticeContext: "" }, // 操作按钮 buttons: [ { buttonName: "保存", checked: !0, disabled: !0, content: "发起节点保存操作,审批节点下无保存操作,可在草稿箱查看", buttonCode: "save", color: "default" }, { buttonName: "提交", checked: !0, disabled: !0, content: "发起节点填写完申请单,,提交流程到下一步,可在我发起的查看", buttonCode: "submit", color: "primary" } ], // 抄送设置 approverGroups: [ { nodeId: e(), // 审批人模式 approverType: 1, // 审批名称 approverTypeName: "上级", // 层级模式 levelMode: 1, // 控件ID(人员控件、部门控件) controlIds: [], // 控件名称(人员控件、部门控件) controlNames: [], // 人员类型 assigneeType: 1, // 选择方式 selectMode: 1, // 选择范围 selectRange: 1, // 审批人ID approverIds: [], // 审批人名称 approverNames: [] } ] }), approverNode: () => ({ nodeId: e(), nodeName: "审批节点", nodeType: o.APPROVER, // 流程节点状态(用于只读模式, 0:未进行 1:进行中 2:已完成) nodeStatus: -1, // 显示添加按钮 addable: !0, // 可删除 canDelete: !0, // 可删除提示 deletable: !1, // 是否激活 active: !1, // 是否可以拷贝 canCopy: !0, // 是否修改 update: !1, // 拖拽样式 dragClass: !1, // 拖拽工具 dragTool: !1, // 是否有错误 error: !1, // 显示内容 content: "", // 图标 icon: "Approve", iconUrl: "https://foruda.gitee.com/images/1689560287614227699/34dc2d66_9837676.png", // color1: 'rgb(99, 104, 234)', // color2: 'rgb(99, 104, 234)', // color3: 'rgb(148, 152, 255)' color1: "rgb(250, 146, 0)", color2: "rgb(250, 146, 0)", color3: "rgb(255, 188, 88)", // 流程基础配置属性 attr: { // 审批类型 approvalMethod: 1, // 审批方式 approvalMode: 1, // 通过率 rate: 100, // 审批人与发起人为同一人时 starterAssignee: 1, // 相同审批人为同一人时 adjacent: 2, // 审批人为空时 emptyFlag: 5, // 允许退回人类型 allowBackType: 1, // 退回审批形式 backApprovalType: void 0, // 审批人为空时指定成员ID emptyApproverIds: [], // 审批人为空时指定成员名称 emptyApproverNames: [] }, // 审批设置 approverGroups: [ { nodeId: e(), // 审批人模式 approverType: 1, // 审批名称 approverTypeName: "上级", // 层级模式 levelMode: 1, // 控件ID(人员控件、部门控件) controlIds: [], // 控件名称(人员控件、部门控件) controlNames: [], // 人员类型 assigneeType: 1, // 选择方式 selectMode: 1, // 选择范围 selectRange: 1, // 审批人ID approverIds: [], // 审批人名称 approverNames: [] } ], // 表单权限 privileges: [], // 高级配置 // configure: {}, // 流程基础通知属性 notice: { // 通知类型 noticeType: 1, // 通知主题 noticeTitle: "", // 通知内容 noticeContext: "" }, // 操作按钮 buttons: [ { buttonName: "同意", checked: !0, disabled: !1, content: "审批节点同意该审核之操作,审批通过,可在我已办查看", buttonCode: "agree", color: "success" }, { buttonName: "拒绝", checked: !0, disabled: !1, content: "节点负责人可以拒绝该流程(拒绝后流程直接结束,标记为已拒绝)", buttonCode: "reject", color: "error" }, { buttonName: "转交", checked: !0, disabled: !1, content: "转交给他人办理,依然在当前节点", buttonCode: "turn", color: "cyan" }, { buttonName: "退回", checked: !1, disabled: !1, content: "退回给申请人,申请人修改完成后,流程按节点开始走", code: "back", color: "default" }, { buttonName: "撤回", checked: !1, disabled: !1, content: "允许申请人对未进入流程(第一个流程节点为待处理状态)的申请进行撤回", buttonCode: "revoke", color: "default" }, { buttonName: "加签", checked: !1, disabled: !1, content: "这个事情我不能完全做主,需要某些人先处理,再右我处理", buttonCode: "addSign", color: "warning" }, { buttonName: "抄送", checked: !1, disabled: !1, content: "允许审批人进行抄送", buttonCode: "copyer", color: "warning" }, { buttonName: "征询", checked: !1, disabled: !1, content: "征询他人意见", buttonCode: "consult", color: "warning" } ] }), copyerNode: () => ({ nodeId: e(), nodeName: " 抄送节点", nodeType: o.COPYER, // 流程节点状态(用于只读模式, 0:未进行 1:进行中 2:已完成) nodeStatus: -1, // 显示添加按钮 addable: !0, // 可删除 canDelete: !0, // 可删除提示 deletable: !1, // 是否激活 active: !1, // 是否可以拷贝 canCopy: !0, // 是否修改 update: !1, // 拖拽样式 dragClass: !1, // 拖拽工具 dragTool: !1, // 是否有错误 error: !1, // 显示内容 content: "", icon: "Cc", iconUrl: "https://foruda.gitee.com/images/1689560294380008819/6afe8e50_9837676.png", color1: "rgb(99, 104, 234)", color2: "rgb(99, 104, 234)", color3: "rgb(148, 152, 255)", // 抄送人设置 approverGroups: [ { nodeId: e(), // 审批人模式 approverType: 1, // 审批名称 approverTypeName: "上级", // 层级模式 levelMode: 1, // 控件ID(人员控件、部门控件) controlIds: [], // 控件名称(人员控件、部门控件) controlNames: [], // 人员类型 assigneeType: 1, // 选择方式 selectMode: 1, // 选择范围 selectRange: 1, // 审批人ID approverIds: [], // 审批人名称 approverNames: [] } ], // 表单权限 privileges: [], // 高级配置 // configure: {}, // 流程基础通知属性 notice: { // 通知类型 noticeType: 1, // 通知主题 noticeTitle: "", // 通知内容 noticeContext: "" }, // 操作按钮 buttons: [] }), routerNode: () => ({ nodeId: e(), nodeName: "路由", nodeType: o.ROUTER, // 流程节点状态(用于只读模式, 0:未进行 1:进行中 2:已完成) nodeStatus: -1, // 显示添加按钮 addable: !0, // 可删除 canDelete: !0, // 是否修改 update: !1, // 子节点 childNode: void 0, conditionNodes: [ { nodeId: e(), nodeName: "条件1", nodeType: o.BRANCH, // 流程节点状态(用于只读模式, 0:未进行 1:进行中 2:已完成) nodeStatus: -1, // 显示添加按钮 addable: !0, // 可删除 canDelete: !0, // 可删除提示 deletable: !1, // 是否激活 active: !1, // 是否可以拷贝 canCopy: !0, // 是否修改 update: !1, // 拖拽样式 dragClass: !1, // 拖拽工具 dragTool: !1, // 是否有错误 error: !1, // 显示内容 content: void 0, // 图标 icon: "Branch", iconUrl: "https://foruda.gitee.com/images/1689560302802681260/6708fb5e_9837676.png", color1: "rgb(0, 110, 248)", color2: "rgb(0, 110, 248)", color3: "rgb(105, 172, 255)", // 流程基础配置属性 attr: { // 分支类型 branchType: 1, // 优先级 priorityLevel: 1, // 显示优先级 showPriorityLevel: !0, rate: 0, // 审批人为空时指定成员ID emptyApproverIds: [], // 审批人为空时指定成员名称 emptyApproverNames: [] }, // 子节点 childNode: void 0, // 条件组 conditionGroup: [] }, { nodeId: e(), nodeName: "默认条件", nodeType: o.BRANCH, // 流程节点状态(用于只读模式, 0:未进行 1:进行中 2:已完成) nodeStatus: -1, // 显示添加按钮 addable: !0, // 可删除 canDelete: !1, // 可删除提示 deletable: !1, // 是否激活 active: !1, // 是否可以拷贝 canCopy: !0, // 是否修改 update: !1, // 拖拽样式 dragClass: !1, // 拖拽工具 dragTool: !1, // 是否有错误 error: !1, // 显示内容 content: "不满足时,进入默认条件", // 图标 icon: "Branch", iconUrl: "https://foruda.gitee.com/images/1689560302802681260/6708fb5e_9837676.png", color1: "rgb(0, 110, 248)", color2: "rgb(0, 110, 248)", color3: "rgb(105, 172, 255)", // 流程基础配置属性 attr: { // 分支类型 branchType: 1, // 优先级 priorityLevel: 1, // 显示优先级 showPriorityLevel: !0, rate: 0, // 审批人为空时指定成员ID emptyApproverIds: [], // 审批人为空时指定成员名称 emptyApproverNames: [] }, // 子节点 childNode: void 0, // 条件组 conditionGroup: [] } ] }), branchNode: (t) => ({ nodeId: e(), nodeName: `条件${t}`, nodeType: o.BRANCH, // 流程节点状态(用于只读模式, 0:未进行 1:进行中 2:已完成) nodeStatus: -1, // 显示添加按钮 addable: !0, // 可删除 canDelete: !0, // 可删除提示 deletable: !1, // 是否激活 active: !1, // 是否可以拷贝 canCopy: !1, // 是否修改 update: !1, // 是否有错误 error: !1, // 显示内容 content: void 0, // 图标 icon: "Branch", iconUrl: "https://foruda.gitee.com/images/1689560302802681260/6708fb5e_9837676.png", color1: "rgb(0, 110, 248)", color2: "rgb(0, 110, 248)", color3: "rgb(105, 172, 255)", attr: { // 显示优先级 showPriorityLevel: !0, // 优先级 priorityLevel: t, // 分支类型 branchType: 1, rate: 0, // 审批人为空时指定成员ID emptyApproverIds: [], // 审批人为空时指定成员名称 emptyApproverNames: [] }, // 子节点 childNode: void 0, // 条件组 conditionGroup: [] }), jumpNode: () => ({ nodeId: e(), nodeName: "跳转节点", nodeType: o.JUMP, // 流程节点状态(用于只读模式, 0:未进行 1:进行中 2:已完成) nodeStatus: -1, // 审批设置 approverGroups: [ { nodeId: e(), // 审批人模式 approverType: 30, // 审批名称 approverTypeName: "跳转", // 层级模式 levelMode: 1, // 控件ID(人员控件、部门控件) controlIds: null, // 控件名称(人员控件、部门控件) controlNames: null, // 人员类型 assigneeType: 1, // 选择方式 selectMode: 1, // 选择范围 selectRange: 1, // 审批人ID approverIds: [], // 审批人名称 approverNames: [] } ], // 拖拽样式 dragClass: !1, // 拖拽工具 dragTool: !1, // 表单权限 privileges: [], // 高级配置 // configure: {}, // 子节点 childNode: void 0, // 显示添加按钮 addable: !0, // 可删除 canDelete: !0, // 可删除提示 deletable: !1, // 是否修改 update: !1, // 是否有错误 error: !1, // 显示内容 content: void 0, // 图标 icon: "Jump", iconUrl: "https://foruda.gitee.com/images/1689560302802681260/6708fb5e_9837676.png", color1: "rgb(202 91 221)", color2: "rgb(202 91 221)", color3: "rgb(231 76 233)" }), noticeNode: () => ({ nodeId: e(), nodeName: "通知", nodeType: 5, // 流程节点状态(用于只读模式, 0:未进行 1:进行中 2:已完成) nodeStatus: -1, // 子节点 childNode: void 0, // 流程基础通知属性 notice: { // 通知类型 noticeType: 1, // 通知主题 noticeTitle: "", // 通知内容 noticeContext: "" }, // 审批设置 approverGroups: [ { nodeId: e(), // 审批人模式 approverType: 1, // 审批名称 approverTypeName: "上级", // 层级模式 levelMode: 1, // 控件ID(人员控件、部门控件) controlIds: null, // 控件名称(人员控件、部门控件) controlNames: null, // 人员类型 assigneeType: 1, // 选择方式 selectMode: 1, // 选择范围 selectRange: 1, // 审批人ID approverIds: [], // 审批人名称 approverNames: [] } ], // 显示添加按钮 addable: !0, // 可删除 canDelete: !0, // 可删除提示 deletable: !1, // 是否修改 update: !1, // 是否有错误 error: !1, // 图标 icon: "Notice", iconUrl: "https://foruda.gitee.com/images/1689560302802681260/6708fb5e_9837676.png", color1: "#498ff2", color2: "#498ff2", color3: "#6da4f2" }), suggestNode: () => { const t = e(); return { nodeId: t, nodeName: "意见分支", nodeType: o.SUGGEST, // 流程节点状态(用于只读模式, 0:未进行 1:进行中 2:已完成) nodeStatus: -1, // 子节点 childNode: void 0, // 显示添加按钮 addable: !0, // 可删除 canDelete: !0, // 是否修改 update: !1, // 是否有错误 error: !1, conditionNodes: [ { nodeId: e(), nodePid: t, nodeName: "同意", nodeType: o.SUGGEST_BRANCH, // 流程基础配置属性 attr: { // 优先级 priorityLevel: 2, // 分支类型 branchType: 2, rate: 0, // 审批人ID emptyApproverIds: [], // 审批人名称 emptyApproverNames: [] }, // 流程节点状态(用于只读模式, 0:未进行 1:进行中 2:已完成) nodeStatus: -1, // 子节点 childNode: void 0, // 显示添加按钮 addable: !0, // 可删除 canDelete: !0, // 可删除提示 deletable: !1, // 是否修改 update: !1, // 表示同意 suggest: 1, // 是否有错误 error: !1, content: "意见为同意", // 图标 icon: "Suggest", color1: "rgb(14 233 83)", color2: "rgb(14 233 83)", color3: "rgb(14 233 83)" // 14 233 83 73 242 126 }, { nodeId: e(), nodePid: t, nodeName: "不同意", nodeType: o.SUGGEST_BRANCH, // 流程基础配置属性 attr: { // 优先级 priorityLevel: 2, // 分支类型 branchType: 2, rate: 0, // 审批人ID emptyApproverIds: [], // 审批人名称 emptyApproverNames: [] }, // 流程节点状态(用于只读模式, 0:未进行 1:进行中 2:已完成) nodeStatus: -1, // 子节点 childNode: void 0, // 显示添加按钮 addable: !0, // 可删除 canDelete: !0, // 可删除提示 deletable: !1, // 是否修改 update: !1, // 表示不同意 suggest: 1, // 是否有错误 error: !1, content: "意见为不同意", // 图标 icon: "Cancel", color1: "rgb(242 73 79)", color2: "rgb(242 73 79)", color3: "rgb(242 73 79)" } ] }; }, parallelNode: () => { const t = e(); return { nodeId: t, nodeName: "并行", nodeType: o.PARALLEL, // 流程节点状态(用于只读模式, 0:未进行 1:进行中 2:已完成) nodeStatus: -1, // 显示添加按钮 addable: !0, // 可删除 canDelete: !0, // 是否修改 update: !1, // 聚合节点 childNode: { nodeId: e(), nodePid: t, nodeName: "聚合", nodeType: o.POLYMERIZE, nodeStatus: -1, childNode: void 0, // 显示添加按钮 addable: !0, // 可删除 canDelete: !1, // 可删除提示 deletable: !1, // 是否修改 update: !1, content: "并行节点将在此聚合", // 图标 icon: "Aggregate", color1: "rgb(12, 206, 164)", color2: "rgb(12, 206, 163)", color3: "rgb(178, 249, 209)" }, conditionNodes: [ { nodeId: e(), nodePid: t, nodeName: "并行1", nodeType: o.PARALLEL_BRANCH, // 流程节点状态(用于只读模式, 0:未进行 1:进行中 2:已完成) nodeStatus: -1, // 是否有错误 error: !1, // 显示内容 content: "任意(其他)", // 子节点 childNode: void 0, // 显示添加按钮 addable: !0, // 可删除 canDelete: !0, // 可删除提示 deletable: !1, // 是否修改 update: !1, // 流程基础配置属性 attr: { // 分支类型 branchType: 3, rate: 0, // 审批人ID emptyApproverIds: [], // 审批人名称 emptyApproverNames: [] }, // 条件组 conditionGroup: [], // 图标 icon: "Parallel", color1: "rgb(12, 206, 164)", color2: "rgb(12, 206, 163)", color3: "rgb(178, 249, 209)" }, { nodeId: e(), nodePid: t, nodeName: "并行2", nodeType: o.PARALLEL_BRANCH, // 流程节点状态(用于只读模式, 0:未进行 1:进行中 2:已完成) nodeStatus: -1, // 是否有错误 error: !1, // 显示内容 content: "任意(其他)", // 子节点 childNode: void 0, // 显示添加按钮 addable: !0, // 可删除 canDelete: !0, // 可删除提示 deletable: !1, // 是否修改 update: !1, // 流程基础配置属性 attr: { // 分支类型 branchType: 3, rate: 0, // 审批人ID emptyApproverIds: [], // 审批人名称 emptyApproverNames: [] }, // 条件组 conditionGroup: [], // 图标 icon: "Parallel", color1: "rgb(12, 206, 164)", color2: "rgb(12, 206, 163)", color3: "rgb(178, 249, 209)" } ] }; }, subFlowNode: () => ({ nodeId: e(), nodeName: "子流程节点", nodeType: o.SUB_FLOW, // 流程节点状态(用于只读模式, 0:未进行 1:进行中 2:已完成) nodeStatus: -1, // 显示添加按钮 addable: !0, // 可删除 canDelete: !0, // 可删除提示 deletable: !1, // 是否激活 active: !1, // 是否可以拷贝 canCopy: !0, // 是否修改 update: !1, // 拖拽样式 dragClass: !1, // 拖拽工具 dragTool: !1, // 是否有错误 error: !1, // 显示内容 content: "", // 图标 icon: "Subflow", iconUrl: "https://foruda.gitee.com/images/1689560287614227699/34dc2d66_9837676.png", // color1: 'rgb(99, 104, 234)', // color2: 'rgb(99, 104, 234)', // color3: 'rgb(148, 152, 255)' color1: "rgb(154,164,119)", color2: "rgb(181,189,153)", color3: "rgb(210,215,191)", // 子流程数据映射配置 childToParentFields: [], parentToChildFields: [], // 流程基础配置属性 attr: { // 子流程 parentModelId: null, parentModelName: null }, // 审批设置 approverGroups: [ { nodeId: e(), // 审批人模式 approverType: 8, // 审批名称 approverTypeName: "指定成员", // 层级模式 levelMode: 1, // 控件ID(人员控件、部门控件) controlIds: [], // 控件名称(人员控件、部门控件) controlNames: [], // 人员类型 assigneeType: 1, // 选择方式 selectMode: 1, // 选择范围 selectRange: 1, // 审批人ID approverIds: [], // 审批人名称 approverNames: [] } ] }) }; }; export { N as default };