修改设备列表弹窗样式，

修改搜索框输入文字样式

public/config.js

@@ -15,5 +15,6 @@ window.g = {
     // BASE_API: "http://192.168.4.219:12397/ioc-server",
     // UE_IP: "http://192.168.4.159"
     // UE_IP: "http://127.0.0.1:80"
-    UE_IP: "ws://192.168.4.152:81"
+    // UE_IP: "ws://192.168.4.152:81"
+    UE_IP: "ws://192.168.4.148:88"
 };

src/App.vue

@@ -8,6 +8,7 @@
 -->
 
 <template >
+
     <router-view />
     <!-- <UeVideo /> -->
 </template>

src/assets/css/home.scss

@@ -22,6 +22,14 @@
         }
     }
 }
+.bg-shadow{
+    width: 100vw;
+    height: 100vh;
+    position: absolute;
+    top: 0;
+    left: 0;
+    pointer-events: none;
+}
 
 .el-container {
     height: 938px;

src/assets/css/left.scss

@@ -16,7 +16,7 @@
     display: flex;
     flex-direction: column;
     padding: 11px 10px 15px 10px; //教室分类统计
-
+    pointer-events: auto;
     .left_top {
         box-sizing: border-box;
         width: 392px;
@@ -337,6 +337,14 @@
             }
             .scroll-container{
                 flex: 1;
+                .empty-container{
+                    margin-top: 10px;
+                    display: flex;
+                    justify-content: center;
+                    align-items: center;
+                    height: 100%;
+                    background: rgba(26, 86, 154, 0.16);
+                }
             }
 
             .vue3-seamless-scroll {

src/assets/css/right.scss

@@ -327,6 +327,8 @@
                 width: 100%;
                 height: 100%;
                 position: relative;
+                overflow: hidden;
+                clip-path: polygon(1% 0, 99% 0, 100% 2%, 100% 100%, 80% 100%, 20% 100%, 0 100%, 0 2%);
                 // background-color: red;
                 
                 // -webkit-clip-path: polygon(4% 0, 96% 0, 100% 4%, 100% 80%, 100% 99%, 0 100%, 0% 80%, 0 4%);

src/components/home.vue

@@ -1,7 +1,7 @@
 <template>
   <!-- <div class="container" > -->
   <Header />
-
+  <img class="bg-shadow" :src="bgShadow" alt="" srcset="">
   <Left v-if="isShowLeft" ref="childRef" @childMethod="childMethod"></Left>
   <right v-if="isShowRight"></right>
   <div
@@ -98,6 +98,7 @@
     <el-table
       :data="deviceDetailsList"
       border
+      :resizable="false"
       height="350px"
       style="width: 100%; background: rgba(0, 0, 0, 0)"
     >
@@ -105,6 +106,7 @@
         align="center"
         type="index"
         label="序号"
+        width="100px"
       ></el-table-column>
       <el-table-column
         align="center"

src/components/left.vue

@@ -98,7 +98,7 @@
         <div class="usering-free">
           <div class="usering-box">
             <div class="text">
-              使用中{{ getPercentage || 0 }}%
+              使用中：{{ getPercentage || 0 }}%
               <span class="num">{{ occupiedClassroomsCount || 0 }}间</span>
             </div>
           </div>
@@ -287,7 +287,12 @@
                 </template>
               </scroll>
             </div>
+
+            <div v-else class="empty-container">
+              <img :src="noData" alt="" srcset="">
+            </div>
           </div>
+         
         </div>
         <!-- </div> -->
       </div>
@@ -690,7 +695,7 @@ export default {
     let scrollContainerHeight = ref(null);
     onMounted(() => {
       getClassData();
-      start();
+      //start();
       // 获取教师下拉选择数据
       getClassSelections();
       //获取教室列表数据
@@ -769,7 +774,7 @@ export default {
     const getPercentage = computed(() => {
       const total = classRoom.value.length;
       const occupied = occupiedClassroomsCount.value;
-      return ((occupied / total) * 100).toFixed(2) || 0;
+      return (((occupied / total) * 100).toFixed(2))=='NaN'?0:(((occupied / total) * 100).toFixed(2)) ;
     });
 
     // 获取教师下拉选择
@@ -859,6 +864,7 @@ export default {
     };
     const leftimg = ref("./img/");
     const frame = ref("./img/frame.png");
+    const noData = ref("./img/no-data.png");
     return {
       roomVisible,
       classCount,
@@ -907,6 +913,7 @@ export default {
       offset,
       scrollContainerHeight,
       scrollContainerRef,
+      noData
     };
   },
 };
@@ -934,18 +941,19 @@ export default {
 
 .el-popper {
   border: 2px solid #1a2d47 !important;
-  background: rgba(1, 18, 35, 0.87) !important;
-  border-radius: 1px !important;
+  background: rgba(1, 18, 35, 0.60) !important;
+  border-radius: 4px !important;
+
 }
 .el-dropdown-menu {
-  background: rgba(1, 18, 35, 0.87) !important;
+  background: rgba(1, 18, 35, 0.60) !important;
   border: none !important;
-  border-radius: 2px !important;
+  border-radius: 4px !important;
+  padding: 2px  !important;
 }
 .el-dropdown-menu__item {
-  color: rgba(255, 255, 255, 0.75);
-  border-radius: 2px !important;
-  border-radius: 2px !important;
+  color: rgba(255, 255, 255, 0.72);
+  border-radius: 4px !important;
 }
 .popper__arrow::after {
   background: rgba(255, 255, 255, 0.12);
@@ -966,4 +974,7 @@ export default {
 .el-popper__arrow {
   display: none;
 }
+.el-input__inner{
+  color: #fff !important;
+}
 </style>

src/components/right.vue

@@ -472,11 +472,15 @@ export default {
   }
 }
 .deviceDialog {
+  border-radius: 4px 4px 0px 0px;
+
   .el-dialog__header {
+    border-radius: 4px 4px 0px 0px;
+
     height: 39px;
     line-height: 39px;
-    padding: 0;
-    background-color: #1b67d9;
+    padding: 5px;
+    background-color: #0082d3;
     margin-right: 0;
     text-indent: 14px;
 
@@ -497,10 +501,14 @@ export default {
   }
   .el-dialog__body {
     // padding: 10px !important;
-    background-color: rgba(0, 0, 0, 0.5) !important;
+    // background-color: rgba(0, 0, 0, 0.5) !important;
+    background: rgba(6, 22, 30, 0.48) !important;
+    
+
+    padding:8px 10px;
     .el-table {
       --el-table-border-color: #253f48;
-      --el-table-row-hover-bg-color: rgba(0, 0, 0, 0.7);
+      --el-table-row-hover-bg-color: rgba(0, 0, 0, 0.3);
       .normal {
         text-align: center;
         /* text/pc/02-55-Regular */
@@ -549,10 +557,16 @@ export default {
       }
     }
     .el-table th.el-table__cell {
-      background-color: rgba(0, 0, 0, 0.5);
+      background: rgba(6, 22, 30, 0.48) !important;
+    
     }
     .el-table tr {
-      background-color: rgba(0, 0, 0, 0.5);
+      background: rgba(6, 22, 30, 0.48) !important;
+
+    }
+    .el-table thead {
+      background: rgba(6, 22, 30, 0.48) !important;
+
     }
     .el-table td.el-table__cell,
     .el-table th.el-table__cell.is-leaf {
@@ -566,7 +580,7 @@ export default {
     height: 39px;
     line-height: 39px;
     padding: 0px;
-    background-color: #1b67d9;
+    background-color: #0082d3;
     margin-right: 0;
     text-indent: 10px;
 
@@ -588,8 +602,8 @@ export default {
 
   .el-dialog__body {
     padding: 10px !important;
-    background-color: rgba(0, 0, 0, 0.2) !important;
-
+    background: rgba(6, 22, 30, 0.85) !important;
+    bortder-radius: 4px !important;
     .details-container {
       color: #fff;