From 93a736a8976fd97aa7a0bfa8667362c34bc669b9 Mon Sep 17 00:00:00 2001
From: TsMask <340112800@qq.com>
Date: Tue, 6 Feb 2024 15:20:02 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E9=BB=84=E9=87=91=E6=8C=87=E6=A0=87?=
 =?UTF-8?q?=E9=A1=B9=E5=9B=BE=E8=A1=A8=E6=98=BE=E7=A4=BA=E5=85=A8=E9=83=A8?=
 =?UTF-8?q?=E5=BC=80=E5=85=B3=E6=8E=A7=E5=88=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/i18n/locales/en-US.ts                 |  1 +
 src/i18n/locales/zh-CN.ts                 |  1 +
 src/views/perfManage/goldTarget/index.vue | 51 ++++++++++++++++++-----
 3 files changed, 42 insertions(+), 11 deletions(-)

diff --git a/src/i18n/locales/en-US.ts b/src/i18n/locales/en-US.ts
index d3a6e194..842a2687 100644
--- a/src/i18n/locales/en-US.ts
+++ b/src/i18n/locales/en-US.ts
@@ -718,6 +718,7 @@ export default {
         time:'Time',
         exportSure:'Confirm whether to export all statistical data',
         exportEmpty: "Export data is empty",
+        showChartSelected: "Show All",
       }
     },
     traceManage: {
diff --git a/src/i18n/locales/zh-CN.ts b/src/i18n/locales/zh-CN.ts
index e59d6ced..2a27a2a2 100644
--- a/src/i18n/locales/zh-CN.ts
+++ b/src/i18n/locales/zh-CN.ts
@@ -718,6 +718,7 @@ export default {
         time:'时间',
         exportSure:'确认是否导出全部统计数据',
         exportEmpty: "导出数据为空",
+        showChartSelected: "显示全部",
       }
     },
     traceManage: {
diff --git a/src/views/perfManage/goldTarget/index.vue b/src/views/perfManage/goldTarget/index.vue
index 9b70aea5..c35a4dea 100644
--- a/src/views/perfManage/goldTarget/index.vue
+++ b/src/views/perfManage/goldTarget/index.vue
@@ -161,6 +161,8 @@ type StateType = {
   /**网元类型 */
   neType: string[];
   /**图表标签选择 */
+  chartLegendSelectedFlag: boolean;
+  /**图表标签选择 */
   chartLegendSelected: Record<string, boolean>;
   /**图表配置数据 */
   chartOption: EChartsOption;
@@ -169,6 +171,7 @@ type StateType = {
 /**对象信息状态 */
 let state: StateType = reactive({
   neType: [],
+  chartLegendSelectedFlag: false,
   chartLegendSelected: {},
   chartOption: {
     tooltip: {
@@ -197,12 +200,7 @@ let state: StateType = reactive({
         color: '#646A73',
       },
       icon: 'circle',
-      selected: {
-        // 选中'系列1'
-        系列1: true,
-        // 不选中'系列2'
-        系列2: false,
-      },
+      selected: {},
     },
     grid: {
       left: '10%',
@@ -224,10 +222,6 @@ let state: StateType = reactive({
   },
 });
 
-function fnChangShowType() {
-  tableState.showTable = !tableState.showTable;
-}
-
 /**
  * 数据列表导出
  */
@@ -368,6 +362,11 @@ function fnGetList() {
     });
 }
 
+/**切换显示类型 图或表格 */
+function fnChangShowType() {
+  tableState.showTable = !tableState.showTable;
+}
+
 /**绘制图表 */
 function fnRanderChart() {
   const container: HTMLElement | undefined = kpiChartDom.value;
@@ -429,7 +428,7 @@ function fnRanderChartData() {
       data: [],
     });
     tableColumnsKeyArr.push(`${columns.key}`);
-    chartLegendSelected[`${columns.title}`] = false;
+    chartLegendSelected[`${columns.title}`] = state.chartLegendSelectedFlag;
   }
 
   // 用降序就反转
@@ -449,6 +448,7 @@ function fnRanderChartData() {
     }
   }
   // console.log(queryParams.sortOrder, xDatas, yDatas);
+
   // 图标签选择状态标记
   state.chartLegendSelected = chartLegendSelected;
   kpiChart.value.setOption({
@@ -462,6 +462,21 @@ function fnRanderChartData() {
   });
 }
 
+/**图表折线显示全部 */
+function fnLegendSelected(bool: any) {
+  const chartLegendSelected: Record<string, boolean> = {};
+  for (const key of Object.keys(state.chartLegendSelected)) {
+    chartLegendSelected[key] = bool;
+  }
+  // 图标签选择状态标记
+  state.chartLegendSelected = chartLegendSelected;
+  kpiChart.value.setOption({
+    legend: {
+      selected: chartLegendSelected,
+    },
+  });
+}
+
 onMounted(() => {
   // 获取网元网元列表
   neInfoStore.fnNelist().then(res => {
@@ -662,6 +677,20 @@ onMounted(() => {
             </a-dropdown>
           </a-tooltip>
         </a-space>
+        <a-space :size="8" align="center" v-show="!tableState.showTable">
+          <a-tooltip>
+            <template #title>
+              {{ t('views.perfManage.goldTarget.showChartSelected') }}
+            </template>
+            <a-switch
+              :disabled="tableState.loading"
+              v-model:checked="state.chartLegendSelectedFlag"
+              :checked-children="t('common.switch.open')"
+              :un-checked-children="t('common.switch.shut')"
+              @change="fnLegendSelected"
+            />
+          </a-tooltip>
+        </a-space>
       </template>
 
       <!-- 表格列表 -->