diff --git a/.env.development b/.env.development
index 8253cfb..8e968ab 100644
--- a/.env.development
+++ b/.env.development
@@ -7,9 +7,9 @@ ENV = 'development'
 # 开发环境
 # VUE_APP_BASE_API = '/dev-api'
 # 后台
-VUE_APP_BASE_API = 'http://192.168.1.222:8080'
+# VUE_APP_BASE_API = 'http://192.168.1.222:8080'
 # 云端
-# VUE_APP_BASE_API = 'http://106.55.173.225:8090'
+VUE_APP_BASE_API = 'http://106.55.173.225:8090'
 
 # 路由懒加载
 VUE_CLI_BABEL_TRANSPILE_MODULES = true
diff --git a/public/favicon.ico b/public/favicon.ico
index e263760..050428e 100644
Binary files a/public/favicon.ico and b/public/favicon.ico differ
diff --git a/src/assets/images/logo-1.png b/src/assets/images/logo-1.png
new file mode 100644
index 0000000..ffcefe8
Binary files /dev/null and b/src/assets/images/logo-1.png differ
diff --git a/src/assets/images/logo-2.png b/src/assets/images/logo-2.png
new file mode 100644
index 0000000..8d7adf1
Binary files /dev/null and b/src/assets/images/logo-2.png differ
diff --git a/src/assets/logo/logo.png b/src/assets/logo/logo.png
index e263760..ffcefe8 100644
Binary files a/src/assets/logo/logo.png and b/src/assets/logo/logo.png differ
diff --git a/src/assets/logo/logoRight.png b/src/assets/logo/logoRight.png
new file mode 100644
index 0000000..8d7adf1
Binary files /dev/null and b/src/assets/logo/logoRight.png differ
diff --git a/src/assets/styles/element-ui.scss b/src/assets/styles/element-ui.scss
index 696dea0..3420def 100644
--- a/src/assets/styles/element-ui.scss
+++ b/src/assets/styles/element-ui.scss
@@ -1133,11 +1133,11 @@
     linear-gradient(#053766, #053766);
   border-radius: 10px;
   border: solid 2px #005fbf;
-  top: 40% !important;
+  top: 5% !important;
   display: flex;
   flex-direction: column;
   align-items: center;
-  padding: 25px 15px 25px 20px !important;
+  padding:10px !important;
 }
 
 /* 修改消息文本颜色 */
@@ -1158,10 +1158,10 @@
   background-repeat: no-repeat;
   background-size: 100% 100%;
   display: inline-block;
-  width: 90px;
-  height: 90px;
+  width: 50px;
+  height: 50px;
   margin-right: 0px !important;
-  margin-bottom: 16px;
+  margin-bottom: 10px;
   vertical-align: middle;
 }
 .el-icon-success:before,
@@ -1180,10 +1180,10 @@
   background-repeat: no-repeat;
   background-size: 100% 100%;
   display: inline-block;
-  width: 90px;
-  height: 90px;
+  width: 50px;
+  height: 50px;
   margin-right: 0px !important;
-  margin-bottom: 16px;
+  margin-bottom: 10px;
   vertical-align: middle;
 }
 .el-message .el-icon-warning {
@@ -1192,10 +1192,10 @@
   background-repeat: no-repeat;
   background-size: 100% 100%;
   display: inline-block;
-  width: 90px;
-  height: 90px;
+  width: 50px;
+  height: 50px;
   margin-right: 0px !important;
-  margin-bottom: 16px;
+  margin-bottom: 10px;
   vertical-align: middle;
 }
 .el-upload-list__item-name {
diff --git a/src/layout/components/Sidebar/Logo.vue b/src/layout/components/Sidebar/Logo.vue
index 6a978db..d78edeb 100644
--- a/src/layout/components/Sidebar/Logo.vue
+++ b/src/layout/components/Sidebar/Logo.vue
@@ -3,11 +3,13 @@
     <transition name="sidebarLogoFade">
       <router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="">
         <img v-if="logo" :src="logo" class="sidebar-logo" />
-        <h1 v-else class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ title }} </h1>
+        <img v-else :src="logoRight" class="sidebar-logo-right" />
+        <!-- <h1 v-else class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ title }} </h1> -->
       </router-link>
       <router-link v-else key="expand" class="sidebar-logo-link" to="">
         <img v-if="logo" :src="logo" class="sidebar-logo" />
-        <h1 class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ title }} </h1>
+        <img :src="logoRight" class="sidebar-logo-right" />
+        <!-- <h1 class="sidebar-title" :style="{ color: sideTheme === 'theme-dark' ? variables.logoTitleColor : variables.logoLightTitleColor }">{{ title }} </h1> -->
       </router-link>
     </transition>
   </div>
@@ -15,6 +17,7 @@
 
 <script>
 import logoImg from '@/assets/logo/logo.png'
+import logoRightImg from '@/assets/logo/logoRight.png'
 import variables from '@/assets/styles/variables.scss'
 
 export default {
@@ -36,7 +39,8 @@ export default {
   data() {
     return {
       title: process.env.VUE_APP_TITLE,
-      logo: logoImg
+      logo: logoImg,
+      logoRight:logoRightImg,
     }
   }
 }
@@ -54,26 +58,34 @@ export default {
 
 .sidebar-logo-container {
   position: relative;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
   width: 100%;
   height: 50px;
   line-height: 50px;
-  // background: #2b2f3a;
   background-image: linear-gradient(0deg, 
-		#002c5e 0%, 
-		#0069b2 100%), 
-	linear-gradient(
-		#002c5e, 
-		#002c5e);
-	background-blend-mode: normal, 
-		normal;
-	box-shadow: inset 0px -1px 0px 0px 
-		rgba(255, 255, 255, 0.1);
+    #002c5e 0%, 
+    #0069b2 100%), 
+  linear-gradient(
+    #002c5e, 
+    #002c5e);
+  background-blend-mode: normal, 
+    normal;
+  box-shadow: inset 0px -1px 0px 0px 
+    rgba(255, 255, 255, 0.1);
   text-align: center;
   overflow: hidden;
-
   & .sidebar-logo-link {
+    flex: 1;
     height: 100%;
     width: 100%;
+    display: flex !important;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    box-sizing: border-box !important;
 
     & .sidebar-logo {
       width: 32px;
@@ -81,6 +93,10 @@ export default {
       vertical-align: middle;
       margin-right: 12px;
     }
+    & .sidebar-logo-right{
+      width: 100px;
+      height: 35px;
+    }
 
     & .sidebar-title {
       display: inline-block;
diff --git a/src/views/aircAndWindc/awSysMonitor/index.vue b/src/views/aircAndWindc/awSysMonitor/index.vue
index b76fabd..9a01703 100644
--- a/src/views/aircAndWindc/awSysMonitor/index.vue
+++ b/src/views/aircAndWindc/awSysMonitor/index.vue
@@ -118,15 +118,21 @@
               alt=""
             />
           </div>
-          <div class="wind-tem">
+          <div class="wind-tem1">
             <div class="wind-text">回风温度</div>
             <el-input v-model="temValue" size="mini">
               <svg-icon slot="prefix" icon-class="tem_icon" class="tem-icon" />
             </el-input>
           </div>
-          <div class="wind-valve">
-            <div class="wind-text">电动阀比例调节控制</div>
-            <el-input v-model="valvePercent" size="mini">
+          <div class="wind-tem2">
+            <div class="wind-text">送风温度</div>
+            <el-input v-model="temValue" size="mini">
+              <svg-icon slot="prefix" icon-class="tem_icon" class="tem-icon" />
+            </el-input>
+          </div>
+          <div class="fan-frequency">
+            <div class="wind-text">风机变频控制</div>
+            <el-input v-model="frequency" size="mini">
               <svg-icon
                 slot="prefix"
                 icon-class="percentage-icon"
@@ -134,45 +140,91 @@
               />
             </el-input>
           </div>
-          <div class="fan-run">
-            <div class="wind-text">风机运行状态</div>
-            <el-switch
-              style="display: block"
-              v-model="runStatus"
-              active-color="#13ce66"
-              inactive-color="#ff4949"
-              active-text="运行"
-              inactive-text="停止"
-            >
-            </el-switch>
+          <div class="fan-satatus1">
+            <div class="context-li">
+              <div class="wind-text">风机运行状态</div>
+              <el-switch
+                style="display: block"
+                v-model="runStatus"
+                active-color="#13ce66"
+                inactive-color="#ff4949"
+                active-text="运行"
+                inactive-text="停止"
+              >
+              </el-switch>
+            </div>
+            <div class="context-li">
+              <div class="wind-text">风机手自动状态</div>
+              <el-switch
+                style="display: block"
+                v-model="autoStatus"
+                active-color="#13ce66"
+                inactive-color="#ff4949"
+                active-text="手动"
+                inactive-text="自动"
+              >
+              </el-switch>
+            </div>
+            <div class="context-li">
+              <div class="wind-text">风机启停控制</div>
+              <el-switch
+                style="display: block"
+                v-model="startStatus"
+                active-color="#13ce66"
+                inactive-color="#ff4949"
+                active-text="关闭"
+                inactive-text="打开"
+              >
+              </el-switch>
+            </div>
+            <div class="context-li">
+              <div class="wind-text">风机故障状态</div>
+              <el-switch
+                style="display: block"
+                v-model="startStatus"
+                active-color="#13ce66"
+                inactive-color="#ff4949"
+                active-text="未故障"
+                inactive-text="故障"
+              >
+              </el-switch>
+            </div>
           </div>
-          <div class="fan-auto">
-            <div class="wind-text">风机手自动状态</div>
-            <el-switch
-              style="display: block"
-              v-model="autoStatus"
-              active-color="#13ce66"
-              inactive-color="#ff4949"
-              active-text="手动"
-              inactive-text="自动"
-            >
-            </el-switch>
+          <div class="fan-satatus2">
+            <div class="context-li">
+              <div class="wind-text">供水温度</div>
+              <el-input v-model="temValue" size="mini">
+                <svg-icon
+                  slot="prefix"
+                  icon-class="tem_icon"
+                  class="tem-icon"
+                />
+              </el-input>
+            </div>
+            <div class="context-li">
+              <div class="wind-text">回水温度</div>
+              <el-input v-model="temValue" size="mini">
+                <svg-icon
+                  slot="prefix"
+                  icon-class="tem_icon"
+                  class="tem-icon"
+                />
+              </el-input>
+            </div>
+            <div class="context-li">
+              <div class="wind-text">水阀调节</div>
+              <el-input v-model="valvePercent" size="mini">
+                <svg-icon
+                  slot="prefix"
+                  icon-class="percentage-icon"
+                  class="percentage-icon"
+                />
+              </el-input>
+            </div>
           </div>
-          <div class="fan-start">
-            <div class="wind-text">风机启停控制</div>
-            <el-switch
-              style="display: block"
-              v-model="startStatus"
-              active-color="#13ce66"
-              inactive-color="#ff4949"
-              active-text="关闭"
-              inactive-text="打开"
-            >
-            </el-switch>
-          </div>
-          <div class="fan-frequency">
-            <div class="wind-text">风机变频控制</div>
-            <el-input v-model="frequency" size="mini">
+          <div class="wind-valve">
+            <div class="wind-text">风阀调节</div>
+            <el-input v-model="valvePercent" size="mini">
               <svg-icon
                 slot="prefix"
                 icon-class="percentage-icon"
@@ -434,7 +486,7 @@ export default {
     left: 0;
     z-index: 1;
   }
-  .wind-tem {
+  .wind-tem1 {
     z-index: 10;
     width: 1.3rem;
     position: absolute;
@@ -449,28 +501,27 @@ export default {
       margin-bottom: 0.15rem;
     }
   }
-  .wind-valve {
+  .wind-tem2 {
     z-index: 10;
+    width: 1.3rem;
     position: absolute;
-    top: 4.6rem;
-    left: 3rem;
-    width: 3rem;
+    top: 1.7rem;
+    right: 0.3rem;
     display: flex;
-    flex-direction: row;
+    flex-direction: column;
     align-items: center;
     .wind-text {
       color: #00d2ff;
       font-size: 0.18rem;
-      margin-right: 0.1rem;
-      white-space: nowrap;
+      margin-bottom: 0.15rem;
     }
   }
-  .fan-run {
+  .fan-frequency {
     z-index: 10;
     position: absolute;
-    top: 1.8rem;
-    left: 7rem;
-    width: 3rem;
+    top: 1.7rem;
+    left: 8.5rem;
+    width: 1.3rem;
     display: flex;
     flex-direction: column;
     align-items: center;
@@ -478,47 +529,58 @@ export default {
       color: #00d2ff;
       font-size: 0.18rem;
       margin-bottom: 0.15rem;
-      white-space: nowrap;
     }
   }
-  .fan-auto {
-    z-index: 10;
+  .fan-satatus1 {
     position: absolute;
-    top: 1.8rem;
-    left: 9rem;
-    width: 3rem;
+    top: 4.5rem;
+    left: 8.5rem;
     display: flex;
     flex-direction: column;
-    align-items: center;
+    align-items: flex-start;
+    .context-li {
+      z-index: 10;
+      // width: 2rem;
+      margin-bottom: 0.1rem;
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+    }
     .wind-text {
       color: #00d2ff;
       font-size: 0.18rem;
-      margin-bottom: 0.15rem;
+      margin-right: 0.15rem;
       white-space: nowrap;
     }
   }
-  .fan-start {
-    z-index: 10;
+  .fan-satatus2 {
     position: absolute;
-    top: 4.6rem;
-    left: 7rem;
-    width: 3rem;
+    top: 5.5rem;
+    left: 6rem;
     display: flex;
     flex-direction: column;
-    align-items: center;
+    align-items: flex-start;
+    .context-li {
+      z-index: 10;
+      width: 2rem;
+      margin-bottom: 0.1rem;
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+    }
     .wind-text {
       color: #00d2ff;
       font-size: 0.18rem;
-      margin-bottom: 0.15rem;
+      margin-right: 0.15rem;
       white-space: nowrap;
     }
   }
-  .fan-frequency {
+  .wind-valve {
     z-index: 10;
     position: absolute;
-    top: 4.55rem;
-    right: 0.5rem;
-    width: 2.5rem;
+    top: 4.6rem;
+    left: 3rem;
+    width: 2rem;
     display: flex;
     flex-direction: row;
     align-items: center;
@@ -716,12 +778,12 @@ export default {
   }
 }
 @media (min-width: 1160px) and (max-width: 1360px) {
-    .windC  {
+  .windC {
     transform: scale(0.8);
   }
 }
 @media (min-width: 990px) and (max-width: 1160px) {
-    .windC  {
+  .windC {
     transform: scale(0.7);
   }
 }
diff --git a/src/views/centerairC/delaySwitch/index.vue b/src/views/centerairC/delaySwitch/index.vue
index 89da0e1..e89640f 100644
--- a/src/views/centerairC/delaySwitch/index.vue
+++ b/src/views/centerairC/delaySwitch/index.vue
@@ -191,7 +191,7 @@ export default {
       operationConrol([data])
         .then((res) => {
           if (res.code == 200) {
-            this.$modal.msgSuccess("操作成功");
+            this.$modal.msgSuccess("指令下发成功!");
             // 开启 loading 效果
             this.loading = true;
             // 更新所有设备状态;
diff --git a/src/views/centerairC/deviceStrategy/index.vue b/src/views/centerairC/deviceStrategy/index.vue
index d122bfc..226ed5a 100644
--- a/src/views/centerairC/deviceStrategy/index.vue
+++ b/src/views/centerairC/deviceStrategy/index.vue
@@ -189,7 +189,7 @@ export default {
       operationConrol([data])
         .then((res) => {
           if (res.code == 200) {
-            this.$modal.msgSuccess("操作成功");
+            this.$modal.msgSuccess("指令下发成功!");
             // 开启 loading 效果
             this.loading = true;
             // 更新所有设备状态;
diff --git a/src/views/centerairC/enSourceAnalysis/components/equipment.vue b/src/views/centerairC/enSourceAnalysis/components/equipment.vue
index 5de5ad6..bb46fc7 100644
--- a/src/views/centerairC/enSourceAnalysis/components/equipment.vue
+++ b/src/views/centerairC/enSourceAnalysis/components/equipment.vue
@@ -83,9 +83,9 @@
             >
               <el-option
                 v-for="item in electTypes"
-                :key="item.id"
+                :key="item.mtNum"
                 :label="item.otherName"
-                :value="item.id"
+                :value="item.mtNum"
               ></el-option>
             </el-select>
             <el-select
@@ -116,7 +116,7 @@
           <div class="details_ref" ref="details_ref"></div>
           <div class="table-content" style="width: 100%">
             <el-table
-              border
+              stripe
               :data="tableData"
               style="width: 100%"
               v-if="tableData && tableData.length > 0"
@@ -310,12 +310,13 @@ export default {
           pageNum: 1,
           pageSize: 100,
           mtType: "5", // 标准ModBus电表
+          isUse: "0",
         };
         cpmList(data)
           .then((response) => {
             this.electType = [];
             this.electTypes = response.rows;
-            this.electType = [this.electTypes[0].id];
+            this.electType = [this.electTypes[0].mtNum];
             console.log("this.electTypes", this.electTypes);
             console.log("this.electType", this.electType);
             this.handleSelectChange();
@@ -355,10 +356,11 @@ export default {
     handleSelectChange() {
       console.log("----和默认选中值比较", this.electType);
       this.selectElect = this.electType.map((v) => {
-        const selectedItem = this.electTypes.find((item) => item.id === v);
+        const selectedItem = this.electTypes.find((item) => item.mtNum === v);
         return {
           name: selectedItem ? selectedItem.otherName : "",
-          value: v,
+          // 如果 selectedItem 存在，则使用其 id 属性作为 value，否则设为 null
+          value: selectedItem ? selectedItem.id : null,
         };
       });
       console.log("this.selectElect", this.selectElect);
@@ -471,24 +473,26 @@ export default {
       this.listLoading = true;
       deviceAnalyze(data).then((res) => {
         console.log("查询返回", res);
-        if (res.code == 200 && res.data.content) {
-          // 格式化 content 填充 this.tableData
-          this.tableData = res.data.content[1].timeStr.map((date, index) => {
+        if (res.code == 200 && res.data.length > 0) {
+          // 格式化 data 填充 this.tableData
+          this.tableData = res.data[1].timeStr.map((date, index) => {
             const rowData = { date };
-            res.data.content[0].dataList.forEach((data, dataIndex) => {
+            res.data[2].dataList.forEach((data, dataIndex) => {
               rowData[`data${dataIndex + 1}`] = data.value[index];
             });
             return rowData;
           });
           console.log("tableData", this.tableData);
-          // 格式化 content 填充 header
+          console.log("res.data[2].dataList",res.data[2].dataList)
+          console.log("this.electTypes", this.electTypes);
+          // 格式化 data 填充 header
           this.headers = [
             { key: "date", label: "时间" },
-            ...res.data.content[0].dataList.map((data, index) => {
+            ...res.data[2].dataList.map((data, index) => {
               const matched = this.electTypes.find(
-                (item) => item.value === data.name
+                (item) => item.mtNum === data.name
               );
-              const label = matched ? matched.label : "";
+              const label = matched ? matched.otherName : "";
               return {
                 key: `data${index + 1}`,
                 label: label,
@@ -537,19 +541,16 @@ export default {
       console.log("查询数据参数", data);
       deviceAnalyze(data).then((res) => {
         console.log("查询返回", res);
-        if (res.code == 200 && res.data.content) {
-          this.timeData = res.data.content[1].timeStr;
+        if (res.code == 200 && res.data.length > 0) {
+          this.timeData = res.data[1].timeStr;
           // 具体看看怎么拿到x组数据   得到一个数组，对象{name：需要匹配select数据源,data}
-          console.log(
-            "res.data.content[0].dataList",
-            res.data.content[0].dataList
-          );
+          console.log("res.data[2].dataList", res.data[2].dataList);
           this.dataArr = [];
-          this.dataArr = res.data.content[0].dataList;
+          this.dataArr = res.data[2].dataList;
           this.dataArr.forEach((obj) => {
-            const match = this.electTypes.find((s) => s.value === obj.name);
+            const match = this.electTypes.find((s) => s.mtNum === obj.name);
             if (match) {
-              obj.name = match.label;
+              obj.name = match.otherName;
             }
             obj.type = "line";
             obj.smooth = true;
diff --git a/src/views/centerairC/energyAnalysis/components/qnqAnalysis.vue b/src/views/centerairC/energyAnalysis/components/qnqAnalysis.vue
index 543927b..a321d94 100644
--- a/src/views/centerairC/energyAnalysis/components/qnqAnalysis.vue
+++ b/src/views/centerairC/energyAnalysis/components/qnqAnalysis.vue
@@ -357,6 +357,7 @@ export default {
         console.log("查询返回", res);
         if (res.code == 200 && res.data.data !== null) {
           this.dateList = res.data.times;
+          console.log("后端返回的上期值------------", res.data.data[1]);
           // 具体看看怎么拿到三组数据
           this.curValue2 = [];
           this.lastValue2 = [];
diff --git a/src/views/centerairC/sysControl/index copy 2.vue b/src/views/centerairC/sysControl/index copy 2.vue
new file mode 100644
index 0000000..9d8d252
--- /dev/null
+++ b/src/views/centerairC/sysControl/index copy 2.vue	
@@ -0,0 +1,431 @@
+<template>
+  <div class="app-container" v-loading="loading">
+    <!-- 状态统计 -->
+    <div class="status-statistics">
+      <div class="status-card">
+        <div class="status-label">运行设备</div>
+        <div class="status-value-running">
+          {{ statistics.running }}/{{ total }}
+        </div>
+      </div>
+      <div class="status-card">
+        <div class="status-label">手动模式</div>
+        <div class="status-value-auto">{{ statistics.manual }}/{{ total }}</div>
+      </div>
+      <div class="status-card">
+        <div class="status-label">自动模式</div>
+        <div class="status-value-maintenance">
+          {{ statistics.auto }}/{{ total }}
+        </div>
+      </div>
+      <div class="status-card">
+        <div class="status-label">故障设备</div>
+        <div class="status-value-error">{{ statistics.warn }}/{{ total }}</div>
+      </div>
+    </div>
+    <el-tabs v-model="activeName" @tab-click="handleClick">
+      <el-tab-pane label="主机" name="host"> </el-tab-pane>
+      <el-tab-pane label="冷却塔" name="second"> </el-tab-pane>
+      <el-tab-pane label="冷却泵" name="three"> </el-tab-pane>
+      <el-tab-pane label="冷冻泵" name="three"> </el-tab-pane>
+      <el-tab-pane label="冷冻蝶阀" name="three"> </el-tab-pane>
+      <el-tab-pane label="冷却蝶阀" name="three"> </el-tab-pane>
+      <el-tab-pane label="冷却塔出水阀" name="three"> </el-tab-pane>
+    </el-tabs>
+    <!-- 非蝶阀控制列表 -->
+    <div class="device-container">
+      <list-header
+        :deviceList="hostList"
+        @operationControl="hadleOperationConrol"
+      ></list-header>
+    </div>
+    <div class="device-container">
+      <list-header
+        :deviceList="coolingTowerFanList"
+        @operationControl="hadleOperationConrol"
+      ></list-header>
+    </div>
+    <div class="device-container">
+      <list-header
+        :deviceList="coolingPump"
+        @operationControl="hadleOperationConrol"
+      ></list-header>
+    </div>
+    <div class="device-container">
+      <list-header
+        :deviceList="freezingPump"
+        @operationControl="hadleOperationConrol"
+      ></list-header>
+    </div>
+    <!-- 蝶阀控制列表 -->
+    <div class="device-container">
+      <vavleheader
+        :valveList="freezingValve"
+        @operationControl="hadleOperationConrol"
+      ></vavleheader>
+    </div>
+    <div class="device-container">
+      <vavleheader
+        :valveList="coolingValve"
+        @operationControl="hadleOperationConrol"
+      ></vavleheader>
+    </div>
+    <div class="device-container">
+      <vavleheader
+        :valveList="coolingTowerOutValve"
+        @operationControl="hadleOperationConrol"
+      ></vavleheader>
+    </div>
+  </div>
+</template>
+
+<script>
+import { operationList, operationConrol } from "@/api/centerairC/sysMonitor";
+import listHeader from "./listHeader.vue";
+import Vavleheader from "./vavleheader.vue";
+export default {
+  components: { listHeader, Vavleheader },
+  name: "sysMonitor",
+  data() {
+    return {
+      loading: false,
+      deviceList: [], //全部
+      hostList: [], //主机
+      coolingTowerFanList: [], //冷却塔风机
+      coolingPump: [], //冷却泵
+      freezingPump: [], //冷冻泵
+      valveList: [], //阀
+      total: null,
+      freezingValve: [], //冷冻蝶阀
+      coolingValve: [], //冷却蝶阀
+      coolingTowerOutValve: [], //冷却塔出水阀
+      activeName: "host", //设备管理
+    };
+  },
+  computed: {
+    statistics() {
+      const deviceManual = this.deviceList.filter(
+        (d) => d.automaticText === false
+      ).length;
+      const deviceAuto = this.deviceList.filter(
+        (d) => d.automaticText === true
+      ).length;
+      const valveManual = this.valveList.filter(
+        (v) => v.automaticText === false
+      ).length;
+      const valveAuto = this.valveList.filter(
+        (v) => v.automaticText === true
+      ).length;
+
+      return {
+        running: this.deviceList.filter((d) => d.runStatus === "运行").length,
+        manual: deviceManual + valveManual,
+        auto: deviceAuto + valveAuto,
+        warn: this.deviceList.filter((d) => d.warnText === "故障").length,
+      };
+    },
+  },
+  mounted() {
+    this.getOperationList();
+  },
+  methods: {
+    handleClick(tab, event) {
+      console.log(tab, event);
+    },
+    // 系统控制列表
+    getOperationList() {
+      return new Promise((resolve, reject) => {
+        operationList({ systemType: 0 })
+          .then((res) => {
+            console.log("列表返回res", res);
+            if (res.code === 200) {
+              let handleList = res.rows;
+              this.deviceList = [];
+              this.valveList = [];
+              handleList.forEach((element) => {
+                if (element.children && element.children.length > 0) {
+                  // 初始化一个空对象来存储非蝶阀处理后的结果
+                  let deviceItem = {
+                    name: element.name,
+                  };
+                  // 初始化一个空对象来存储阀门处理后的结果
+                  let valveItem = {
+                    name: element.name,
+                  };
+
+                  const limitedChildren = element.children;
+                  let valveClosed = false;
+                  let valveOpened = false;
+
+                  limitedChildren.forEach((child) => {
+                    if (child.name) {
+                      // 运行状态
+                      if (
+                        child.paramType === "1" &&
+                        !child.name.includes("阀")
+                      ) {
+                        deviceItem.runStatus =
+                          Number(child.value) == 0 ? "不运行" : "运行";
+                      }
+                      // 手动控制
+                      else if (
+                        child.paramType === "2" &&
+                        !child.name.includes("阀")
+                      ) {
+                        deviceItem.controlText =
+                          Number(child.value) == 0 ? false : true;
+                        deviceItem.controlId = child.id;
+                      }
+                      // 手自动切换    0自动1手动
+                      else if (
+                        child.paramType === "6" &&
+                        !child.name.includes("阀")
+                      ) {
+                        deviceItem.automaticText =
+                          Number(child.value) == 0 ? true : false;
+                        deviceItem.automaticId = child.id;
+                      }
+                      // 故障报警
+                      else if (
+                        child.paramType === "5" &&
+                        !child.name.includes("阀")
+                      ) {
+                        deviceItem.warnText =
+                          Number(child.value) == 0 ? "未故障" : "故障";
+                        // 本地远程
+                      } else if (
+                        child.paramType === "22" &&
+                        !child.name.includes("阀")
+                      ) {
+                        deviceItem.localRemote =
+                          Number(child.value) == 0 ? "本地" : "远程";
+                      }
+                      // 频率调节
+                      else if (
+                        child.paramType === "3" &&
+                        !child.name.includes("阀")
+                      ) {
+                        deviceItem.frequencySet =
+                          Number(child.value) == 0 ? "0" : child.value;
+                        deviceItem.frequencyId = child.id;
+                      }
+                      // 频率反馈
+                      else if (child.paramType === "4") {
+                        deviceItem.frequency = child.value;
+                      }
+
+                      // 阀门的-手自动切换
+                      else if (
+                        child.paramType === "6" &&
+                        child.name.includes("阀")
+                      ) {
+                        valveItem.automaticText =
+                          Number(child.value) == 0 ? true : false;
+                        valveItem.automaticId = child.id;
+                      }
+                      // 阀门的-手动控制
+                      else if (
+                        child.paramType === "2" &&
+                        child.name.includes("阀")
+                      ) {
+                        valveItem.controlText =
+                          Number(child.value) == 0 ? false : true;
+                        valveItem.controlId = child.id;
+                      }
+
+                      // 记录阀关到位状态
+                      if (
+                        child.name.includes("阀关到位") &&
+                        Number(child.value) == 0
+                      ) {
+                        valveClosed = false;
+                      } else if (
+                        child.name.includes("阀关到位") &&
+                        Number(child.value) == 1
+                      ) {
+                        valveClosed = true;
+                      }
+                      // 记录阀开到位的状态
+                      if (
+                        child.name.includes("阀开到位") &&
+                        Number(child.value) == 0
+                      ) {
+                        valveOpened = false;
+                      } else if (
+                        child.name.includes("阀开到位") &&
+                        Number(child.value) == 1
+                      ) {
+                        valveOpened = true;
+                      }
+                    }
+                  });
+
+                  // 根据阀关到位和阀开到位的状态设置阀门状态
+                  if (valveClosed && !valveOpened) {
+                    valveItem.closeStatus = "开启";
+                    valveItem.openStauts = "关闭";
+                  } else if (!valveClosed && valveOpened) {
+                    valveItem.closeStatus = "关闭";
+                    valveItem.openStauts = "开启";
+                  } else if (!valveClosed && !valveOpened) {
+                    valveItem.closeStatus = "关闭";
+                    valveItem.openStauts = "关闭";
+                  }
+
+                  // 将处理后的对象添加到 deviceList 中
+                  if (Object.keys(deviceItem).length > 1) {
+                    this.deviceList.push(deviceItem);
+                  }
+                  // 将处理后的对象添加到 valveList 中
+                  if (Object.keys(valveItem).length > 1) {
+                    this.valveList.push(valveItem);
+                  }
+                }
+              });
+              this.valveList = this.valveList.filter(
+                (item) => item.name && item.name.includes("阀")
+              );
+              console.log("处理过的this.deviceList", this.deviceList);
+              console.log("处理过的this.valveList", this.valveList);
+              this.total = this.deviceList.length + this.valveList.length;
+
+              // 再分类不同的设备列表
+              this.hostList = [];
+              this.coolingTowerFanList = [];
+              this.coolingPump = [];
+              this.freezingPump = [];
+              this.freezingValve = [];
+              this.coolingValve = [];
+              this.coolingTowerOutValve = [];
+              this.deviceList.forEach((list) => {
+                if (list.name.includes("机") && !list.name.includes("风")) {
+                  this.hostList.push(list);
+                }
+                if (list.name.includes("风机")) {
+                  this.coolingTowerFanList.push(list);
+                }
+                if (list.name.includes("冷却泵")) {
+                  this.coolingPump.push(list);
+                }
+                if (list.name.includes("冷冻泵")) {
+                  this.freezingPump.push(list);
+                }
+              });
+              this.valveList.forEach((list) => {
+                if (list.name.includes("冷冻蝶阀")) {
+                  this.freezingValve.push(list);
+                }
+                if (list.name.includes("冷却蝶阀")) {
+                  this.coolingValve.push(list);
+                }
+                if (list.name.includes("冷却塔出水阀")) {
+                  this.coolingTowerOutValve.push(list);
+                }
+              });
+              console.log("处理过后的主机列表", this.hostList);
+            } else {
+              this.deviceList = [];
+              this.valveList = [];
+              this.total = 0;
+            }
+            // 成功时解析 Promise
+            resolve(res);
+          })
+          .catch((error) => {
+            // 失败时拒绝 Promise
+            reject(error);
+          });
+      });
+    },
+    // 操作
+    hadleOperationConrol(id, param) {
+      let data = {
+        id: id,
+        param: param,
+      };
+      console.log("操作参数", data);
+      operationConrol([data])
+        .then((res) => {
+          if (res.code == 200) {
+            this.$modal.msgSuccess("指令下发成功!");
+            // 开启 loading 效果
+            this.loading = true;
+            // 更新所有设备状态;
+            setTimeout(() => {
+              this.getOperationList().finally(() => {
+                // 关闭 loading 效果
+                this.loading = false;
+              });
+            }, 6000);
+          } else {
+            // this.$modal.msgError("操作失败");
+            console.log("应该更新状态的");
+            // 更新所有设备状态;
+            this.getOperationList();
+          }
+        })
+        .catch((error) => {
+          console.log("请求发生错误，更新设备状态", error);
+          // 更新所有设备状态;
+          this.getOperationList();
+        });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+/* 设备控制列表样式 */
+.device-container {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  background-color: #142c4e;
+  padding: 10px 10px 30px 10px;
+  border-radius: 10px;
+  margin-bottom: 20px;
+}
+/* 状态统计样式 */
+.status-statistics {
+  margin-bottom: 25px;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}
+
+.status-card {
+  background-color: #142c4e;
+  border-radius: 10px;
+  padding: 10px;
+  width: 24%;
+}
+
+.status-label {
+  color: #9ca3af;
+  margin-bottom: 20px;
+}
+
+.status-value-running {
+  font-size: 24px;
+  font-weight: bold;
+  color: #22c55e;
+}
+
+.status-value-auto {
+  font-size: 24px;
+  font-weight: bold;
+  color: #60a5fa;
+}
+
+.status-value-error {
+  font-size: 24px;
+  font-weight: bold;
+  color: #ef4444;
+}
+
+.status-value-maintenance {
+  font-size: 24px;
+  font-weight: bold;
+  color: #f59e0b;
+}
+</style>
diff --git a/src/views/centerairC/sysControl/index copy.vue b/src/views/centerairC/sysControl/index copy.vue
new file mode 100644
index 0000000..7bbeb12
--- /dev/null
+++ b/src/views/centerairC/sysControl/index copy.vue	
@@ -0,0 +1,643 @@
+<template>
+  <div class="app-container" v-loading="loading">
+    <!-- 状态统计 -->
+    <div class="status-statistics">
+      <div class="status-card">
+        <div class="status-label">运行设备</div>
+        <div class="status-value-running">
+          {{ statistics.running }}/{{ total }}
+        </div>
+      </div>
+      <div class="status-card">
+        <div class="status-label">手动模式</div>
+        <div class="status-value-auto">{{ statistics.manual }}/{{ total }}</div>
+      </div>
+      <div class="status-card">
+        <div class="status-label">自动模式</div>
+        <div class="status-value-maintenance">
+          {{ statistics.auto }}/{{ total }}
+        </div>
+      </div>
+      <div class="status-card">
+        <div class="status-label">故障设备</div>
+        <div class="status-value-error">{{ statistics.warn }}/{{ total }}</div>
+      </div>
+    </div>
+    <!-- 非蝶阀控制列表 -->
+    <div class="device-container">
+      <!-- <div class="device-li">
+        <div class="device-name">设备名称</div>
+        <div class="device-name">运行状态</div>
+        <div class="device-name">手动控制</div>
+        <div class="device-name">手自动切换</div>
+        <div class="device-name">本地远程状态</div>
+        <div class="device-name">故障报警</div>
+        <div class="device-name">频率调节</div>
+        <div class="device-name">频率反馈</div>
+      </div> -->
+      <list-header :deviceList ="deviceList"></list-header>
+      <!-- <div class="device-li" v-for="(item, index) in deviceList" :key="index">
+        <div class="device-name">{{ item.name }}</div>
+        <div class="device-name">
+          <div
+            class="run"
+            :class="item.runStatus === '运行' ? 'run' : 'no-run'"
+          >
+            {{ item.runStatus }}
+          </div>
+        </div>
+        <div class="device-name">
+          <el-switch
+            style="display: block"
+            v-model="item.controlText"
+            active-color="#13ce66"
+            inactive-color="#ff4949"
+            active-text="开启"
+            inactive-text="停止"
+            @change="handleControlText(item)"
+          >
+          </el-switch>
+        </div>
+        <div class="device-name">
+          <el-switch
+            style="display: block"
+            v-model="item.automaticText"
+            active-color="#13ce66"
+            inactive-color="#ff4949"
+            active-text="自动"
+            inactive-text="手动"
+            @change="handleAutomaticText(item)"
+          >
+          </el-switch>
+        </div>
+        <div class="device-name">
+          <span
+            :class="
+              item.localRemote === '远程' ? 'strong-electric' : 'auto-electric'
+            "
+            >{{ item.localRemote }}</span
+          >
+        </div>
+        <div class="device-name">
+          <div :class="item.warnText === '故障' ? 'bad-status' : 'good-status'">
+            {{ item.warnText }}
+          </div>
+        </div>
+        <div class="device-name">
+          <el-input
+            v-if="item.frequencySet !== null && item.frequencySet !== undefined"
+            v-model="item.frequencySet"
+            size="mini"
+            @keyup.enter.native="handleEnter(item)"
+            @input="handleInput(item)"
+          ></el-input>
+          <div class="device-name" v-else></div>
+        </div>
+        <div class="device-name" v-if="item.frequency">
+          {{ item.frequency }}Hz
+        </div>
+        <div class="device-name" v-else></div>
+      </div> -->
+    </div>
+    <!-- 蝶阀控制列表 -->
+    <div class="device-container second">
+      <div class="device-li">
+        <div class="device-name">设备名称</div>
+        <div class="device-name">手动控制</div>
+        <div class="device-name">手自动切换</div>
+        <div class="device-name">本地远程状态</div>
+        <div class="device-name">阀关反馈</div>
+        <div class="device-name">阀开反馈</div>
+      </div>
+      <div class="device-li" v-for="(item, index) in valveList" :key="index">
+        <div class="device-name">{{ item.name }}</div>
+        <div class="device-name">
+          <el-switch
+            style="display: block"
+            v-model="item.controlText"
+            active-color="#13ce66"
+            inactive-color="#ff4949"
+            active-text="开启"
+            inactive-text="停止"
+            @change="handleControlText(item)"
+          >
+          </el-switch>
+        </div>
+        <div class="device-name">
+          <el-switch
+            style="display: block"
+            v-model="item.automaticText"
+            active-color="#13ce66"
+            inactive-color="#ff4949"
+            active-text="自动"
+            inactive-text="手动"
+            @change="handleAutomaticText(item)"
+          >
+          </el-switch>
+        </div>
+        <div class="device-name">
+          <span
+            :class="
+              item.localRemote === '远程' ? 'strong-electric' : 'auto-electric'
+            "
+            >{{ item.localRemote }}</span
+          >
+        </div>
+        <div class="device-name">
+          <div
+            :class="item.openStauts === '关闭' ? 'bad-status' : 'good-status'"
+          >
+            {{ item.openStauts }}
+          </div>
+        </div>
+        <div class="device-name">
+          <div
+            :class="item.closeStatus === '关闭' ? 'bad-status' : 'good-status'"
+          >
+            {{ item.closeStatus }}
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { operationList, operationConrol } from "@/api/centerairC/sysMonitor";
+import listHeader from "./listHeader.vue";
+export default {
+  components: { listHeader },
+  name: "sysMonitor",
+  data() {
+    return {
+      loading: false,
+      deviceList: [], //全部
+      hostList: [], //主机
+      coolingTowerFanList: [], //冷却塔风机
+      coolingPump: [], //冷却泵
+      freezingPump: [], //冷冻泵
+      valveList: [], //阀
+      total: null,
+      freezingValve: [], //冷冻蝶阀
+      coolingValve: [], //冷却蝶阀
+      coolingTowerOutValve: [], //冷却塔出水阀
+    };
+  },
+  computed: {
+    statistics() {
+      const deviceManual = this.deviceList.filter(
+        (d) => d.automaticText === false
+      ).length;
+      const deviceAuto = this.deviceList.filter(
+        (d) => d.automaticText === true
+      ).length;
+      const valveManual = this.valveList.filter(
+        (v) => v.automaticText === false
+      ).length;
+      const valveAuto = this.valveList.filter(
+        (v) => v.automaticText === true
+      ).length;
+
+      return {
+        running: this.deviceList.filter((d) => d.runStatus === "运行").length,
+        manual: deviceManual + valveManual,
+        auto: deviceAuto + valveAuto,
+        warn: this.deviceList.filter((d) => d.warnText === "故障").length,
+      };
+    },
+  },
+  mounted() {
+    this.getOperationList();
+  },
+  methods: {
+    // 系统控制列表
+    getOperationList() {
+      return new Promise((resolve, reject) => {
+        operationList({ systemType: 0 })
+          .then((res) => {
+            console.log("列表返回res", res);
+            if (res.code === 200) {
+              let handleList = res.rows;
+              this.deviceList = [];
+              this.valveList = [];
+              handleList.forEach((element) => {
+                if (element.children && element.children.length > 0) {
+                  // 初始化一个空对象来存储非蝶阀处理后的结果
+                  let deviceItem = {
+                    name: element.name,
+                  };
+                  // 初始化一个空对象来存储阀门处理后的结果
+                  let valveItem = {
+                    name: element.name,
+                  };
+
+                  const limitedChildren = element.children;
+                  let valveClosed = false;
+                  let valveOpened = false;
+
+                  limitedChildren.forEach((child) => {
+                    if (child.name) {
+                      // 运行状态
+                      if (
+                        child.paramType === "1" &&
+                        !child.name.includes("阀")
+                      ) {
+                        deviceItem.runStatus =
+                          Number(child.value) == 0 ? "不运行" : "运行";
+                      }
+                      // 手动控制
+                      else if (
+                        child.paramType === "2" &&
+                        !child.name.includes("阀")
+                      ) {
+                        deviceItem.controlText =
+                          Number(child.value) == 0 ? false : true;
+                        deviceItem.controlId = child.id;
+                      }
+                      // 手自动切换    0自动1手动
+                      else if (
+                        child.paramType === "6" &&
+                        !child.name.includes("阀")
+                      ) {
+                        deviceItem.automaticText =
+                          Number(child.value) == 0 ? true : false;
+                        deviceItem.automaticId = child.id;
+                      }
+                      // 故障报警
+                      else if (
+                        child.paramType === "5" &&
+                        !child.name.includes("阀")
+                      ) {
+                        deviceItem.warnText =
+                          Number(child.value) == 0 ? "未故障" : "故障";
+                        // 本地远程
+                      } else if (
+                        child.paramType === "22" &&
+                        !child.name.includes("阀")
+                      ) {
+                        deviceItem.localRemote =
+                          Number(child.value) == 0 ? "本地" : "远程";
+                      }
+                      // 频率调节
+                      else if (
+                        child.paramType === "3" &&
+                        !child.name.includes("阀")
+                      ) {
+                        deviceItem.frequencySet =
+                          Number(child.value) == 0 ? "0" : child.value;
+                        deviceItem.frequencyId = child.id;
+                      }
+                      // 频率反馈
+                      else if (child.paramType === "4") {
+                        deviceItem.frequency = child.value;
+                      }
+
+                      // 阀门的-本地远程状态
+                      else if (
+                        child.paramType === "22" &&
+                        child.name.includes("阀")
+                      ) {
+                        valveItem.localRemote =
+                          Number(child.value) == 0 ? "本地" : "远程";
+                      }
+                      // 阀门的-手自动切换
+                      else if (
+                        child.paramType === "6" &&
+                        child.name.includes("阀")
+                      ) {
+                        valveItem.automaticText =
+                          Number(child.value) == 0 ? true : false;
+                        valveItem.automaticId = child.id;
+                      }
+                      // 阀门的-手动控制
+                      else if (
+                        child.paramType === "2" &&
+                        child.name.includes("阀")
+                      ) {
+                        valveItem.controlText =
+                          Number(child.value) == 0 ? false : true;
+                        valveItem.controlId = child.id;
+                      }
+
+                      // 记录阀关到位状态
+                      if (
+                        child.name.includes("阀关到位") &&
+                        Number(child.value) == 0
+                      ) {
+                        valveClosed = false;
+                      } else if (
+                        child.name.includes("阀关到位") &&
+                        Number(child.value) == 1
+                      ) {
+                        valveClosed = true;
+                      }
+                      // 记录阀开到位的状态
+                      if (
+                        child.name.includes("阀开到位") &&
+                        Number(child.value) == 0
+                      ) {
+                        valveOpened = false;
+                      } else if (
+                        child.name.includes("阀开到位") &&
+                        Number(child.value) == 1
+                      ) {
+                        valveOpened = true;
+                      }
+                    }
+                  });
+
+                  // 根据阀关到位和阀开到位的状态设置阀门状态
+                  if (valveClosed && !valveOpened) {
+                    valveItem.closeStatus = "开启";
+                    valveItem.openStauts = "关闭";
+                  } else if (!valveClosed && valveOpened) {
+                    valveItem.closeStatus = "关闭";
+                    valveItem.openStauts = "开启";
+                  }
+
+                  // 将处理后的对象添加到 deviceList 中
+                  if (Object.keys(deviceItem).length > 1) {
+                    this.deviceList.push(deviceItem);
+                  }
+                  // 将处理后的对象添加到 valveList 中
+                  if (Object.keys(valveItem).length > 1) {
+                    this.valveList.push(valveItem);
+                  }
+                }
+              });
+              console.log("处理过的this.deviceList", this.deviceList);
+              console.log("处理过的this.valveList", this.valveList);
+              this.total = this.deviceList.length + this.valveList.length;
+
+              // 再分类不同的设备列表
+              this.hostList = [];
+              this.deviceList.forEach((list) => {
+                if (list.name.includes("机") && !list.name.includes("风")) {
+                  this.hostList.push(list);
+                }
+              });
+              console.log("处理过后的主机列表", this.hostList);
+            } else {
+              this.deviceList = [];
+              this.valveList = [];
+              this.total = 0;
+            }
+            // 成功时解析 Promise
+            resolve(res);
+          })
+          .catch((error) => {
+            // 失败时拒绝 Promise
+            reject(error);
+          });
+      });
+    },
+    // 处理输入事件，过滤非数字字符
+    handleInput(item) {
+      console.log("校验");
+      // 实时校验并过滤非数字字符
+      item.frequencySet = String(item.frequencySet).replace(/[^\d]/g, "");
+    },
+    handleEnter(item) {
+      console.log("请求后端");
+      this.$confirm(
+        `确定要修改"${item.name}"的频率为:${item.frequencySet} Hz吗?`,
+        "提示",
+        {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        }
+      )
+        .then(() => {
+          this.hadleOperationConrol(item.frequencyId, item.frequencySet);
+        })
+        .catch(() => {
+          // 用户取消操作，需要更新原来的频率
+          this.getOperationList();
+        });
+    },
+    //手动控制
+    handleControlText(item) {
+      this.$confirm(
+        `确定要切换设备"${item.name}"的状态为:${
+          item.controlText ? "开启" : "停止 吗?"
+        }`,
+        "提示",
+        {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        }
+      )
+        .then(() => {
+          // 这里调用请求函数
+          console.log("请求后台", item.controlText);
+          let param = null;
+          if (item.controlText) {
+            param = 1;
+          } else {
+            param = 0;
+          }
+          this.hadleOperationConrol(item.controlId, param);
+        })
+        .catch(() => {
+          // 用户取消操作，恢复开关状态
+          item.controlText = !item.controlText;
+          console.log("不请求后台");
+        });
+    },
+    // 手自动切换
+    handleAutomaticText(item) {
+      this.$confirm(
+        `确定要切换设备"${item.name}"的状态为:${
+          item.automaticText ? "自动" : "手动 吗?"
+        }`,
+        "提示",
+        {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        }
+      )
+        .then(() => {
+          // 这里调用请求函数
+          console.log("请求后台", item.automaticText);
+          let param = null;
+          if (item.automaticText) {
+            param = 0;
+          } else {
+            param = 1;
+          }
+          this.hadleOperationConrol(item.automaticId, param);
+        })
+        .catch(() => {
+          // 用户取消操作，恢复开关状态
+          item.automaticText = !item.automaticText;
+          console.log("不请求后台");
+        });
+    },
+    hadleOperationConrol(id, param) {
+      let data = {
+        id: id,
+        param: param,
+      };
+      console.log("操作参数", data);
+      operationConrol([data])
+        .then((res) => {
+          if (res.code == 200) {
+            this.$modal.msgSuccess("操作成功");
+            // 开启 loading 效果
+            this.loading = true;
+            // 更新所有设备状态;
+            setTimeout(() => {
+              this.getOperationList().finally(() => {
+                // 关闭 loading 效果
+                this.loading = false;
+              });
+            }, 6000);
+          } else {
+            // this.$modal.msgError("操作失败");
+            console.log("应该更新状态的");
+            // 更新所有设备状态;
+            this.getOperationList();
+          }
+        })
+        .catch((error) => {
+          console.log("请求发生错误，更新设备状态", error);
+          // 更新所有设备状态;
+          this.getOperationList();
+        });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+/* 设备控制列表样式 */
+.device-container {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  background-color: #142c4e;
+  padding: 10px 10px 30px 10px;
+  border-radius: 10px;
+  .device-li {
+    flex: 1;
+    width: 100%;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    padding: 12px 0;
+    color: #abcdfc;
+    border-bottom: 1px dashed #0349ac;
+    .device-name {
+      flex: 1;
+      white-space: nowrap;
+      .el-switch {
+        width: 120px !important;
+      }
+      .run {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        display: block;
+      }
+      .run::before {
+        content: "";
+        display: inline-block;
+        width: 10px;
+        height: 10px;
+        background-color: rgb(16, 231, 16);
+        border-radius: 50%;
+        margin-right: 5px;
+      }
+      .no-run {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        display: block;
+      }
+      .no-run::before {
+        content: "";
+        display: inline-block;
+        width: 10px;
+        height: 10px;
+        background-color: rgb(180, 180, 180);
+        border-radius: 50%;
+        margin-right: 5px;
+      }
+      .el-input {
+        width: 100px;
+      }
+      .strong-electric {
+        background-color: rgba(59, 130, 246, 0.2);
+        color: #60a5fa;
+        padding: 5px 20px;
+        border-radius: 10px;
+      }
+      .auto-electric {
+        background-color: rgba(231, 144, 45, 0.2);
+        color: #e47f21;
+        padding: 5px 20px;
+        border-radius: 10px;
+      }
+      .good-status {
+        color: #4ade80;
+      }
+      .bad-status {
+        color: #f05348;
+      }
+    }
+  }
+  .device-li:nth-child(1) {
+    color: #9ca3af;
+  }
+}
+.second {
+  margin-top: 20px;
+}
+
+/* 状态统计样式 */
+.status-statistics {
+  margin-bottom: 25px;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+}
+
+.status-card {
+  background-color: #142c4e;
+  border-radius: 10px;
+  padding: 10px;
+  width: 24%;
+}
+
+.status-label {
+  color: #9ca3af;
+  margin-bottom: 20px;
+}
+
+.status-value-running {
+  font-size: 24px;
+  font-weight: bold;
+  color: #22c55e;
+}
+
+.status-value-auto {
+  font-size: 24px;
+  font-weight: bold;
+  color: #60a5fa;
+}
+
+.status-value-error {
+  font-size: 24px;
+  font-weight: bold;
+  color: #ef4444;
+}
+
+.status-value-maintenance {
+  font-size: 24px;
+  font-weight: bold;
+  color: #f59e0b;
+}
+</style>
diff --git a/src/views/centerairC/sysControl/index.vue b/src/views/centerairC/sysControl/index.vue
index 0963fed..ff41214 100644
--- a/src/views/centerairC/sysControl/index.vue
+++ b/src/views/centerairC/sysControl/index.vue
@@ -23,150 +23,68 @@
         <div class="status-value-error">{{ statistics.warn }}/{{ total }}</div>
       </div>
     </div>
-    <!-- 非蝶阀控制列表 -->
-    <div class="device-container">
-      <!-- <div class="device-li">
-        <div class="device-name">设备名称</div>
-        <div class="device-name">运行状态</div>
-        <div class="device-name">手动控制</div>
-        <div class="device-name">手自动切换</div>
-        <div class="device-name">本地远程状态</div>
-        <div class="device-name">故障报警</div>
-        <div class="device-name">频率调节</div>
-        <div class="device-name">频率反馈</div>
-      </div> -->
-      <list-header></list-header>
-      <div class="device-li" v-for="(item, index) in deviceList" :key="index">
-        <div class="device-name">{{ item.name }}</div>
-        <div class="device-name">
-          <div
-            class="run"
-            :class="item.runStatus === '运行' ? 'run' : 'no-run'"
-          >
-            {{ item.runStatus }}
-          </div>
+    <el-tabs v-model="activeName" @tab-click="handleClick">
+      <el-tab-pane label="主机" name="host">
+        <div class="device-container">
+          <list-header
+            :deviceList="hostList"
+            :isNoShowHz="true"
+            @operationControl="hadleOperationConrol"
+          ></list-header>
         </div>
-        <div class="device-name">
-          <el-switch
-            style="display: block"
-            v-model="item.controlText"
-            active-color="#13ce66"
-            inactive-color="#ff4949"
-            active-text="开启"
-            inactive-text="停止"
-            @change="handleControlText(item)"
-          >
-          </el-switch>
+        <div class="device-container">
+          <vavleheader
+            :valveList="freezingValve"
+            @operationControl="hadleOperationConrol"
+          ></vavleheader>
         </div>
-        <div class="device-name">
-          <el-switch
-            style="display: block"
-            v-model="item.automaticText"
-            active-color="#13ce66"
-            inactive-color="#ff4949"
-            active-text="自动"
-            inactive-text="手动"
-            @change="handleAutomaticText(item)"
-          >
-          </el-switch>
+        <div class="device-container">
+          <vavleheader
+            :valveList="coolingValve"
+            @operationControl="hadleOperationConrol"
+          ></vavleheader>
         </div>
-        <div class="device-name">
-          <span
-            :class="
-              item.localRemote === '远程' ? 'strong-electric' : 'auto-electric'
-            "
-            >{{ item.localRemote }}</span
-          >
+      </el-tab-pane>
+      <el-tab-pane label="冷却塔" name="coolingTowerFan">
+        <div class="device-container">
+          <list-header
+            :deviceList="coolingTowerFanList"
+            @operationControl="hadleOperationConrol"
+          ></list-header>
         </div>
-        <div class="device-name">
-          <div :class="item.warnText === '故障' ? 'bad-status' : 'good-status'">
-            {{ item.warnText }}
-          </div>
+        <div class="device-container">
+          <vavleheader
+            :valveList="coolingTowerOutValve"
+            @operationControl="hadleOperationConrol"
+          ></vavleheader>
         </div>
-        <div class="device-name">
-          <el-input
-            v-if="item.frequencySet !== null && item.frequencySet !== undefined"
-            v-model="item.frequencySet"
-            size="mini"
-            @keyup.enter.native="handleEnter(item)"
-            @input="handleInput(item)"
-          ></el-input>
-          <div class="device-name" v-else></div>
+      </el-tab-pane>
+      <el-tab-pane label="冷却泵" name="coolingPump">
+        <div class="device-container">
+          <list-header
+            :deviceList="coolingPump"
+            @operationControl="hadleOperationConrol"
+          ></list-header>
         </div>
-        <div class="device-name" v-if="item.frequency">
-          {{ item.frequency }}Hz
+      </el-tab-pane>
+      <el-tab-pane label="冷冻泵" name="freezingPump">
+        <div class="device-container">
+          <list-header
+            :deviceList="freezingPump"
+            @operationControl="hadleOperationConrol"
+          ></list-header>
         </div>
-        <div class="device-name" v-else></div>
-      </div>
-    </div>
-    <!-- 蝶阀控制列表 -->
-    <div class="device-container second">
-      <div class="device-li">
-        <div class="device-name">设备名称</div>
-        <div class="device-name">手动控制</div>
-        <div class="device-name">手自动切换</div>
-        <div class="device-name">本地远程状态</div>
-        <div class="device-name">阀关反馈</div>
-        <div class="device-name">阀开反馈</div>
-      </div>
-      <div class="device-li" v-for="(item, index) in valveList" :key="index">
-        <div class="device-name">{{ item.name }}</div>
-        <div class="device-name">
-          <el-switch
-            style="display: block"
-            v-model="item.controlText"
-            active-color="#13ce66"
-            inactive-color="#ff4949"
-            active-text="开启"
-            inactive-text="停止"
-            @change="handleControlText(item)"
-          >
-          </el-switch>
-        </div>
-        <div class="device-name">
-          <el-switch
-            style="display: block"
-            v-model="item.automaticText"
-            active-color="#13ce66"
-            inactive-color="#ff4949"
-            active-text="自动"
-            inactive-text="手动"
-            @change="handleAutomaticText(item)"
-          >
-          </el-switch>
-        </div>
-        <div class="device-name">
-          <span
-            :class="
-              item.localRemote === '远程' ? 'strong-electric' : 'auto-electric'
-            "
-            >{{ item.localRemote }}</span
-          >
-        </div>
-        <div class="device-name">
-          <div
-            :class="item.openStauts === '关闭' ? 'bad-status' : 'good-status'"
-          >
-            {{ item.openStauts }}
-          </div>
-        </div>
-        <div class="device-name">
-          <div
-            :class="item.closeStatus === '关闭' ? 'bad-status' : 'good-status'"
-          >
-            {{ item.closeStatus }}
-          </div>
-        </div>
-      </div>
-    </div>
+      </el-tab-pane>
+    </el-tabs>
   </div>
 </template>
 
 <script>
 import { operationList, operationConrol } from "@/api/centerairC/sysMonitor";
 import listHeader from "./listHeader.vue";
+import Vavleheader from "./vavleheader.vue";
 export default {
-  components: { listHeader },
+  components: { listHeader, Vavleheader },
   name: "sysMonitor",
   data() {
     return {
@@ -181,6 +99,7 @@ export default {
       freezingValve: [], //冷冻蝶阀
       coolingValve: [], //冷却蝶阀
       coolingTowerOutValve: [], //冷却塔出水阀
+      activeName: "host", //设备管理
     };
   },
   computed: {
@@ -210,6 +129,9 @@ export default {
     this.getOperationList();
   },
   methods: {
+    handleClick(tab, event) {
+      console.log(tab, event);
+    },
     // 系统控制列表
     getOperationList() {
       return new Promise((resolve, reject) => {
@@ -292,14 +214,6 @@ export default {
                         deviceItem.frequency = child.value;
                       }
 
-                      // 阀门的-本地远程状态
-                      else if (
-                        child.paramType === "22" &&
-                        child.name.includes("阀")
-                      ) {
-                        valveItem.localRemote =
-                          Number(child.value) == 0 ? "本地" : "远程";
-                      }
                       // 阀门的-手自动切换
                       else if (
                         child.paramType === "6" &&
@@ -353,6 +267,9 @@ export default {
                   } else if (!valveClosed && valveOpened) {
                     valveItem.closeStatus = "关闭";
                     valveItem.openStauts = "开启";
+                  } else if (!valveClosed && !valveOpened) {
+                    valveItem.closeStatus = "关闭";
+                    valveItem.openStauts = "关闭";
                   }
 
                   // 将处理后的对象添加到 deviceList 中
@@ -365,16 +282,45 @@ export default {
                   }
                 }
               });
+              this.valveList = this.valveList.filter(
+                (item) => item.name && item.name.includes("阀")
+              );
               console.log("处理过的this.deviceList", this.deviceList);
               console.log("处理过的this.valveList", this.valveList);
               this.total = this.deviceList.length + this.valveList.length;
 
               // 再分类不同的设备列表
               this.hostList = [];
+              this.coolingTowerFanList = [];
+              this.coolingPump = [];
+              this.freezingPump = [];
+              this.freezingValve = [];
+              this.coolingValve = [];
+              this.coolingTowerOutValve = [];
               this.deviceList.forEach((list) => {
                 if (list.name.includes("机") && !list.name.includes("风")) {
                   this.hostList.push(list);
                 }
+                if (list.name.includes("风机")) {
+                  this.coolingTowerFanList.push(list);
+                }
+                if (list.name.includes("冷却泵")) {
+                  this.coolingPump.push(list);
+                }
+                if (list.name.includes("冷冻泵")) {
+                  this.freezingPump.push(list);
+                }
+              });
+              this.valveList.forEach((list) => {
+                if (list.name.includes("冷冻蝶阀")) {
+                  this.freezingValve.push(list);
+                }
+                if (list.name.includes("冷却蝶阀")) {
+                  this.coolingValve.push(list);
+                }
+                if (list.name.includes("冷却塔出水阀")) {
+                  this.coolingTowerOutValve.push(list);
+                }
               });
               console.log("处理过后的主机列表", this.hostList);
             } else {
@@ -391,91 +337,7 @@ export default {
           });
       });
     },
-    // 处理输入事件，过滤非数字字符
-    handleInput(item) {
-      console.log("校验");
-      // 实时校验并过滤非数字字符
-      item.frequencySet = String(item.frequencySet).replace(/[^\d]/g, "");
-    },
-    handleEnter(item) {
-      console.log("请求后端");
-      this.$confirm(
-        `确定要修改"${item.name}"的频率为:${item.frequencySet} Hz吗?`,
-        "提示",
-        {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning",
-        }
-      )
-        .then(() => {
-          this.hadleOperationConrol(item.frequencyId, item.frequencySet);
-        })
-        .catch(() => {
-          // 用户取消操作，需要更新原来的频率
-          this.getOperationList();
-        });
-    },
-    //手动控制
-    handleControlText(item) {
-      this.$confirm(
-        `确定要切换设备"${item.name}"的状态为:${
-          item.controlText ? "开启" : "停止 吗?"
-        }`,
-        "提示",
-        {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning",
-        }
-      )
-        .then(() => {
-          // 这里调用请求函数
-          console.log("请求后台", item.controlText);
-          let param = null;
-          if (item.controlText) {
-            param = 1;
-          } else {
-            param = 0;
-          }
-          this.hadleOperationConrol(item.controlId, param);
-        })
-        .catch(() => {
-          // 用户取消操作，恢复开关状态
-          item.controlText = !item.controlText;
-          console.log("不请求后台");
-        });
-    },
-    // 手自动切换
-    handleAutomaticText(item) {
-      this.$confirm(
-        `确定要切换设备"${item.name}"的状态为:${
-          item.automaticText ? "自动" : "手动 吗?"
-        }`,
-        "提示",
-        {
-          confirmButtonText: "确定",
-          cancelButtonText: "取消",
-          type: "warning",
-        }
-      )
-        .then(() => {
-          // 这里调用请求函数
-          console.log("请求后台", item.automaticText);
-          let param = null;
-          if (item.automaticText) {
-            param = 0;
-          } else {
-            param = 1;
-          }
-          this.hadleOperationConrol(item.automaticId, param);
-        })
-        .catch(() => {
-          // 用户取消操作，恢复开关状态
-          item.automaticText = !item.automaticText;
-          console.log("不请求后台");
-        });
-    },
+    // 操作
     hadleOperationConrol(id, param) {
       let data = {
         id: id,
@@ -485,7 +347,7 @@ export default {
       operationConrol([data])
         .then((res) => {
           if (res.code == 200) {
-            this.$modal.msgSuccess("操作成功");
+            this.$modal.msgSuccess("指令下发成功!");
             // 开启 loading 效果
             this.loading = true;
             // 更新所有设备状态;
@@ -521,82 +383,8 @@ export default {
   background-color: #142c4e;
   padding: 10px 10px 30px 10px;
   border-radius: 10px;
-  .device-li {
-    flex: 1;
-    width: 100%;
-    display: flex;
-    flex-direction: row;
-    align-items: center;
-    padding: 12px 0;
-    color: #abcdfc;
-    border-bottom: 1px dashed #0349ac;
-    .device-name {
-      flex: 1;
-      white-space: nowrap;
-      .el-switch {
-        width: 120px !important;
-      }
-      .run {
-        display: flex;
-        flex-direction: row;
-        align-items: center;
-        display: block;
-      }
-      .run::before {
-        content: "";
-        display: inline-block;
-        width: 10px;
-        height: 10px;
-        background-color: rgb(16, 231, 16);
-        border-radius: 50%;
-        margin-right: 5px;
-      }
-      .no-run {
-        display: flex;
-        flex-direction: row;
-        align-items: center;
-        display: block;
-      }
-      .no-run::before {
-        content: "";
-        display: inline-block;
-        width: 10px;
-        height: 10px;
-        background-color: rgb(180, 180, 180);
-        border-radius: 50%;
-        margin-right: 5px;
-      }
-      .el-input {
-        width: 100px;
-      }
-      .strong-electric {
-        background-color: rgba(59, 130, 246, 0.2);
-        color: #60a5fa;
-        padding: 5px 20px;
-        border-radius: 10px;
-      }
-      .auto-electric {
-        background-color: rgba(231, 144, 45, 0.2);
-        color: #e47f21;
-        padding: 5px 20px;
-        border-radius: 10px;
-      }
-      .good-status {
-        color: #4ade80;
-      }
-      .bad-status {
-        color: #f05348;
-      }
-    }
-  }
-  .device-li:nth-child(1) {
-    color: #9ca3af;
-  }
-}
-.second {
-  margin-top: 20px;
+  margin-bottom: 20px;
 }
-
 /* 状态统计样式 */
 .status-statistics {
   margin-bottom: 25px;
diff --git a/src/views/centerairC/sysControl/listHeader.vue b/src/views/centerairC/sysControl/listHeader.vue
index f5db1ba..513f026 100644
--- a/src/views/centerairC/sysControl/listHeader.vue
+++ b/src/views/centerairC/sysControl/listHeader.vue
@@ -7,14 +7,174 @@
       <div class="device-name">手自动切换</div>
       <div class="device-name">本地远程状态</div>
       <div class="device-name">故障报警</div>
-      <div class="device-name">频率调节</div>
-      <div class="device-name">频率反馈</div>
+      <div class="device-name" v-if="!isNoShowHz">频率调节</div>
+      <div class="device-name" v-if="!isNoShowHz">频率反馈</div>
+    </div>
+    <div class="device-li" v-for="(item, index) in deviceList" :key="index">
+      <div class="device-name">{{ item.name }}</div>
+      <div class="device-name">
+        <div class="run" :class="item.runStatus === '运行' ? 'run' : 'no-run'">
+          {{ item.runStatus }}
+        </div>
+      </div>
+      <div class="device-name">
+        <el-switch
+          style="display: block"
+          v-model="item.controlText"
+          active-color="#13ce66"
+          inactive-color="#ff4949"
+          active-text="开启"
+          inactive-text="停止"
+          @change="handleControlText(item)"
+        >
+        </el-switch>
+      </div>
+      <div class="device-name">
+        <el-switch
+          style="display: block"
+          v-model="item.automaticText"
+          active-color="#13ce66"
+          inactive-color="#ff4949"
+          active-text="自动"
+          inactive-text="手动"
+          @change="handleAutomaticText(item)"
+        >
+        </el-switch>
+      </div>
+      <div class="device-name">
+        <span
+          :class="
+            item.localRemote === '远程' ? 'strong-electric' : 'auto-electric'
+          "
+          >{{ item.localRemote }}</span
+        >
+      </div>
+      <div class="device-name">
+        <div :class="item.warnText === '故障' ? 'bad-status' : 'good-status'">
+          {{ item.warnText }}
+        </div>
+      </div>
+      <div class="device-name" v-if="!isNoShowHz">
+        <el-input
+          v-if="item.frequencySet !== null && item.frequencySet !== undefined"
+          v-model="item.frequencySet"
+          size="mini"
+          @keyup.enter.native="handleEnter(item)"
+          @input="handleInput(item)"
+        ></el-input>
+        <div class="device-name" v-else></div>
+      </div>
+      <template v-if="!isNoShowHz">
+        <div class="device-name" v-if="item.frequency">
+          {{ item.frequency }}Hz
+        </div>
+        <div class="device-name" v-else></div>
+      </template>
     </div>
   </div>
 </template>
 
 <script>
-export default {};
+export default {
+  props: {
+    deviceList: {
+      type: Array,
+      default: () => [],
+    },
+    isNoShowHz: {
+      type: Boolean,
+      default: () => false,
+    },
+  },
+  methods: {
+    // 处理输入事件，过滤非数字字符
+    handleInput(item) {
+      console.log("校验");
+      // 实时校验并过滤非数字字符
+      item.frequencySet = String(item.frequencySet).replace(/[^\d]/g, "");
+    },
+    handleEnter(item) {
+      console.log("请求后端");
+      this.$confirm(
+        `确定要修改"${item.name}"的频率为:${item.frequencySet} Hz吗?`,
+        "提示",
+        {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        }
+      )
+        .then(() => {
+          // 触发自定义事件 operationControl，并传递两个参数
+          this.$emit("operationControl", item.frequencyId, item.frequencySet);
+        })
+        .catch(() => {
+          // 用户取消操作，需要更新原来的频率
+          this.getOperationList();
+        });
+    },
+    //手动控制
+    handleControlText(item) {
+      this.$confirm(
+        `确定要切换设备"${item.name}"的状态为:${
+          item.controlText ? "开启" : "停止 吗?"
+        }`,
+        "提示",
+        {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        }
+      )
+        .then(() => {
+          // 这里调用请求函数
+          console.log("请求后台", item.controlText);
+          let param = null;
+          if (item.controlText) {
+            param = 1;
+          } else {
+            param = 0;
+          }
+          this.$emit("operationControl", item.controlId, param);
+        })
+        .catch(() => {
+          // 用户取消操作，恢复开关状态
+          item.controlText = !item.controlText;
+          console.log("不请求后台");
+        });
+    },
+    // 手自动切换
+    handleAutomaticText(item) {
+      this.$confirm(
+        `确定要切换设备"${item.name}"的状态为:${
+          item.automaticText ? "自动" : "手动 吗?"
+        }`,
+        "提示",
+        {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        }
+      )
+        .then(() => {
+          // 这里调用请求函数
+          console.log("请求后台", item.automaticText);
+          let param = null;
+          if (item.automaticText) {
+            param = 0;
+          } else {
+            param = 1;
+          }
+          this.$emit("operationControl", item.automaticId, param);
+        })
+        .catch(() => {
+          // 用户取消操作，恢复开关状态
+          item.automaticText = !item.automaticText;
+          console.log("不请求后台");
+        });
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>
diff --git a/src/views/centerairC/sysControl/vavleheader.vue b/src/views/centerairC/sysControl/vavleheader.vue
new file mode 100644
index 0000000..7da8713
--- /dev/null
+++ b/src/views/centerairC/sysControl/vavleheader.vue
@@ -0,0 +1,199 @@
+<template>
+  <div>
+    <div class="device-li">
+      <div class="device-name">设备名称</div>
+      <div class="device-name">手动控制</div>
+      <div class="device-name">手自动切换</div>
+      <div class="device-name">阀开反馈</div>
+      <div class="device-name">阀关反馈</div>
+    </div>
+    <div class="device-li" v-for="(item, index) in valveList" :key="index">
+      <div class="device-name">{{ item.name }}</div>
+      <div class="device-name">
+        <el-switch
+          style="display: block"
+          v-model="item.controlText"
+          active-color="#13ce66"
+          inactive-color="#ff4949"
+          active-text="开启"
+          inactive-text="停止"
+          @change="handleControlText(item)"
+        >
+        </el-switch>
+      </div>
+      <div class="device-name">
+        <el-switch
+          style="display: block"
+          v-model="item.automaticText"
+          active-color="#13ce66"
+          inactive-color="#ff4949"
+          active-text="自动"
+          inactive-text="手动"
+          @change="handleAutomaticText(item)"
+        >
+        </el-switch>
+      </div>
+      <div class="device-name">
+        <div :class="item.openStauts === '关闭' ? 'bad-status' : 'good-status'">
+          {{ item.openStauts }}
+        </div>
+      </div>
+      <div class="device-name">
+        <div
+          :class="item.closeStatus === '关闭' ? 'bad-status' : 'good-status'"
+        >
+          {{ item.closeStatus }}
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    valveList: {
+      type: Array,
+      default: () => [],
+    },
+  },
+  methods: {
+    //手动控制
+    handleControlText(item) {
+      this.$confirm(
+        `确定要切换设备"${item.name}"的状态为:${
+          item.controlText ? "开启" : "停止 吗?"
+        }`,
+        "提示",
+        {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        }
+      )
+        .then(() => {
+          // 这里调用请求函数
+          console.log("请求后台", item.controlText);
+          let param = null;
+          if (item.controlText) {
+            param = 1;
+          } else {
+            param = 0;
+          }
+          // 触发自定义事件 operationControl，并传递两个参数
+          this.$emit("operationControl", item.controlId, param);
+        })
+        .catch(() => {
+          // 用户取消操作，恢复开关状态
+          item.controlText = !item.controlText;
+          console.log("不请求后台");
+        });
+    },
+    // 手自动切换
+    handleAutomaticText(item) {
+      this.$confirm(
+        `确定要切换设备"${item.name}"的状态为:${
+          item.automaticText ? "自动" : "手动 吗?"
+        }`,
+        "提示",
+        {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        }
+      )
+        .then(() => {
+          // 这里调用请求函数
+          console.log("请求后台", item.automaticText);
+          let param = null;
+          if (item.automaticText) {
+            param = 0;
+          } else {
+            param = 1;
+          }
+          // 触发自定义事件 operationControl，并传递两个参数
+          this.$emit("operationControl", item.automaticId, param);
+        })
+        .catch(() => {
+          // 用户取消操作，恢复开关状态
+          item.automaticText = !item.automaticText;
+          console.log("不请求后台");
+        });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.device-li {
+  flex: 1;
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  padding: 12px 0;
+  color: #abcdfc;
+  border-bottom: 1px dashed #0349ac;
+  .device-name {
+    flex: 1;
+    white-space: nowrap;
+    .el-switch {
+      width: 120px !important;
+    }
+    .run {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      display: block;
+    }
+    .run::before {
+      content: "";
+      display: inline-block;
+      width: 10px;
+      height: 10px;
+      background-color: rgb(16, 231, 16);
+      border-radius: 50%;
+      margin-right: 5px;
+    }
+    .no-run {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      display: block;
+    }
+    .no-run::before {
+      content: "";
+      display: inline-block;
+      width: 10px;
+      height: 10px;
+      background-color: rgb(180, 180, 180);
+      border-radius: 50%;
+      margin-right: 5px;
+    }
+    .el-input {
+      width: 100px;
+    }
+    .strong-electric {
+      background-color: rgba(59, 130, 246, 0.2);
+      color: #60a5fa;
+      padding: 5px 20px;
+      border-radius: 10px;
+    }
+    .auto-electric {
+      background-color: rgba(231, 144, 45, 0.2);
+      color: #e47f21;
+      padding: 5px 20px;
+      border-radius: 10px;
+    }
+    .good-status {
+      color: #4ade80;
+    }
+    .bad-status {
+      color: #f05348;
+    }
+  }
+}
+.device-li:nth-child(1) {
+  color: #9ca3af;
+}
+</style>
diff --git a/src/views/centerairC/sysMonitor/index.vue b/src/views/centerairC/sysMonitor/index.vue
index db032f6..e44d8ea 100644
--- a/src/views/centerairC/sysMonitor/index.vue
+++ b/src/views/centerairC/sysMonitor/index.vue
@@ -507,7 +507,7 @@ export default {
           operationConrol([data])
             .then((res) => {
               if (res.code == 200) {
-                this.$modal.msgSuccess("操作成功");
+                this.$modal.msgSuccess("指令下发成功!");
                 // 开启 loading 效果
                 this.loading = true;
                 // 更新状态;
diff --git a/src/views/centerairC/timeSwitch/index.vue b/src/views/centerairC/timeSwitch/index.vue
index 75c8f8c..c6d3126 100644
--- a/src/views/centerairC/timeSwitch/index.vue
+++ b/src/views/centerairC/timeSwitch/index.vue
@@ -248,7 +248,7 @@ export default {
       operationConrol([data])
         .then((res) => {
           if (res.code == 200) {
-            this.$modal.msgSuccess("操作成功");
+            this.$modal.msgSuccess("指令下发成功!");
             // 开启 loading 效果
             this.loading = true;
             // 更新所有设备状态;
diff --git a/src/views/hotWater/waterControl/index.vue b/src/views/hotWater/waterControl/index.vue
index ffbce89..88b1132 100644
--- a/src/views/hotWater/waterControl/index.vue
+++ b/src/views/hotWater/waterControl/index.vue
@@ -558,7 +558,7 @@ export default {
       operationConrol([data])
         .then((res) => {
           if (res.code == 200) {
-            this.$modal.msgSuccess("操作成功");
+            this.$modal.msgSuccess("指令下发成功!");
             // 开启 loading 效果
             this.loading = true;
             // 更新所有设备状态;