diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes-config/start-user-node-config.vue b/apps/web-antd/src/components/simple-process-design/components/nodes-config/start-user-node-config.vue new file mode 100644 index 00000000..80b7b3a1 --- /dev/null +++ b/apps/web-antd/src/components/simple-process-design/components/nodes-config/start-user-node-config.vue @@ -0,0 +1,284 @@ + + + diff --git a/apps/web-antd/src/components/simple-process-design/components/nodes/start-user-node.vue b/apps/web-antd/src/components/simple-process-design/components/nodes/start-user-node.vue index 748acef3..2edb1093 100644 --- a/apps/web-antd/src/components/simple-process-design/components/nodes/start-user-node.vue +++ b/apps/web-antd/src/components/simple-process-design/components/nodes/start-user-node.vue @@ -11,6 +11,7 @@ import { Input } from 'ant-design-vue'; import { NODE_DEFAULT_TEXT, NodeType } from '../../consts'; import { useNodeName2, useTaskStatusClass, useWatchNode } from '../../helpers'; +import StartUserNodeConfig from '../nodes-config/start-user-node-config.vue'; import NodeHandler from './node-handler.vue'; defineOptions({ name: 'StartUserNode' }); @@ -55,8 +56,7 @@ const nodeClick = () => { 'TODO 编辑模式,打开节点配置、把当前节点传递给配置组件', nodeSetting.value, ); - // nodeSetting.value.showStartUserNodeConfig(currentNode.value); - // nodeSetting.value.openDrawer(); + nodeSetting.value.showStartUserNodeConfig(currentNode.value); } }; @@ -108,12 +108,12 @@ const nodeClick = () => { /> - + /> diff --git a/apps/web-antd/src/components/simple-process-design/components/simple-process-designer.vue b/apps/web-antd/src/components/simple-process-design/components/simple-process-designer.vue index f817963c..7f2762ca 100644 --- a/apps/web-antd/src/components/simple-process-design/components/simple-process-designer.vue +++ b/apps/web-antd/src/components/simple-process-design/components/simple-process-designer.vue @@ -3,21 +3,19 @@ import type { Ref } from 'vue'; import type { SimpleFlowNode } from '../consts'; -import type { BpmFormApi } from '#/api/bpm/form'; import type { BpmUserGroupApi } from '#/api/bpm/userGroup'; import type { SystemDeptApi } from '#/api/system/dept'; import type { SystemPostApi } from '#/api/system/post'; import type { SystemRoleApi } from '#/api/system/role'; import type { SystemUserApi } from '#/api/system/user'; -import { inject, onMounted, provide, ref } from 'vue'; +import { inject, onMounted, provide, ref, watch } from 'vue'; import { handleTree } from '@vben/utils'; import { Button, Modal } from 'ant-design-vue'; import { getFormDetail } from '#/api/bpm/form'; -import { getModel } from '#/api/bpm/model'; import { getUserGroupSimpleList } from '#/api/bpm/userGroup'; import { getSimpleDeptList } from '#/api/system/dept'; import { getSimplePostList } from '#/api/system/post'; @@ -33,21 +31,23 @@ defineOptions({ }); const props = defineProps({ - modelId: { - type: String, - required: false, - default: undefined, - }, - modelKey: { - type: String, - required: false, - default: undefined, - }, modelName: { type: String, required: false, default: undefined, }, + // 流程表单 ID + modelFormId: { + type: Number, + required: false, + default: undefined, + }, + // 表单类型 + modelFormType: { + type: Number, + required: false, + default: BpmModelFormType.NORMAL, + }, // 可发起流程的人员编号 startUserIds: { type: Array, @@ -66,7 +66,31 @@ const emits = defineEmits(['success']); const processData = inject('processData') as Ref; const loading = ref(false); const formFields = ref([]); -const formType = ref(20); +const formType = ref(props.modelFormType); + +// 监听 modelFormType 变化 +watch( + () => props.modelFormType, + (newVal) => { + formType.value = newVal; + }, +); + +// 监听 modelFormId 变化 +watch( + () => props.modelFormId, + async (newVal) => { + if (newVal) { + const form = await getFormDetail(newVal); + formFields.value = form?.fields; + } else { + // 如果 modelFormId 为空,清空表单字段 + formFields.value = []; + } + }, + { immediate: true }, +); + const roleOptions = ref([]); // 角色列表 const postOptions = ref([]); // 岗位列表 const userOptions = ref([]); // 用户列表 @@ -172,19 +196,6 @@ const validateNode = ( onMounted(async () => { try { loading.value = true; - // 获取表单字段 - if (props.modelId) { - const bpmnModel = await getModel(props.modelId); - if (bpmnModel) { - formType.value = bpmnModel.formType; - if (formType.value === BpmModelFormType.NORMAL && bpmnModel.formId) { - const bpmnForm = (await getFormDetail( - bpmnModel.formId, - )) as unknown as BpmFormApi.FormVO; - formFields.value = bpmnForm?.fields; - } - } - } // 获得角色列表 roleOptions.value = await getSimpleRoleList(); // 获得岗位列表 diff --git a/apps/web-antd/src/components/simple-process-design/components/simple-process-model.vue b/apps/web-antd/src/components/simple-process-design/components/simple-process-model.vue index 2495a68f..cfd2e6a8 100644 --- a/apps/web-antd/src/components/simple-process-design/components/simple-process-model.vue +++ b/apps/web-antd/src/components/simple-process-design/components/simple-process-model.vue @@ -198,8 +198,8 @@ onMounted(() => { }); - + diff --git a/apps/web-antd/src/components/simple-process-design/styles/simple-process-designer.scss b/apps/web-antd/src/components/simple-process-design/styles/simple-process-designer.scss index 817e7a76..dbda6573 100644 --- a/apps/web-antd/src/components/simple-process-design/styles/simple-process-designer.scss +++ b/apps/web-antd/src/components/simple-process-design/styles/simple-process-designer.scss @@ -209,8 +209,8 @@ .simple-process-model-container { width: 100%; height: 100%; + padding-top: 32px; overflow-x: auto; - background: url('./svg/simple-process-bg.svg') 0 0 repeat; background-color: #fafafa; .simple-process-model { @@ -219,6 +219,7 @@ align-items: center; justify-content: center; min-width: fit-content; + background: url('./svg/simple-process-bg.svg') 0 0 repeat; transform: scale(1); transform-origin: 50% 0 0; transition: transform 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); diff --git a/apps/web-antd/src/views/bpm/model/form/modules/process-design.vue b/apps/web-antd/src/views/bpm/model/form/modules/process-design.vue index 10f99f8d..f9fb0754 100644 --- a/apps/web-antd/src/views/bpm/model/form/modules/process-design.vue +++ b/apps/web-antd/src/views/bpm/model/form/modules/process-design.vue @@ -55,9 +55,9 @@ defineExpose({