fix: [BPM 工作流] 问题修复

apps/web-antd/src/views/bpm/processInstance/detail/modules/time-line.vue

@@ -5,6 +5,7 @@ import type { BpmProcessInstanceApi } from '#/api/bpm/processInstance';
 import { ref } from 'vue';
 import { useRouter } from 'vue-router';
 
+import { useVbenModal } from '@vben/common-ui';
 import { IconifyIcon } from '@vben/icons';
 import { formatDateTime, isEmpty } from '@vben/utils';
 
@@ -102,7 +103,7 @@ const nodeTypeSvgMap = {
     color: '#14bb83',
     icon: 'icon-park-outline:tree-diagram',
   },
-};
+} as Record<BpmNodeTypeEnum, { color: string; icon: string }>;
 
 // 只有状态是 -1、0、1 才展示头像右小角状态小icon
 const onlyStatusIconShow = [-1, 0, 1];
@@ -150,21 +151,27 @@ function getApprovalNodeTime(node: BpmProcessInstanceApi.ApprovalNodeInfo) {
 }
 
 // 选择自定义审批人
-const userSelectFormRef = ref();
+const [UserSelectModalComp, userSelectModalApi] = useVbenModal({
+  connectedComponent: UserSelectModal,
+  destroyOnClose: true,
+});
 const selectedActivityNodeId = ref<string>();
 const customApproveUsers = ref<Record<string, any[]>>({}); // key：activityId，value：用户列表
 
 // 打开选择用户弹窗
 const handleSelectUser = (activityId: string, selectedList: any[]) => {
   selectedActivityNodeId.value = activityId;
-  userSelectFormRef.value.open(
-    selectedList?.length ? selectedList.map((item) => item.id) : [],
-  );
+  userSelectModalApi
+    .setData({ userIds: selectedList.map((item) => item.id) })
+    .open();
 };
 
 // 选择用户完成
 const selectedUsers = ref<number[]>([]);
 function handleUserSelectConfirm(userList: any[]) {
+  if (!selectedActivityNodeId.value) {
+    return;
+  }
   customApproveUsers.value[selectedActivityNodeId.value] = userList || [];
 
   emit('selectUserConfirm', selectedActivityNodeId.value, userList);
@@ -289,8 +296,12 @@ function handleUserSelectCancel() {
                 type="primary"
                 size="middle"
                 ghost
+                class="flex items-center justify-center"
                 @click="
-                  handleSelectUser(activity.id, customApproveUsers[activity.id])
+                  handleSelectUser(
+                    activity.id,
+                    customApproveUsers[activity.id] ?? [],
+                  )
                 "
               >
                 <template #icon>
@@ -445,8 +456,7 @@ function handleUserSelectCancel() {
     </Timeline>
 
     <!-- 用户选择弹窗 -->
-    <UserSelectModal
-      ref="userSelectFormRef"
+    <UserSelectModalComp
       v-model:value="selectedUsers"
       :multiple="true"
       title="选择用户"