From 6ca65657914e3c3b53c0b811de48f6717687109e Mon Sep 17 00:00:00 2001
From: shijing <sj_mzw@163.com>
Date: Wed, 28 Feb 2024 16:02:08 +0800
Subject: [PATCH] =?UTF-8?q?=E6=99=BA=E8=83=BD=E7=AE=A1=E7=90=86=E8=A1=A8?=
 =?UTF-8?q?=E5=A4=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../bigScreen/enpComponents/smarg_trans.vue   |   5 +-
 src/views/bigScreen/enpComponents/smartg.vue  |   2 +-
 .../enpComponents/smartg_carwash.vue          |   8 +-
 .../bigScreen/enpComponents/smartg_prod.vue   |   5 +-
 src/views/bigScreen/index_enp_blue.vue        | 647 +++++++++---------
 5 files changed, 339 insertions(+), 328 deletions(-)

diff --git a/src/views/bigScreen/enpComponents/smarg_trans.vue b/src/views/bigScreen/enpComponents/smarg_trans.vue
index c80385f0..43acd983 100644
--- a/src/views/bigScreen/enpComponents/smarg_trans.vue
+++ b/src/views/bigScreen/enpComponents/smarg_trans.vue
@@ -1,6 +1,6 @@
 <template>
     <el-container>
-        <el-header>
+        <el-header class="searchWrap">
             <div class="left-panel">
                 <el-select v-model="query.mgroup" placeholder="工段 " @change="handleQuery" clearable>
                     <el-option v-for="item in mgroupOptions" :key="item" :label="item.name" :value="item.id"></el-option>
@@ -105,7 +105,8 @@ export default {
     font-size: 14px;
     font-weight: 400;
     margin-right: 10px;
-    display: flex
+    display: flex;
+    align-items: center;
 }
 
 .radio {
diff --git a/src/views/bigScreen/enpComponents/smartg.vue b/src/views/bigScreen/enpComponents/smartg.vue
index 0fc4b43e..f37ddad4 100644
--- a/src/views/bigScreen/enpComponents/smartg.vue
+++ b/src/views/bigScreen/enpComponents/smartg.vue
@@ -1,6 +1,6 @@
 <template>
     <el-container>
-        <el-header>
+        <el-header class="panel_title">
             <el-menu mode="horizontal" :default-active="activeIndex" :ellipsis="false" @select="handleSelect">
                 <el-menu-item index="1">厂区环境治理</el-menu-item>
                 <el-menu-item index="2">生产过程治理</el-menu-item>
diff --git a/src/views/bigScreen/enpComponents/smartg_carwash.vue b/src/views/bigScreen/enpComponents/smartg_carwash.vue
index 85b3086f..7d4f8b25 100644
--- a/src/views/bigScreen/enpComponents/smartg_carwash.vue
+++ b/src/views/bigScreen/enpComponents/smartg_carwash.vue
@@ -1,8 +1,8 @@
 <template>
     <el-container>
-        <el-aside width="70%">
+        <el-aside width="69%" style="margin-right:1%;border-right:0">
             <el-container>
-                <el-header>
+                <el-header class="searchWrap">
                     <div class="left-panel">
                         <div class="left-panel">洗车行为统计</div>
                     </div>
@@ -30,12 +30,12 @@
         </el-aside>
         <el-main class="nopadding">
             <el-container>
-                <el-header>
+                <el-header class="searchWrap">
                     <div class="left-panel">环卫车智能调度</div>
                 </el-header>
                 <el-main class="nopadding">
                     <el-container>
-                        <el-header>
+                        <el-header class="">
                             <div class="left-panel">
                                 <span>厂区环境(PM10):</span>
                                 <span style="color: green"> 36ug/m3</span>
diff --git a/src/views/bigScreen/enpComponents/smartg_prod.vue b/src/views/bigScreen/enpComponents/smartg_prod.vue
index c0207c2f..6d8b33b1 100644
--- a/src/views/bigScreen/enpComponents/smartg_prod.vue
+++ b/src/views/bigScreen/enpComponents/smartg_prod.vue
@@ -1,6 +1,6 @@
 <template>
     <el-container>
-        <el-header>
+        <el-header class="searchWrap">
             <div class="left-panel">
                 <el-select v-model="query.mgroup" placeholder="工段 " @change="handleQuery" clearable>
                     <el-option v-for="item in mgroupOptions" :key="item" :label="item.name" :value="item.id"></el-option>
@@ -105,7 +105,8 @@ export default {
     font-size: 14px;
     font-weight: 400;
     margin-right: 10px;
-    display: flex
+    display: flex;
+    align-items: center;
 }
 
 .radio {
diff --git a/src/views/bigScreen/index_enp_blue.vue b/src/views/bigScreen/index_enp_blue.vue
index d6b9c70a..4af91eee 100644
--- a/src/views/bigScreen/index_enp_blue.vue
+++ b/src/views/bigScreen/index_enp_blue.vue
@@ -1,340 +1,342 @@
 <template>
-  <div class="dashboard">
-    <header>
-      <div class="headerImg">
-        <img src="img/enp_blue/header_enp.png" style="width:100%;">
-        <div class="sysName">
-          水泥有限公司</div>
-      </div>
-      <div class="login_config" style="z-index:1000;position: absolute;right: 1vw;bottom: 0;">
-        <el-button :icon="config.dark ? 'el-icon-sunny' : 'el-icon-moon'" circle type="info"
-          @click="configDark"></el-button>
+  <div class="dashboard" style="height:100%">
+    <el-container style="height:100%">
+      <el-header style="height:8vh">
+        <div class="headerImg">
+          <img src="img/enp_blue/header_enp.png" style="width:100%;height:100%">
+          <div class="sysName">{{ this.$TOOL.data.get("BASE_INFO").base.base_name }}</div>
+        </div>
+        <!-- <div class="login_config" style="z-index:1000;position: absolute;right: 1vw;bottom: 0;">
+          <el-button :icon="config.dark ? 'el-icon-sunny' : 'el-icon-moon'" circle type="info"
+            @click="configDark"></el-button>
 
-      </div>
-      <div style="position: absolute;top:0.7vh;height:6vh">
-        <div style="display: flex;padding-top: 1vh;margin-left: 1vw;">
-          <div :class="bindClass(0)" @click="menuClick(0)">
-            <div class="menuItem">首页</div>
-          </div>
-          <div :class="bindClass(1)">
-            <div class="menuItem">
-              <el-dropdown class="dropdown" trigger="click" @command="handleClick">
-                <span class="el-dropdown-link">
-                  有组织排放管理
-                </span>
-                <template #dropdown>
-                  <el-dropdown-menu class="enpMenu">
-                    <el-dropdown-item command="paikou">排放口清单</el-dropdown-item>
-                    <el-dropdown-item command="cems">CEMS监测清单</el-dropdown-item>
-                    <el-dropdown-item command="cems2">CEMS监测预警</el-dropdown-item>
-                    <el-dropdown-item command="cemsExport">CEMS报表导出</el-dropdown-item>
-                  </el-dropdown-menu>
-                </template>
-              </el-dropdown>
+        </div> -->
+        <div style="position: absolute;top:0.7vh;height:6vh">
+          <div style="display: flex;padding-top: 1vh;margin-left: 1vw;">
+            <div :class="bindClass(0)" @click="menuClick(0)">
+              <div class="menuItem">首页</div>
             </div>
-          </div>
-          <div :class="bindClass(2)">
-            <div class="menuItem">
-              <el-dropdown class="dropdown" trigger="click" @command="handleClick2">
-                <span class="el-dropdown-link">
-                  无组织排放管理
-                </span>
-                <template #dropdown>
-                  <el-dropdown-menu class="enpMenu">
-                    <el-dropdown-item command="pollutant">污染源清单</el-dropdown-item>
-                    <el-dropdown-item command="pollutant2">污染源监测</el-dropdown-item>
-                    <el-dropdown-item command="smartg">智能治理</el-dropdown-item>
-                  </el-dropdown-menu>
-                </template>
-              </el-dropdown>
+            <div :class="bindClass(1)">
+              <div class="menuItem">
+                <el-dropdown class="dropdown" trigger="click" @command="handleClick">
+                  <span class="el-dropdown-link">
+                    有组织排放管理
+                  </span>
+                  <template #dropdown>
+                    <el-dropdown-menu class="enpMenu">
+                      <el-dropdown-item command="paikou">排放口清单</el-dropdown-item>
+                      <el-dropdown-item command="cems">CEMS监测清单</el-dropdown-item>
+                      <el-dropdown-item command="cems2">CEMS监测预警</el-dropdown-item>
+                      <el-dropdown-item command="cemsExport">CEMS报表导出</el-dropdown-item>
+                    </el-dropdown-menu>
+                  </template>
+                </el-dropdown>
+              </div>
+            </div>
+            <div :class="bindClass(2)">
+              <div class="menuItem">
+                <el-dropdown class="dropdown" trigger="click" @command="handleClick2">
+                  <span class="el-dropdown-link">
+                    无组织排放管理
+                  </span>
+                  <template #dropdown>
+                    <el-dropdown-menu class="enpMenu">
+                      <el-dropdown-item command="pollutant">污染源清单</el-dropdown-item>
+                      <el-dropdown-item command="pollutant2">污染源监测</el-dropdown-item>
+                      <el-dropdown-item command="smartg">智能治理</el-dropdown-item>
+                    </el-dropdown-menu>
+                  </template>
+                </el-dropdown>
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div style="position: absolute;top:0.7vh;right: 8px;height: 6vh;">
-        <div style="display: flex;padding-top:  1vh;padding-right:  1vw;justify-content: flex-end;">
-          <div :class="bindClass(3)">
-            <div class="menuItem">
-              <el-dropdown class="dropdown" trigger="click" @command="handleClick3">
-                <span class="el-dropdown-link">
-                  清洁运输
-                </span>
-                <template #dropdown>
-                  <el-dropdown-menu class="enpMenu">
-                    <el-dropdown-item command="transport">厂外运输</el-dropdown-item>
-                    <el-dropdown-item command="innerClean">厂内清洁</el-dropdown-item>
-                  </el-dropdown-menu>
-                </template>
-              </el-dropdown>
+        <div style="position: absolute;top:0.7vh;right: 8px;height: 6vh;">
+          <div style="display: flex;padding-top:  1vh;padding-right:  1vw;justify-content: flex-end;">
+            <div :class="bindClass(3)">
+              <div class="menuItem">
+                <el-dropdown class="dropdown" trigger="click" @command="handleClick3">
+                  <span class="el-dropdown-link">
+                    清洁运输
+                  </span>
+                  <template #dropdown>
+                    <el-dropdown-menu class="enpMenu">
+                      <el-dropdown-item command="transport">厂外运输</el-dropdown-item>
+                      <el-dropdown-item command="innerClean">厂内清洁</el-dropdown-item>
+                    </el-dropdown-menu>
+                  </template>
+                </el-dropdown>
+              </div>
             </div>
-          </div>
-          <div :class="bindClass(4)" @click="menuClick(4)">
-            <!-- <div class="menuItem">环保管理</div> -->
-            <div class="menuItem">
-              <el-dropdown class="dropdown" trigger="click" @command="handleClick4">
-                <span class="el-dropdown-link">
-                  环保管理
-                </span>
-                <template #dropdown>
-                  <el-dropdown-menu class="enpMenu">
-                    <el-dropdown-item command="envirmonitor">环境监测清单</el-dropdown-item>
-                    <el-dropdown-item command="envirqualmonitor">环境质量监测</el-dropdown-item>
-                    <!-- <el-dropdown-item command="pollutecalendar">污染日历</el-dropdown-item> -->
-                    <!-- <el-dropdown-item command="">决策分析</el-dropdown-item> -->
-                  </el-dropdown-menu>
-                </template>
-              </el-dropdown>
+            <div :class="bindClass(4)" @click="menuClick(4)">
+              <!-- <div class="menuItem">环保管理</div> -->
+              <div class="menuItem">
+                <el-dropdown class="dropdown" trigger="click" @command="handleClick4">
+                  <span class="el-dropdown-link">
+                    环保管理
+                  </span>
+                  <template #dropdown>
+                    <el-dropdown-menu class="enpMenu">
+                      <el-dropdown-item command="envirmonitor">环境监测清单</el-dropdown-item>
+                      <el-dropdown-item command="envirqualmonitor">环境质量监测</el-dropdown-item>
+                      <!-- <el-dropdown-item command="pollutecalendar">污染日历</el-dropdown-item> -->
+                      <!-- <el-dropdown-item command="">决策分析</el-dropdown-item> -->
+                    </el-dropdown-menu>
+                  </template>
+                </el-dropdown>
+              </div>
             </div>
-          </div>
-          <div :class="bindClass(5)" @click="menuClick(5)">
-            <!-- <div class="menuItem">台账管理</div> -->
-            <div class="menuItem">
-              <el-dropdown class="dropdown" trigger="click" @command="handleClick5">
-                <span class="el-dropdown-link">
-                  台账管理
-                </span>
-                <template #dropdown>
-                  <el-dropdown-menu class="enpMenu">
-                    <el-dropdown-item command="eqments">设备清单</el-dropdown-item>
-                    <el-dropdown-item command="alarmrecord">报警记录 </el-dropdown-item>
-                    <el-dropdown-item command="video">视屏墙 </el-dropdown-item>
-                  </el-dropdown-menu>
-                </template>
-              </el-dropdown>
+            <div :class="bindClass(5)" @click="menuClick(5)">
+              <!-- <div class="menuItem">台账管理</div> -->
+              <div class="menuItem">
+                <el-dropdown class="dropdown" trigger="click" @command="handleClick5">
+                  <span class="el-dropdown-link">
+                    台账管理
+                  </span>
+                  <template #dropdown>
+                    <el-dropdown-menu class="enpMenu">
+                      <el-dropdown-item command="eqments">设备清单</el-dropdown-item>
+                      <el-dropdown-item command="alarmrecord">报警记录 </el-dropdown-item>
+                      <el-dropdown-item command="video">视屏墙 </el-dropdown-item>
+                    </el-dropdown-menu>
+                  </template>
+                </el-dropdown>
+              </div>
             </div>
+            <div class="wraning_icon"></div>
+            <div class="user_icon" @click="backSystem"></div>
           </div>
-          <div class="wraning_icon"></div>
-          <div class="user_icon" @click="backSystem"></div>
         </div>
-      </div>
-    </header>
-    <el-main style="padding:0;overflow: hidden;">
-      <div v-show="activeIndex == 0" class="model" style="">
-        <div id="loadingScreen">
+      </el-header>
+      <el-main style="padding:0;">
+        <div v-show="activeIndex == 0" class="model" style="">
+          <!-- <div id="loadingScreen">
           <el-progress type="circle" :percentage="loadedPercent" :width=220 status="warning">
             <template #default="{ percentage }">
               <div style="font-size: 30px; color: white; font-weight: bold">{{ percentage }}%</div>
               <div style="font-size: 18px; color: white; margin-top: 10px">工厂模型加载中</div>
             </template>
           </el-progress>
+        </div> -->
+          <Cesium />
+          <!-- <canvas id="renderCanvas"></canvas> -->
         </div>
-        <Cesium />
-        <canvas id="renderCanvas"></canvas>
-      </div>
-      <!-- 左侧列表数据 -->
-      <div v-show="activeIndex == 0" class="left_other animate__animated animate__backInLeft">
-        <!-- 无组织污染源一览 -->
-        <div class="panel panel1">
-          <div class="blockTitle">
-            <div class="blockTitleText">无组织污染源一览</div>
-            <img class="blockTitleImg" src="img/enp_blue/block_title.png">
-          </div>
-          <div style="display: flex;">
-            <div style="padding:0.5vw">
-              <div class="chart" id="chart1" style="width:7vw;height:7vw;"></div>
+        <!-- 左侧列表数据 -->
+        <div v-show="activeIndex == 0" class="left_other animate__animated animate__backInLeft">
+          <!-- 无组织污染源一览 -->
+          <div class="panel panel1">
+            <div class="blockTitle">
+              <div class="blockTitleText">无组织污染源一览</div>
+              <img class="blockTitleImg" src="img/enp_blue/block_title.png">
             </div>
-            <div style="width: 60%;">
-              <div class="pieDataItem">
-                <div class="pieDataText">总计</div>
-                <div class="pieDataNumber">{{ wryData.count }}</div>
+            <div style="display: flex;">
+              <div style="padding:0.5vw">
+                <div class="chart" id="chart1" style="width:7vw;height:7vw;"></div>
               </div>
-              <div class="pieDataItem">
-                <div class="pieDataText">生产工艺过程</div>
-                <div class="pieDataNumber">{{ wryData.count_mtrans }}</div>
-              </div>
-              <div class="pieDataItem">
-                <div class="pieDataText">物料储存</div>
-                <div class="pieDataNumber">{{ wryData.count_mstore }}</div>
-              </div>
-              <div class="pieDataItem">
-                <div class="pieDataText">物料输送</div>
-                <div class="pieDataNumber">{{ wryData.count_product }}</div>
+              <div style="width: 60%;">
+                <div class="pieDataItem">
+                  <div class="pieDataText">总计</div>
+                  <div class="pieDataNumber">{{ wryData.count }}</div>
+                </div>
+                <div class="pieDataItem">
+                  <div class="pieDataText">生产工艺</div>
+                  <div class="pieDataNumber">{{ wryData.count_mtrans }}</div>
+                </div>
+                <div class="pieDataItem">
+                  <div class="pieDataText">物料储存</div>
+                  <div class="pieDataNumber">{{ wryData.count_mstore }}</div>
+                </div>
+                <div class="pieDataItem">
+                  <div class="pieDataText">物料输送</div>
+                  <div class="pieDataNumber">{{ wryData.count_product }}</div>
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <!-- 接入设备数量总览 -->
-        <div class="panel panel2">
-          <div class="blockTitle">
-            <div class="blockTitleText">接入设备数量总览</div>
-            <img class="blockTitleImg" src="img/enp_blue/block_title.png">
-          </div>
-          <div style="display: flex;padding: 1vh 1vw;">
-            <div style="width: 50%;">
-              <div class="eqItem">
-                <img class="eqImg" src="img/enp_blue/eq_s.svg">
-                <div class="eqText">
-                  <div class="eqName">生产设备</div>
-                  <div class="eqNumWrap"><span class="eqNum">{{ eqNumData.sc }}</span>台</div>
-                </div>
-              </div>
-              <div class="eqItem">
-                <img class="eqImg" src="img/enp_blue/eq_v.svg">
-                <div class="eqText">
-                  <div class="eqName">监测设备</div>
-                  <div class="eqNumWrap"><span class="eqNum">{{ eqNumData.jc }}</span>台</div>
-                </div>
-              </div>
+          <!-- 接入设备数量总览 -->
+          <div class="panel panel2">
+            <div class="blockTitle">
+              <div class="blockTitleText">接入设备数量总览</div>
+              <img class="blockTitleImg" src="img/enp_blue/block_title.png">
             </div>
-            <div style="width: 50%;">
-              <div class="eqItem">
-                <img class="eqImg " src="img/enp_blue/eq_z.svg">
-                <div class="eqText">
-                  <div class="eqName">治理设备</div>
-                  <div class="eqNumWrap"><span class="eqNum">{{ eqNumData.zl }}</span>台</div>
+            <div style="display: flex;padding: 1vh 1vw;">
+              <div style="width: 50%;height:100%">
+                <div class="eqItem">
+                  <img class="eqImg" src="img/enp_blue/eq_s.svg">
+                  <div class="eqText">
+                    <div class="eqName">生产设备</div>
+                    <div class="eqNumWrap"><span class="eqNum">{{ eqNumData.sc }}</span>台</div>
+                  </div>
+                </div>
+                <div class="eqItem">
+                  <img class="eqImg" src="img/enp_blue/eq_v.svg">
+                  <div class="eqText">
+                    <div class="eqName">监测设备</div>
+                    <div class="eqNumWrap"><span class="eqNum">{{ eqNumData.jc }}</span>台</div>
+                  </div>
                 </div>
               </div>
-              <div class="eqItem">
-                <img class="eqImg" src="img/enp_blue/eq_c.svg">
-                <div class="eqText">
-                  <div class="eqName">监控设备</div>
-                  <div class="eqNumWrap"><span class="eqNum">{{ eqNumData.jk }}</span>台</div>
+              <div style="width: 50%;height:100%">
+                <div class="eqItem">
+                  <img class="eqImg " src="img/enp_blue/eq_z.svg">
+                  <div class="eqText">
+                    <div class="eqName">治理设备</div>
+                    <div class="eqNumWrap"><span class="eqNum">{{ eqNumData.zl }}</span>台</div>
+                  </div>
                 </div>
-              </div>
-              <!-- <div class="eqItem">
+                <div class="eqItem">
+                  <img class="eqImg" src="img/enp_blue/eq_c.svg">
+                  <div class="eqText">
+                    <div class="eqName">监控设备</div>
+                    <div class="eqNumWrap"><span class="eqNum">{{ eqNumData.jk }}</span>台</div>
+                  </div>
+                </div>
+                <!-- <div class="eqItem">
                 <img class="eqImg eqImg_s" src="img/enp_blue/hjzljc.svg">
                 <div class="eqText eqText_s">
                   <div class="eqName">环境质量检测</div>
                   <div class="eqNumWrap"><span class="eqNum">9</span>台</div>
                 </div>
               </div> -->
+              </div>
+            </div>
+          </div>
+          <!-- 主要排放口实时监测清单 -->
+          <div class="panel panel3">
+            <div class="blockTitle">
+              <div class="blockTitleText">主要排放口实时监测清单</div>
+              <img class="blockTitleImg" src="img/enp_blue/block_title.png">
+            </div>
+            <div>
+              <div class="title_s">{{ cemsData.equipment_name }}</div>
+              <div class="status"><span style="color:#32D74B">数据正常</span><span>2024-01-26 14:32:06</span></div>
+              <div class="tableHear" style="padding: 0 1vh;">
+                <div style="flex:1;height:1vh"></div>
+                <div style="flex:5;margin: 0 1vh;">项目</div>
+                <div style="flex:2">实测</div>
+                <div style="flex:2">折算</div>
+              </div>
+              <div class="rowItem">
+                <div class="rowindex">1</div>
+                <div class="rowname">颗粒物(mg/m³)</div>
+                <div class="rownum">1</div>
+              </div>
+              <div class="rowItem">
+                <div class="rowindex">2</div>
+                <div class="rowname">SO₂(mg/m³)</div>
+                <div class="rownum">2</div>
+              </div>
+              <div class="rowItem">
+                <div class="rowindex">3</div>
+                <div class="rowname">NOx(mg/m³)</div>
+                <div class="rownum">3</div>
+              </div>
             </div>
           </div>
         </div>
-        <!-- 主要排放口实时监测清单 -->
-        <div class="panel panel3">
-          <div class="blockTitle">
-            <div class="blockTitleText">主要排放口实时监测清单</div>
-            <img class="blockTitleImg" src="img/enp_blue/block_title.png">
-          </div>
-          <div>
-            <div class="title_s">{{ cemsData.equipment_name }}</div>
-            <div class="status"><span style="color:#32D74B">数据正常</span><span>2024-01-26 14:32:06</span></div>
-            <div class="tableHear" style="padding: 0 1vh;">
-              <div style="flex:1;height:1vh"></div>
-              <div style="flex:5;margin: 0 1vh;">项目</div>
-              <div style="flex:2">实测</div>
-              <div style="flex:2">折算</div>
-            </div>
-            <div class="rowItem">
-              <div class="rowindex">1</div>
-              <div class="rowname">颗粒物(mg/m³)</div>
-              <div class="rownum">1</div>
-            </div>
-            <div class="rowItem">
-              <div class="rowindex">2</div>
-              <div class="rowname">SO₂(mg/m³)</div>
-              <div class="rownum">2</div>
-            </div>
-            <div class="rowItem">
-              <div class="rowindex">3</div>
-              <div class="rowname">NOx(mg/m³)</div>
-              <div class="rownum">3</div>
+        <!-- 右侧数据 -->
+        <div v-show="activeIndex == 0" class="right_other animate__animated animate__backInRight">
+          <!-- 统计 -->
+          <div class="panel panel4" style="box-sizing:border-box;padding:0 1vh">
+            <div class="right_one">
+              <div class="leftNumbers">
+                <div class="numberItem">
+                  <div class="numberItemName">含氧量</div>
+                  <div><span class="numberItemNum">1.56</span><span class="numberItemUnit">%</span></div>
+                </div>
+                <div class="numberItem">
+                  <div class="numberItemName">温度</div>
+                  <div><span class="numberItemNum">73.5</span><span class="numberItemUnit">℃</span></div>
+                </div>
+                <div class="numberItem">
+                  <div class="numberItemName">流速</div>
+                  <div><span class="numberItemNum">4.185</span><span class="numberItemUnit">m/s</span></div>
+                </div>
+              </div>
+              <div class="rightNumbers">
+                <div class="numberItem">
+                  <div class="numberItemName">压力</div>
+                  <div><span class="numberItemNum">721.215 </span><span class="numberItemUnit">KPa</span></div>
+                </div>
+                <div class="numberItem">
+                  <div class="numberItemName">湿度</div>
+                  <div><span class="numberItemNum">3.615 </span><span class="numberItemUnit">%RH</span> </div>
+                </div>
+                <div class="numberItem">
+                  <div class="numberItemName">流量</div>
+                  <div>-</div>
+                </div>
+              </div>
+              <div class="ballImg">
+                <span class="right_one_status">正常</span>
+              </div>
             </div>
           </div>
-        </div>
-      </div>
-      <!-- 右侧数据 -->
-      <div v-show="activeIndex == 0" class="right_other animate__animated animate__backInRight">
-        <!-- 统计 -->
-        <div class="panel panel4" style="box-sizing:border-box;padding:0 1vh">
-          <div class="right_one">
-            <div class="leftNumbers">
-              <div class="numberItem">
-                <div class="numberItemName">含氧量</div>
-                <div><span class="numberItemNum">1.56</span><span class="numberItemUnit">%</span></div>
-              </div>
-              <div class="numberItem">
-                <div class="numberItemName">温度</div>
-                <div><span class="numberItemNum">73.5</span><span class="numberItemUnit">℃</span></div>
-              </div>
-              <div class="numberItem">
-                <div class="numberItemName">流速</div>
-                <div><span class="numberItemNum">4.185</span><span class="numberItemUnit">m/s</span></div>
-              </div>
+          <!-- 环境质量实时监测清单 -->
+          <div class="panel panel_big panel5">
+            <div class="blockTitle">
+              <div class="blockTitleText">环境质量实时监测清单</div>
+              <img class="blockTitleImg" src="img/enp_blue/block_title.png">
             </div>
-            <div class="rightNumbers">
-              <div class="numberItem">
-                <div class="numberItemName">压力</div>
-                <div><span class="numberItemNum">721.215 </span><span class="numberItemUnit">KPa</span></div>
+            <div>
+              <div class="tableHear" style="margin-top:1vh;height:2.6vh;line-height:2.6vh;display:flex;padding:1vh">
+                <div style="flex:2">项目</div>
+                <div style="flex:1">PM10(μg/m³)</div>
+                <div style="flex:1">PM2.5(μg/m³)</div>
               </div>
-              <div class="numberItem">
-                <div class="numberItemName">湿度</div>
-                <div><span class="numberItemNum">3.615 </span><span class="numberItemUnit">%RH</span> </div>
-              </div>
-              <div class="numberItem">
-                <div class="numberItemName">流量</div>
-                <div>-</div>
-              </div>
-            </div>
-            <div class="ballImg">
-              <span class="right_one_status">正常</span>
-            </div>
-          </div>
-        </div>
-        <!-- 环境质量实时监测清单 -->
-        <div class="panel panel_big panel5">
-          <div class="blockTitle">
-            <div class="blockTitleText">环境质量实时监测清单</div>
-            <img class="blockTitleImg" src="img/enp_blue/block_title.png">
-          </div>
-          <div>
-            <div class="tableHear" style="margin-top:1vh;height:2.6vh;line-height:2.6vh;display:flex;padding:1vh">
-              <div style="flex:2">项目</div>
-              <div style="flex:1">PM10(μg/m³)</div>
-              <div style="flex:1">PM2.5(μg/m³)</div>
-            </div>
-            <div class="tableBody">
-              <div v-for="item in wData" :key="item">
-                <div class="badyItem">
-                  <div style="flex:2">
-                    <img src="img/enp_blue/listImg.png"
-                      style="width:2vh;height:2vh;margin:1.2vh 1vh;vertical-align:middle">
-                    <span>{{ item.name }}</span>
+              <div class="tableBody">
+                <div v-for="item in wData" :key="item">
+                  <div class="badyItem">
+                    <div style="flex:2">
+                      <img src="img/enp_blue/listImg.png"
+                        style="width:2vh;height:2vh;margin:1.2vh 1vh;vertical-align:middle">
+                      <span>{{ item.name }}</span>
+                    </div>
+                    <span style="flex:1">{{ item.pm10 }}</span>
+                    <span style="flex:1">{{ item.pm25 }}</span>
                   </div>
-                  <span style="flex:1">{{ item.pm10 }}</span>
-                  <span style="flex:1">{{ item.pm25 }}</span>
                 </div>
               </div>
             </div>
           </div>
         </div>
-      </div>
-      <div v-show="activeIndex == 0" class="left_border"></div>
-      <div v-show="activeIndex == 0" class="right_border"></div>
-      <div v-show="activeIndex == 0" class="btns_enp">
-        <div class="btns" :class="bindBtnClass(0)">生产设备</div>
-        <div class="btns" :class="bindBtnClass(1)">治理设备</div>
-        <div class="btns" :class="bindBtnClass(2)">监测设备</div>
-        <div class="btns" :class="bindBtnClass(3)">监控设备</div>
-        <div class="btns" :class="bindBtnClass(4)">环境监测</div>
-      </div>
-      <div v-show="activeIndex == 0" class="bottom_enp"></div>
-      <div v-if="activeIndex != 0" class="container">
-        <el-drawer v-model="elDrawer" :modal="false" :close-on-click-modal="false" size="95%" :with-header="false"
-          direction="ltr" :show-close="false" id="enpElDrawer">
-          <!-- <div class="sysName">智能环保一体化管控平台</div> -->
-          <org-dialog v-if="activeDrawerName == 'paikou'" @close="closeDialog"></org-dialog>
-          <cems-drawer v-else-if="activeDrawerName == 'cems'" @close="closeDialog"></cems-drawer>
-          <cems2-drawer v-else-if="activeDrawerName == 'cems2'" @close="closeDialog"></cems2-drawer>
-          <cems-export v-else-if="activeDrawerName == 'cemsExport'" @close="closeDialog"></cems-export>
-          <pollutant v-else-if="activeDrawerName == 'pollutant'" @close="closeDialog"></pollutant>
-          <!-- 运输清洁 -->
-          <transport v-else-if="activeDrawerName == 'transport'" @close="closeDialog"></transport>
-          <innerclean v-else-if="activeDrawerName == 'innerClean'" @close="closeDialog"></innerclean>
-          <!-- 环保管理 -->
-          <envirqualmonitor v-else-if="activeDrawerName == 'envirqualmonitor'" @close="closeDialog"></envirqualmonitor>
-          <envirmonitor v-else-if="activeDrawerName == 'envirmonitor'" @close="closeDialog"></envirmonitor>
-          <pollutecalendar v-else-if="activeDrawerName == 'pollutecalendar'" @close="closeDialog"></pollutecalendar>
-          <!-- 台账管理 -->
-          <eqments v-else-if="activeDrawerName == 'eqments'" @close="closeDialog"></eqments>
-          <alarmrecord v-else-if="activeDrawerName == 'alarmrecord'" @close="closeDialog"></alarmrecord>
-          <pollutant2 v-else-if="activeDrawerName == 'pollutant2'" @close="closeDialog"></pollutant2>
-          <smartg v-else-if="activeDrawerName == 'smartg'" @close="closeDialog"></smartg>
-          <videowall v-else-if="activeDrawerName == 'video'" @close="closeDialog"></videowall>
-        </el-drawer>
-      </div>
-    </el-main>
+        <!-- <div v-show="activeIndex == 0" class="left_border"></div> -->
+        <!-- <div v-show="activeIndex == 0" class="right_border"></div> -->
+        <div v-show="activeIndex == 0" class="btns_enp">
+          <div class="btns" :class="bindBtnClass(0)">生产设备</div>
+          <div class="btns" :class="bindBtnClass(1)">治理设备</div>
+          <div class="btns" :class="bindBtnClass(2)">监测设备</div>
+          <div class="btns" :class="bindBtnClass(3)">监控设备</div>
+          <!-- <div class="btns" :class="bindBtnClass(4)">环境监测</div> -->
+        </div>
+        <div v-show="activeIndex == 0" class="bottom_enp"></div>
+        <div v-if="activeIndex != 0" class="container">
+          <el-drawer v-model="elDrawer" :modal="false" :close-on-click-modal="false" size="95%" :with-header="false"
+            direction="ltr" :show-close="false" id="enpElDrawer">
+            <!-- <div class="sysName">智能环保一体化管控平台</div> -->
+            <org-dialog v-if="activeDrawerName == 'paikou'" @close="closeDialog"></org-dialog>
+            <cems-drawer v-else-if="activeDrawerName == 'cems'" @close="closeDialog"></cems-drawer>
+            <cems2-drawer v-else-if="activeDrawerName == 'cems2'" @close="closeDialog"></cems2-drawer>
+            <cems-export v-else-if="activeDrawerName == 'cemsExport'" @close="closeDialog"></cems-export>
+            <pollutant v-else-if="activeDrawerName == 'pollutant'" @close="closeDialog"></pollutant>
+            <!-- 运输清洁 -->
+            <transport v-else-if="activeDrawerName == 'transport'" @close="closeDialog"></transport>
+            <innerclean v-else-if="activeDrawerName == 'innerClean'" @close="closeDialog"></innerclean>
+            <!-- 环保管理 -->
+            <envirqualmonitor v-else-if="activeDrawerName == 'envirqualmonitor'" @close="closeDialog"></envirqualmonitor>
+            <envirmonitor v-else-if="activeDrawerName == 'envirmonitor'" @close="closeDialog"></envirmonitor>
+            <pollutecalendar v-else-if="activeDrawerName == 'pollutecalendar'" @close="closeDialog"></pollutecalendar>
+            <!-- 台账管理 -->
+            <eqments v-else-if="activeDrawerName == 'eqments'" @close="closeDialog"></eqments>
+            <alarmrecord v-else-if="activeDrawerName == 'alarmrecord'" @close="closeDialog"></alarmrecord>
+            <pollutant2 v-else-if="activeDrawerName == 'pollutant2'" @close="closeDialog"></pollutant2>
+            <smartg v-else-if="activeDrawerName == 'smartg'" @close="closeDialog"></smartg>
+            <videowall v-else-if="activeDrawerName == 'video'" @close="closeDialog"></videowall>
+          </el-drawer>
+        </div>
+      </el-main>
+    </el-container>
+
   </div>
 </template>
 <script>
@@ -495,20 +497,24 @@ export default {
       ],
     }
   },
-  watch: {
-    'config.dark'(val) {
-      if (val) {
-        document.documentElement.classList.add("dark")
-        this.$TOOL.data.set("APP_DARK", val)
-      } else {
-        document.documentElement.classList.remove("dark")
-        this.$TOOL.data.remove("APP_DARK")
-      }
-    },
-    'config.lang'(val) {
-      this.$i18n.locale = val
-      this.$TOOL.data.set("APP_LANG", val)
-    }
+  // watch: {
+  //   'config.dark'(val) {
+  //     if (val) {
+  //       document.documentElement.classList.add("dark")
+  //       this.$TOOL.data.set("APP_DARK", val)
+  //     } else {
+  //       document.documentElement.classList.remove("dark")
+  //       this.$TOOL.data.remove("APP_DARK")
+  //     }
+  //   },
+  //   'config.lang'(val) {
+  //     this.$i18n.locale = val
+  //     this.$TOOL.data.set("APP_LANG", val)
+  //   }
+  // },
+  created() {
+    document.documentElement.classList.add("dark")
+    this.$TOOL.data.set("APP_DARK", true)
   },
   mounted() {
     let that = this;
@@ -651,8 +657,8 @@ export default {
         left_other.style.width = '100%';
         right_other.style.position = 'static';
         right_other.style.width = '100%';
-        model.style.position = 'relative';
-        model.style.height = chartHeight;
+        // model.style.position = 'relative';
+        // model.style.height = chartHeight;
         var charts = document.getElementsByClassName('chart')
         for (var i = 0; i < charts.length; i++) {
           var chart = charts[i]
@@ -1155,6 +1161,8 @@ export default {
   },
   unmounted() {
     this.close();
+    document.documentElement.classList.remove("dark");
+    this.$TOOL.data.remove("APP_DARK")
   },
 }
 </script>
@@ -1189,8 +1197,8 @@ header {
 
 .headerImg {
   width: 100%;
-  height: 6.7vh;
-  line-height: 6.3vh;
+  height: 6.6vh;
+  line-height: 6.5vh;
   color: #ffffff;
   font-size: 1.8vw;
   text-align: center;
@@ -1310,6 +1318,7 @@ header {
   top: 8%;
   left: 0;
   width: 100%;
+  height: 100%;
   background-image: url('/public/img/enp_blue/bg_enp.png');
   background-size: cover;
 }
@@ -1393,7 +1402,6 @@ header {
 
 .eqItem {
   display: flex;
-  /* height: 9vh; */
   flex-direction: row;
   justify-content: space-between;
   flex-wrap: nowrap;
@@ -1414,10 +1422,10 @@ header {
 
 .eqText {
   flex: 1;
-  height: 8vh;
+  height: 9vh;
   font-size: 1.4vh;
   padding-left: 0.5vw;
-  margin-bottom: 1vh;
+  margin: 0.5vh 0;
   background: url('/public/img/enp_blue/eq_border2.svg') no-repeat;
   background-size: 100% 100%;
   background-size: contain;
@@ -1441,7 +1449,7 @@ header {
 
 .eqNumWrap {
   font-size: 1.2vh;
-  line-height: 2.5vh;
+  line-height: 3.5vh;
 }
 
 .eqNum {
@@ -1462,24 +1470,25 @@ header {
 
 .pieDataItem {
   width: 50%;
-  height: 35%;
+  height: 49%;
   position: relative;
   display: inline-block;
   margin-top: 10%;
+  padding-left: 0.5vw;
   /* border-left: 1px solid #0070FF; */
 }
 
 .pieDataText {
   height: 2vh;
   line-height: 1.9vh;
-  font-size: 1.1vh;
+  font-size: 1.5vh;
   color: #ffffff;
   padding-left: 0.2vw;
 }
 
 .pieDataItem:nth-of-type(1) {
   .pieDataText {
-    border-left: 0.3vh solid #0091ff;
+    border-left: 0.5vh solid #0091ff;
   }
 
   .pieDataNumber {
@@ -1489,7 +1498,7 @@ header {
 
 .pieDataItem:nth-of-type(2) {
   .pieDataText {
-    border-left: 0.3vh solid #0Ed877;
+    border-left: 0.5vh solid #0Ed877;
   }
 
   .pieDataNumber {
@@ -1499,7 +1508,7 @@ header {
 
 .pieDataItem:nth-of-type(3) {
   .pieDataText {
-    border-left: 0.3vh solid #ffbf60;
+    border-left: 0.5vh solid #ffbf60;
   }
 
   .pieDataNumber {
@@ -1509,7 +1518,7 @@ header {
 
 .pieDataItem:nth-of-type(4) {
   .pieDataText {
-    border-left: 0.3vh solid #67dbff;
+    border-left: 0.5vh solid #67dbff;
   }
 
   .pieDataNumber {