From 69b7012682b65295d0cd454c8b9077db1133985f Mon Sep 17 00:00:00 2001
From: Gary Gu <garygu@Garydebijibendiannao.local>
Date: Fri, 11 Apr 2025 15:25:05 +0800
Subject: [PATCH] feat: 增加协同平台功能

---
 src/views/EquipmentView.vue |   68 ++++++++++++++++++++++-----------
 1 files changed, 45 insertions(+), 23 deletions(-)

diff --git a/src/views/EquipmentView.vue b/src/views/EquipmentView.vue
index c4dcaae..2860604 100644
--- a/src/views/EquipmentView.vue
+++ b/src/views/EquipmentView.vue
@@ -60,7 +60,7 @@
         <div class="percentage">{{item.percentage}}%</div>
        </div>
        <div class="label mt-[5px] flex flex-row items-center justify-center">
-        <div class="text-[12px] text-[#FFFFFF] mr-[12px]">{{item.name}}</div>
+        <div class="text-[16px] text-[#FFFFFF] mr-[12px]">{{item.name}}</div>
         <div class="text-[24px] text-[#FFD500]">{{item.value}}</div>
        </div>
       </div>
@@ -103,42 +103,54 @@
      <img class="w-[60px] h-[60px]" src="../assets/images/backgrounds/daqiwendu.png" alt="">
      <div class="env-info">
       <span class="envlabel">大气温度</span>
-      <span class="envvalue" :style="enviorStyle">5°C</span>
+      <div class="envvalue" :style="enviorStyle">
+        <span class="envvalue-text">5°C</span>
+      </div>
      </div>
     </div>
     <div class="env-item">
      <img class="w-[60px] h-[60px]" src="../assets/images/backgrounds/daqishidu.png" alt="">
      <div class="env-info">
       <span class="envlabel">大气湿度</span>
-      <span class="envvalue" :style="enviorStyle">22.9%</span>
+      <div class="envvalue" :style="enviorStyle">
+        <span class="envvalue-text">22.9%</span>
+      </div>
      </div>
     </div>
     <div class="env-item">
      <img class="w-[60px] h-[60px]" src="../assets/images/backgrounds/PM2.png" alt="">
      <div class="env-info">
       <span class="envlabel">PM2.5</span>
-      <span class="envvalue" :style="enviorStyle">10 μg/m³</span>
+      <div class="envvalue" :style="enviorStyle">
+        <span class="envvalue-text">10 μg/m³</span>
+      </div>
      </div>
     </div>
     <div class="env-item">
      <img class="w-[60px] h-[60px]" src="../assets/images/backgrounds/PM10.png" alt="">
      <div class="env-info">
       <span class="envlabel">PM10</span>
-      <span class="envvalue" :style="enviorStyle">13 μg/m³</span>
+      <div class="envvalue" :style="enviorStyle">
+        <span class="envvalue-text">13 μg/m³</span>
+      </div>
      </div>
     </div>
     <div class="env-item">
      <img class="w-[60px] h-[60px]" src="../assets/images/backgrounds/fengli.png" alt="">
      <div class="env-info">
       <span class="envlabel">风力</span>
-      <span class="envvalue" :style="enviorStyle">3级</span>
+      <div class="envvalue" :style="enviorStyle">
+        <span class="envvalue-text">3级</span>
+      </div>
      </div>
     </div>
     <div class="env-item">
      <img class="w-[60px] h-[60px]" src="../assets/images/backgrounds/fengxiang.png" alt="">
      <div class="env-info">
       <span class="envlabel">风向</span>
-      <span class="envvalue" :style="enviorStyle">北风</span>
+      <div class="envvalue" :style="enviorStyle">
+        <span class="envvalue-text">北风</span>
+      </div>
      </div>
     </div>
    </div>
@@ -179,6 +191,7 @@
      options: {
       tooltip: {
        trigger: 'item',
+       show: false
       },
       legend: {
        itemWidth: 8,
@@ -237,7 +250,7 @@
         },
         data: [{
           value: 81.5,
-          name: '主隧洞掘进',
+          name: '',
           itemStyle: {
            color: '#00FFFF'
           }
@@ -263,6 +276,7 @@
      options: {
       tooltip: {
        trigger: 'item',
+       show: false
       },
       legend: {
        itemWidth: 8,
@@ -321,7 +335,7 @@
         },
         data: [{
           value: 33,
-          name: '主隧洞掘进',
+          name: '',
           itemStyle: {
            color: '#00FFFF'
           }
@@ -347,6 +361,7 @@
      options: {
       tooltip: {
        trigger: 'item',
+       show: false
       },
       legend: {
        itemWidth: 8,
@@ -405,7 +420,7 @@
         },
         data: [{
           value: 20,
-          name: '主隧洞掘进',
+          name: '',
           itemStyle: {
            color: '#00FFFF'
           }
@@ -456,7 +471,7 @@
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .equipment-container {
  width: 100%;
  display: flex;
@@ -527,12 +542,9 @@
 }
 
 .env-info {
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- width: 70%;
- height: 95%;
+ 
+ width: calc( 100% - 88px);
+ height: 100%;
 }
 
 .satalabel {
@@ -546,17 +558,27 @@
 }
 
 .envlabel {
- font-size: 14px;
+ font-size: 16px;
  color: #C8C8C8;
+ display: flex;
+ align-items: center;
+ justify-content: center;
 }
 
 .envvalue {
   text-align: center;
- font-size: 16px;
- color: #fff;
- margin-top: 4px;
- width: 100%;
- height: 100%;
+  font-size: 18px;
+  color: #fff;
+  margin-top: 4px;
+  width: 100%;
+  height: calc(100% - 28px);
+  position: relative;
+ .envvalue-text{
+  position: absolute;
+  top: 33%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+ }
 }
 
 .equipment-status {

--
Gitblit v1.9.3