Jelajahi Sumber

[Mod 0000] 公司端首页各个模块修改

houzekong 9 bulan lalu
induk
melakukan
5a56d56151

+ 37 - 6
src/views/vent/home/clique/components/risk-warn.vue

@@ -69,7 +69,7 @@
               </div>
               <div class="item-monitor-box">
                 <span class="title">火灾监测</span>
-                <span class="value value1">{{ centerData.fire }}</span>
+                <span class="value" :class="calcTextColor(centerData.fire)">{{ centerData.fire }}</span>
               </div>
             </div>
             <div class="item item2">
@@ -78,7 +78,7 @@
               </div>
               <div class="item-monitor-box">
                 <span class="title">设备监测</span>
-                <span class="value value">{{ centerData.sb }}</span>
+                <span class="value" :class="calcTextColor(centerData.fire)">{{ centerData.sb }}</span>
               </div>
             </div>
             <div class="item item3">
@@ -87,7 +87,7 @@
               </div>
               <div class="item-monitor-box">
                 <span class="title">瓦斯监测</span>
-                <span class="value">{{ centerData.ws }}</span>
+                <span class="value" :class="calcTextColor(centerData.fire)">{{ centerData.ws }}</span>
                 <!-- <div class="">
                                     <span class="title">矿井瓦斯鉴定等级监测</span>
                                     <span class="value">低瓦斯</span>
@@ -100,7 +100,7 @@
               </div>
               <div class="item-monitor-box">
                 <span class="title">粉尘监测</span>
-                <span class="value">{{ centerData.fc }}</span>
+                <span class="value" :class="calcTextColor(centerData.fire)">{{ centerData.fc }}</span>
               </div>
             </div>
             <div class="item item5">
@@ -109,7 +109,7 @@
               </div>
               <div class="item-monitor-box">
                 <span class="title">通风监测</span>
-                <span class="value">{{ centerData.tf }}</span>
+                <span class="value" :class="calcTextColor(centerData.fire)">{{ centerData.tf }}</span>
               </div>
             </div>
           </div>
@@ -193,6 +193,23 @@
     }
   );
 
+  function calcTextColor(str: string) {
+    switch (str) {
+      case '正常':
+        return '';
+      case '低风险':
+        return '';
+      case '一般风险':
+        return 'value-yellow';
+      case '较高风险':
+        return 'value-orange';
+      case '高风险':
+        return 'value-red';
+      default:
+        return '';
+    }
+  }
+
   onMounted(async () => {
     rainBg('rain', 'animation-box');
   });
@@ -579,13 +596,27 @@
                   margin-left: 10px;
                 }
 
-                .value1 {
+                .value-red {
                   font-size: 16px;
                   font-weight: 800;
                   margin-top: 6px;
                   color: #ff0000;
                   animation: color-blink 1s infinite;
                 }
+                .value-orange {
+                  font-size: 16px;
+                  font-weight: 800;
+                  margin-top: 6px;
+                  color: #ff8800;
+                  animation: color-blink 1s infinite;
+                }
+                .value-yellow {
+                  font-size: 16px;
+                  font-weight: 800;
+                  margin-top: 6px;
+                  color: #ffff00;
+                  animation: color-blink 1s infinite;
+                }
 
                 @keyframes color-blink {
                   0% {

+ 2 - 2
src/views/vent/home/clique/components/scene-key.vue

@@ -25,8 +25,8 @@
             <img v-else src="../../../../../assets/images/company/iconS2.png" alt="" />
             <!-- <img v-else src="../../../../../assets/images/company/iconS3.png" alt="" />
             <img v-else src="../../../../../assets/images/company/iconS4.png" alt="" /> -->
-          </i> </div
-        >sssss
+          </i>
+        </div>
       </div>
     </div>
   </div>

+ 3 - 3
src/views/vent/home/clique/components/wind-road-middle.vue

@@ -11,7 +11,7 @@
       <div class="road-card">
         <div class="head-nav">
           <span>{{ roadDatas.label }} : </span>
-          <span>{{ roadDatas.value }}m</span>
+          <span>{{ roadDatas.value }}km</span>
         </div>
         <div class="echart-box">
           <div ref="road" class="road"></div>
@@ -86,7 +86,7 @@
           },
         },
         yAxis: {
-          max: Math.ceil(roadDatas.value + 1000),
+          max: Math.ceil(parseInt(roadDatas.value) + 1000),
           name: '长度(m)',
           nameTextStyle: {
             color: '#3df6ff',
@@ -336,7 +336,7 @@
     (newR, oldR) => {
       if (JSON.stringify(newR) != '{}') {
         maxData.length = 0;
-        roadDatas.value = newR.totallength;
+        roadDatas.value = Math.floor(newR.totallength / 1000);
         xData.value = newR.data1;
         yData.value = newR.data;
         yData.value.forEach((el) => {

+ 3 - 1
src/views/vent/home/clique/index.vue

@@ -109,7 +109,9 @@
     console.log(res, '公司端首页数据----------');
     if (res && res.length > 0) {
       earlyWarn.value = res;
-      roadData.totallength = res[0] && res[0].sys_data ? res[0].sys_data.totallength : 0;
+      roadData.totallength = res.reduce((len, r) => {
+        return r.sys_data ? len + r.sys_data.totallength : len;
+      }, 0);
       roadData.data.length = 0;
       roadData.data1.length = 0;
       airKjStatus.length = 0;