From fbdeec745ed125c3aef9136b72d1f8c0d84536b1 Mon Sep 17 00:00:00 2001
From: "liu.shiyi" <liu.shiyi@ustcinfo.com>
Date: Wed, 6 Sep 2023 15:17:26 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E4=BF=AE=E6=94=B9tab=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E5=9C=A8=E9=A2=84=E8=A7=88=E6=80=81=E5=87=BA=E7=8E=B0=E5=8F=B3?=
 =?UTF-8?q?=E9=94=AE=E8=8F=9C=E5=8D=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../BasicComponents/ChartTab/index.vue        | 43 +++++++++++++++----
 1 file changed, 34 insertions(+), 9 deletions(-)

diff --git a/data-room-ui/packages/BasicComponents/ChartTab/index.vue b/data-room-ui/packages/BasicComponents/ChartTab/index.vue
index 7574addb..73a15e23 100644
--- a/data-room-ui/packages/BasicComponents/ChartTab/index.vue
+++ b/data-room-ui/packages/BasicComponents/ChartTab/index.vue
@@ -27,6 +27,7 @@
       </div>
     </div>
     <div
+      v-if="config.customize.tabList &&config.customize.tabList.length"
       class="line-box"
       :style="{'background-color':config.customize.lineColor}"
     />
@@ -34,16 +35,27 @@
       v-if="config.customize.tabList &&config.customize.tabList.length"
       class="chart-item-box"
     >
-      <Configuration
-        :config="config.customize.tabList[currentIndex].chart"
-        @openRightPanel="openRightPanel"
+      <!--      <Configuration-->
+      <!--        :config="config.customize.tabList[currentIndex].chart"-->
+      <!--        @openRightPanel="openRightPanel"-->
+      <!--      >-->
+      <div
+        class="configuration-wrap"
+        :class="{
+          'active': activeCodes.includes(config.customize.tabList[currentIndex].chart.code),
+          'hover': hoverCode === config.customize.tabList[currentIndex].chart.code
+        }"
+        @mouseenter.stop="changeHover(config.customize.tabList[currentIndex].chart.code)"
+        @mouseleave="changeHover('')"
+        @click.stop="changeActive(config.customize.tabList[currentIndex].chart)"
       >
         <RenderCardInner
           :ref="'RenderCard' + config.customize.tabList[currentIndex].chartCode"
           :config="config.customize.tabList[currentIndex].chart"
           @click.native="currentChartHandler"
         />
-      </Configuration>
+      </div>
+      <!--      </Configuration>-->
     </div>
     <el-empty
       v-else-if="!config.customize.tabList.length"
@@ -75,6 +87,8 @@ export default {
       pageCode: state => state.bigScreen.pageInfo.code,
       customTheme: state => state.bigScreen.pageInfo.pageConfig.customTheme,
       activeCode: state => state.bigScreen.activeCode,
+      activeCodes: state => state.bigScreen.activeCodes,
+      hoverCode: state => state.bigScreen.hoverCode,
       chartList: (state) => state.bigScreen.pageInfo.chartList
     })
   },
@@ -96,7 +110,8 @@ export default {
     ...mapMutations({
       changeChartConfig: 'bigScreen/changeChartConfig',
       changeActiveItemConfig: 'bigScreen/changeActiveItemConfig',
-      changeActiveCode: 'bigScreen/changeActiveCode'
+      changeActiveCode: 'bigScreen/changeActiveCode',
+      changeHoverCode: 'bigScreen/changeHoverCode'
     }),
     changeStyle (config) {
       config = { ...this.config, ...config }
@@ -115,11 +130,14 @@ export default {
     currentChartHandler () {
       this.changeActiveCode(this.config.customize.tabList[this.currentIndex]?.chartCode)
       this.changeActiveItemConfig(this.config.customize.tabList[this.currentIndex]?.chart)
-      console.log()
     },
-    // 打开右侧面板
-    openRightPanel () {
-      // EventBus.$emit('openRightPanel', this.currentChart)
+    // 改变hover的组件
+    changeHover (code) {
+      this.changeHoverCode(code)
+    },
+    // 改变激活的组件
+    changeActive (config) {
+      this.changeActiveCode(config.code)
     }
   }
 }
@@ -141,6 +159,13 @@ export default {
   .chart-item-box{
     width: 100%;
     height: calc(100% - 40px);
+    &:hover{
+      cursor: pointer;
+    }
+    .configuration-wrap{
+      width: 100%;
+      height: calc(100% - 40px);
+    }
   }
   .active{
     color: var(--bs-el-color-primary) !important;