chore: 弹窗关闭后仍然显示表单浮层

apps/web-antd/src/views/workflow/components/copy-component.vue

@@ -22,7 +22,7 @@ const props = withDefaults(defineProps<{ ellipseNumber?: number }>(), {
   ellipseNumber: 3,
 });
 
-const emit = defineEmits<{ finish: [User[]] }>();
+const emit = defineEmits<{ cancel: []; finish: [User[]] }>();
 
 const [UserSelectModal, modalApi] = useVbenModal({
   connectedComponent: userSelectModal,
@@ -80,6 +80,6 @@ const displayedList = computed(() => {
       </Tooltip>
     </AvatarGroup>
     <a-button size="small" @click="handleOpen">选择人员</a-button>
-    <UserSelectModal @finish="handleFinish" />
+    <UserSelectModal @cancel="$emit('cancel')" @finish="handleFinish" />
   </div>
 </template>

apps/web-antd/src/views/workflow/components/user-select-modal.vue

@@ -20,6 +20,13 @@ const props = withDefaults(defineProps<{ mode?: 'multiple' | 'single' }>(), {
 });
 
 const emit = defineEmits<{
+  /**
+   * 取消的事件
+   */
+  cancel: [];
+  /**
+   * 选择完成的事件
+   */
   finish: [User[]];
 }>();
 
@@ -27,6 +34,7 @@ const [BasicModal, modalApi] = useVbenModal({
   title: '选择人员',
   class: 'w-[1050px]',
   fullscreenButton: false,
+  onClosed: () => emit('cancel'),
   onConfirm: handleSubmit,
   async onOpened() {
     const { userList = [] } = modalApi.getData() as { userList: User[] };

apps/web-antd/src/views/workflow/task/taskWaiting.vue

@@ -187,8 +187,10 @@ function handleFinish(userList: User[]) {
                   @finish="() => reload(false)"
                 >
                   <FormItem label="申请人">
+                    <!-- 弹窗关闭后仍然显示表单浮层 -->
                     <CopyComponent
                       v-model:user-list="selectedUserList"
+                      @cancel="() => (popoverOpen = true)"
                       @finish="handleFinish"
                     />
                   </FormItem>