左侧菜单栏样式修改

src/views/controlCenter/6170/index.vue

@@ -124,6 +124,16 @@
                 </el-col>
             </el-row>
         </div>
+        <!-- ===========充电提示框====== -->
+        <el-dialog title="充电提示" v-model="centerDialogVisible" width="15%">
+            <div style="display: flex; align-items: center;">
+                <h3 style="color: rgba(224, 52, 52, 1)">设备电量低于20%</h3>
+            </div>
+            <div>请及时充电</div>
+            <span slot="footer" class="dialog-footer" style="text-align: right;display: block;">
+                <el-button type="primary" @click="centerDialogVisible = false">确 定</el-button>
+            </span>
+        </el-dialog>
     </div>
 </template>
 <script setup name="DeviceControl" lang="ts">
@@ -151,6 +161,7 @@ const fullscreenLoading = ref(false)
 const forceAlarmLoading = ref(false)  //强制报警
 const sendTextLoading = ref(false)
 const lightModesLoading = ref(false)
+const centerDialogVisible = ref(false)
 const {
     connected,
     connect,
@@ -575,9 +586,8 @@ const handleDeviceMessage = (msg: any) => {
                 deviceDetail.value.batteryPercentage = deviceState[3]; //电量
                 deviceDetail.value.batteryRemainingTime = deviceState[5]; //续航时间
                 // getList(); // 重新获取设备详情
-                if (deviceDetail.value.batteryPercentage < 20) {
-                    ElMessage.closeAll();
-                    proxy?.$modal.msgWarning('电量低于20%，请及时充电');
+                if (deviceDetail.value.batteryPercentage < 20 && deviceDetail.value.chargeState == 0) {
+                    centerDialogVisible.value=true
                 }
                 break;
             default:
@@ -663,7 +673,7 @@ onUnmounted(() => {
             background: white;
             padding: 0px 20px 50px;
             border: 1px solid #ebeef5;
-            height: 250px;
+            height: 289px;
             position: relative;
         }
 
@@ -736,6 +746,7 @@ onUnmounted(() => {
 
 
         }
+
         .brightness-alarm {
             display: flex;
             justify-content: space-between;
@@ -927,4 +938,9 @@ onUnmounted(() => {
         }
     }
 }
+
+.path-img {
+    width: 52px;
+    height: 28px;
+}
 </style>