From 8e9bf6fc0d37045cefa81af8c291bf5b7799c31c Mon Sep 17 00:00:00 2001
From: teukkk <mengyuan.lv@fit2cloud.com>
Date: Wed, 5 Jun 2024 10:44:49 +0800
Subject: [PATCH] =?UTF-8?q?fix(=E6=8E=A5=E5=8F=A3=E6=B5=8B=E8=AF=95):=20?=
 =?UTF-8?q?=E6=8E=A5=E5=8F=A3=E6=8A=A5=E5=91=8A=E4=BF=AE=E6=94=B9=E7=BB=86?=
 =?UTF-8?q?=E8=8A=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../api-test/report/component/scenarioCom.vue | 29 ++++++++++++++-----
 .../src/views/api-test/report/locale/en-US.ts |  3 +-
 .../src/views/api-test/report/locale/zh-CN.ts |  1 +
 .../detail/component/ReportMetricsItem.vue    |  2 +-
 4 files changed, 26 insertions(+), 9 deletions(-)

diff --git a/frontend/src/views/api-test/report/component/scenarioCom.vue b/frontend/src/views/api-test/report/component/scenarioCom.vue
index 28fc21629c..2dc3dd7aff 100644
--- a/frontend/src/views/api-test/report/component/scenarioCom.vue
+++ b/frontend/src/views/api-test/report/component/scenarioCom.vue
@@ -6,7 +6,7 @@
     <!-- 报告分析，报告步骤分析和请求分析开始 -->
     <div class="analyze mb-1">
       <div class="analyze-item">
-        <div class="block-title">{{ t('report.detail.api.stepAnalysis') }}</div>
+        <div class="block-title">{{ t('report.detail.api.reportAnalysis') }}</div>
         <ReportMetricsItem
           v-for="analysisItem in reportAnalysisList"
           :key="analysisItem.name"
@@ -18,8 +18,8 @@
         <div class="block-title">{{ t('report.detail.api.stepAnalysis') }}</div>
         <SetReportChart
           :legend-data="stepAnalysisLegendData"
-          :options="charOptions"
-          :request-total="getIndicators(detail.requestTotal) || 0"
+          :options="stepCharOptions"
+          :request-total="getIndicators(detail.stepTotal) || 0"
         />
       </div>
       <!-- 请求分析 -->
@@ -27,7 +27,7 @@
         <div class="block-title">{{ t('report.detail.api.requestAnalysis') }}</div>
         <SetReportChart
           :legend-data="legendData"
-          :options="charOptions"
+          :options="requestCharOptions"
           :request-total="getIndicators(detail.requestTotal) || 0"
         />
       </div>
@@ -44,6 +44,7 @@
 
 <script setup lang="ts">
   import { ref } from 'vue';
+  import { cloneDeep } from 'lodash-es';
 
   import SetReportChart from './case/setReportChart.vue';
   import ReportDetailHeader from './reportDetailHeader.vue';
@@ -154,7 +155,7 @@
 
   const legendData = ref<LegendData[]>([]);
   const stepAnalysisLegendData = ref<LegendData[]>([]);
-  const charOptions = ref({
+  const defaultCharOptions = {
     tooltip: {
       show: false,
       trigger: 'item',
@@ -212,7 +213,9 @@
         },
       ],
     },
-  });
+  };
+  const stepCharOptions = ref(cloneDeep(defaultCharOptions));
+  const requestCharOptions = ref(cloneDeep(defaultCharOptions));
   const activeTab = ref<'tiled' | 'tab'>('tiled');
 
   function getRote(count: number, countTotal: number) {
@@ -250,7 +253,7 @@
       },
     ];
 
-    charOptions.value.series.data = tempArr.map((item: any) => {
+    requestCharOptions.value.series.data = tempArr.map((item: any) => {
       return {
         value: detail.value[item.value] || 0,
         name: t(item.label),
@@ -269,6 +272,18 @@
         rote: `${detail.value[item.rateKey] || 0}%`,
       };
     });
+    stepCharOptions.value.series.data = tempArr.map((item: any) => {
+      const valueName = `step${item.value.charAt(0).toUpperCase() + item.value.slice(1)}`;
+      return {
+        value: detail.value[valueName] || 0,
+        name: t(item.label),
+        itemStyle: {
+          color: item.color,
+          borderWidth: 2,
+          borderColor: '#ffffff',
+        },
+      };
+    });
     stepAnalysisLegendData.value = tempArr.map((item: any) => {
       const valueName = `step${item.value.charAt(0).toUpperCase() + item.value.slice(1)}`;
       return {
diff --git a/frontend/src/views/api-test/report/locale/en-US.ts b/frontend/src/views/api-test/report/locale/en-US.ts
index fd3ae41e66..f67e45e484 100644
--- a/frontend/src/views/api-test/report/locale/en-US.ts
+++ b/frontend/src/views/api-test/report/locale/en-US.ts
@@ -25,7 +25,8 @@ export default {
   'report.detail.api.resContent': 'Response content',
   'report.detail.api.executionTime': 'Execution time',
   'report.detail.api.executionTimeTo': 'To',
-  'report.detail.api.stepAnalysis': 'step Analysis',
+  'report.detail.api.stepAnalysis': 'Step analysis',
+  'report.detail.api.reportAnalysis': 'Report analysis',
   'report.detail.api.content': 'content',
   'report.detail.api.assertStatus': 'status',
   'report.detail.api.totalTime': 'Total report time',
diff --git a/frontend/src/views/api-test/report/locale/zh-CN.ts b/frontend/src/views/api-test/report/locale/zh-CN.ts
index 4727ef3b07..e792b91688 100644
--- a/frontend/src/views/api-test/report/locale/zh-CN.ts
+++ b/frontend/src/views/api-test/report/locale/zh-CN.ts
@@ -25,6 +25,7 @@ export default {
   'report.detail.api.executionTime': '执行时间',
   'report.detail.api.executionTimeTo': '至',
   'report.detail.api.stepAnalysis': '步骤分析',
+  'report.detail.api.reportAnalysis': '报告分析',
   'report.detail.api.content': '内容',
   'report.detail.api.assertStatus': '状态',
   'report.detail.api.totalTime': '报告总耗时',
diff --git a/frontend/src/views/test-plan/report/detail/component/ReportMetricsItem.vue b/frontend/src/views/test-plan/report/detail/component/ReportMetricsItem.vue
index 2eccdaedbe..6622af6d4a 100644
--- a/frontend/src/views/test-plan/report/detail/component/ReportMetricsItem.vue
+++ b/frontend/src/views/test-plan/report/detail/component/ReportMetricsItem.vue
@@ -7,7 +7,7 @@
         <MsIcon
           v-if="props.itemInfo.tip?.length"
           type="icon-icon-maybe_outlined"
-          class="ml-[8px] text-[var(--color-text-4)] hover:text-[rgb(var(--primary-5))]"
+          class="ml-[8px] text-[var(--color-text-brand)] hover:text-[rgb(var(--primary-5))]"
         />
       </a-tooltip>
       <MsTag