From cf439e471d8cad56214f3ef2692a1580cee7eda4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=AD=A3=E4=B8=87=E4=BF=8A?= <X1y3z1wyx4j051sw>
Date: Mon, 24 Nov 2025 14:23:28 +0800
Subject: [PATCH] =?UTF-8?q?style/=E6=97=A0=E7=94=A8=E6=A0=B7=E5=BC=8F?=
 =?UTF-8?q?=E5=8E=BB=E9=99=A4=EF=BC=8C=E5=A2=9E=E5=8A=A0=E7=AE=A1=E5=BB=8A?=
 =?UTF-8?q?=E4=BB=8B=E7=BB=8D=E5=BC=B9=E7=AA=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env                                   |   19 +
 .env.development                       |   19 +
 .env.production                        |   19 +
 src/layout/components/Sidebar/Logo.vue |    4 +-
 src/views/dashboard/LineChartTpf.vue   |    1 -
 src/views/dashboard/index.vue          | 1443 +-----------------------
 6 files changed, 105 insertions(+), 1400 deletions(-)
 create mode 100644 .env
 create mode 100644 .env.development
 create mode 100644 .env.production

diff --git a/.env b/.env
new file mode 100644
index 0000000..5a2941e
--- /dev/null
+++ b/.env
@@ -0,0 +1,19 @@
+###
+ # @Author: 季万俊
+ # @Date: 2025-09-04 19:58:43
+ # @Description: 
+### 
+# 页面标题
+VITE_APP_TITLE = 智慧管廊综合管理平台软件V1.0
+
+# 开发环境配置
+ENV = 'development'
+
+# 若依管理系统/开发环境
+VITE_APP_BASE_API = '/api'
+VITE_VUE_LOGIN_USERNAME = 'admin'
+VITE_VUE_LOGIN_PASSWORD = 'admin123'
+VITE_VUE_APP_BASE_FILEURL = "http://172.16.1.162:18080/"
+
+# 路由懒加载
+VUE_CLI_BABEL_TRANSPILE_MODULES = true
diff --git a/.env.development b/.env.development
new file mode 100644
index 0000000..5a2941e
--- /dev/null
+++ b/.env.development
@@ -0,0 +1,19 @@
+###
+ # @Author: 季万俊
+ # @Date: 2025-09-04 19:58:43
+ # @Description: 
+### 
+# 页面标题
+VITE_APP_TITLE = 智慧管廊综合管理平台软件V1.0
+
+# 开发环境配置
+ENV = 'development'
+
+# 若依管理系统/开发环境
+VITE_APP_BASE_API = '/api'
+VITE_VUE_LOGIN_USERNAME = 'admin'
+VITE_VUE_LOGIN_PASSWORD = 'admin123'
+VITE_VUE_APP_BASE_FILEURL = "http://172.16.1.162:18080/"
+
+# 路由懒加载
+VUE_CLI_BABEL_TRANSPILE_MODULES = true
diff --git a/.env.production b/.env.production
new file mode 100644
index 0000000..aa919a8
--- /dev/null
+++ b/.env.production
@@ -0,0 +1,19 @@
+###
+ # @Author: 季万俊
+ # @Date: 2025-09-04 19:58:43
+ # @Description: 
+### 
+# 页面标题
+VITE_APP_TITLE = 智慧管廊综合管理平台软件V1.0
+
+# 开发环境配置
+ENV = 'development'
+
+# 若依管理系统/开发环境
+VITE_APP_BASE_API = '/api'
+VITE_VUE_LOGIN_USERNAME = 'admin'
+VITE_VUE_LOGIN_PASSWORD = 'admin123'
+VITE_VUE_APP_BASE_FILEURL = "/"
+
+# 路由懒加载
+VUE_CLI_BABEL_TRANSPILE_MODULES = true
diff --git a/src/layout/components/Sidebar/Logo.vue b/src/layout/components/Sidebar/Logo.vue
index 94e161d..2e01a34 100644
--- a/src/layout/components/Sidebar/Logo.vue
+++ b/src/layout/components/Sidebar/Logo.vue
@@ -29,7 +29,6 @@ defineProps({
     required: true
   }
 })
-console.log(import.meta,"----import.meta.env");
 
 const title = import.meta.env.VITE_APP_TITLE
 const settingsStore = useSettingsStore()
@@ -87,10 +86,11 @@ const getLogoTextColor = computed(() => {
       margin: 0;
       color: v-bind(getLogoTextColor);
       font-weight: 600;
-      line-height: 50px;
+      line-height: 24px;
       font-size: 14px;
       font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
       vertical-align: middle;
+      padding: 0 4px;
     }
   }
 
diff --git a/src/views/dashboard/LineChartTpf.vue b/src/views/dashboard/LineChartTpf.vue
index a805f1e..d65bf46 100644
--- a/src/views/dashboard/LineChartTpf.vue
+++ b/src/views/dashboard/LineChartTpf.vue
@@ -42,7 +42,6 @@ export default {
   data() {
     return {
       chart: null,
-      chartData: {},
     };
   },
   watch: {
diff --git a/src/views/dashboard/index.vue b/src/views/dashboard/index.vue
index 2635ebd..2bc8088 100644
--- a/src/views/dashboard/index.vue
+++ b/src/views/dashboard/index.vue
@@ -11,7 +11,10 @@
     <div class="left" @mouseenter="mouseOver1" @mouseleave="mouseLeave1">
       <div class="leftBox1" :class="{ collapsed: isLeftCollapsed }">
         <div class="leftOne">
-          <div class="title4">管廊概况</div>
+          <div class="title4">
+            <span>管廊概况</span>
+            <span class="remark" @click="showRemark">管廊介绍 ></span>
+          </div>
           <div class="gl-info">
             <dl>
               <dt>管廊名称</dt>
@@ -40,71 +43,6 @@
               <dd>友谊大道</dd>
             </dl>
           </div>
-          <!-- <div class="warnListbox">
-            <div
-              class="warnList"
-              v-for="(item, index) in fireWarnList"
-              :key="index"
-              :class="item.style"
-            >
-              <div
-                style="
-                  display: flex;
-                  flex-direction: column;
-                  align-items: flex-start;
-                  width: 65%;
-                  justify-content: center;
-                  margin-top: 0%;
-                "
-              >
-                <span
-                  style="
-                    display: flex;
-                    width: 100%;
-                    justify-content: center;
-                    margin-top: -15%;
-                  "
-                >
-                  <img :src="getAssetUrl(item.icon)"
-                /></span>
-                <span
-                  style="
-                    margin-top: 5%;
-                    display: flex;
-                    width: 100%;
-                    justify-content: center;
-                  "
-                >
-                  <span style="font-size: 0.6rem">{{ item.name }}</span>
-                </span>
-                <span
-                  style="
-                    margin-top: 5%;
-                    display: flex;
-                    width: 100%;
-                    justify-content: center;
-                  "
-                >
-                  <span style="font-size: 0.6rem">{{ item.unit }}</span>
-                </span>
-
-                <span
-                  class="countsName"
-                  style="
-                    display: flex;
-                    width: 100%;
-                    justify-content: center;
-                    margin-top: 8%;
-                  "
-                  ><span
-                    class="counts"
-                    style="font-size: 20px; font-weight: 600; text-align: left"
-                    >{{ item.count }}</span
-                  ></span
-                >
-              </div>
-            </div>
-          </div> -->
         </div>
         <div class="leftTwo">
           <div class="title4">
@@ -121,7 +59,7 @@
             <span>能耗统计</span>
             <el-select
               v-model="nhValue"
-              size="mini"
+              size="small"
               style="width: 100px"
               class="custom-select"
             >
@@ -147,7 +85,7 @@
 
     <div class="right" @mouseenter="mouseOver1" @mouseleave="mouseLeave1">
       <div class="rightBox1" :class="{ collapsedR: isRightCollapsed }">
-                <div class="rightTwo">
+        <div class="rightTwo">
           <div class="title4">报警信息</div>
           <div
             class="warnList"
@@ -206,7 +144,7 @@
             <span>环境监测</span>
             <el-select
               v-model="nhValue"
-              size="mini"
+              size="small"
               style="width: 80px"
               class="custom-select"
             >
@@ -249,6 +187,24 @@
         ></component>
       </keep-alive>
     </div>
+
+    <el-dialog
+      v-model="showRemarkPanel"
+      title="管廊介绍"
+      :zIndex="9999"
+      width="500"
+    >
+      <span class="remark-content">
+        礼和路(友谊大道-欢乐大道)综合管廊设计范围北起友谊大道，南至欢乐大道，综合管廊工程约2.37公里综合管廊布置在道路机非隔离带下方，为三舱管廊，其中综合舱断面净尺寸BXH=2.6mx3.0m，高压电力舱断面净尺寸BXH=2.5mx3.0m，热力舱断面净尺寸BxH=2.5mX3.0m，管廊标准段覆土均为3.0m。
+      </span>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button class="close-btn" type="primary" @click="showRemarkPanel = false">
+            关闭
+          </el-button>
+        </div>
+      </template>
+    </el-dialog>
   </div>
 </template>
   
@@ -257,7 +213,6 @@ import LineCharttpf from "./LineChartTpf";
 import LineChartduoneng from "./LineChartduoneng";
 import PieChartdevice from "./PieChartdevice";
 import plan from "../plan.vue";
-import { color } from "echarts";
 export default {
   name: "cockpit",
   components: {
@@ -276,30 +231,6 @@ export default {
       warningIndex: -1,
       lineChartData: {},
       lineChartDataCO2: {},
-      fireWarnList: [
-        {
-          style: "yongdian",
-          name: "累计用电",
-          unit: "KWh",
-          count: "3732",
-          icon: "/ljyd.png",
-        },
-        {
-          style: "zhongyang",
-          name: "总能量",
-          unit: "KWh",
-          count: "9",
-          icon: "/yjzdl.png",
-        },
-        {
-          style: "vRV",
-          name: "总碳排放量",
-          unit: "t",
-          count: "732",
-          icon: "/yjztl.png",
-        },
-      ],
-      count: ["blueCount", "redCount", "yellowCount"],
       warnList: [
         {
           id: "1",
@@ -316,14 +247,6 @@ export default {
           status: "已处理",
         },
       ], //报警数组
-      selectValue: {
-        value: "79",
-        parentId: "-1",
-        label: "江北新区法院",
-      },
-      selectDate: 1,
-
-      equipmentList1: [],
       closeStatus: null,
       waringData: {},
       pickerVal: new Date(),
@@ -331,6 +254,7 @@ export default {
         xdata: [],
         result: [],
       },
+      showRemarkPanel: false
     };
   },
 
@@ -340,13 +264,16 @@ export default {
   },
 
   methods: {
+    showRemark() {
+      this.showRemarkPanel = true;
+    },
     getHoursFromZeroToTarget(endHour) {
       const targetHour =
         typeof endHour === "number"
           ? Math.max(0, Math.min(23, endHour))
           : new Date().getHours();
       const hourArr = [];
-      for (let hour = 0; hour <= targetHour; hour+= 2) {
+      for (let hour = 0; hour <= targetHour; hour += 2) {
         const formattedHour = hour.toString().padStart(2, "0");
         hourArr.push(`${formattedHour}:00`);
       }
@@ -464,10 +391,6 @@ export default {
   text-align: center;
 }
 
-.el-table tr:nth-child(odd) {
-  //   background-color: rgba(212, 234, 255, 0.08) !important;
-}
-
 .el-table--border .el-table__cell {
   border-right: 0px solid #dfe6ec;
 }
@@ -478,8 +401,10 @@ export default {
   background: transparent !important;
 }
 
-.el-dialog {
-  height: 70%;
+::v-deep .el-dialog {
+  background: url("/src/assets/beij/nrk.png");
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
 }
 
 .el-dialog__wrapper {
@@ -510,24 +435,12 @@ export default {
 }
 
 .el-table .el-table__body tr.el-table__row:nth-child(odd) {
-  //   background-color: rgba(212, 234, 255, 0.08) !important;
   background: url("../../assets/beij/titletable2.png") !important;
   background-size: 100% 100% !important;
 }
 </style>
   
   <style rel="stylesheet/scss" lang="scss">
-.formula {
-  font-size: 0.6rem;
-  position: absolute;
-  text-align: left;
-  top: 16%;
-  left: 30%;
-  color: #fff;
-  width: 70%;
-}
-
-// 16px: 16px;
 .noData {
   background-image: url(../../assets/images/noData.png);
   width: 100%;
@@ -545,19 +458,6 @@ export default {
   position: absolute;
   top: 5%;
 
-  .leftf {
-    width: 5%;
-    height: 100%;
-    position: absolute;
-    background-size: 100% 100%;
-  }
-
-  .toggleLeft {
-    position: absolute;
-    top: 52%;
-    right: -40px;
-  }
-
   .leftBox1 {
     height: 99%;
     margin-left: 6px;
@@ -565,13 +465,10 @@ export default {
     padding: 3%;
     background: url(../../assets/beij/nrk.png) no-repeat;
     background-size: 100% 100%;
-
     .leftOne {
       height: 33%;
       width: 100%;
-
       .warnList {
-        // height: 50%;
         height: 100%;
         width: 30%;
         margin-bottom: 1%;
@@ -580,693 +477,29 @@ export default {
         flex-wrap: nowrap;
         align-items: center;
         justify-content: space-around;
-        //   padding-right: 20%;
         box-sizing: border-box;
         color: #d4eaff;
         font-size: 0.7rem;
-
-        .countsName {
-          background: url(../../assets/beij/nhsj.png) no-repeat;
-
-          .counts {
-            // 渐变样式
-            background: linear-gradient(
-              to bottom,
-              rgba(255, 255, 255, 1) 0%,
-              rgba(88, 135, 223, 1) 100%
-            );
-            -webkit-background-clip: text;
-            background-clip: text;
-            color: transparent;
-          }
-        }
-      }
-
-      .yongdian {
-        // background: url(../../assets/beij/ljyd.png) no-repeat;
-        // background-size: 100% 100%;
-      }
-
-      .yongshui {
-        // background: url(../../assets/beij/ljys.png) no-repeat;
-        // background-size: 100% 100%;
-      }
-
-      .zhongyang {
-        // background: url(../../assets/beij/yjzdl.png) no-repeat;
-        // background-size: 100% 100%;
-      }
-
-      .vRV {
-        // background: url(../../assets/beij/yjztl.png) no-repeat;
-        // background-size: 100% 100%;
-      }
-
-      .maintenance {
-        height: calc(100% - 13%);
-        width: 100%;
-        padding: 0 2% 0 2%;
-        box-sizing: border-box;
-
-        .maintenanceCount {
-          width: 100%;
-          height: 30%;
-          //   background: url(../../assets/images/maintenance.png) no-repeat;
-          background-size: 100% 100%;
-          margin-top: 2%;
-
-          .quantity {
-            color: #d4eaff;
-            font-size: 16px;
-            display: flex;
-            flex-wrap: nowrap;
-            justify-content: space-around;
-            align-items: center;
-            width: 100%;
-            height: 50%;
-          }
-        }
-
-        .maintenanceEcharts {
-          width: 100%;
-          height: calc(100% - 30%);
-          display: flex;
-          flex-wrap: nowrap;
-
-          #maintenanceLeft {
-            width: 50%;
-            height: 100%;
-          }
-
-          #maintenanceRight {
-            width: 50%;
-            height: 100%;
-          }
-        }
-      }
-
-      .wisdomContent {
-        height: calc(100% - 18%);
-        width: 100%;
-        margin-top: 1%;
-        display: flex;
-        flex-wrap: wrap;
-        // background: url(../../assets/beij/box.png) no-repeat;
-        background-size: 100% 100%;
-
-        .wisdomTop {
-          width: 100%;
-          height: 100%;
-          display: flex;
-          flex-wrap: nowrap;
-          justify-content: space-around;
-          align-items: center;
-
-          .wisdomData {
-            display: flex;
-            flex-direction: column;
-            align-items: center;
-            height: 90%;
-            width: 30%;
-
-            .blueHouse {
-              background: url(../../assets/beij/dangri.png) no-repeat;
-              background-size: 100% 100%;
-              display: flex;
-              align-items: center;
-              justify-content: center;
-              // background: url(../../assets/beij/ljll.png) no-repeat;
-              //   margin-top: 10%;
-            }
-
-            .redHouse {
-              // background: url(../../assets/beij/ljrn.png) no-repeat;
-              background: url(../../assets/beij/dangyue.png) no-repeat;
-              background-size: 100% 100%;
-              display: flex;
-              align-items: center;
-              justify-content: center;
-              //   margin-top: 10%;
-            }
-
-            .yellowHouse {
-              background: url(../../assets/beij/dangnian.png) no-repeat;
-              background-size: 100% 100%;
-              display: flex;
-              align-items: center;
-              justify-content: center;
-              //   margin-top: 10%;
-            }
-
-            .blueCount {
-              color: #7cffe2;
-            }
-
-            .redCount {
-              color: #00d5ff;
-            }
-
-            .yellowCount {
-              color: #ffb800;
-            }
-          }
-        }
-
-        .wisdomBottom {
-          height: calc(100% - 75%);
-          width: 100%;
-          display: flex;
-          flex-wrap: nowrap;
-          justify-content: space-around;
-          align-items: center;
-
-          .wisdomCount {
-            height: 100%;
-            width: 15%;
-            color: #d4eaff;
-            font-size: 16px;
-            // background: url(../../assets/images/flootLine.png) no-repeat;
-            background-size: 100% 100%;
-            display: flex;
-            align-items: center;
-          }
-        }
       }
     }
 
     .leftTwo {
       height: 33%;
       width: 100%;
-
-      .wisdomContent {
-        height: calc(100% - 18%);
-        width: 100%;
-        margin-top: 1%;
-        display: flex;
-        flex-wrap: wrap;
-        // background: url(../../assets/beij/box.png) no-repeat;
-        background-size: 100% 100%;
-
-        .wisdomTop {
-          width: 100%;
-          height: 100%;
-          display: flex;
-          flex-wrap: nowrap;
-          justify-content: space-evenly;
-          align-items: center;
-
-          .wisdomData {
-            display: flex;
-            flex-direction: column;
-            align-items: center;
-            // height: 90%;
-            // width: 45%;
-            height: 90%;
-            width: 31%;
-            background-size: 100% 100%;
-
-            .blueHouse {
-              background: url(../../assets/beij/dangri.png) no-repeat;
-
-              display: flex;
-              align-items: center;
-              justify-content: center;
-              // background: url(../../assets/beij/ljll.png) no-repeat;
-              background-size: 100% 100%;
-              //   margin-top: 10%;
-            }
-
-            .redHouse {
-              // background: url(../../assets/beij/ljrn.png) no-repeat;
-
-              background: url(../../assets/beij/dangyue.png) no-repeat;
-              background-size: 100% 100%;
-              display: flex;
-              align-items: center;
-              justify-content: center;
-              //   margin-top: 10%;
-            }
-
-            .yellowHouse {
-              background: url(../../assets/beij/dangnian.png) no-repeat;
-              background-size: 100% 100%;
-              display: flex;
-              align-items: center;
-              justify-content: center;
-              //   margin-top: 10%;
-            }
-
-            .blueCount {
-              color: #7cffe2;
-            }
-
-            .redCount {
-              color: #00d5ff;
-            }
-
-            .yellowCount {
-              color: #ffb800;
-            }
-          }
-        }
-
-        .wisdomBottom {
-          height: calc(100% - 75%);
-          width: 100%;
-          display: flex;
-          flex-wrap: nowrap;
-          justify-content: space-around;
-          align-items: center;
-
-          .wisdomCount {
-            height: 100%;
-            width: 15%;
-            color: #d4eaff;
-            font-size: 16px;
-            // background: url(../../assets/images/flootLine.png) no-repeat;
-            background-size: 100% 100%;
-            display: flex;
-            align-items: center;
-          }
-        }
-      }
-
       .warning {
-        // background: url(../../assets/beij/box.png) no-repeat;
         background-size: 100% 100%;
         height: calc(100% - 20%);
         margin-top: 1%;
         width: 100%;
         display: flex;
         flex-wrap: nowrap;
-
         .lineChart {
           margin-left: 1%;
           width: 96%;
-          //   width: 96%;
           height: 90%;
         }
-
-        #warningOne {
-          width: 100%;
-          height: 100%;
-        }
       }
-
       position: relative;
-
-      .toggle {
-        position: absolute;
-        top: 40%;
-        right: -50px;
-      }
-    }
-  }
-}
-
-@keyframes leftAnimation {
-  0% {
-    position: relative;
-    left: 38%;
-    transform: scale(0);
-  }
-
-  100% {
-    position: relative;
-    left: 0%;
-    transform: scale(1);
-  }
-}
-
-@keyframes mytest {
-  100% {
-    right: 10px;
-  }
-
-  90% {
-    right: 120px;
-  }
-
-  80% {
-    right: 160px;
-  }
-
-  70% {
-    right: 200px;
-  }
-
-  60% {
-    right: 240px;
-  }
-
-  50% {
-    right: 300px;
-  }
-
-  40% {
-    right: 340px;
-  }
-
-  30% {
-    right: 380px;
-  }
-
-  20% {
-    right: 420px;
-  }
-
-  10% {
-    right: 460px;
-  }
-
-  1% {
-    right: 480px;
-  }
-}
-
-.middlebottom {
-  width: 100%;
-  height: 30%;
-  background: url(../../assets/yunwei/bottom.png) no-repeat;
-  background-size: 100% 100%;
-  z-index: 998;
-  position: absolute;
-  bottom: 0%;
-
-  // left: 1%;
-  .middlebottomf {
-    width: 100%;
-    height: 25%;
-    position: absolute;
-    bottom: 0%;
-    z-index: 500;
-    // right: 0%;
-    // background: url(../../assets/yunwei/bottmf.png) no-repeat;
-    background-size: 100% 100%;
-  }
-
-  .middlebottomBox {
-    width: 50%;
-    height: 100%;
-    // white-space: nowrap;
-    // animation: 10s wordsLoop linear infinite normal;
-    display: flex;
-    flex-wrap: wrap;
-    // margin-bottom: -1%;
-    margin-top: -1.5%;
-    left: 26%;
-    background: url("../../assets/beij/dnhbnrk.png") no-repeat;
-    background-size: 100% 100%;
-    padding: 0.5%;
-
-    .tit {
-      width: 100%;
-      height: 12%;
-      background: url("../../assets/beij/dnhb.png") no-repeat;
-      background-size: 100% 100%;
-      color: #d4eaff;
-      font-size: 22px;
-      display: flex;
-      align-items: center;
-      padding-left: 7%;
-      box-sizing: border-box;
-      font-family: "PangmenZhengDao", sans-serif;
-      text-shadow: 0px 1px 3px #d4eaff;
-      /* 蓝色发光层 */
-      /* 白色发光层 */
-    }
-
-    .wisdomContent {
-      height: calc(100% - 5%);
-      width: 100%;
-      // margin-top: 1%;
-      display: flex;
-      flex-wrap: wrap;
-      // background: url(../../assets/beij/box.png) no-repeat;
-      // background-size: 100% 100%;
-
-      .wisdomTop {
-        width: 100%;
-        height: 95%;
-        display: flex;
-        flex-wrap: nowrap;
-        justify-content: space-around;
-        align-items: center;
-
-        .wisdomData {
-          display: flex;
-          flex-direction: column;
-          align-items: center;
-          height: 90%;
-          width: 30%;
-          margin-left: 2%;
-
-          .blueHouse {
-            background: url(../../assets/beij/dangnian.png) no-repeat;
-            background-size: 100% 100%;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            //   margin-top: 10%;
-          }
-
-          .redHouse {
-            background: url(../../assets/beij/dangyue.png) no-repeat;
-            background-size: 100% 100%;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            //   margin-top: 10%;
-          }
-
-          .yellowHouse {
-            background: url(../../assets/beij/dangri.png) no-repeat;
-            background-size: 100% 100%;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            //   margin-top: 10%;
-          }
-
-          .blueCount {
-            color: #7cffe2;
-          }
-
-          .redCount {
-            color: #00d5ff;
-          }
-
-          .yellowCount {
-            color: #ffb800;
-          }
-
-          .ljnl {
-            background: url(../../assets/beij/ljnl.png) no-repeat;
-            background-size: 100% 100%;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            //   margin-top: 10%;
-          }
-
-          .ljydl {
-            background: url(../../assets/beij/ljydl.png) no-repeat;
-            background-size: 100% 100%;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            //   margin-top: 10%;
-          }
-
-          .ysl {
-            background: url(../../assets/beij/ysl.png) no-repeat;
-            background-size: 100% 100%;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-          }
-
-          .ljzll {
-            background: url(../../assets/beij/ljzll.png) no-repeat;
-            background-size: 100% 100%;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            //   margin-top: 10%;
-          }
-
-          .ljzrl {
-            background: url(../../assets/beij/ljzrl.png) no-repeat;
-            background-size: 100% 100%;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            //   margin-top: 10%;
-          }
-
-          .COPa {
-            background: url(../../assets/beij/COPa.png) no-repeat;
-            background-size: 100% 100%;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            //   margin-top: 10%;
-          }
-        }
-      }
-
-      .wisdomBottom {
-        height: calc(100% - 75%);
-        width: 100%;
-        display: flex;
-        flex-wrap: nowrap;
-        justify-content: space-around;
-        align-items: center;
-
-        .wisdomCount {
-          height: 100%;
-          width: 15%;
-          color: #d4eaff;
-          font-size: 16px;
-          // background: url(../../assets/images/flootLine.png) no-repeat;
-          background-size: 100% 100%;
-          display: flex;
-          align-items: center;
-        }
-      }
-    }
-
-    .warning {
-      background: url(../../assets/beij/box.png) no-repeat;
-      background-size: 100% 100%;
-      height: calc(100% - 20%);
-      margin-top: 1%;
-      width: 100%;
-      display: flex;
-      flex-wrap: nowrap;
-
-      .lineChart {
-        margin-left: 1%;
-        width: 96%;
-        //   width: 96%;
-        height: 90%;
-      }
-
-      #warningOne {
-        width: 100%;
-        height: 100%;
-      }
-    }
-
-    position: relative;
-
-    .toggle {
-      position: absolute;
-      top: 40%;
-      right: -50px;
-    }
-
-    .equipment1 {
-      // height: calc(100% - 15%);
-      height: calc(100% - 15%);
-      width: calc(100% - 50%);
-      display: flex;
-      flex-wrap: wrap;
-      // overflow: auto;
-      position: relative;
-      margin-bottom: 5%;
-      left: 26%;
-
-      .el-carousel__container {
-        height: 100%;
-        width: 100%;
-      }
-
-      .el-carousel__indicators--horizontal {
-        display: none;
-      }
-
-      // .el-carousel__arrow--left{
-      //         display: none;
-      //     }
-      //     .el-carousel__arrow--right{
-      //         display: none;
-      //     }
-      .equipmentEnergy1 {
-        width: 100%;
-        height: 100%;
-        // white-space: nowrap;
-        // animation: 10s wordsLoop linear infinite normal;
-        display: flex;
-        flex-wrap: wrap;
-
-        .equipmentEnergyChild1 {
-          width: 23.5%;
-          height: 100%;
-          //   padding: 1% 0;
-          position: relative;
-          //   background: url("../../assets/beij/jiankbox.png") no-repeat;
-          background-size: 100% 100%;
-          margin-left: 1%;
-          // padding: 10px;
-          padding: 4px 4px 8px 4px;
-          border-radius: 3%;
-
-          .equipmentList1 {
-            width: 100%;
-            height: 100%;
-
-            color: #d4eaff;
-            font-size: 1rem;
-            font-weight: 600;
-            display: flex;
-            flex-direction: column;
-            justify-content: center;
-          }
-
-          .equipmentName1 {
-            height: calc(100% - 80%);
-            width: 100%;
-            color: #d4eaff;
-            font-size: 12px;
-            position: absolute;
-            bottom: 0%;
-            left: 0%;
-            text-align: left;
-            padding-left: 8%;
-            background: url("../../assets/beij/jiankTit.png") no-repeat;
-            background-size: 100% 100%;
-          }
-
-          .blue {
-            color: #00d5ff;
-          }
-
-          .red {
-            color: #ff4d4f;
-          }
-
-          .green {
-            color: green;
-          }
-
-          .yellow {
-            color: yellow;
-          }
-
-          .orange {
-            color: orange;
-          }
-
-          .purple {
-            color: rgb(91, 3, 91);
-          }
-
-          .minRed {
-            color: #790406;
-          }
-        }
-      }
     }
   }
 }
@@ -1290,7 +523,6 @@ export default {
   position: fixed;
   top: 0;
   left: 0;
-  // z-index: 111;
   z-index: 888;
   display: flex;
   align-items: center;
@@ -1307,27 +539,10 @@ export default {
   flex-wrap: wrap;
   background: url(../../assets/beij/right.png) no-repeat;
   background-size: 100% 100%;
-
   z-index: 999;
   position: absolute;
   top: 5%;
   right: 0%;
-
-  .rightf {
-    width: 5%;
-    height: 100%;
-    position: absolute;
-    right: 0%;
-    background: url(../../assets/yunwei/rightf.png) no-repeat;
-    background-size: 100% 100%;
-  }
-
-  .toggleri {
-    position: absolute;
-    top: 52%;
-    left: -40px;
-  }
-
   .rightBox1 {
     width: 99%;
     height: 99%;
@@ -1337,306 +552,14 @@ export default {
     background-size: 100% 100%;
     padding: 3%;
     margin-left: 5%;
-
-    .rightOne {
-      height: 33%;
-      width: 100%;
-
-      .warnListbox {
-        // background: url(../../assets/beij/box.png) no-repeat;
-        background-size: 100% 100%;
-        height: calc(100% - 18%);
-        width: 100%;
-        margin-top: 0%;
-        padding: 1%;
-
-        .equipmentEnergyChild1 {
-          width: 100%;
-          height: 100%;
-          //   padding: 1% 0;
-          position: relative;
-          //   background: url("../../assets/beij/jiankbox.png") no-repeat;
-          background-size: 100% 100%;
-          //   margin-left: 1%;
-          // padding: 10px;
-          padding: 4px 4px 8px 4px;
-          border-radius: 3%;
-
-          .equipmentList1 {
-            width: 100%;
-            height: 100%;
-
-            color: #d4eaff;
-            font-size: 1rem;
-            font-weight: 600;
-            display: flex;
-            flex-direction: column;
-            justify-content: center;
-          }
-
-          .equipmentName1 {
-            height: calc(100% - 80%);
-            width: 100%;
-            color: #d4eaff;
-            font-size: 12px;
-            position: absolute;
-            bottom: 0%;
-            left: 0%;
-            text-align: left;
-            padding-left: 8%;
-            background: url("../../assets/beij/jiankTit.png") no-repeat;
-            background-size: 100% 100%;
-          }
-
-          .blue {
-            color: #00d5ff;
-          }
-
-          .red {
-            color: #ff4d4f;
-          }
-
-          .green {
-            color: green;
-          }
-
-          .yellow {
-            color: yellow;
-          }
-
-          .orange {
-            color: orange;
-          }
-
-          .purple {
-            color: rgb(91, 3, 91);
-          }
-
-          .minRed {
-            color: #790406;
-          }
-        }
-      }
-
-      .warnList {
-        height: 50%;
-        width: 100%;
-        margin-bottom: 2%;
-        display: flex;
-        flex-wrap: nowrap;
-        align-items: center;
-        justify-content: space-around;
-        //   padding-right: 20%;
-        box-sizing: border-box;
-        color: #d4eaff;
-        font-size: 0.7rem;
-      }
-
-      .zhongyang {
-        background: url(../../assets/beij/zhongyang.png) no-repeat;
-        background-size: 100% 100%;
-      }
-
-      .vRV {
-        background: url(../../assets/beij/VRV.png) no-repeat;
-        background-size: 100% 100%;
-      }
-
-      .maintenance {
-        height: calc(100% - 13%);
-        width: 100%;
-        padding: 0 2% 0 2%;
-        box-sizing: border-box;
-
-        .maintenanceCount {
-          width: 100%;
-          height: 30%;
-          //   background: url(../../assets/images/maintenance.png) no-repeat;
-          background-size: 100% 100%;
-          margin-top: 2%;
-
-          .quantity {
-            color: #d4eaff;
-            font-size: 16px;
-            display: flex;
-            flex-wrap: nowrap;
-            justify-content: space-around;
-            align-items: center;
-            width: 100%;
-            height: 50%;
-          }
-        }
-
-        .maintenanceEcharts {
-          width: 100%;
-          height: calc(100% - 30%);
-          display: flex;
-          flex-wrap: nowrap;
-
-          #maintenanceLeft {
-            width: 50%;
-            height: 100%;
-          }
-
-          #maintenanceRight {
-            width: 50%;
-            height: 100%;
-          }
-        }
-      }
-    }
-
     .rightTwo {
       height: 33%;
       width: 100%;
       position: relative;
-
-      .toggleRight {
-        position: absolute;
-        top: 40%;
-        left: -50px;
-      }
-
-      .warnListbox {
-        background-size: 100% 100%;
-        height: calc(100% - 18%);
-        width: 100%;
-        margin-top: 1%;
-        padding: 1%;
-      }
-
-      .wisdomContent {
-        height: calc(100% - 18%);
-        width: 100%;
-        margin-top: 1%;
-        display: flex;
-        flex-wrap: wrap;
-        // background: url(../../assets/beij/box.png) no-repeat;
-        background-size: 100% 100%;
-
-        .wisdomTop {
-          width: 100%;
-          height: 100%;
-          display: flex;
-          flex-wrap: nowrap;
-          justify-content: space-around;
-          align-items: center;
-
-          .wisdomData {
-            display: flex;
-            flex-direction: column;
-            align-items: center;
-            height: 90%;
-            width: 30%;
-
-            .sghe {
-              display: flex;
-              align-items: center;
-              justify-content: center;
-              //   margin-top: 10%;
-            }
-
-            .titlebox {
-              font-size: 13px;
-              position: absolute;
-              line-height: 33px;
-              width: 29%;
-              top: 50%;
-              background: url(../../assets/beij/shb.png) no-repeat;
-              background-size: 100% 100%;
-            }
-
-            .sbCount {
-            }
-
-            .white {
-              color: #d4eaff;
-            }
-
-            .green {
-              color: #00d5ff;
-            }
-
-            .yellow {
-              color: #ffb800;
-            }
-          }
-        }
-
-        .wisdomBottom {
-          height: calc(100% - 75%);
-          width: 100%;
-          display: flex;
-          flex-wrap: nowrap;
-          justify-content: space-around;
-          align-items: center;
-
-          .wisdomCount {
-            height: 100%;
-            width: 15%;
-            color: #d4eaff;
-            font-size: 16px;
-            background-size: 100% 100%;
-            display: flex;
-            align-items: center;
-          }
-        }
-      }
-
-      #energyEcharts {
-        width: 100%;
-        height: calc(100% - 25%);
-      }
-
-      .selectChange {
-        width: 23%;
-        height: 10%;
-        position: absolute;
-        top: 22%;
-        right: 5%;
-      }
-
-      .pickerChange {
-        width: 23%;
-        height: 10%;
-        position: absolute;
-        top: 22%;
-        right: 60%;
-      }
-
-      .selectChange1 {
-        width: 23%;
-        height: 10%;
-        position: absolute;
-        top: 22%;
-        right: 35%;
-      }
-
-      position: relative;
-
-      .toggle {
-        position: absolute;
-        top: 40%;
-        left: -50px;
-      }
     }
   }
 }
 
-@keyframes rightAnimation {
-  0% {
-    position: relative;
-    right: 38%;
-    transform: scale(0);
-  }
-
-  100% {
-    position: relative;
-    right: 0%;
-    transform: scale(1);
-  }
-}
-
 .title4 {
   width: 100%;
   height: 12%;
@@ -1652,6 +575,10 @@ export default {
   font-family: "PangmenZhengDao", sans-serif;
   display: flex;
   text-shadow: 0px 1px 3px #d4eaff;
+  .remark {
+    font-size: 14px;
+    cursor: pointer;
+  }
 
   /* 蓝色发光层 */
   /* 白色发光层 */
@@ -1672,27 +599,6 @@ export default {
     float: right;
     margin-right: 3%;
   }
-
-  .areaSlect {
-    flex: 1;
-    display: flex;
-    align-items: center;
-    justify-content: flex-end;
-    float: right;
-    margin-right: 3%;
-
-    span {
-      font-family: normal;
-      color: #d4eaff;
-      font-size: 14px;
-    }
-
-    .select {
-      width: 34%;
-      display: flex;
-      align-items: center;
-    }
-  }
 }
 
 .leftBox1 {
@@ -1709,47 +615,6 @@ export default {
   transition: width 1s ease;
 }
 
-/* 定义动画 */
-@keyframes slideOutToRight {
-  from {
-    transform: translateX(0);
-    /* 初始状态，盒子在原位置 */
-    opacity: 1;
-    /* 初始状态，盒子完全不透明 */
-  }
-
-  to {
-    transform: translateX(100%);
-    /* 结束状态，盒子向右移动到父容器的100%宽度位置 */
-    opacity: 0;
-    /* 结束状态，盒子完全透明且不可见 */
-  }
-}
-
-/* 定义keyframes规则 */
-@keyframes slide-and-fade-out {
-  0% {
-    transform: translateX(0%);
-    /* 初始状态，盒子在原位置 */
-    opacity: 1;
-    /* 盒子不透明 */
-  }
-
-  50% {
-    transform: translateX(50%);
-    /* 盒子向右推，移动到视图宽度的100%位置 */
-    opacity: 0.5;
-    /* 在推动过程中保持不透明 */
-  }
-
-  100% {
-    transform: translateX(100%);
-    /* 推动结束位置 */
-    opacity: 0;
-    /* 在推动结束时变透明 */
-  }
-}
-
 .rightBox1.collapsedR {
   width: 0px;
   display: none;
@@ -1757,12 +622,8 @@ export default {
 .PieChart1 {
   width: 100%;
   height: 100%;
-  //   padding: 1% 0;
-  //   position: relative;
-  //   background: url("../../assets/beij/jiankbox.png") no-repeat;
   background-size: 100% 100%;
   margin-left: 1%;
-  // padding: 10px;
   padding: 4px 4px 8px 4px;
   border-radius: 3%;
 }
@@ -1773,7 +634,7 @@ export default {
     color: #d4eaff;
     font-size: 16px;
     margin: 0;
-    padding: 7px 0;
+    padding: 5px 0;
     dt {
       font-weight: bold;
       width: 100px;
@@ -1787,12 +648,10 @@ export default {
 
 .rightTwo {
   height: 34%;
-  //   height: 52%;
   width: 100%;
   position: relative;
 
   .warning {
-    // background: url(../../assets/beij/box.png) no-repeat;
     background-size: 100% 100%;
     height: calc(100% - 20%);
     margin-top: 1%;
@@ -1803,97 +662,11 @@ export default {
     .lineChart {
       margin-left: 1%;
       width: 96%;
-      //   width: 96%;
       height: 90%;
     }
-
-    #warningOne {
-      width: 100%;
-      height: 100%;
-    }
-  }
-
-  .warnListTitle {
-    height: 6%;
-    width: 100%;
-    position: relative;
-
-    .titleTwo {
-      width: 20%;
-      height: 100%;
-      margin-left: 2%;
-      //   background: url(../../assets/images/flootLine.png) no-repeat;
-      background-size: 100% 100%;
-      color: #d4eaff;
-      font-size: 16px;
-      position: absolute;
-    }
-  }
-
-  .warnBtn {
-    width: 100%;
-    height: 20%;
-    margin-top: 1%;
-    display: flex;
-    flex-wrap: nowrap;
-    justify-content: space-around;
-    align-items: center;
-
-    .btnList {
-      //   width: 13%;
-      //   height: 38%;
-      width: 17%;
-      height: 41%;
-      //   background: url(../../assets/images/warnBtn.png) no-repeat;
-      background-size: 100% 100%;
-      color: #d4eaff;
-      font-size: 16px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      font-size: 18px;
-    }
-
-    .btnListAc {
-      //   width: 13%;
-      //   height: 38%;
-      width: 17%;
-      height: 41%;
-      //   background: url(../../assets/images/warnBtnAc.png) no-repeat;
-      background-size: 100% 100%;
-      color: #d4eaff;
-      font-size: 16px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      font-size: 16px;
-    }
-  }
-
-  .warning {
-    // background: url(../../assets/beij/box.png) no-repeat;
-    background-size: 100% 100%;
-    height: calc(100% - 20%);
-    margin-top: 1%;
-    width: 100%;
-    display: flex;
-    flex-wrap: nowrap;
-
-    .lineChart {
-      margin-left: 1%;
-      width: 96%;
-      //   width: 96%;
-      height: 90%;
-    }
-
-    #warningOne {
-      width: 100%;
-      height: 100%;
-    }
   }
 
   .warnList {
-    // background: url(../../assets/beij/box.png) no-repeat;
     background-size: 100% 100%;
     height: calc(100% - 18%);
     width: 100%;
@@ -1902,17 +675,12 @@ export default {
     padding: 3%;
 
     .warnListContent {
-      //   height: 27%;
-      //   height: 50%;
       height: 47%;
       width: 100%;
       background: url(../../assets/beij/baoj.png) no-repeat;
       background-size: 100% 100%;
-      //   background: rgba(11, 31, 61, 0.3);
       cursor: pointer;
-      //   margin-bottom: 2%;
       margin-bottom: 3%;
-      //   border: 1px dashed #fff;
       color: #d4eaff;
       font-size: 16px;
       display: flex;
@@ -1950,16 +718,11 @@ export default {
     }
 
     .warnListContent.selected {
-      /* 选中时的背景颜色 */
-      //   background: rgba(27, 72, 139, 0.5);
-      //   border: 1px solid rgb(27, 72, 139);
       background: url(../../assets/beij/baojh1.png) no-repeat;
       background-size: 100% 100%;
     }
 
     .warnListContent:hover {
-      //   background: rgba(27, 72, 139, 0.5);
-      //   border: 1px solid rgb(27, 72, 139);
       background: url(../../assets/beij/baojh1.png) no-repeat;
       background-size: 100% 100%;
     }
@@ -1968,22 +731,6 @@ export default {
   ::-webkit-scrollbar {
     display: none;
   }
-
-  .camera {
-    height: calc(100% - 15%);
-    width: 100%;
-    display: flex;
-    flex-wrap: wrap;
-    align-items: center;
-    justify-content: space-around;
-    align-content: stretch;
-
-    .cameraList {
-      width: 47%;
-      height: 44%;
-      border: 3px solid rgb(1, 176, 202);
-    }
-  }
 }
 
 .leftThree {
@@ -1991,101 +738,7 @@ export default {
   width: 100%;
   position: relative;
 
-  .wisdomContent {
-    height: calc(100% - 18%);
-    width: 100%;
-    margin-top: 1%;
-    display: flex;
-    flex-wrap: wrap;
-    // background: url(../../assets/beij/box.png) no-repeat;
-    background-size: 100% 100%;
-
-    .wisdomTop {
-      width: 100%;
-      height: 100%;
-      display: flex;
-      flex-wrap: nowrap;
-      justify-content: space-evenly;
-      align-items: center;
-
-      .wisdomData {
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        // height: 90%;
-        // width: 45%;
-        height: 90%;
-        width: 31%;
-        background-size: 100% 100%;
-
-        .blueHouse {
-          background: url(../../assets/beij/dangri.png) no-repeat;
-
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          // background: url(../../assets/beij/ljll.png) no-repeat;
-          background-size: 100% 100%;
-          //   margin-top: 10%;
-        }
-
-        .redHouse {
-          // background: url(../../assets/beij/ljrn.png) no-repeat;
-
-          background: url(../../assets/beij/dangyue.png) no-repeat;
-          background-size: 100% 100%;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          //   margin-top: 10%;
-        }
-
-        .yellowHouse {
-          background: url(../../assets/beij/dangnian.png) no-repeat;
-          background-size: 100% 100%;
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          //   margin-top: 10%;
-        }
-
-        .blueCount {
-          color: #7cffe2;
-        }
-
-        .redCount {
-          color: #00d5ff;
-        }
-
-        .yellowCount {
-          color: #ffb800;
-        }
-      }
-    }
-
-    .wisdomBottom {
-      height: calc(100% - 75%);
-      width: 100%;
-      display: flex;
-      flex-wrap: nowrap;
-      justify-content: space-around;
-      align-items: center;
-
-      .wisdomCount {
-        height: 100%;
-        width: 15%;
-        color: #d4eaff;
-        font-size: 16px;
-        // background: url(../../assets/images/flootLine.png) no-repeat;
-        background-size: 100% 100%;
-        display: flex;
-        align-items: center;
-      }
-    }
-  }
-
   .warning {
-    // background: url(../../assets/beij/box.png) no-repeat;
     background-size: 100% 100%;
     height: calc(100% - 20%);
     margin-top: 1%;
@@ -2099,17 +752,6 @@ export default {
       //   width: 96%;
       height: 90%;
     }
-
-    #warningOne {
-      width: 100%;
-      height: 100%;
-    }
-  }
-
-  .toggle {
-    position: absolute;
-    top: 40%;
-    right: -50px;
   }
 }
 </style>
@@ -2141,5 +783,12 @@ export default {
 .rightThree {
   height: 33%;
 }
+.remark-content {
+  color: #fff;
+}
+.close-btn {
+  background: #d4eaff50;
+  border: 0;
+}
 </style>>
   
\ No newline at end of file