diff --git a/src/styles/index.scss b/src/styles/index.scss
index 0b40bab..dcce559 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -164,4 +164,12 @@
 
 .el-overlay{
   z-index: 99999 !important;
+}
+
+.el-notification{
+  border: none !important;
+  background-color: #0f2856 !important;
+  .el-notification__content{
+    color: #eee !important;
+  }
 }
\ No newline at end of file
diff --git a/src/types/auto-imports.d.ts b/src/types/auto-imports.d.ts
index e21443a..5742656 100644
--- a/src/types/auto-imports.d.ts
+++ b/src/types/auto-imports.d.ts
@@ -5,6 +5,7 @@ declare global {
   const ElForm: typeof import('element-plus/es')['ElForm']
   const ElMessage: typeof import('element-plus/es')['ElMessage']
   const ElMessageBox: typeof import('element-plus/es')['ElMessageBox']
+  const ElNotification: typeof import('element-plus/es')['ElNotification']
   const NEllipsis: typeof import('naive-ui')['NEllipsis']
   const asyncComputed: typeof import('@vueuse/core')['asyncComputed']
   const autoResetRef: typeof import('@vueuse/core')['autoResetRef']
@@ -275,6 +276,7 @@ declare module 'vue' {
     readonly ElForm: UnwrapRef<typeof import('element-plus/es')['ElForm']>
     readonly ElMessage: UnwrapRef<typeof import('element-plus/es')['ElMessage']>
     readonly ElMessageBox: UnwrapRef<typeof import('element-plus/es')['ElMessageBox']>
+    readonly ElNotification: UnwrapRef<typeof import('element-plus/es')['ElNotification']>
     readonly NEllipsis: UnwrapRef<typeof import('naive-ui')['NEllipsis']>
     readonly asyncComputed: UnwrapRef<typeof import('@vueuse/core')['asyncComputed']>
     readonly autoResetRef: UnwrapRef<typeof import('@vueuse/core')['autoResetRef']>
diff --git a/src/views/monitoring/components/header.vue b/src/views/monitoring/components/header.vue
index 0eb97aa..c640890 100644
--- a/src/views/monitoring/components/header.vue
+++ b/src/views/monitoring/components/header.vue
@@ -187,7 +187,14 @@ function returnBack() {
 }
 function waringClick() {
     //点击报警按钮
-    waringDrawer.value = true
+    if (waringData.value.length === 0) {
+        ElNotification({
+            message: '暂没有报警信息！',
+            type: 'info',
+        })
+    } else {
+        waringDrawer.value = true
+    }
 }
 
 // function getWeatherData() {
diff --git a/src/views/monitoring/components/menu.vue b/src/views/monitoring/components/menu.vue
index a310c5a..0151b7e 100644
--- a/src/views/monitoring/components/menu.vue
+++ b/src/views/monitoring/components/menu.vue
@@ -1,7 +1,9 @@
 <template>
-  <n-menu ref="menuInstRef" class="menu" :indent="0" :options="menuOptions" v-model:value="selectedKey" key-field="deptId"
-    label-field="deptName" :default-expand-all="false" :watch-props="['defaultExpandedKeys']"
-    :render-label="renderMenuLabel" @update:value="menuUpdateValue" />
+  <div class="menuCantent">
+    <n-menu ref="menuInstRef" class="menu" :indent="0" :options="menuOptions" v-model:value="selectedKey"
+      key-field="deptId" label-field="deptName" :default-expand-all="false" :watch-props="['defaultExpandedKeys']"
+      :render-label="renderMenuLabel" @update:value="menuUpdateValue" />
+  </div>
 </template>
 
 <script lang="ts" setup>
@@ -106,107 +108,154 @@ function menuUpdateValue(key: string, item: MenuOption) {
   --n-item-text-color-child-active: #fff;
 }
 
-.menu {
-  text-align: center;
+.menuCantent {
+  height: -webkit-fill-available;
+  overflow: auto;
 
-  :deep(.n-submenu) {
-    --n-item-color-hover: auto;
+  .menu {
+    text-align: center;
 
-    .n-menu-item {
-      .n-menu-item-content {
-        padding: 0 !important;
+    :deep(.n-submenu) {
+      --n-item-color-hover: auto;
 
-        .n-ellipsis {
-          font-family: 'AlibabaPuHuiTiBold';
-          padding: 0 15px;
+      .n-menu-item {
+        .n-menu-item-content {
+          padding: 0 !important;
+
+          .n-ellipsis {
+            font-family: 'AlibabaPuHuiTiBold';
+            padding: 0 15px;
+          }
+
+          .n-menu-item-content__arrow {
+            color: #B1E3FF;
+          }
         }
-        .n-menu-item-content__arrow{
-          color: #B1E3FF;
+
+        .n-menu-item-content.n-menu-item-content--child-active {
+          .n-menu-item-content-header {
+            color: #B1E3FF;
+          }
+
+          .n-menu-item-content__arrow {
+            color: #B1E3FF;
+          }
         }
-      }
 
-      .n-menu-item-content.n-menu-item-content--child-active {
+        // .n-menu-item-content--child-active {
+        //   .n-menu-item-content-header:hover {
+        //     color: #fff !important;
+        //   }
+
+        //   .n-menu-item-content__arrow:hover {
+        //     color: #fff !important;
+        //   }
+        // }
+        // .n-menu-item-content--child-active:hover{
+        //   color: #fff !important;
+        // }
+
         .n-menu-item-content-header {
+          font-size: 2.2rem;
           color: #B1E3FF;
         }
-        .n-menu-item-content__arrow{
-          color: #B1E3FF;
-        }
-      }
-
-      // .n-menu-item-content--child-active {
-      //   .n-menu-item-content-header:hover {
-      //     color: #fff !important;
-      //   }
-
-      //   .n-menu-item-content__arrow:hover {
-      //     color: #fff !important;
-      //   }
-      // }
-      // .n-menu-item-content--child-active:hover{
-      //   color: #fff !important;
-      // }
-
-      .n-menu-item-content-header {
-        font-size: 2.2rem;
-        color: #B1E3FF;
       }
-    }
 
-    .n-menu-item:hover {
-      color: red;
-    }
-
-    .n-submenu-children {
-      .n-menu-item-content-header {
-        font-size: 1.6rem;
+      .n-menu-item:hover {
+        color: red;
       }
 
-      .n-menu-item-content--selected {
+      .n-submenu-children {
         .n-menu-item-content-header {
-          color: #fff;
+          font-size: 1.6rem;
+        }
 
-          .n-ellipsis {
-            position: relative;
+        .n-menu-item-content--selected {
+          .n-menu-item-content-header {
+            color: #fff;
 
-            span {
-              padding: 0 10px;
-            }
+            .n-ellipsis {
+              position: relative;
+
+              span {
+                padding: 0 10px;
+              }
 
-            span::before {
-              content: '';
-              position: absolute;
-              left: 0;
-              top: 0.7rem;
-              width: 1.8rem;
-              height: 1.8rem;
-              background: url(@/assets/images/taps.png) no-repeat;
-              background-size: cover;
+              span::before {
+                content: '';
+                position: absolute;
+                left: 0;
+                top: 0.7rem;
+                width: 1.8rem;
+                height: 1.8rem;
+                background: url(@/assets/images/taps.png) no-repeat;
+                background-size: cover;
+              }
             }
           }
         }
-      }
 
-      .n-menu-item-content--selected::before {
-        background: -webkit-linear-gradient(left, #1fc7ff29 0%, #1177e700 100%);
-        left: 0;
-        right: 0;
-      }
+        .n-menu-item-content--selected::before {
+          background: -webkit-linear-gradient(left, #1fc7ff29 0%, #1177e700 100%);
+          left: 0;
+          right: 0;
+        }
 
-      .n-menu-item-content--selected::after {
-        content: '';
-        position: absolute;
-        bottom: 0;
-        width: 100%;
-        height: 2px;
-        background: -webkit-linear-gradient(left, #1fc7ff29 0%, #1177e700 100%);
+        .n-menu-item-content--selected::after {
+          content: '';
+          position: absolute;
+          bottom: 0;
+          width: 100%;
+          height: 2px;
+          background: -webkit-linear-gradient(left, #1fc7ff29 0%, #1177e700 100%);
+        }
       }
-    }
 
-    .n-base-icon {
-      color: #84e0f7;
-      right: 10px;
+      .n-base-icon {
+        color: #84e0f7;
+        right: 10px;
+      }
     }
   }
 }
-</style>
+
+/*滚动条整体部分*/
+.menuCantent::-webkit-scrollbar,
+.tableGrid ::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
+
+/*滚动条的轨道*/
+.menuCantent::-webkit-scrollbar-track,
+.tableGrid ::-webkit-scrollbar-track {
+  background-color: transparent;
+  -webkit-border-radius: 8px;
+  -moz-border-radius: 8px;
+  border-radius: 8px;
+}
+
+/*滚动条里面的小方块，能向上向下移动*/
+.menuCantent::-webkit-scrollbar-thumb,
+.tableGrid ::-webkit-scrollbar-thumb {
+  background-color: rgb(147, 147, 153, 0.5);
+  -webkit-border-radius: 8px;
+  -moz-border-radius: 8px;
+  border-radius: 8px;
+}
+
+.menuCantent::-webkit-scrollbar-thumb:hover,
+.tableGrid ::-webkit-scrollbar-thumb:hover {
+  background-color: #a8a8a8;
+}
+
+.menuCantent::-webkit-scrollbar-thumb:active,
+.tableGrid :-webkit-scrollbar-thumb:active {
+  background-color: #787878;
+}
+
+/*边角，即两个滚动条的交汇处*/
+.menuCantent::-webkit-scrollbar-corner,
+.tableGrid ::-webkit-scrollbar-corner {
+  background-color: transparent;
+}</style>
diff --git a/src/views/monitoring/devicemanage/index.scss b/src/views/monitoring/devicemanage/index.scss
index 274cae6..db52f5f 100644
--- a/src/views/monitoring/devicemanage/index.scss
+++ b/src/views/monitoring/devicemanage/index.scss
@@ -5,8 +5,8 @@
     background: url(@/assets/images/screen.png);
     // background-color: var(--tableBg);
     background-size: 100% 100%;
-    background-color: rgba(0, 0, 0, 0.3);
-    background-blend-mode: multiply;
+    // background-color: rgba(0, 0, 0, 0.3);
+    // background-blend-mode: multiply;
     padding: 0 25px;
     overflow: hidden;
 
@@ -15,13 +15,16 @@
 
         .sidebar {
             width: 12%;
-            height: calc(100vh - 5.7rem - 60px);
+            height: calc(100vh - 95px - 30px); //屏幕高度-头部header高度-底部高度
             flex-shrink: 0;
-            border: 2px solid #1e60a6;
-            padding: 10px;
-            box-shadow: inset 0px 0px 10px 0px rgb(36, 90, 12);
-            margin-right: 1%;
-            overflow: scroll;
+            border: 1px solid #0D55B0;
+            padding: 10px 0;
+            // box-shadow: inset 0px 0px 10px 0px rgb(36, 90, 12);
+            margin-right: 1vw;
+            position: relative;
+            overflow: hidden;
+            transition: width 0.28s;
+            background-color: rgba(2, 8, 46, 0.8);
 
             // .menu {
             //     text-align: center;
@@ -99,10 +102,21 @@
             // }
         }
 
+        .sidebar::after {
+            content: '';
+            position: absolute;
+            bottom: 0;
+            width: 100%;
+            height: 18rem;
+            background: url(@/assets/images/menu_bg.png) no-repeat;
+            background-size: 100% 100%;
+        }
+
         .main {
             width: 87%;
             border: 2px solid #1e60a6;
             box-shadow: inset 0px 0px 10px 0px rgb(36, 90, 124);
+            background-color: rgba(2, 8, 46, 0.8);
 
             :deep(.devicePrt) {
                 .deviceImg {
@@ -423,7 +437,7 @@
 
                         .item {
                             width: 49%;
-                            height: calc(100vh - 150px - 52rem);
+                            height: calc(100vh - 150px - 53rem);
                             padding: 15px 0;
                             background: -webkit-linear-gradient(top, #052266 0%, #011341 100%);
                             overflow: auto;
@@ -465,8 +479,9 @@
                                                     color: #41a5d7;
                                                 }
                                             }
-                                            .content.pump{
-                                                span{
+
+                                            .content.pump {
+                                                span {
                                                     flex: auto;
                                                 }
                                             }
@@ -483,12 +498,13 @@
                                 .colItem:not(:first-child) {
                                     border-top: none
                                 }
-                                .colItem:not(:first-child)::before{
+
+                                .colItem:not(:first-child)::before {
                                     display: block;
                                     content: '';
                                     width: 100%;
                                     height: 1px;
-                                    background: linear-gradient(90deg, rgba(31,225,255,0) 0%, rgba(189,220,255,0.94) 50%, rgba(31,225,255,0) 97%);
+                                    background: linear-gradient(90deg, rgba(31, 225, 255, 0) 0%, rgba(189, 220, 255, 0.94) 50%, rgba(31, 225, 255, 0) 97%);
                                 }
                             }
                         }
@@ -620,14 +636,12 @@
         }
 
         /*滚动条整体部分*/
-        .sidebar::-webkit-scrollbar,
         .tableGrid ::-webkit-scrollbar {
             width: 8px;
             height: 8px;
         }
 
         /*滚动条的轨道*/
-        .sidebar::-webkit-scrollbar-track,
         .tableGrid ::-webkit-scrollbar-track {
             background-color: transparent;
             -webkit-border-radius: 8px;
@@ -636,7 +650,6 @@
         }
 
         /*滚动条里面的小方块，能向上向下移动*/
-        .sidebar::-webkit-scrollbar-thumb,
         .tableGrid ::-webkit-scrollbar-thumb {
             background-color: rgb(147, 147, 153, 0.5);
             -webkit-border-radius: 8px;
@@ -644,20 +657,45 @@
             border-radius: 8px;
         }
 
-        .sidebar::-webkit-scrollbar-thumb:hover,
         .tableGrid ::-webkit-scrollbar-thumb:hover {
             background-color: #a8a8a8;
         }
 
-        .sidebar::-webkit-scrollbar-thumb:active,
         .tableGrid :-webkit-scrollbar-thumb:active {
             background-color: #787878;
         }
 
         /*边角，即两个滚动条的交汇处*/
-        .sidebar::-webkit-scrollbar-corner,
         .tableGrid ::-webkit-scrollbar-corner {
             background-color: transparent;
         }
     }
+}
+
+.dark {
+    .devicemanage {
+        background-color: rgba(29, 30, 31, 0.8);
+        background-blend-mode: multiply;
+
+        .layout {
+
+            .sidebar {
+                background-color: rgba(29, 30, 31, 0.8);
+            }
+
+            .main {
+                background-color: rgba(29, 30, 31, 0.8);
+
+                .devicePrt {
+                    :deep(.devicInfo) {
+                        .infoPanel {
+                            .item {
+                                background: -webkit-linear-gradient(top, rgba(29, 30, 31, 0.8) 0%, rgba(28, 32, 37, 0.8) 100%);
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
 }
\ No newline at end of file
diff --git a/src/views/monitoring/screen/components/main.vue b/src/views/monitoring/screen/components/main.vue
index d2f640a..0f027f7 100644
--- a/src/views/monitoring/screen/components/main.vue
+++ b/src/views/monitoring/screen/components/main.vue
@@ -13,10 +13,10 @@
   > -->
   <div class="mainTable" :style="{ height: `${sidebarHeight}px` }">
     <n-spin :show="loadingShow">
-      <vxe-grid ref="tableRef" class="tableGrid" align="center" auto-resize :height="sidebarHeight - 4"
+      <vxe-grid ref="tableRef" class="tableGrid" align="center" auto-resize keep-source :height="sidebarHeight - 4"
         header-row-class-name="headerRowClass" header-cell-class-name="headerCellClass" row-class-name="tableRowClass"
-        cell-class-name="tableCellClass" :sort-config="{ multiple: true, trigger: 'cell' }" stripe border="outer"
-        :column-config="{ resizable: true, useKey: true }" :row-config="{ useKey: true }" :columns="tableColumn"
+        cell-class-name="tableCellClass" :sort-config="{ multiple: true, trigger: 'cell' }" :stripe="true" :border="false"
+        :column-config="{ resizable: true, useKey: true }" :row-config="{ useKey: true }" :span-method="mergeRowMethod" :columns="tableColumn"
         :data="tableData" @cell-dblclick="cellDBLClickEvent">
         <template #deviceuuid_default="{ row }">
           <div class="title">
@@ -83,7 +83,10 @@ const menuKey = ref(0);
 const tableColumn = ref([]);
 const tableData = ref<TableVo[]>([]);
 const tableRef = ref<VxeGridInstance<TableVo>>();
-const fields = ref(['deviceuuid']) //需要合并的列数据字段
+const cellRow = ref({})
+const cellColumn = ref()
+const cellField = ref();
+// const fields = ref(['deviceuuid']) //需要合并的列数据字段
 // const waringArrow = ref([])
 
 interface FormDataVO {
@@ -187,6 +190,7 @@ mitt.on('treeData', (res: any) => {
   const params = res;
   editConfig(params).then((res: any) => {
     if (res.code === 200) {
+      mitt.emit('treeClose', true);
     }
   });
   // tableColumn.value=res
@@ -252,7 +256,7 @@ function tableHeader() {
         field: 'id',
         type: 'html',
         formatter: formatRole,
-        visible:false
+        visible: false
       },
     ];
     console.log(tableCessText)
@@ -315,14 +319,17 @@ function tableDatas() {
 
 const cellDBLClickEvent: VxeTableEvents.CellDblclick<TableVo> = ({ row, column }) => {
   //双击单元格
-  console.log(row, column);
-  const cellFiled = row[column.field];
+  console.log("cellData--", row, column);
+  const cellField = row[column.field];
   const data = row.data;
-  if (cellFiled.canBeControl === '1') {
+  cellRow.value = row
+  cellColumn.value = column
+  cellField.value = cellField
+  if (cellField.canBeControl === '1') {
     modalTitle.value = column.title;
     formData.value.url = data.url;
-    formData.value.deviceName = cellFiled.deviceName;
-    formData.value.value = cellFiled.val;
+    formData.value.deviceName = cellField.deviceName;
+    formData.value.value = cellField.val;
     editModal.value = true;
   }
   console.log(row[column.field]);
@@ -332,33 +339,35 @@ const formatRole: VxeColumnPropTypes.Formatter<HeaderVo> = ({ cellValue }) => {
   //表单参数为object时处理
   // const iconFont=cellValue.changeProp===-1?'<i class="iconfont icon-decline" />':(cellValue.changeProp===1?'<i class="iconfont icon-rise" />':'<i/>')
   // const cellData = `<span class="cellClass ${cellValue.alertProp===1?'warning':''}">${cellValue.val}</span>${iconFont}`;
-  const cellData = `<span class="cellClass ${cellValue.alertProp === 1 ? 'warning' : ''}">${cellValue.val}</span><i class="iconfont ${cellValue.changeProp === -1 ? 'icon-decline' : (cellValue.changeProp === 1 ? 'icon-rise' : '')}" ></i>${cellValue.canBeControl === '1' ? '<i class="iconfont icon-edit-icon"></i>' : ''}`;
+  const cellData = `<span class="cellClass ${cellValue.alertProp === 1 ? 'warning' : (cellValue.canBeControl === '1' ? 'cellEdit' : '')}">${cellValue.val}</span><i class="iconfont ${cellValue.changeProp === -1 ? 'icon-decline' : (cellValue.changeProp === 1 ? 'icon-rise' : '')}" ></i>${cellValue.canBeControl === '1' ? '<i class="iconfont icon-edit-icon"></i>' : ''}`;
   return cellData;
 };
 
 // 通用行合并函数（将相同多列数据合并为一行）
-// const mergeRowMethod: VxeTablePropTypes.SpanMethod = ({ row, _rowIndex, column, visibleData }) => {
-//   const cellValue = row[column.field]
-//   if (cellValue && fields.value.includes(column.field)) {
-//     const prevRow = visibleData[_rowIndex - 1]
-//     let nextRow = visibleData[_rowIndex + 1]
-//     if (prevRow && prevRow[column.field] === cellValue) {
-//       return { rowspan: 0, colspan: 0 }
-//     } else {
-//       let countRowspan = 1
-//       while (nextRow && nextRow[column.field] === cellValue) {
-//         nextRow = visibleData[++countRowspan + _rowIndex]
-//       }
-//       if (countRowspan > 1) {
-//         return { rowspan: countRowspan, colspan: 1 }
-//       }
-//     }
-//   }
-// }
+const mergeRowMethod: VxeTablePropTypes.SpanMethod<TableVo> = ({ row, _rowIndex, column, visibleData }) => {
+  const fields = ['title']
+  const cellValue = row[column.field]
+  if (cellValue && fields.includes(column.field)) {
+    const prevRow = visibleData[_rowIndex - 1]
+    let nextRow = visibleData[_rowIndex + 1]
+    if (prevRow && prevRow[column.field] === cellValue) {
+      return { rowspan: 0, colspan: 0 }
+    } else {
+      let countRowspan = 1
+      while (nextRow && nextRow[column.field] === cellValue) {
+        nextRow = visibleData[++countRowspan + _rowIndex]
+      }
+      if (countRowspan > 1) {
+        return { rowspan: countRowspan, colspan: 1 }
+      }
+    }
+  }
+}
 
 const submitEvent: VxeFormEvents.Submit = () => {
   //修改数据之后通过websocket传给后端
   formLoading.value = true;
+  const $table = tableRef.value;
   const submitData = {
     code: 'W01',
     data: {
@@ -371,6 +380,14 @@ const submitEvent: VxeFormEvents.Submit = () => {
   socket.send(submitData);
   formLoading.value = false;
   editModal.value = false;
+
+  if ($table) {
+    const row = cellRow.value
+    const field = cellColumn.value.field;
+    row[field].val = formData.value.value
+    $table.reloadRow(row, null, field)
+  }
+
   // VXETable.modal.message({ content: '保存成功', status: 'success' });
 };
 
diff --git a/src/views/monitoring/screen/components/showTree.vue b/src/views/monitoring/screen/components/showTree.vue
index 7687c55..aa5bb54 100644
--- a/src/views/monitoring/screen/components/showTree.vue
+++ b/src/views/monitoring/screen/components/showTree.vue
@@ -9,19 +9,19 @@
         </span>
         <div class="weight" v-if="!data.children">
           <span>宽度(px):</span>
-          <el-input v-model="data.width" size="small" placeholder="请输入宽度" />
+          <el-input v-model="data.width" size="small" :disabled="data.disabled" placeholder="请输入宽度" />
         </div>
       </template>
     </el-tree>
     <div class="treeBtn">
       <el-button @click="cancelClick">取消</el-button>
-      <el-button type="primary" @click="confirmClick">确认</el-button>
+      <el-button type="primary" :loading="treeLoading" @click="confirmClick">{{ treeLoading ? '确认中' : '确认' }}</el-button>
     </div>
   </div>
 </template>
 
 <script lang="ts" setup>
-import { getCurrentInstance,ComponentInternalInstance } from 'vue';
+import { getCurrentInstance, ComponentInternalInstance } from 'vue';
 import mitt from '@/plugins/bus';
 const { proxy } = getCurrentInstance() as ComponentInternalInstance
 const defaultCheckedKeys = ref([]); //默认选项
@@ -39,6 +39,7 @@ interface TreeVo {
   controlValue?: number;
   children?: TreeVo[];
 }
+const treeLoading = ref(false)
 const treeData = ref<TreeVo[]>();
 const emit = defineEmits(['cancelClick', 'confirmClick']);
 
@@ -51,7 +52,7 @@ const props: any = defineProps({
 
 onMounted(() => {
   treeData.value = props.headerData;
-  const checkData:any = [];
+  const checkData: any = [];
   props.headerData.map((item: TreeVo) => {
     if (item.visible) {
       checkData.push(item.id);
@@ -73,6 +74,12 @@ onMounted(() => {
 //   console.log(res)
 // });
 
+mitt.on('treeClose', (res: any) => {
+  //监听配置项确认后
+  emit('cancelClick', '');
+  treeLoading.value = false
+});
+
 const defaultProps = {
   children: 'children',
   label: 'title',
@@ -255,7 +262,7 @@ const defaultProps = {
 //   },
 // ];
 
-function allowDrop(draggingNode:any, dropNode:any, type:any) {
+function allowDrop(draggingNode: any, dropNode: any, type: any) {
   // 只允许同级拖拽，不允许改变原来的目录结构
   if (type !== 'inner') {
     let control = draggingNode.level === dropNode.level ? true : false;
@@ -283,7 +290,7 @@ function cancelClick() {
 }
 function confirmClick() {
   //确认
-  emit('cancelClick', '');
+  treeLoading.value = true
   mitt.emit('treeData', treeData.value);
 }
 </script>
diff --git a/src/views/monitoring/screen/index.scss b/src/views/monitoring/screen/index.scss
index a3ca302..fca08ed 100644
--- a/src/views/monitoring/screen/index.scss
+++ b/src/views/monitoring/screen/index.scss
@@ -7,7 +7,7 @@
   background: url(@/assets/images/screen.png) no-repeat;
   // background-color: var(--tableBg);
   background-size: 100% 100%;
-  // background-color: rgba(0, 0, 0, 0.5);
+  // background-color: rgba(29,30,31,0.8);
   // background-blend-mode: multiply;
   padding: 0 25px;
   overflow: hidden;
@@ -318,7 +318,8 @@
           --vxe-table-header-background-color: none;
           --vxe-table-body-background-color: none;
           --vxe-table-footer-background-color: none;
-          --vxe-table-border-color: none;
+          --vxe-table-border-color: rgba(12, 80, 166, 0.3);
+          // --vxe-table-border-color: none;
           --vxe-font-color: #5beff9;
           --vxe-table-header-font-color: #ffffffb3;
           border: 1px solid #0D55B0;
@@ -336,6 +337,10 @@
                 color: #eee;
                 border: 1px solid rgba(12, 80, 166, 1) !important;
                 border-left: none !important;
+
+                .vxe-resizable.is--line:before {
+                  content: none
+                }
               }
 
               // .headerCellClass:nth-child(1){
@@ -356,11 +361,12 @@
                   font-family: 'AlibabaPuHuiTiRegular';
                   color: #B1E3FF;
 
-                  .title{
+                  .title {
                     display: flex;
                     align-items: center;
                     text-align: left;
-                    .svg-icon{
+
+                    .svg-icon {
                       flex-shrink: 0;
                     }
                   }
@@ -377,6 +383,10 @@
                     color: red;
                   }
 
+                  .cellEdit {
+                    cursor: pointer;
+                  }
+
                   .iconfont {
                     font-size: 18px;
                   }
@@ -392,6 +402,7 @@
                   .iconfont.icon-edit-icon {
                     font-size: 16px;
                     margin-left: 5px;
+                    cursor: pointer;
                   }
                 }
               }
@@ -537,14 +548,12 @@
     }
 
     /*滚动条整体部分*/
-    .sidebar::-webkit-scrollbar,
     .tableGrid ::-webkit-scrollbar {
       width: 8px;
       height: 8px;
     }
 
     /*滚动条的轨道*/
-    .sidebar::-webkit-scrollbar-track,
     .tableGrid ::-webkit-scrollbar-track {
       background-color: transparent;
       -webkit-border-radius: 8px;
@@ -553,7 +562,6 @@
     }
 
     /*滚动条里面的小方块，能向上向下移动*/
-    .sidebar::-webkit-scrollbar-thumb,
     .tableGrid ::-webkit-scrollbar-thumb {
       background-color: rgb(147, 147, 153, 0.5);
       -webkit-border-radius: 8px;
@@ -561,18 +569,15 @@
       border-radius: 8px;
     }
 
-    .sidebar::-webkit-scrollbar-thumb:hover,
     .tableGrid ::-webkit-scrollbar-thumb:hover {
       background-color: #a8a8a8;
     }
 
-    .sidebar::-webkit-scrollbar-thumb:active,
     .tableGrid :-webkit-scrollbar-thumb:active {
       background-color: #787878;
     }
 
     /*边角，即两个滚动条的交汇处*/
-    .sidebar::-webkit-scrollbar-corner,
     .tableGrid ::-webkit-scrollbar-corner {
       background-color: transparent;
     }
@@ -601,4 +606,42 @@
   }
 }
 
-// }
\ No newline at end of file
+// }
+
+.dark {
+  .screen {
+    background-color: rgba(29, 30, 31, 0.8);
+    background-blend-mode: multiply;
+
+    .layout {
+
+      .sidebar {
+        background-color: rgba(29, 30, 31, 0.8);
+      }
+
+      .main {
+        background-color: rgba(29, 30, 31, 0.8);
+        .mainTable {
+          .tableGrid {
+            :deep(.vxe-table) {
+              .vxe-table--fixed-left-wrapper.scrolling--middle {
+                background: -webkit-linear-gradient(top, rgba(21, 21, 25, 1) 0%, rgba(21, 21, 25, 1) 100%);
+                box-shadow: inset 0px 0px 10px rgb(36, 90, 124) !important;
+              }
+            }
+          }
+        }
+      }
+
+      .infoPanel {
+        :deep(.swiper) {
+          .item {
+            .content {
+              background-color: rgba(29, 30, 31, 0.8);
+            }
+          }
+        }
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/vite.config.ts b/vite.config.ts
index 362fce0..7d27a61 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -45,9 +45,9 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
       hmr: true,//配置HMR
       proxy: {
         [env.VITE_APP_BASE_API]: {
-          target: 'http://172.1.2.106:9000/',//本地接口地址
+          // target: 'http://172.1.2.106:9000/',//本地接口地址
           // target: 'http://172.1.2.48:9000/',//本地接口地址
-          // target: 'http://board.heatiot.cn:8001/prod-api/',//线上接口地址
+          target: 'http://board.heatiot.cn:8001/prod-api/',//线上接口地址
           changeOrigin: true,
           rewrite: path =>
             path.replace(new RegExp('^' + env.VITE_APP_BASE_API), '')