```

fix(monitor): 修复设备名称显示异常问题
在 monitor.vue 页面中新增按钮用于查看预制舱参数，并引入模态框展示相关信息。
调整 EditCom.vue 中对 workModeIdSelect 的监听逻辑，去除冗余判断条件并补全 switch 语句结构。
```

web/src/components/EditCom.vue

@@ -177,10 +177,11 @@ export default {
   watch: {
     workModeIdSelect: {
       async handler(n, o) {
-        if (o && n !== o) {
+        if ( n !== o) {
           this.detailInfos[0].ruleForm.policy_id = ''
         }
         switch (n) {
+         
         case '1':
           this.detailInfos[0].list[this.detailInfos[0].list.length - 1].type = 'select'
           this.detailInfos[0].list[this.detailInfos[0].list.length - 1].list =

web/src/components/monitor/device.vue

@@ -8,7 +8,7 @@
           </div>
           <div class="title">
             <span class="number">{{ item.device_id }}</span>
-            <span class="name" :title="name">{{ item.name }}</span>
+            <span class="name" :title="item.name">{{ item.name }}</span>
             <span class="number type">{{ item.typename }}</span>
           </div>
         </div>
@@ -137,7 +137,7 @@ import predictEcharts from '@/components/predict/predictEcharts.vue'
 import { postReq, getReq } from '@/request/api'
 import { deviceTypeList } from '@/utils/config'
 export default {
-  name: '',
+  name: 'DevicePage',
   components: { predictEcharts },
   props: {
     stationId: {

web/src/components/monitor/videos.vue

@@ -35,7 +35,7 @@
 import { postReq, getReq } from '@/request/api'
 import haikang from './haikang.vue'
 export default {
-  name: '',
+  name: 'VideosPage',
   components: { haikang },
   props: {
     stationId: {

web/src/views/monitor.vue

@@ -9,6 +9,7 @@
               >{{ station.name }}
             </a-select-option>
           </a-select>
+          <a-button type="primary" @click="handleMessage" style="margin-left: 20px">查看预制舱参数</a-button>
         </div>
       </div>
       <div class="right">
@@ -45,6 +46,15 @@
         <device v-else :station-id="selectStationId" :system-type="systemType" />
       </div>
     </div>
+    <a-modal
+      v-model:open="msgModal"
+      width="700px"
+      style="top: 80px"
+      :footer="null"
+      :destroy-on-close="true"
+    >
+   <div style="color: #fff;padding: 20px" v-html="message"></div>
+    </a-modal>
   </div>
 </template>
 
@@ -66,6 +76,8 @@ export default {
       value: [],
       stations: [],
       selectStationId: '',
+      message:'',
+      msgModal:false,
       systems: [
         {
           name: '储能系统',
@@ -103,7 +115,7 @@ export default {
           num: 62,
           systemType: 4,
           titles: [
-            { v: '总功率', key: 'power', sufix: 'kW' },
+            // { v: '总功率', key: 'power', sufix: 'kW' },
             { v: '数量', key: 'num' }
           ]
         }
@@ -146,6 +158,9 @@ export default {
     this.getStations()
   },
   methods: {
+    handleMessage(){
+      this.msgModal=true
+    },
     //下发
     async handleDispatch() {
       console.log(this.workMode)
@@ -188,6 +203,9 @@ export default {
         res.data.device_group.forEach((Element, index) => {
           this.systems[index].num = Element.count
           this.systems[index].power = Element.power
+          if(Element.category==1){
+            this.message=Element.msg
+          }
         })
         this.workMode = res.data.work_mode
       } catch (error) {