大屏优化

src/views/screen/wsScreen/components/left/EquipItem.vue

@@ -137,8 +137,9 @@ export default {
     .left-tip {
       padding-top: 6px;
       padding-bottom: 15px;
-      font-size: 12px;
+      font-size: 11px;
       font-weight: 600;
+      width: 50px;
     }
   }
 
@@ -146,7 +147,7 @@ export default {
     margin-left: 10px;
     margin-top: 16px;
     padding: 4px 0;
-    font-size: 12px;
+    font-size: 11px;
     font-weight: 600;
     width: 100px;
     text-align: center;

src/views/screen/wsScreen/components/left/EquipItemMore.vue

@@ -4,7 +4,7 @@
       v-if="dialogVisible"
       v-loading="isLoading"
       :visible.sync="dialogVisible"
-      width="60%"
+      width="80%"
       :modal="false"
       class="dlg-box"
     >

src/views/screen/wsScreen/components/left/RightItem.vue

@@ -59,6 +59,17 @@ export default {
           top: '20%',
           bottom: '15%',
         },
+        tooltip: {
+    trigger: 'axis',
+    axisPointer: {
+      type: 'shadow',
+    },
+    formatter: (params) => {
+      const item = params[0]
+      return `${item.name}<br/>数量：${item.value}`
+    },
+  },
+
         xAxis: {
           data: xData,
           axisTick: { show: false },
@@ -68,6 +79,7 @@ export default {
             color: '#ccc',
             fontSize: 12,
             margin: 10,
+            rotate: 45,
           },
         },
         yAxis: {
@@ -143,7 +155,7 @@ export default {
 
 <style lang="scss" scoped>
 .chart-container {
-  width: 1500px; /* 宽度 */
+  width: 900px; /* 宽度 */
   height: 209px; /* 高度 */
   margin: 0 auto;
 }

src/views/screen/wsScreen/components/left/index.vue

@@ -23,13 +23,13 @@
       <div class="item-box">
         <el-row :gutter="20">
           <el-col :span="8" :offset="0">
-            <EquipItem title="线路装备" :state="state1" :pieValues="list1" @openDialog="openEquipItemMore(5474)" />
+            <EquipItem title="线路装备" :state="state1" :pieValues="list1" @openDialog="openEquipItemMore(2)" />
           </el-col>
           <el-col :span="8" :offset="0">
-            <EquipItem title="变电装备" :state="state2" :pieValues="list2" @openDialog="openEquipItemMore(5080)" />
+            <EquipItem title="变电装备" :state="state2" :pieValues="list2" @openDialog="openEquipItemMore(1)" />
           </el-col>
           <el-col :span="8" :offset="0">
-            <EquipItem title="电缆装备" :state="state3" :pieValues="list3" @openDialog="openEquipItemMore(5010)" />
+            <EquipItem title="电缆装备" :state="state3" :pieValues="list3" @openDialog="openEquipItemMore(3)" />
           </el-col>
         </el-row>
       </div>

src/views/screen/wsScreenWidescreen/components/left/UnitEquipmentConfig.vue

@@ -87,6 +87,8 @@ th,
 td {
   padding: 10px;
   text-align: center;
+  white-space: nowrap;
+  border: 1px solid rgba(255, 255, 255, 0.3); // 边框颜色可根据背景调整
 }
 
 th {

src/views/screen/wsScreenWidescreen/components/left/index.vue

@@ -16,13 +16,13 @@
       <div class="item-box">
         <el-row :gutter="20">
           <el-col :span="8" :offset="0">
-            <EquipItem title="线路装备" :state="state1" :pieValues="list1" @openDialog="openEquipItemMore(5474)" />
+            <EquipItem title="线路装备" :state="state1" :pieValues="list1" @openDialog="openEquipItemMore(2)" />
           </el-col>
           <el-col :span="8" :offset="0">
-            <EquipItem title="变电装备" :state="state2" :pieValues="list2" @openDialog="openEquipItemMore(5080)" />
+            <EquipItem title="变电装备" :state="state2" :pieValues="list2" @openDialog="openEquipItemMore(1)" />
           </el-col>
           <el-col :span="8" :offset="0">
-            <EquipItem title="电缆装备" :state="state3" :pieValues="list3" @openDialog="openEquipItemMore(5010)" />
+            <EquipItem title="电缆装备" :state="state3" :pieValues="list3" @openDialog="openEquipItemMore(3)" />
           </el-col>
         </el-row>
       </div>

src/views/screen/wsScreenWidescreen/components/right/ProEquipSituationList.vue

@@ -240,6 +240,8 @@ th,
 td {
   padding: 10px;
   text-align: center;
+  white-space: nowrap;
+  border: 1px solid rgba(255, 255, 255, 0.3); // 边框颜色可根据背景调整
 }
 
 th {

src/views/screen/wsScreenWidescreen/components/right/UsageRateSituationList.vue

@@ -99,6 +99,8 @@ th,
 td {
   padding: 10px;
   text-align: center;
+  white-space: nowrap;
+  border: 1px solid rgba(255, 255, 255, 0.3); // 边框颜色可根据背景调整
 }
 
 th {