大屏

src/styles/view/datav.scss

@@ -147,6 +147,9 @@
                         padding: 0;
                         line-height: unset;
                     }
+                    .current-row .el-table__cell {
+                        background-color: #0a3b87;
+                    }
                 }
             }
         }

src/views/home/datav.vue

@@ -188,7 +188,7 @@
                     <div class="hc-datav-row-line relative">
                         <div class="title">项目数据</div>
                         <div class="hc-full relative">
-                            <HcDatavCharts />
+                            <HcDatavCharts v-if="isDatavCharts" />
                         </div>
                     </div>
                 </el-col>
@@ -389,8 +389,14 @@ const tableData1 = ref([
 ])
 
 //表格被点击
+const isDatavCharts = ref(true)
 const tableRowClick = (row) => {
     console.log(row)
+    //模拟改变图表
+    isDatavCharts.value = false
+    setTimeout(() => {
+        isDatavCharts.value = true
+    }, 100)
 }
 
 //滞后表格1
@@ -406,6 +412,11 @@ const lagData1 = ref([
 ])
 const lagRowClick = (row) => {
     console.log(row)
+    //模拟改变图表
+    isDatavCharts.value = false
+    setTimeout(() => {
+        isDatavCharts.value = true
+    }, 100)
 }
 
 //表格2

src/views/home/modules/charts.vue

@@ -4,6 +4,7 @@
 
 <script setup>
 import { onMounted, ref, watch } from 'vue'
+import { getNumber, getRandom } from 'js-fast-way'
 
 const props = defineProps({
     datas: {
@@ -56,17 +57,17 @@ const setClassifyChartsOption = (data) => {
             {
                 name: '超进度项目',
                 type: 'line',
-                data: [120, 234, 101, 101],
+                data: [getNumber(3), getNumber(3), getNumber(3), getNumber(3)],
             },
             {
                 name: '常规项目',
                 type: 'line',
-                data: [220, 134, 191, 101],
+                data: [getNumber(3), getNumber(3), getNumber(3), getNumber(3)],
             },
             {
                 name: '滞后项目',
                 type: 'line',
-                data: [150, 154, 201, 101],
+                data: [getNumber(3), getNumber(3), getNumber(3), getNumber(3)],
             },
         ],
     }