refactor(实时监控): 重构实时监控组件的数据处理和显示逻辑

- 将数据源参数从大写改为首字母大写以保持一致性
- 重构带钢位置进度计算为计算属性
- 扩展并优化各段指标配置，增加更多监控项
- 调整网格布局为8列以适应新增指标
- 优化WebSocket数据处理逻辑，移除冗余代码

klp-ui/src/views/lines/zinc/components/real-time-monitoring.vue

@@ -29,7 +29,7 @@
           <!-- 带钢位置卡片 -->
           <div class="strip-status-card">
             <span class="strip-status-label">带钢位置</span>
-            <span class="strip-status-value">{{ getRealtimeValueBySource('ENTRY', 'stripLocation') }}</span>
+            <span class="strip-status-value">{{ getRealtimeValueBySource('Entry', 'stripLocation') }}</span>
             <span class="strip-status-unit">m</span>
             <div class="progress-container">
               <div class="progress-bar">
@@ -41,7 +41,7 @@
           <!-- 带钢速度卡片 -->
           <div class="strip-status-card">
             <span class="strip-status-label">带钢速度</span>
-            <span class="strip-status-value">{{ getRealtimeValueBySource('ENTRY', 'stripSpeed') }}</span>
+            <span class="strip-status-value">{{ getRealtimeValueBySource('Entry', 'stripSpeed') }}</span>
             <span class="strip-status-unit">m/min</span>
           </div>
         </div>
@@ -55,7 +55,7 @@
         <div class="metrics-grid-3">
           <div class="metric-box" v-for="it in entryMetrics" :key="'entry_' + it.field">
             <span class="metric-name">{{ it.label || getFieldLabel(it.field) }}</span>
-            <span class="metric-value">{{ getRealtimeValueBySource('ENTRY', it.field) }}</span>
+            <span class="metric-value">{{ getRealtimeValueBySource('Entry', it.field) }}</span>
             <span class="metric-unit">{{ it.unit || getFieldUnit(it.field) }}</span>
           </div>
         </div>
@@ -67,10 +67,10 @@
         <div class="metrics-grid-3">
           <div class="metric-box" v-for="it in furnaceMetrics" :key="'furnace_' + it.actualField">
             <span class="metric-name">{{ it.label || getFieldLabel(it.actualField) }}</span>
-            <span class="metric-value">{{ getRealtimeValueBySource('FURNACE', it.actualField) }}</span>
+            <span class="metric-value">{{ getRealtimeValueBySource('Furnace', it.actualField) }}</span>
             <span class="metric-unit">{{ it.unit || getFieldUnit(it.actualField) }}</span>
             <span class="metric-set-value" v-if="it.setField">
-              设定: {{ getRealtimeValueBySource('FURNACE', it.setField) }}
+              设定: {{ getRealtimeValueBySource('Furnace', it.setField) }}
             </span>
           </div>
         </div>
@@ -81,7 +81,7 @@
         <div class="metrics-grid-3">
           <div class="metric-box" v-for="it in coatMetrics" :key="'coat_' + it.field">
             <span class="metric-name">{{ it.label || getFieldLabel(it.field) }}</span>
-            <span class="metric-value">{{ getRealtimeValueBySource('COAT', it.field) }}</span>
+            <span class="metric-value">{{ getRealtimeValueBySource('Coat', it.field) }}</span>
             <span class="metric-unit">{{ it.unit || getFieldUnit(it.field) }}</span>
           </div>
         </div>
@@ -93,7 +93,7 @@
         <div class="metrics-grid-3">
           <div class="metric-box" v-for="it in exitMetrics" :key="'exit_' + it.field">
             <span class="metric-name">{{ it.label || getFieldLabel(it.field) }}</span>
-            <span class="metric-value">{{ getRealtimeValueBySource('EXIT', it.field) }}</span>
+            <span class="metric-value">{{ getRealtimeValueBySource('Exit', it.field) }}</span>
             <span class="metric-unit">{{ it.unit || getFieldUnit(it.field) }}</span>
           </div>
         </div>
@@ -138,28 +138,60 @@ export default {
       },
       latestMeasure: null, // 最新测量数据
       socketDataAppended: false, // socket数据是否已追加
-      stripLocationProgress: 0, // 带钢位置进度百分比
       // 各段指标配置
       entryMetrics: [
+        { field: 'stripLocation', label: '带钢位置', unit: 'm' },
         { field: 'stripSpeed', label: '带钢速度', unit: 'm/min' },
         { field: 'tensionPorBr1', label: '张力POR-BR1', unit: 'kN' },
         { field: 'tensionBr1Br2', label: '张力BR1-BR2', unit: 'kN' },
-        { field: 'tensionBr2Br3', label: '张力BR2-BR3', unit: 'kN' }
+        { field: 'tensionBr2Br3', label: '张力BR2-BR3', unit: 'kN' },
+
       ],
       furnaceMetrics: [
-        { actualField: 'jcf1FurnaceTemperatureActual', setField: 'jcf1FurnaceTemperatureSet', label: 'JCF1温度', unit: '℃' },
-        { actualField: 'jcf2FurnaceTemperatureActual', setField: 'jcf2FurnaceTemperatureSet', label: 'JCF2温度', unit: '℃' },
-        { actualField: 'lbzFurnaceTemperatureActual', setField: 'lbzFurnaceTemperatureSet', label: 'LBZ温度', unit: '℃' }
+        { actualField: 'jcf1FurnaceTemperatureActual', setField: 'jcf1FurnaceTemperatureSet', label: 'JCF1炉温', unit: '℃' },
+        { actualField: 'jcf2FurnaceTemperatureActual', setField: 'jcf2FurnaceTemperatureSet', label: 'JCF2炉温', unit: '℃' },
+        { actualField: 'lbzFurnaceTemperatureActual', setField: 'lbzFurnaceTemperatureSet', label: 'LBZ炉温', unit: '℃' },
+        { actualField: 'lthFurnaceTemperatureActual', setField: 'lthFurnaceTemperatureSet', label: 'LTH炉温', unit: '℃' },
+        { actualField: 'nof1FurnaceTemperatureActual', setField: 'nof1FurnaceTemperatureSet', label: 'NOF1炉温', unit: '℃' },
+        { actualField: 'nof2FurnaceTemperatureActual', setField: 'nof2FurnaceTemperatureSet', label: 'NOF2炉温', unit: '℃' },
+        { actualField: 'nof3FurnaceTemperatureActual', setField: 'nof3FurnaceTemperatureSet', label: 'NOF3炉温', unit: '℃' },
+        { actualField: 'nof4FurnaceTemperatureActual', setField: 'nof4FurnaceTemperatureSet', label: 'NOF4炉温', unit: '℃' },
+        { actualField: 'nof5FurnaceTemperatureActual', setField: 'nof5FurnaceTemperatureSet', label: 'NOF5炉温', unit: '℃' },
+        { actualField: 'phFurnaceTemperatureActual', setField: null, label: 'PH炉温', unit: '℃' },
+        { actualField: 'rtf1FurnaceTemperatureActual', setField: 'rtf1FurnaceTemperatureSet', label: 'RTF1炉温', unit: '℃' },
+        { actualField: 'rtf2FurnaceTemperatureActual', setField: 'rtf2FurnaceTemperatureSet', label: 'RTF2炉温', unit: '℃' },
+        { actualField: 'sfFurnaceTemperatureActual', setField: 'sfFurnaceTemperatureSet', label: 'SF炉温', unit: '℃' },
+        { actualField: 'tdsFurnaceTemperatureActual', setField: 'tdsFurnaceTemperatureSet', label: 'TDS炉温', unit: '℃' },
       ],
       coatMetrics: [
-        { field: 'avrCoatingWeightTop', label: '上涂层重量', unit: 'g/m²' },
-        { field: 'avrCoatingWeightBottom', label: '下涂层重量', unit: 'g/m²' },
-        { field: 'airKnifePressure', label: '气刀压力', unit: 'bar' }
+        { field: 'avrCoatingWeightTop', label: '上层平均涂层重量', unit: 'g/m²' },
+        { field: 'avrCoatingWeightBottom', label: '下层平均涂层重量', unit: 'g/m²' },
+        { field: 'airKnifePressure', label: '气刀压力', unit: '' },
+        { field: 'stripSpeedTmExit', label: 'TM出口速度', unit: 'm/min' }
       ],
       exitMetrics: [
-        { field: 'tensionBr8Br9', label: '张力BR8-BR9', unit: 'kN' },
-        { field: 'tensionBr9Tr', label: '张力BR9-TR', unit: 'kN' },
-        { field: 'speedExitSection', label: '出口速度', unit: 'm/min' }
+        { field: 'alkaliConcentration', label: '碱液浓度', unit: '' },
+        { field: 'alkaliTemperature', label: '碱液温度', unit: '℃' },
+        { field: 'celCapacity', label: '电池容量', unit: '' },
+        { field: 'celLength', label: '电池长度', unit: 'm' },
+        { field: 'cleaningCurrent', label: '清洗电流', unit: 'A' },
+        { field: 'cleaningVoltage', label: '清洗电压', unit: 'V' },
+        { field: 'dryingTemperature', label: '干燥温度', unit: '℃' },
+        { field: 'entryCoilId', label: '入口卷号', unit: '' },
+        { field: 'hotAirFlow', label: '热风流量', unit: '' },
+        { field: 'hotAirPressure', label: '热风压力', unit: '' },
+        { field: 'payOffReelNumber', label: '放卷卷号', unit: '' },
+        { field: 'rinseConductivity', label: '冲洗电导率', unit: '' },
+        { field: 'rinseTemperature', label: '冲洗温度', unit: '℃' },
+        { field: 'stripLocation', label: '带钢位置', unit: 'm' },
+        { field: 'stripSpeed', label: '带钢速度', unit: 'm/min' },
+        { field: 'tensionBr1Br2', label: '张力 BR1-BR2', unit: 'daN' },
+        { field: 'tensionBr2Br3', label: '张力 BR2-BR3', unit: 'daN' },
+        { field: 'tensionPorBr1', label: '入口张力 POR-BR1', unit: 'daN' },
+        { field: 'tensionBr8Br9', label: '张力 BR8-BR9', unit: 'daN' },
+        { field: 'tensionBr9Tr', label: '张力 BR9-TR', unit: 'daN' },
+        { field: 'speedExitSection', label: '出口速度', unit: 'm/min' },
+        { field: 'coilLength', label: '钢卷长度', unit: 'm' }
       ],
       // ECharts实例缓存
       chartInstances: {
@@ -170,6 +202,20 @@ export default {
       }
     }
   },
+  computed: {
+    // 带钢位置进度（位置/3000）
+    stripLocationProgress() {
+      if (this.isDestroyed) return 0
+      const m = this.latestMeasure || {}
+      const entry = m.appMeasureEntryMessage || {}
+      const location = entry.stripLocation !== null && entry.stripLocation !== undefined
+        ? parseFloat(entry.stripLocation) || 0
+        : 0
+      const maxLocation = 3000
+      const progress = (location / maxLocation) * 100
+      return Math.min(Math.max(progress, 0), 100)
+    },
+  },
   // Vue2生命周期钩子
   created() {
     // 组件创建时加载初始数据
@@ -329,8 +375,6 @@ export default {
           console.error('WebSocket错误:', error)
         },
         onMessage: (event) => {
-          // if (isDestroyed) return
-          console.log('收到消息:', event, vm)
           if (!vm) {
             isDestroyed = true
             return
@@ -352,12 +396,11 @@ export default {
               try {
                 vm.latestMeasure = payload
 
+                console.log('更新数据:', payload)
                 vm.appendStripSpeedPoint(payload)
                 vm.updateLastTime()
                 // 实时更新图表
                 vm.updateCharts()
-                // 更新带钢位置进度
-                vm.stripLocationProgress = vm.getRealtimeValueBySource('ENTRY', 'stripLocation') * 10 || 0
               } catch (e) {
                 isDestroyed = true
                 console.error('更新实时数据失败:', e)
@@ -479,7 +522,7 @@ export default {
     // 追加带钢速度数据点
     appendStripSpeedPoint(payload) {
       const now = new Date().toTimeString().slice(0, 8)
-      const speed = payload.stripSpeed || 0
+      const speed = payload.appMeasureEntryMessage.stripSpeed || 0
       this.pushSeries('stripSpeed', now, { stripSpeed: speed })
     },
     // 更新最后更新时间
@@ -490,7 +533,8 @@ export default {
     getRealtimeValueBySource(source, field) {
       if (!this.latestMeasure) return '--'
       // 按source映射到不同的字段前缀/规则
-      const value = this.latestMeasure[field] || 0
+      console.log('source:', source, field, this.latestMeasure[`appMeasure${source}Message`])
+      const value = this.latestMeasure[`appMeasure${source}Message`][field] || 0
       return value.toFixed(2) // 格式化显示
     },
     // 获取字段标签
@@ -682,7 +726,7 @@ export default {
 /* 指标网格样式 */
 .metrics-grid-3 {
   display: grid;
-  grid-template-columns: repeat(3, 1fr);
+  grid-template-columns: repeat(8, 1fr);
   gap: 10px;
   margin-bottom: 15px;
 }