[Feat 0000]预警监测系统样式优化

src/views/vent/home/configurable/configurable.data.ts

@@ -514,7 +514,6 @@ export const testConfigVent: Config[] = [
       position: 'bottom:15px;right:15px;',
     },
   },
-
 ];
 
 export const testConfigDust: Config[] = [
@@ -2829,7 +2828,7 @@ export const testConfigFusionGreen: Config[] = [
           },
         },
       ],
-     to:'/ventilate/warn/home',
+      to: '/ventilate/warn/home',
     },
     showStyle: {
       size: 'width:420px;height:400px;',
@@ -3052,7 +3051,7 @@ export const testConfigFusionGreen: Config[] = [
           },
         },
       ],
-     to:'/device/warn/home',
+      to: '/device/warn/home',
     },
     showStyle: {
       size: 'width:420px;height:400px;',
@@ -3134,7 +3133,7 @@ export const testConfigFusionGreen: Config[] = [
           },
         },
       ],
-      to:'/fire/warn/home',
+      to: '/fire/warn/home',
     },
     showStyle: {
       size: 'width:420px;height:400px;',
@@ -3230,7 +3229,7 @@ export const testConfigFusionGreen: Config[] = [
           },
         },
       ],
-     to:'/dust/warn/home',
+      to: '/dust/warn/home',
     },
     showStyle: {
       size: 'width:420px;height:400px;',
@@ -3298,7 +3297,7 @@ export const testConfigFusionGreen: Config[] = [
           },
         },
       ],
-       to:'/gas/warn/home',
+      to: '/gas/warn/home',
     },
     showStyle: {
       size: 'width:990px;height:170px;',
@@ -4129,7 +4128,7 @@ export const testConfigWarnMonitor: Config[] = [
           readFrom: 'deviceWarn',
           listOption: {
             fanmain: {
-              url: getThemifyImagesURL('vent/alarm-icons/zhushan.png'),
+              url: getThemifyImagesURL('vent/alarm-icons/zfj.png'),
               text: '',
               allText: '总数',
               warnText: '报警数',
@@ -4139,7 +4138,7 @@ export const testConfigWarnMonitor: Config[] = [
               closeCount: 'fanmain_close',
             },
             fanlocal: {
-              url: getThemifyImagesURL('vent/alarm-icons/js.png'),
+              url: getThemifyImagesURL('vent/alarm-icons/jbfj.png'),
               text: '',
               allText: '总数',
               warnText: '报警数',
@@ -4149,7 +4148,7 @@ export const testConfigWarnMonitor: Config[] = [
               closeCount: 'fanlocal_close',
             },
             bundletube: {
-              url: getThemifyImagesURL('vent/alarm-icons/shug.png'),
+              url: getThemifyImagesURL('vent/alarm-icons/sgjc.png'),
               text: '',
               allText: '总数',
               warnText: '报警数',
@@ -4159,7 +4158,7 @@ export const testConfigWarnMonitor: Config[] = [
               closeCount: 'bundletube_close',
             },
             fanlocaldp: {
-              url: getThemifyImagesURL('vent/alarm-icons/yafeng.png'),
+              url: getThemifyImagesURL('vent/alarm-icons/jbfj-db.png'),
               text: '',
               allText: '总数',
               warnText: '报警数',
@@ -4169,7 +4168,7 @@ export const testConfigWarnMonitor: Config[] = [
               closeCount: 'fanlocaldp_close',
             },
             gate: {
-              url: getThemifyImagesURL('vent/alarm-icons/fm.png'),
+              url: getThemifyImagesURL('vent/alarm-icons/fm-green.png'),
               text: '',
               allText: '总数',
               warnText: '报警数',
@@ -4179,7 +4178,7 @@ export const testConfigWarnMonitor: Config[] = [
               closeCount: 'gate_close',
             },
             window: {
-              url: getThemifyImagesURL('vent/alarm-icons/fc.png'),
+              url: getThemifyImagesURL('vent/alarm-icons/fc-green.png'),
               text: '',
               allText: '总数',
               warnText: '报警数',
@@ -4189,7 +4188,7 @@ export const testConfigWarnMonitor: Config[] = [
               closeCount: 'window_close',
             },
             windrect: {
-              url: getThemifyImagesURL('vent/alarm-icons/cf.png'),
+              url: getThemifyImagesURL('vent/alarm-icons/dscf-green.png'),
               text: '',
               allText: '总数',
               warnText: '报警数',
@@ -4199,7 +4198,7 @@ export const testConfigWarnMonitor: Config[] = [
               closeCount: 'windrect_close',
             },
             forcFan: {
-              url: getThemifyImagesURL('vent/alarm-icons/zhushan.png'),
+              url: getThemifyImagesURL('vent/alarm-icons/yf-green.png'),
               text: '',
               allText: '总数',
               warnText: '报警数',
@@ -4209,7 +4208,7 @@ export const testConfigWarnMonitor: Config[] = [
               closeCount: 'forcFan_close',
             },
             spray: {
-              url: getThemifyImagesURL('vent/alarm-icons/pw.png'),
+              url: getThemifyImagesURL('vent/alarm-icons/pl-green.png'),
               text: '',
               allText: '总数',
               warnText: '报警数',
@@ -4219,7 +4218,7 @@ export const testConfigWarnMonitor: Config[] = [
               closeCount: 'spray_close',
             },
             dustdev: {
-              url: getThemifyImagesURL('vent/alarm-icons/penfen.png'),
+              url: getThemifyImagesURL('vent/alarm-icons/pf-green.png'),
               text: '',
               allText: '总数',
               warnText: '报警数',
@@ -4229,7 +4228,7 @@ export const testConfigWarnMonitor: Config[] = [
               closeCount: 'dustdev_close',
             },
             nitrogen: {
-              url: getThemifyImagesURL('vent/alarm-icons/zhujiang.png'),
+              url: getThemifyImagesURL('vent/alarm-icons/zd-green.png'),
               text: '',
               allText: '总数',
               warnText: '报警数',
@@ -4239,7 +4238,7 @@ export const testConfigWarnMonitor: Config[] = [
               closeCount: 'nitrogen_close',
             },
             pulping: {
-              url: getThemifyImagesURL('vent/alarm-icons/zhujiang.png'),
+              url: getThemifyImagesURL('vent/alarm-icons/zj-green.png'),
               text: '',
               allText: '总数',
               warnText: '报警数',
@@ -4249,7 +4248,7 @@ export const testConfigWarnMonitor: Config[] = [
               closeCount: 'pulping_close',
             },
             atomizing: {
-              url: getThemifyImagesURL('vent/alarm-icons/penlin.png'),
+              url: getThemifyImagesURL('vent/alarm-icons/pw-green.png'),
               text: '',
               allText: '总数',
               warnText: '报警数',
@@ -4259,7 +4258,7 @@ export const testConfigWarnMonitor: Config[] = [
               closeCount: 'atomizing_close',
             },
             dustsensor: {
-              url: getThemifyImagesURL('vent/alarm-icons/penfen.png'),
+              url: getThemifyImagesURL('vent/alarm-icons/cgq-green.png'),
               text: '',
               allText: '总数',
               warnText: '报警数',
@@ -4269,7 +4268,7 @@ export const testConfigWarnMonitor: Config[] = [
               closeCount: 'dustsensor_close',
             },
             gas: {
-              url: getThemifyImagesURL('vent/alarm-icons/wasichoucaig.png'),
+              url: getThemifyImagesURL('vent/alarm-icons/ccb-green.png'),
               text: '',
               allText: '总数',
               warnText: '报警数',
@@ -4279,7 +4278,7 @@ export const testConfigWarnMonitor: Config[] = [
               closeCount: 'gas_close',
             },
             pump: {
-              url: getThemifyImagesURL('vent/alarm-icons/wasibeng.png'),
+              url: getThemifyImagesURL('vent/alarm-icons/ccb-green.png'),
               text: '',
               allText: '总数',
               warnText: '报警数',
@@ -4289,7 +4288,7 @@ export const testConfigWarnMonitor: Config[] = [
               closeCount: 'pump_close',
             },
             modelsensor: {
-              url: getThemifyImagesURL('vent/alarm-icons/cf.png'),
+              url: getThemifyImagesURL('vent/alarm-icons/cf-green.png'),
               text: '',
               allText: '总数',
               warnText: '报警数',

src/views/vent/home/configurable/green/components/dz-list.vue

@@ -2,19 +2,8 @@
   <div :class="deviceType == 'deviceManageInfo' ? 'dz-list1' : 'dz-list'">
     <div :class="deviceType == 'deviceManageInfo' ? 'icons-box1' : 'icons-box'" @mouseleave="resetScroll">
       <template v-for="(item, key) in listOption" :key="key">
-        <div
-          class="icon-item"
-          :style="
-            deviceType == 'deviceManageInfo'
-              ? {
-                  backgroundImage: 'url(' + item.url + ')',
-                  backgroundRepeat: 'no-repeat',
-                  backgroundSize: '100% 100%',
-                }
-              : {}
-          "
-        >
-          <!-- <img :src="item.url" :alt="item.text" /> -->
+        <div class="icon-item">
+          <img :src="item.url" :alt="item.text" />
           <div class="level-text">
             <div class="all-count">
               <span>{{ `${item.allText}&nbsp:&nbsp` }}</span>
@@ -85,6 +74,7 @@ watch(
   height: 100%;
 }
 .dz-list1 {
+  --image-model_icon-item1: url('@/assets/images/home-warn/8-6.png');
   width: 100%;
   height: 100%;
 }
@@ -168,6 +158,8 @@ watch(
 
   .icon-item {
     flex: 0 0 calc(50% - 5px);
+    background: var(--image-model_icon-item1) no-repeat;
+    background-size: 100% 100%;
     height: 46px;
     position: relative;
     display: flex;
@@ -179,8 +171,8 @@ watch(
       display: flex;
       justify-content: space-around;
       position: absolute;
-      top: 18px;
-      left: 76px;
+      top: 10px;
+      left: 97px;
       color: #ffffffe0;
       font-size: 14px;
       text-align: center;
@@ -205,8 +197,11 @@ watch(
     }
 
     img {
-      width: 100%;
-      height: 60px;
+      width: 50px;
+      height: 50px;
+      position: absolute;
+      left: 24px;
+      top: -17px;
     }
   }
 }