fix(工作台): 修复工作台系统卡片人员bug

frontend/src/views/workbench/homePage/components/defectMemberBar.vue

@@ -29,8 +29,7 @@
             :prefix="t('workbench.homePage.staff')"
             :multiple="true"
             :has-all-select="true"
-            :default-all-select="innerHandleUsers.length === 0"
+            @popup-visible-change="popupVisibleChange"
-            @change="changeMember"
           >
           </MsSelect>
         </div>
@@ -60,7 +59,6 @@
   import type { OverViewOfProject, SelectedCardItem, TimeFormParams } from '@/models/workbench/homePage';
 
   import { getColorScheme, getCommonBarOptions, handleNoDataDisplay } from '../utils';
-  import type { SelectOptionData } from '@arco-design/web-vue';
 
   const { t } = useI18n();
   const appStore = useAppStore();
@@ -92,7 +90,7 @@
     })
   );
 
-  const memberOptions = ref<SelectOptionData[]>([]);
+  const memberOptions = ref<{ label: string; value: string }[]>([]);
 
   const options = ref<Record<string, any>>({});
 
@@ -178,23 +176,29 @@
       label: e.text,
       value: e.value,
     }));
-    innerHandleUsers.value = innerHandleUsers.value.filter((id: string) =>
+    innerHandleUsers.value = memberOptions.value.map((e) => e.value);
-      memberOptions.value.some((member) => member.value === id)
-    );
   }
 
-  function changeProject() {
+  async function handleProjectChange(isRefreshKey: boolean = false) {
-    innerHandleUsers.value = [];
+    await nextTick();
-    nextTick(() => {
+    if (!isRefreshKey) {
-      emit('change');
+      await getMemberOptions();
-    });
+    }
+    await getDefectMemberDetail();
   }
 
-  function changeMember() {
+  async function changeProject() {
-    nextTick(() => {
+    await handleProjectChange(false);
-      getDefectMemberDetail();
+    emit('change');
-      emit('change');
+  }
-    });
+
+  function popupVisibleChange(val: boolean) {
+    if (!val) {
+      nextTick(() => {
+        getDefectMemberDetail();
+        emit('change');
+      });
+    }
   }
 
   watch(
@@ -230,15 +234,12 @@
     }
   );
 
-  watch([() => props.refreshKey, () => projectId.value], async () => {
+  watch([() => props.refreshKey, () => projectId.value], ([refreshKey]) => {
-    await nextTick();
+    handleProjectChange(!!refreshKey);
-    getMemberOptions();
-    getDefectMemberDetail();
   });
 
   onMounted(() => {
-    getMemberOptions();
+    handleProjectChange(false);
-    getDefectMemberDetail();
   });
 </script>
 

frontend/src/views/workbench/homePage/components/overview.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="card-wrapper">
     <CardSkeleton v-if="showSkeleton" :show-skeleton="showSkeleton" />
-    <div v-show="!showSkeleton">
+    <div v-else>
       <div class="flex items-center justify-between">
         <a-tooltip :content="t(props.item.label)" position="tl">
           <div class="title one-line-text"> {{ t(props.item.label) }} </div>
@@ -21,7 +21,7 @@
             :has-all-select="true"
             :default-all-select="props.item.selectAll"
             :at-least-one="true"
-            @change="changeProject"
+            @popup-visible-change="popupVisibleChange"
           >
           </MsSelect>
         </div>
@@ -152,7 +152,7 @@
         projectIds: innerProjectIds.value,
         organizationId: appStore.currentOrgId,
         handleUsers: [],
-        selectAll: selectAll.value,
+        selectAll: innerSelectAll.value,
       };
       let detail;
       if (props.item.key === WorkCardEnum.PROJECT_VIEW) {
@@ -170,17 +170,33 @@
       showSkeleton.value = false;
     }
   }
-  const isInit = ref(true);
+
-  function changeProject() {
+  function handleProjectChange(shouldEmit = false) {
-    if (isInit.value) return;
+    // 项目切换逻辑
     nextTick(() => {
       innerSelectAll.value = selectAll.value;
-      emit('change');
+      initOverViewDetail();
+      if (shouldEmit) emit('change');
     });
   }
 
+  function popupVisibleChange(val: boolean) {
+    if (!val) {
+      handleProjectChange(true);
+    }
+  }
+
+  async function handleRefreshKeyChange() {
+    await nextTick(() => {
+      innerProjectIds.value = [...props.item.projectIds];
+      innerSelectAll.value = props.item.selectAll;
+    });
+    setTimeout(() => {
+      initOverViewDetail();
+    }, 0);
+  }
+
   onMounted(() => {
-    isInit.value = false;
     initOverViewDetail();
   });
 
@@ -191,15 +207,10 @@
         initOverViewDetail();
       }
     },
-    {
+    { deep: true }
-      deep: true,
-    }
   );
 
-  watch([() => props.refreshKey, () => innerProjectIds.value], async () => {
+  watch(() => props.refreshKey, handleRefreshKeyChange);
-    await nextTick();
-    initOverViewDetail();
-  });
 </script>
 
 <style scoped lang="less">

frontend/src/views/workbench/homePage/components/overviewMember.vue

@@ -16,6 +16,7 @@
             :search-keys="['name']"
             class="!w-[200px]"
             :prefix="t('workbench.homePage.project')"
+            @change="changeProject"
           >
           </MsSelect>
 
@@ -24,6 +25,7 @@
             :options="memberOptions"
             allow-search
             allow-clear
+            :placeholder="t('ms.case.associate.allData')"
             value-key="value"
             label-key="label"
             :search-keys="['label']"
@@ -31,8 +33,7 @@
             :prefix="t('workbench.homePage.staff')"
             :multiple="true"
             :has-all-select="true"
-            :default-all-select="innerHandleUsers.length === 0"
+            @popup-visible-change="popupVisibleChange"
-            @change="changeMember"
           >
           </MsSelect>
         </div>
@@ -58,7 +59,7 @@
   import { workMemberViewDetail, workProjectMemberOptions } from '@/api/modules/workbench';
   import { useI18n } from '@/hooks/useI18n';
   import useAppStore from '@/store/modules/app';
-  import { characterLimit, sleep } from '@/utils';
+  import { characterLimit } from '@/utils';
 
   import type { OverViewOfProject, SelectedCardItem, TimeFormParams } from '@/models/workbench/homePage';
 
@@ -145,18 +146,29 @@
       label: e.name,
       value: e.id,
     }));
-    innerHandleUsers.value = innerHandleUsers.value.filter((id: string) =>
+    innerHandleUsers.value = memberOptions.value.map((e) => e.value);
-      memberOptions.value.some((member) => member.value === id)
-    );
   }
-  const isInit = ref(true);
 
-  function changeMember(value: string[]) {
+  async function handleProjectChange(isRefreshKey: boolean = false) {
-    nextTick(() => {
+    await nextTick();
-      initOverViewMemberDetail();
+    if (!isRefreshKey) {
-      innerHandleUsers.value = value;
+      await getMemberOptions();
-      emit('change');
+    }
-    });
+    await initOverViewMemberDetail();
+  }
+
+  async function changeProject() {
+    await handleProjectChange(false);
+    emit('change');
+  }
+
+  function popupVisibleChange(val: boolean) {
+    if (!val) {
+      nextTick(() => {
+        initOverViewMemberDetail();
+        emit('change');
+      });
+    }
   }
 
   watch(
@@ -192,28 +204,12 @@
     }
   );
 
-  onMounted(() => {
+  watch([() => props.refreshKey, () => projectId.value], ([refreshKey]) => {
-    isInit.value = false;
+    handleProjectChange(!!refreshKey);
-    if (props.item.projectIds.length) {
-      getMemberOptions();
-    }
-    initOverViewMemberDetail();
   });
 
-  watch([() => props.refreshKey, () => projectId.value], async ([_key, newProjectId]) => {
+  onMounted(() => {
-    await nextTick();
+    handleProjectChange(false);
-
-    if (newProjectId) {
-      innerHandleUsers.value = [];
-      emit('change');
-    }
-
-    if (props.item.projectIds.length) {
-      getMemberOptions();
-    }
-    await sleep(50);
-
-    initOverViewMemberDetail();
   });
 </script>
 

frontend/src/views/workbench/homePage/index.vue

@@ -317,7 +317,7 @@
 
   // 刷新
   async function handleRefresh() {
-    initDefaultList();
+    await initDefaultList();
     refreshKey.value = Date.now();
   }