更新

src/views/vent/monitorManager/alarmMonitor/fire/closeWall.vue

@@ -9,12 +9,12 @@
                 </div>
                 <div class="contents">
                     <div class="text">
-                        <span class="label">位置 : </span>
-                        <span class="value">{{ topContent.position }}</span>
+                        <span class="text-label">位置 : </span>
+                        <span class="text-value">{{ topContent.position }}</span>
                     </div>
                     <div class="text">
-                        <span class="label">时间 : </span>
-                        <span class="value">{{ topContent.time }}</span>
+                        <span class="text-label">时间 : </span>
+                        <span class="text-value">{{ topContent.time }}</span>
                     </div>
                 </div>
             </div>
@@ -27,10 +27,13 @@
             <div class="card-btn">
                 <div :class="activeIndex == index ? 'box-container1' : 'box-container'" v-for="(item, index) in mbList" :key="index"
                     @click="btnClick(item, index)">
-                    <div class="label">{{ item.label }}</div>
+                    <div class="box-label">
+                        <span> {{ item.label }}</span>
+                        <span >{{ item.dw }}</span>    
+                    </div>
                     <div class="box-item box-item1">
                         <span class="text-t">{{ `${item.label1}:` }}</span>
-                        <span class="text-v">{{ `${item.nd}%` }}</span>
+                        <span class="text-v">{{ item.nd }}</span>
                     </div>
                     <div class="box-item box-item2">
                         <span class="text-t">{{ `${item.label2}:` }}</span>
@@ -73,6 +76,7 @@ let topContent = reactive({
 let mbList = reactive([
     {
         label: 'O₂',
+        dw:'(%)',
         label1: '浓度',
         label2: '时间',
         label3: '位置',
@@ -82,6 +86,7 @@ let mbList = reactive([
     },
     {
         label: 'CO',
+        dw:'(ppm)',
         label1: '浓度',
         label2: '时间',
         label3: '位置',
@@ -91,6 +96,7 @@ let mbList = reactive([
     },
     {
         label: 'CO₂',
+        dw:'(%)',
         label1: '浓度',
         label2: '时间',
         label3: '位置',
@@ -100,6 +106,7 @@ let mbList = reactive([
     },
     {
         label: 'CH₄',
+        dw:'(%)',
         label1: '浓度',
         label2: '时间',
         label3: '位置',
@@ -109,6 +116,7 @@ let mbList = reactive([
     },
     {
         label: 'C₂H₂',
+        dw:'(ppm)',
         label1: '浓度',
         label2: '时间',
         label3: '位置',
@@ -118,6 +126,7 @@ let mbList = reactive([
     },
     {
         label: 'C₂H₄',
+        dw:'(ppm)',
         label1: '浓度',
         label2: '时间',
         label3: '位置',
@@ -319,12 +328,12 @@ watch(() => props.listData, (val) => {
                     .text {
                         font-size: 18px;
 
-                        .label {
+                        .text-label {
                             color: #b3b8cc;
                             font-weight: bold;
                         }
 
-                        .value {
+                        .text-value {
                             font-family: 'douyuFont';
                             color: #3df6ff;
                             margin-left: 10px;
@@ -373,12 +382,11 @@ watch(() => props.listData, (val) => {
                 background-size: 100% 100%;
                 cursor: pointer;
 
-                .label {
+                .box-label {
                     position: absolute;
                     left: 50%;
-                    top: 0;
+                    top: 2px;
                     transform: translate(-50%);
-                    font-size: 16px;
                     color: #fff;
                 }
 
@@ -433,12 +441,11 @@ watch(() => props.listData, (val) => {
                 background-size: 100% 100%;
                 cursor: pointer;
 
-                .label {
+                .box-label {
                     position: absolute;
                     left: 50%;
-                    top: 0;
+                    top: 2px;
                     transform: translate(-50%);
-                    font-size: 16px;
                     color: #fff;
                 }
 

src/views/vent/monitorManager/alarmMonitor/fire/mainWell.vue

@@ -23,12 +23,12 @@
                 </div>
                 <div class="contents">
                     <div class="text">
-                        <span class="label">位置 : </span>
-                        <span class="value">{{ topContent.position }}</span>
+                        <span class="text-label">位置 : </span>
+                        <span class="text-value">{{ topContent.position }}</span>
                     </div>
                     <div class="text">
-                        <span class="label">时间 : </span>
-                        <span class="value">{{ topContent.time }}</span>
+                        <span class="text-label">时间 : </span>
+                        <span class="text-value">{{ topContent.time }}</span>
                     </div>
                 </div>
             </div>
@@ -41,7 +41,7 @@
         <div class="center-box" v-if="strType!='sys_coalseam'">
             <div class="content-box" v-for="(items, index) in tabList" :key="index">
                 <div class="title">
-                    <span class="label">{{ items.label }}</span>
+                    <span class="title-label">{{ items.label }}</span>
                     <span class="details">{{ `${items.details}>>` }}</span>
                 </div>
                 <div class="content">
@@ -64,7 +64,7 @@
         <div  :class="listData.fiber.length!=0 ? 'center-box1' : 'center-box2'" v-if="strType=='sys_coalseam'">
             <div class="content-box" v-for="(items, index) in tabLists" :key="index">
                 <div class="title">
-                    <span class="label">{{ items.label }}</span>
+                    <span class="title-label">{{ items.label }}</span>
                     <span class="details">{{ `${items.details}>>` }}</span>
                 </div>
                 <div class="content">
@@ -103,10 +103,13 @@
             <div class="card-btn">
                 <div :class="activeIndex == index ? 'content-box1' : 'content-box'" v-for="(item, index) in mbList" :key="index"
                     @click="btnClick(item, index)">
-                    <div class="label">{{ item.label }}</div>
+                    <div class="btn-label">
+                        <span>{{ item.label }}</span>
+                        <span>{{ item.dw }}</span>
+                    </div>
                     <div class="box-item box-item1">
                         <span class="text-t">{{ `${item.label1}:` }}</span>
-                        <span class="text-v">{{ `${item.nd}%` }}</span>
+                        <span class="text-v">{{ item.nd }}</span>
                     </div>
                     <div class="box-item box-item2">
                         <span class="text-t">{{ `${item.label2}:` }}</span>
@@ -158,6 +161,7 @@ let type = ref('O₂')
 let mbList = reactive([
     {
         label: 'O₂',
+        dw:'(%)',
         label1: '浓度',
         label2: '时间',
         label3: '位置',
@@ -167,6 +171,7 @@ let mbList = reactive([
     },
     {
         label: 'CO',
+        dw:'(ppm)',
         label1: '浓度',
         label2: '时间',
         label3: '位置',
@@ -176,6 +181,7 @@ let mbList = reactive([
     },
     {
         label: 'CO₂',
+        dw:'(%)',
         label1: '浓度',
         label2: '时间',
         label3: '位置',
@@ -185,6 +191,7 @@ let mbList = reactive([
     },
     {
         label: 'CH₄',
+        dw:'(%)',
         label1: '浓度',
         label2: '时间',
         label3: '位置',
@@ -194,6 +201,7 @@ let mbList = reactive([
     },
     {
         label: 'C₂H₂',
+        dw:'(ppm)',
         label1: '浓度',
         label2: '时间',
         label3: '位置',
@@ -203,6 +211,7 @@ let mbList = reactive([
     },
     {
         label: 'C₂H₄',
+        dw:'(ppm)',
         label1: '浓度',
         label2: '时间',
         label3: '位置',
@@ -547,12 +556,12 @@ watch(() => props.listData, (val) => {
                     .text {
                         font-size: 18px;
 
-                        .label {
+                        .text-label {
                             color: #b3b8cc;
                             font-weight: bold;
                         }
 
-                        .value {
+                        .text-value {
                             font-family: 'douyuFont';
                             color: #3df6ff;
                             margin-left: 10px;
@@ -599,7 +608,7 @@ watch(() => props.listData, (val) => {
                 justify-content: space-between;
                 align-items: center;
 
-                .label {
+                .title-label {
                     // font-family: 'douyuFont';
                     font-size: 16px;
                     color: #fff;
@@ -652,7 +661,7 @@ watch(() => props.listData, (val) => {
                 justify-content: space-between;
                 align-items: center;
 
-                .label {
+                .title-label {
                     font-size: 16px;
                     color: #fff;
                 }
@@ -703,7 +712,7 @@ watch(() => props.listData, (val) => {
                 justify-content: space-between;
                 align-items: center;
 
-                .label {
+                .title-label {
                     font-size: 16px;
                     color: #fff;
                 }
@@ -796,7 +805,7 @@ watch(() => props.listData, (val) => {
                 background-size: 100% 100%;
                 cursor: pointer;
 
-                .label {
+                .btn-label {
                     position: absolute;
                     left: 50%;
                     top: 0;
@@ -856,7 +865,7 @@ watch(() => props.listData, (val) => {
                 background-size: 100% 100%;
                 cursor: pointer;
 
-                .label {
+                .btn-label {
                     position: absolute;
                     left: 50%;
                     top: 0;