From 1688ae8d99094f14e224bef0718cc13bd2e2adea Mon Sep 17 00:00:00 2001
From: "xinxin.wu" <xinxin.wu@fit2cloud.com>
Date: Mon, 22 Apr 2024 12:35:34 +0800
Subject: [PATCH] =?UTF-8?q?fix(=E5=8A=9F=E8=83=BD=E7=94=A8=E4=BE=8B):=20?=
 =?UTF-8?q?=E4=BF=AE=E6=94=B9=E5=8A=9F=E8=83=BD=E7=94=A8=E4=BE=8B=E9=83=A8?=
 =?UTF-8?q?=E5=88=86bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ms-message/MessageCenterDrawer.vue        |  8 +++---
 .../response/result/index.vue                 | 16 ++++++------
 .../api-test/report/component/reportList.vue  | 19 +++++++++++---
 .../report/component/step/stepTree.vue        | 24 ++++++++++--------
 .../views/api-test/scenario/detail/index.vue  | 25 +++++++++++++++++++
 .../bug-management/components/bugCaseTab.vue  | 10 +++++---
 .../components/caseTree.vue                   |  2 +-
 .../components/recycleCaseTable.vue           |  2 +-
 .../components/tableFilter.vue                |  6 ++++-
 .../caseManagementFeature/index.vue           |  2 +-
 .../taskCenter/component/apiCase.vue          |  5 ++++
 11 files changed, 88 insertions(+), 31 deletions(-)

diff --git a/frontend/src/components/business/ms-message/MessageCenterDrawer.vue b/frontend/src/components/business/ms-message/MessageCenterDrawer.vue
index 349d41fbc7..d531038982 100644
--- a/frontend/src/components/business/ms-message/MessageCenterDrawer.vue
+++ b/frontend/src/components/business/ms-message/MessageCenterDrawer.vue
@@ -86,7 +86,7 @@
                   </div>
                   <MsButton v-else @click="handleNameClick(item)">
                     <a-tooltip :content="item.resourceName" :mouse-enter-delay="300">
-                      <div class="one-line-text">
+                      <div class="one-line-text max-w-[300px]">
                         {{ item.resourceName }}
                       </div>
                     </a-tooltip>
@@ -112,13 +112,15 @@
                     </a-tooltip>
                   </div>
                   <div class="flex items-center">
-                    <div class="text-[var(--color-text-2)]">{{ item.content.split(':')[0] }}：</div>
+                    <div class="one-line-text max-w-[300px] text-[var(--color-text-2)]"
+                      >{{ item.content.split(':')[0] }}：</div
+                    >
                     <div v-if="item.operation.includes('DELETE')" class="text-[var(--color-text-1)]">
                       {{ item.resourceName }}
                     </div>
                     <MsButton v-else @click="handleNameClick(item)">
                       <a-tooltip :content="item.resourceName" :mouse-enter-delay="300">
-                        <div class="one-line-text">
+                        <div class="one-line-text max-w-[300px]">
                           {{ item.resourceName }}
                         </div>
                       </a-tooltip>
diff --git a/frontend/src/views/api-test/components/requestComposition/response/result/index.vue b/frontend/src/views/api-test/components/requestComposition/response/result/index.vue
index e6f31927fd..033227e50f 100644
--- a/frontend/src/views/api-test/components/requestComposition/response/result/index.vue
+++ b/frontend/src/views/api-test/components/requestComposition/response/result/index.vue
@@ -97,13 +97,15 @@
     </div>
     <!-- 平铺 -->
     <a-spin v-if="props.mode === 'tiled'" class="w-full" :loading="loading">
-      <TiledDisplay
-        :menu-list="responseCompositionTabList"
-        :request-result="activeStepDetailCopy?.content"
-        :console="props.console"
-        :is-definition="props.isDefinition"
-        :report-id="props.reportId"
-      />
+      <Suspense>
+        <TiledDisplay
+          :menu-list="responseCompositionTabList"
+          :request-result="activeStepDetailCopy?.content"
+          :console="props.console"
+          :is-definition="props.isDefinition"
+          :report-id="props.reportId"
+        />
+      </Suspense>
     </a-spin>
     <!-- 响应内容tab -->
     <div v-else class="h-[calc(100%-8px)]">
diff --git a/frontend/src/views/api-test/report/component/reportList.vue b/frontend/src/views/api-test/report/component/reportList.vue
index a2635709d6..c7e9e32580 100644
--- a/frontend/src/views/api-test/report/component/reportList.vue
+++ b/frontend/src/views/api-test/report/component/reportList.vue
@@ -73,7 +73,11 @@
           <template #content>
             <div class="arco-table-filters-content">
               <div class="ml-[6px] flex items-center justify-start px-[6px] py-[2px]">
-                <a-checkbox-group v-model:model-value="triggerModeListFilters" direction="vertical" size="small">
+                <a-checkbox-group
+                  v-model:model-value="triggerModeListFiltersMaps[showType]"
+                  direction="vertical"
+                  size="small"
+                >
                   <a-checkbox v-for="(key, value) of TriggerModeLabel" :key="key" :value="value">
                     <div class="font-medium">{{ t(key) }}</div>
                   </a-checkbox>
@@ -347,6 +351,15 @@
     INDEPENDENT: independentListFilters.value,
     INTEGRATED: integratedListFilters.value,
   });
+
+  const allTriggerModeFilters = ref<string[]>([]);
+  const independentTriggerModeFilters = ref<string[]>([]);
+  const integratedTriggerModeFilters = ref<string[]>([]);
+  const triggerModeListFiltersMaps = ref<Record<string, string[]>>({
+    All: allTriggerModeFilters.value,
+    INDEPENDENT: independentTriggerModeFilters.value,
+    INTEGRATED: integratedTriggerModeFilters.value,
+  });
   // 全部过滤条件
   const allIntegratedFilters = ref<string[]>([]);
   const independentIntegratedFilters = ref<string[]>([]);
@@ -392,7 +405,7 @@
       filter: {
         status: statusListFiltersMap.value[showType.value],
         integrated: integratedFilters.value,
-        triggerMode: triggerModeListFilters.value,
+        triggerMode: triggerModeListFiltersMaps.value[showType.value],
       },
     });
     loadList();
@@ -560,7 +573,7 @@
 
   function showDetail() {
     if ((route.query.reportId || route.query.id) && route.query.type) {
-      activeDetailId.value = route.query.reportId as string;
+      activeDetailId.value = (route.query.reportId as string) || (route.query.id as string);
       activeReportIndex.value = 0;
       if (route.query.type === 'API_SCENARIO') {
         showDetailDrawer.value = true;
diff --git a/frontend/src/views/api-test/report/component/step/stepTree.vue b/frontend/src/views/api-test/report/component/step/stepTree.vue
index 46bcd89f21..856f520115 100644
--- a/frontend/src/views/api-test/report/component/step/stepTree.vue
+++ b/frontend/src/views/api-test/report/component/step/stepTree.vue
@@ -165,17 +165,19 @@
             </div>
             <!-- 折叠展开内容 -->
             <div v-if="showResContent(step)" class="foldContent mt-4 pl-2">
-              <StepDetailContent
-                :mode="props.activeType"
-                :step-item="step"
-                :console="props.console"
-                :is-definition="true"
-                :environment-name="props.environmentName"
-                :show-type="props.showType"
-                :is-response-model="true"
-                :report-id="props?.reportId"
-                :steps="steps"
-              />
+              <Suspense>
+                <StepDetailContent
+                  :mode="props.activeType"
+                  :step-item="step"
+                  :console="props.console"
+                  :is-definition="true"
+                  :environment-name="props.environmentName"
+                  :show-type="props.showType"
+                  :is-response-model="true"
+                  :report-id="props?.reportId"
+                  :steps="steps"
+                />
+              </Suspense>
             </div>
           </div>
         </template>
diff --git a/frontend/src/views/api-test/scenario/detail/index.vue b/frontend/src/views/api-test/scenario/detail/index.vue
index 38d1b517f7..2d4a9484db 100644
--- a/frontend/src/views/api-test/scenario/detail/index.vue
+++ b/frontend/src/views/api-test/scenario/detail/index.vue
@@ -88,6 +88,19 @@
             v-model:assertion-config="scenario.scenarioConfig.assertionConfig"
             @change="scenario.unSaved = true"
           />
+          <template #title>
+            <div class="flex items-center">
+              <div> {{ t('apiScenario.assertion') }}</div>
+              <a-badge
+                v-if="scenario.scenarioConfig.assertionConfig.assertions.length"
+                class="-mb-[2px] ml-2"
+                :class="activeKey === ScenarioDetailComposition.ASSERTION ? 'active-badge' : ''"
+                :max-count="99"
+                :text="assertCount"
+              >
+              </a-badge>
+            </div>
+          </template>
         </a-tab-pane>
         <a-tab-pane
           :key="ScenarioDetailComposition.EXECUTE_HISTORY"
@@ -221,6 +234,12 @@
     }
   }
 
+  const assertCount = computed(() => {
+    return scenario.value.scenarioConfig.assertionConfig.assertions.length > 99
+      ? '99+'
+      : `${scenario.value.scenarioConfig.assertionConfig.assertions.length}` || '';
+  });
+
   const activeKey = ref<ScenarioDetailComposition>(ScenarioDetailComposition.STEP);
 
   // 前置和后置在一个tab里，isChangePre用于判断当前修改的form是前置还是后置
@@ -354,4 +373,10 @@
       .ms-scroll-bar();
     }
   }
+  :deep(.active-badge) {
+    .arco-badge-text,
+    .arco-badge-number {
+      background-color: rgb(var(--primary-5));
+    }
+  }
 </style>
diff --git a/frontend/src/views/bug-management/components/bugCaseTab.vue b/frontend/src/views/bug-management/components/bugCaseTab.vue
index f17d684b03..deebf49722 100644
--- a/frontend/src/views/bug-management/components/bugCaseTab.vue
+++ b/frontend/src/views/bug-management/components/bugCaseTab.vue
@@ -202,7 +202,7 @@
 
   const associatedIds = ref<string[]>([]);
 
-  const currentSelectCase = ref<keyof typeof CaseLinkEnum>('FUNCTIONAL');
+  const currentSelectCase = ref<keyof typeof CaseLinkEnum>('API');
 
   const modulesTreeParams = ref<TableQueryParams>({});
 
@@ -236,8 +236,12 @@
 
   const caseTypeOptions = ref<{ label: string; value: string }[]>([
     {
-      label: 'menu.caseManagement.featureCase',
-      value: 'FUNCTIONAL',
+      value: 'API',
+      label: t('caseManagement.featureCase.apiCase'),
+    },
+    {
+      value: 'SCENARIO',
+      label: t('caseManagement.featureCase.sceneCase'),
     },
   ]);
 
diff --git a/frontend/src/views/case-management/caseManagementFeature/components/caseTree.vue b/frontend/src/views/case-management/caseManagementFeature/components/caseTree.vue
index fa36fee47f..ad2ba0285b 100644
--- a/frontend/src/views/case-management/caseManagementFeature/components/caseTree.vue
+++ b/frontend/src/views/case-management/caseManagementFeature/components/caseTree.vue
@@ -357,7 +357,7 @@
       };
     }
     return {
-      height: 'calc(100vh - 294px)',
+      height: 'calc(100vh - 280px)',
       threshold: 200,
       fixedSize: true,
       buffer: 15,
diff --git a/frontend/src/views/case-management/caseManagementFeature/components/recycleCaseTable.vue b/frontend/src/views/case-management/caseManagementFeature/components/recycleCaseTable.vue
index db8b0c1320..cc43832b75 100644
--- a/frontend/src/views/case-management/caseManagementFeature/components/recycleCaseTable.vue
+++ b/frontend/src/views/case-management/caseManagementFeature/components/recycleCaseTable.vue
@@ -36,7 +36,7 @@
                 :data="caseTree"
                 :keyword="groupKeyword"
                 :expand-all="isExpandAll"
-                :empty-text="t('caseManagement.featureCase.caseEmptyRecycle')"
+                :empty-text="t('common.noData')"
                 draggable
                 :virtual-list-props="virtualListProps"
                 block-node
diff --git a/frontend/src/views/case-management/caseManagementFeature/components/tableFilter.vue b/frontend/src/views/case-management/caseManagementFeature/components/tableFilter.vue
index cdf1722a9a..1ded83da42 100644
--- a/frontend/src/views/case-management/caseManagementFeature/components/tableFilter.vue
+++ b/frontend/src/views/case-management/caseManagementFeature/components/tableFilter.vue
@@ -21,7 +21,11 @@
                 :key="item[props.valueKey || 'value']"
                 :value="item[props.valueKey || 'value']"
               >
-                <a-tooltip :content="item[props.labelKey || 'text']" :mouse-enter-delay="300">
+                <a-tooltip
+                  :content="item[props.labelKey || 'text']"
+                  :mouse-enter-delay="300"
+                  :disabled="!item[props.labelKey || 'text']"
+                >
                   <div class="one-line-text">
                     <slot name="item" :item="item" :index="index"></slot>
                   </div>
diff --git a/frontend/src/views/case-management/caseManagementFeature/index.vue b/frontend/src/views/case-management/caseManagementFeature/index.vue
index e27ac39ccb..fc897a9cb7 100644
--- a/frontend/src/views/case-management/caseManagementFeature/index.vue
+++ b/frontend/src/views/case-management/caseManagementFeature/index.vue
@@ -79,7 +79,7 @@
           </div>
           <div class="flex-1">
             <a-divider class="!my-0 !mb-0" />
-            <div class="case mt-2">
+            <div class="case">
               <div
                 class="flex items-center px-[20px]"
                 :class="getActiveClass('recycle')"
diff --git a/frontend/src/views/project-management/taskCenter/component/apiCase.vue b/frontend/src/views/project-management/taskCenter/component/apiCase.vue
index 10b9186ea3..7e2206097b 100644
--- a/frontend/src/views/project-management/taskCenter/component/apiCase.vue
+++ b/frontend/src/views/project-management/taskCenter/component/apiCase.vue
@@ -95,6 +95,7 @@
           v-model:status-filters="triggerModeFiltersMap[props.moduleType]"
           :title="(columnConfig.title as string)"
           :list="triggerModeList"
+          label-key="label"
           @search="initData()"
         >
           <template #item="{ item }">
@@ -333,6 +334,10 @@
       dataIndex: 'triggerMode',
       slotName: 'triggerMode',
       titleSlotName: 'triggerModeFilter',
+      sortable: {
+        sortDirections: ['ascend', 'descend'],
+        sorter: true,
+      },
       showInTable: true,
       width: 150,
       showDrag: true,