fix(用例管理): 修改用例详情bug

frontend/src/views/case-management/caseManagementFeature/components/caseDetailDrawer.vue

@@ -122,40 +122,23 @@
                 </a-menu>
               </div>
               <div class="leftContent mt-4 px-4">
-                <template v-if="activeTab === 'detail'">
+                <TabDetail
-                  <TabDetail
+                  v-if="activeTab === 'detail'"
-                    ref="tabDetailRef"
+                  ref="tabDetailRef"
-                    :form="detailInfo"
+                  :form="detailInfo"
-                    :allow-edit="true"
+                  :allow-edit="true"
-                    :form-rules="formItem"
+                  :form-rules="formItem"
-                    :active-tab="activeTab"
+                  :active-tab="activeTab"
-                    @update-success="updateSuccess"
+                  @update-success="updateSuccess"
-                  />
+                />
-                </template>
+                <TabCaseTable v-show="activeTab === 'case'" :case-id="props.detailId" />
-                <template v-if="activeTab === 'requirement'">
+                <TabDemand v-show="activeTab === 'requirement'" :case-id="props.detailId" />
-                  <TabDemand :active-tab="activeTab" :case-id="props.detailId" />
+                <TabDefect v-show="activeTab === 'bug'" :case-id="props.detailId" />
-                </template>
+                <TabDependency v-show="activeTab === 'dependency'" :case-id="props.detailId" />
-                <template v-if="activeTab === 'case'">
+                <TabCaseReview v-show="activeTab === 'caseReview'" :case-id="props.detailId" />
-                  <TabCaseTable :active-tab="activeTab" :case-id="props.detailId" />
+                <TabTestPlan v-show="activeTab === 'testPlan'" :active-tab="activeTab" />
-                </template>
+                <TabComment v-if="activeTab === 'comments'" ref="commentRef" :case-id="props.detailId" />
-                <template v-if="activeTab === 'bug'">
+                <TabChangeHistory v-show="activeTab === 'changeHistory'" :case-id="props.detailId" />
-                  <TabDefect :active-tab="activeTab" :case-id="props.detailId" />
-                </template>
-                <template v-if="activeTab === 'dependency'">
-                  <TabDependency :active-tab="activeTab" :case-id="props.detailId" />
-                </template>
-                <template v-if="activeTab === 'caseReview'">
-                  <TabCaseReview :active-tab="activeTab" :case-id="props.detailId" />
-                </template>
-                <template v-if="activeTab === 'testPlan'">
-                  <TabTestPlan :active-tab="activeTab" />
-                </template>
-                <template v-if="activeTab === 'comments'">
-                  <TabComment ref="commentRef" :active-tab="activeTab" :case-id="props.detailId" />
-                </template>
-                <template v-if="activeTab === 'changeHistory'">
-                  <TabChangeHistory :active-tab="activeTab" :case-id="props.detailId" />
-                </template>
               </div>
             </div>
           </template>
@@ -205,7 +188,7 @@
                 <span>{{ dayjs(detailInfo?.createTime).format('YYYY-MM-DD HH:mm:ss') }}</span>
               </div>
               <div class="baseItem">
-                <span class="label"> {{ t('caseManagement.featureCase.tableColumnCreateTime') }}</span>
+                <span class="label"> {{ t('caseManagement.featureCase.tableColumnTag') }}</span>
                 <span>
                   <MsTag v-for="item of detailInfo.tags" :key="item"> {{ item }} </MsTag>
                 </span>
@@ -564,6 +547,7 @@
       if (val) {
         showDrawerVisible.value = val;
         activeTab.value = 'detail';
+        featureCaseStore.setActiveTab(activeTab.value);
       }
     }
   );
@@ -625,10 +609,9 @@
       }
     }
   );
-  provide('activeTab', activeTab.value);
 
   onMounted(() => {
-    settingDrawerRef.value.getTabModule();
+    // settingDrawerRef.value.getTabModule();
   });
 </script>
 

frontend/src/views/case-management/caseManagementFeature/components/caseTable.vue

@@ -48,7 +48,19 @@
       <span type="text" class="px-0">{{ record.updateUserName || '-' }}</span>
     </template>
     <template #caseLevel="{ record }">
-      <caseLevel :case-level="getCaseLevels(record.customFields)" />
+      <a-select
+        v-model:model-value="record.caseLevel"
+        :placeholder="t('common.pleaseSelect')"
+        class="param-input w-full"
+        @change="() => handleStatusChange(record)"
+      >
+        <template #label>
+          <span class="text-[var(--color-text-2)]"> <caseLevel :case-level="record.caseLevel" /></span>
+        </template>
+        <a-option v-for="item of caseLevelList" :key="item.value" :value="item.value">
+          <caseLevel :case-level="item.value" />
+        </a-option>
+      </a-select>
     </template>
     <template #caseLevelFilter="{ columnConfig }">
       <TableFilter
@@ -815,6 +827,7 @@
         }),
         visible: false,
         showModuleTree: false,
+        caseLevel: getCaseLevels(record.customFields),
       };
     },
     updateCaseName
@@ -1321,6 +1334,38 @@
     };
     initData();
   };
+  // 更新用例等级
+  async function handleStatusChange(record: any) {
+    try {
+      const detailResult = await getCaseDetail(record.id);
+      const { customFields } = detailResult;
+      const customFieldsList = customFields.map((item: any) => {
+        if (item.internal && item.fieldName === '用例等级') {
+          return {
+            fieldId: item.fieldId,
+            value: record.caseLevel,
+          };
+        }
+        return {
+          fieldId: item.fieldId,
+          value: Array.isArray(item.defaultValue) ? JSON.stringify(item.defaultValue) : item.defaultValue,
+        };
+      });
+      const params = {
+        request: {
+          ...detailResult,
+          customFields: customFieldsList,
+        },
+        fileList: [],
+      };
+      await updateCaseRequest(params);
+      initData();
+      Message.success(t('common.updateSuccess'));
+    } catch (error) {
+      // eslint-disable-next-line no-console
+      console.log(error);
+    }
+  }
 
   // 拖拽排序
   async function changeHandler(data: TableData[], extra: TableChangeExtra, currentData: TableData[]) {
@@ -1475,4 +1520,18 @@
       color: var(--color-text-2);
     }
   }
+  :deep(.param-input:not(.arco-input-focus, .arco-select-view-focus)) {
+    &:not(:hover) {
+      border-color: transparent !important;
+      .arco-input::placeholder {
+        @apply invisible;
+      }
+      .arco-select-view-icon {
+        @apply invisible;
+      }
+      .arco-select-view-value {
+        color: var(--color-text-brand);
+      }
+    }
+  }
 </style>

frontend/src/views/case-management/caseManagementFeature/components/tabContent/tabBug/tabDefect.vue

@@ -128,9 +128,8 @@
 
   const props = defineProps<{
     caseId: string;
-    activeTab: string;
   }>();
-
+  const activeTab = computed(() => featureCaseStore.activeTab);
   const showType = ref('link');
 
   const keyword = ref<string>('');
@@ -323,9 +322,18 @@
     }
   );
 
-  onMounted(() => {
+  watch(
-    getFetch();
+    () => activeTab.value,
-  });
+    (val) => {
+      if (val === 'bug') {
+        getFetch();
+      }
+    }
+  );
+
+  // onMounted(() => {
+  //   getFetch();
+  // });
 </script>
 
 <style scoped></style>

frontend/src/views/case-management/caseManagementFeature/components/tabContent/tabCase/tabCaseTable.vue

@@ -97,11 +97,6 @@
   const { t } = useI18n();
 
   const currentProjectId = computed(() => appStore.currentProjectId);
-  const activeTab = inject<string>('activeTab');
-  const newActive = computed(() => {
-    return activeTab;
-  });
-  console.log(newActive.value);
   const props = defineProps<{
     caseId: string; // 用例id
   }>();
@@ -276,11 +271,22 @@
     setKeyword(keyword.value);
     await loadList();
   }
+  const activeTab = computed(() => featureCaseStore.activeTab);
 
-  onMounted(async () => {
+  watch(
-    getEnabledModules();
+    () => activeTab.value,
-    getFetch();
+    (val) => {
-  });
+      if (val === 'case') {
+        getEnabledModules();
+        getFetch();
+      }
+    }
+  );
+
+  // onMounted(async () => {
+  //   getEnabledModules();
+  //   getFetch();
+  // });
 </script>
 
 <style scoped></style>

frontend/src/views/case-management/caseManagementFeature/components/tabContent/tabCaseReview.vue

@@ -48,11 +48,11 @@
   import debounce from 'lodash-es/debounce';
 
   const featureCaseStore = useFeatureCaseStore();
+  const activeTab = computed(() => featureCaseStore.activeTab);
   const { t } = useI18n();
 
   const props = defineProps<{
     caseId: string; // 用例id
-    activeTab: string;
   }>();
 
   const keyword = ref<string>('');
@@ -114,9 +114,18 @@
     initData();
   }, 100);
 
-  onMounted(() => {
+  watch(
-    initData();
+    () => activeTab.value,
-  });
+    (val) => {
+      if (val === 'caseReview') {
+        initData();
+      }
+    }
+  );
+
+  // onMounted(() => {
+  //   initData();
+  // });
 </script>
 
 <style scoped></style>

frontend/src/views/case-management/caseManagementFeature/components/tabContent/tabChangeHistory.vue

@@ -95,13 +95,13 @@
 
   const appStore = useAppStore();
   const featureCaseStore = useFeatureCaseStore();
+  const activeTab = computed(() => featureCaseStore.activeTab);
   const visitedKey = 'notRemindChangeHistoryTip';
   const { addVisited } = useVisit(visitedKey);
   const { getIsVisited } = useVisit(visitedKey);
 
   const props = defineProps<{
     caseId: string;
-    activeTab: string;
   }>();
 
   const columns: MsTableColumn = [
@@ -247,10 +247,20 @@
     featureCaseStore.getCaseCounts(props.caseId);
   }
 
-  onMounted(() => {
+  watch(
-    doCheckIsTip();
+    () => activeTab.value,
-    initData();
+    (val) => {
-  });
+      if (val === 'changeHistory') {
+        doCheckIsTip();
+        initData();
+      }
+    }
+  );
+
+  // onMounted(() => {
+  //   doCheckIsTip();
+  //   initData();
+  // });
 </script>
 
 <style scoped></style>

frontend/src/views/case-management/caseManagementFeature/components/tabContent/tabComment/tabCommentIndex.vue

@@ -33,7 +33,7 @@
   import { ref } from 'vue';
   import { Message } from '@arco-design/web-vue';
 
-  import MsComment from '@/components/business/ms-comment/comment';
+  import MsComment from '@/components/business/ms-comment';
   import { CommentItem, CommentParams } from '@/components/business/ms-comment/types';
 
   import {
@@ -47,12 +47,12 @@
   import useFeatureCaseStore from '@/store/modules/case/featureCase';
 
   const featureCaseStore = useFeatureCaseStore();
+  const activeTab = computed(() => featureCaseStore.activeTab);
   const { openModal } = useModal();
   const { t } = useI18n();
 
   const props = defineProps<{
     caseId: string;
-    activeTab: string;
   }>();
 
   const activeComment = ref('caseComment');
@@ -104,6 +104,7 @@
 
   // 添加或者更新评论
   async function handleUpdateOrAdd(item: CommentParams, cb: (result: boolean) => void) {
+    debugger;
     try {
       if (item.id) {
         await updateCommentList(item);
@@ -151,6 +152,14 @@
       }
     }
   );
+  // watch(
+  //   () => activeTab.value,
+  //   (val) => {
+  //     if (val === 'comments') {
+  //       getAllCommentList();
+  //     }
+  //   }
+  // );
 
   onMounted(() => {
     getAllCommentList();

frontend/src/views/case-management/caseManagementFeature/components/tabContent/tabDemand/demand.vue

@@ -99,17 +99,17 @@
   import { getCaseRelatedInfo } from '@/api/modules/project-management/menuManagement';
   import { useI18n } from '@/hooks/useI18n';
   import { useAppStore } from '@/store';
+  import useFeatureCaseStore from '@/store/modules/case/featureCase';
 
   import type { CreateOrUpdateDemand, DemandItem } from '@/models/caseManagement/featureCase';
   import { TableKeyEnum } from '@/enums/tableEnum';
 
   const { t } = useI18n();
   const appStore = useAppStore();
-
+  const featureCaseStore = useFeatureCaseStore();
   const currentProjectId = computed(() => appStore.currentProjectId);
   const props = defineProps<{
     caseId: string;
-    activeTab: string;
   }>();
 
   const keyword = ref<string>('');
@@ -354,17 +354,33 @@
     showAddModel.value = true;
     modelForm.value = { ...initModelForm };
   }
+  const activeTab = computed(() => featureCaseStore.activeTab);
+  // onMounted(async () => {
+  // try {
+  //   const result = await getCaseRelatedInfo(currentProjectId.value);
+  //   if (result && result.platform_key) {
+  //     platformInfo.value = { ...result };
+  //   }
+  // } catch (error) {
+  //   console.log(error);
+  // }
+  // });
 
-  onMounted(async () => {
+  watch(
-    try {
+    () => activeTab.value,
-      const result = await getCaseRelatedInfo(currentProjectId.value);
+    async (val) => {
-      if (result && result.platform_key) {
+      if (val === 'requirement') {
-        platformInfo.value = { ...result };
+        try {
+          const result = await getCaseRelatedInfo(currentProjectId.value);
+          if (result && result.platform_key) {
+            platformInfo.value = { ...result };
+          }
+        } catch (error) {
+          console.log(error);
+        }
       }
-    } catch (error) {
-      console.log(error);
     }
-  });
+  );
 
   function getPlatName() {
     switch (platformInfo.value.platform_key) {

frontend/src/views/case-management/caseManagementFeature/components/tabContent/tabDependency/tabDependency.vue

@@ -84,6 +84,7 @@
   import { characterLimit } from '@/utils';
 
   const featureCaseStore = useFeatureCaseStore();
+  const activeTab = computed(() => featureCaseStore.activeTab);
 
   const appStore = useAppStore();
 
@@ -94,7 +95,6 @@
   const keyword = ref<string>('');
   const props = defineProps<{
     caseId: string;
-    activeTab: string;
   }>();
 
   const columns: MsTableColumn = [
@@ -216,9 +216,18 @@
     }
   );
 
-  onMounted(() => {
+  watch(
-    initData();
+    () => activeTab.value,
-  });
+    (val) => {
+      if (val === 'dependency') {
+        initData();
+      }
+    }
+  );
+
+  // onMounted(() => {
+  //   initData();
+  // });
 </script>
 
 <style scoped></style>

frontend/src/views/case-management/caseManagementFeature/components/tabContent/tabDetail.vue

@@ -284,6 +284,7 @@
   import { getModules, getModulesCount } from '@/api/modules/project-management/fileManagement';
   import { useI18n } from '@/hooks/useI18n';
   import useAppStore from '@/store/modules/app';
+  import useFeatureCaseStore from '@/store/modules/case/featureCase';
   import { downloadByteFile, getGenerateId } from '@/utils';
   import { scrollIntoView } from '@/utils/dom';
 
@@ -296,7 +297,7 @@
 
   const appStore = useAppStore();
   const currentProjectId = computed(() => appStore.currentProjectId);
-
+  const featureCaseStore = useFeatureCaseStore();
   const { t } = useI18n();
 
   const props = withDefaults(
@@ -304,7 +305,7 @@
       form: DetailCase;
       allowEdit?: boolean; // 是否允许编辑
       formRules?: FormRuleItem[]; // 编辑表单
-      activeTab?: string;
+      activeTab?: string | number;
     }>(),
     {
       allowEdit: true, // 是否允许编辑

frontend/src/views/case-management/caseManagementFeature/components/tabContent/tabTestPlan.vue

@@ -30,9 +30,12 @@
 
   import { getRecycleListRequest } from '@/api/modules/case-management/featureCase';
   import { useI18n } from '@/hooks/useI18n';
+  import useFeatureCaseStore from '@/store/modules/case/featureCase';
 
   import { TableKeyEnum } from '@/enums/tableEnum';
 
+  const featureCaseStore = useFeatureCaseStore();
+  const activeTab = computed(() => featureCaseStore.activeTab);
   const { t } = useI18n();
   const keyword = ref<string>('');