[Mod 0000]局部风机管控详情代码优化

src/views/vent/monitorManager/fanLocalMonitor/index.vue

@@ -11,12 +11,16 @@
   <div class="scene-box">
     <div class="top-box" v-if="!loading">
       <div class="top-center row">
-        <div class="vent-flex-row" id="fanLocalSelectDom" v-if="!globalConfig?.simulatedPassword && getDictItemsByCode('fanlocaltype')">
+        <div
+          class="vent-flex-row"
+          id="fanLocalSelectDom"
+          v-if="!globalConfig?.simulatedPassword && getDictItemsByCode(CONSTS.DICT_CODE_FANLOCALTYPE)"
+        >
           <span style="color: var(--vent-font-color); margin-left: 5px">风机类型：</span>
           <JDictSelectTag
             style="width: 180px"
             v-model:value="devicekind"
-            dictCode="fanlocaltype"
+            :dictCode="CONSTS.DICT_CODE_FANLOCALTYPE"
             :showChooseOption="false"
             :getPopupContainer="getPopupContainer"
             @change="changeDeviceKind"
@@ -60,7 +64,7 @@
               fanTitles[0]
             }}</div>
             <div
-              v-if="selectData && ((selectData['install_kind'] && !selectData['install_kind'].endsWith('_1')) || !selectData['install_kind'])"
+              v-if="isShowStandbyFan"
               class="tab-item"
               :class="{ 'tab-item-active-r': warningMonitorRowIndex === 1 }"
               @click="selectDevice('warningMonitorRowIndex', 1)"
@@ -77,12 +81,8 @@
                   </div>
                   <div class="item-name">{{ data.title }}</div>
                   <div v-if="data.dataIndex.startsWith('Fan')">
-                    <div class="item-value" v-if="warningMonitorRowIndex == 0">{{
-                      selectData[data.dataIndex.replace('Fan', 'Fan1')] ? selectData[data.dataIndex.replace('Fan', 'Fan1')] : '-'
-                    }}</div>
-                    <div class="item-value" v-if="warningMonitorRowIndex == 1">{{
-                      selectData[data.dataIndex.replace('Fan', 'Fan2')] ? selectData[data.dataIndex.replace('Fan', 'Fan2')] : '-'
-                    }}</div>
+                    <div class="item-value" v-if="warningMonitorRowIndex == 0">{{ getFanValue(data.dataIndex, 'Fan1') }}</div>
+                    <div class="item-value" v-if="warningMonitorRowIndex == 1">{{ getFanValue(data.dataIndex, 'Fan2') }}</div>
                   </div>
                   <div v-else>
                     <div class="item-value">{{ selectData[data.dataIndex] ? selectData[data.dataIndex] : '-' }}</div>
@@ -91,7 +91,7 @@
               </template>
             </div>
           </div>
-          <div class="container-group" v-if="hasPermission('fanLocal:pjfx')">
+          <div class="container-group" v-if="hasPermission(CONSTS.PERMISSIONS.FAN_LOCAL_PJFX)">
             <div class="warning-header">
               <div class="header-item">
                 <div class="header-title">评价分析</div>
@@ -131,7 +131,7 @@
                 fanTitles[0]
               }}</div>
               <div
-                v-if="selectData && ((selectData['install_kind'] && !selectData['install_kind'].endsWith('_1')) || !selectData['install_kind'])"
+                v-if="isShowStandbyFan"
                 class="tab-item"
                 :class="{ 'tab-item-active-r': dataMonitorRowIndex == 1 }"
                 @click="selectDevice('dataMonitorRowIndex', 1)"
@@ -149,12 +149,8 @@
                         </div>
                         <div class="item-name">{{ state.title }}</div>
                         <div v-if="state.dataIndex.startsWith('Fan')">
-                          <div class="item-value" v-if="dataMonitorRowIndex == 0">{{
-                            selectData[state.dataIndex.replace('Fan', 'Fan1')] ? selectData[state.dataIndex.replace('Fan', 'Fan1')] : '-'
-                          }}</div>
-                          <div class="item-value" v-if="dataMonitorRowIndex == 1">{{
-                            selectData[state.dataIndex.replace('Fan', 'Fan2')] ? selectData[state.dataIndex.replace('Fan', 'Fan2')] : '-'
-                          }}</div>
+                          <div class="item-value" v-if="dataMonitorRowIndex == 0">{{ getFanValue(state.dataIndex, 'Fan1') }}</div>
+                          <div class="item-value" v-if="dataMonitorRowIndex == 1">{{ getFanValue(state.dataIndex, 'Fan2') }}</div>
                         </div>
                         <div v-else>
                           <div class="item-value">{{ selectData[state.dataIndex] ? selectData[state.dataIndex] : '-' }} </div>
@@ -182,17 +178,16 @@
                               <div
                                 class="signal-round"
                                 :class="{
-                                  'signal-round-run': selectData[state.dataIndex.replace('Fan', 'Fan1')] == '0',
+                                  'signal-round-run': getFanValue(state.dataIndex, 'Fan1') == '0',
                                   'signal-round-warning':
-                                    selectData[state.dataIndex.replace('Fan', 'Fan1')] !== undefined &&
-                                    selectData[state.dataIndex.replace('Fan', 'Fan1')] == '1',
-                                  'signal-round-gry': selectData[state.dataIndex.replace('Fan', 'Fan1')] === undefined,
+                                    getFanValue(state.dataIndex, 'Fan1') !== undefined && getFanValue(state.dataIndex, 'Fan1') == '1',
+                                  'signal-round-gry': getFanValue(state.dataIndex, 'Fan1') === undefined,
                                 }"
                               ></div>
                               <div class="vent-margin-l-8">{{
-                                selectData[state.dataIndex.replace('Fan', 'Fan1')] === undefined
+                                getFanValue(state.dataIndex, 'Fan1') === undefined
                                   ? '无状态'
-                                  : selectData[state.dataIndex.replace('Fan', 'Fan1')] == '0'
+                                  : getFanValue(state.dataIndex, 'Fan1') == '0'
                                     ? '正常'
                                     : '异常'
                               }}</div>
@@ -201,17 +196,16 @@
                               <div
                                 class="signal-round"
                                 :class="{
-                                  'signal-round-run': selectData[state.dataIndex.replace('Fan', 'Fan2')] == '0',
+                                  'signal-round-run': getFanValue(state.dataIndex, 'Fan2') == '0',
                                   'signal-round-warning':
-                                    selectData[state.dataIndex.replace('Fan', 'Fan2')] != undefined &&
-                                    selectData[state.dataIndex.replace('Fan', 'Fan2')] == '1',
-                                  'signal-round-gry': selectData[state.dataIndex.replace('Fan', 'Fan2')] == undefined,
+                                    getFanValue(state.dataIndex, 'Fan2') != undefined && getFanValue(state.dataIndex, 'Fan2') == '1',
+                                  'signal-round-gry': getFanValue(state.dataIndex, 'Fan2') == undefined,
                                 }"
                               ></div>
                               <div class="vent-margin-l-8">{{
-                                selectData[state.dataIndex.replace('Fan', 'Fan2')] == undefined
+                                getFanValue(state.dataIndex, 'Fan2') == undefined
                                   ? '无状态'
-                                  : selectData[state.dataIndex.replace('Fan', 'Fan2')] == '0'
+                                  : getFanValue(state.dataIndex, 'Fan2') == '0'
                                     ? '正常'
                                     : '异常'
                               }}</div>
@@ -358,7 +352,7 @@
           </a-tab-pane>
         </a-tabs>
         <a-button
-          v-if="hasPermission('btn:reportDown')"
+          v-if="hasPermission(CONSTS.PERMISSIONS.BTN_REPORT_DOWN)"
           type="primary"
           size="small"
           preIcon="ant-design:download-outlined"
@@ -399,10 +393,7 @@
             <a-radio value="stop">停止</a-radio>
           </a-radio-group>
         </div>
-        <div
-          v-if="selectData && ((selectData['install_kind'] && !selectData['install_kind'].endsWith('_1')) || !selectData['install_kind'])"
-          class="startSmoke-select"
-        >
+        <div v-if="isShowStandbyFan" class="startSmoke-select">
           <div class="label">备机：</div>
           <a-radio-group v-model:value="mainWindIsShow2" @change="changeMotor" name="localWind2">
             <a-radio value="open">开启</a-radio>
@@ -418,10 +409,7 @@
           <div :class="{ 'button-box': true, 'button-disable': false }" @click="handleOk('Fan1Stop')">停止</div>
           <div :class="{ 'button-box': true, 'button-disable': false }" @click="handleOk('Fan1Reset')">复位</div>
         </div>
-        <div
-          v-if="selectData && ((selectData['install_kind'] && !selectData['install_kind'].endsWith('_1')) || !selectData['install_kind'])"
-          class="startSmoke-select"
-        >
+        <div v-if="isShowStandbyFan" class="startSmoke-select">
           <div class="label">备机：</div>
           <div :class="{ 'button-box': true, 'button-disable': false }" @click="handleOk('Fan2Open')">开启</div>
           <div :class="{ 'button-box': true, 'button-disable': false }" @click="handleOk('Fan2Stop')">停止</div>
@@ -434,10 +422,7 @@
           <div class="label">主机：</div>
           <div :class="{ 'button-box': true, 'button-disable': false }" @click="handleOk('Fan1remote')">远程/就地切换</div>
         </div>
-        <div
-          v-if="selectData && ((selectData['install_kind'] && !selectData['install_kind'].endsWith('_1')) || !selectData['install_kind'])"
-          class="startSmoke-select"
-        >
+        <div v-if="isShowStandbyFan" class="startSmoke-select">
           <div class="label">备机：</div>
           <div :class="{ 'button-box': true, 'button-disable': false }" @click="handleOk('Fan2remote')">远程/就地切换</div>
         </div>
@@ -445,17 +430,36 @@
       <!-- 调频 -->
       <div class="vent-flex-row input-box" v-if="controlType == 'Fan1Frequency'">
         <div class="label">主风机运行频率（Hz）：</div>
-        <a-input-number size="small" v-model:value="fan1FrequencyVal" :min="20" :max="50" :step="0.1" />
+        <a-input-number
+          size="small"
+          v-model:value="fan1FrequencyVal"
+          :min="CONSTS.FAN_FREQ_MIN"
+          :max="CONSTS.FAN_FREQ_MAX"
+          :step="CONSTS.FAN_FREQ_STEP"
+        />
       </div>
       <div class="vent-flex-row input-box" v-if="controlType == 'Fan2Frequency'">
         <div class="label">备风机运行频率（Hz）：</div>
-        <a-input-number size="small" v-model:value="fan2FrequencyVal" :min="20" :max="50" :step="0.1" />
+        <!-- 优化：使用常量替代硬编码 -->
+        <a-input-number
+          size="small"
+          v-model:value="fan2FrequencyVal"
+          :min="CONSTS.FAN_FREQ_MIN"
+          :max="CONSTS.FAN_FREQ_MAX"
+          :step="CONSTS.FAN_FREQ_STEP"
+        />
       </div>
       <div class="vent-flex-row input-box" v-if="controlType == 'FanFrequency'">
         <div class="label">风机运行频率（Hz）：</div>
-        <a-input-number size="small" v-model:value="fan1FrequencyVal" :min="20" :max="50" :step="0.1" />
+        <!-- 优化：使用常量替代硬编码 -->
+        <a-input-number
+          size="small"
+          v-model:value="fan1FrequencyVal"
+          :min="CONSTS.FAN_FREQ_MIN"
+          :max="CONSTS.FAN_FREQ_MAX"
+          :step="CONSTS.FAN_FREQ_STEP"
+        />
       </div>
-
       <div class="vent-flex-row input-box" v-if="controlType == 'disAirAlarm'">
         <div class="label">漏风率（%）：</div>
         <a-input-number size="small" v-model:value="frequencyVal" :min="0" :max="50" :step="0.1" />
@@ -542,7 +546,7 @@
 </template>
 
 <script setup lang="ts">
-  import { ExclamationCircleFilled, ArrowRightOutlined, VideoCameraOutlined } from '@ant-design/icons-vue';
+  import { ExclamationCircleFilled, VideoCameraOutlined } from '@ant-design/icons-vue';
   import {
     onBeforeMount,
     ref,
@@ -558,8 +562,8 @@
     shallowReactive,
     shallowRef,
     onBeforeUnmount,
+    readonly,
   } from 'vue';
-  // import BarSingle from '../../../../components/chart/BarSingle.vue';
   import FanDeviceEcharts from '../comment/FanDeviceEcharts.vue';
   import BarAndLine from '../../../../components/chart/BarAndLine.vue';
   import GroupMonitorTable from '../comment/GroupMonitorTable.vue';
@@ -584,7 +588,6 @@
   import { message } from 'ant-design-vue';
   import { useCamera } from '/@/hooks/system/useCamera';
   import { CaretRightOutlined } from '@ant-design/icons-vue';
-  // import ConditionAssistance from './components/conditionAssistanceCY.vue';
   import ConditionAssistance from './components/conditionAssistance.vue';
   import DischargeGas from './components/dischargeGas.vue';
   import SupplyAir from './components/supplyAir.vue';
@@ -595,6 +598,37 @@
   import { useMessage } from '/@/hooks/web/useMessage';
   import { cloneDeep } from 'lodash-es';
 
+  // 优化：提取硬编码为模块级常量
+  const CONSTS = {
+    // 频率相关常量
+    FAN_FREQ_MIN: 20,
+    FAN_FREQ_MAX: 50,
+    FAN_FREQ_STEP: 0.1,
+    // 瓦斯报警值常量
+    GAS_WARNING_VAL_DEFAULT: 0.6,
+    GAS_WARNING_VAL1_DEFAULT: 0.8,
+    // 设备类型/字典常量
+    DEVICE_TYPE_FANLOCAL: 'fanlocal',
+    DICT_CODE_FANLOCALTYPE: 'fanlocaltype',
+    // 风机名称常量
+    FAN_NAME_MAIN: '主机',
+    FAN_NAME_STANDBY: '备机',
+    // 滚动高度默认值
+    SCROLL_Y_DEFAULT: 180,
+    // 权限码常量（统一管理，避免拼写错误）
+    PERMISSIONS: {
+      FAN_LOCAL_PJFX: 'fanLocal:pjfx',
+      FAN_LOCAL_SHOW_CAMERA: 'fanlocal:showCamera',
+      BTN_REPORT_DOWN: 'btn:reportDown',
+    } as const,
+  } as const;
+
+  /** 列配置项 */
+  interface FanColumnItem {
+    title: string;
+    value?: string | number;
+  }
+
   const globalConfig = inject('globalConfig');
   const HistoryTable =
     globalConfig.History_Type == 'remote'
@@ -611,12 +645,12 @@
   const router = useRouter();
   const { createConfirm } = useMessage();
   const globSetting = useGlobSetting();
-  const showPlay = ref(hasPermission('fanlocal:showCamera') ? true : false);
+  const showPlay = ref(hasPermission(CONSTS.PERMISSIONS.FAN_LOCAL_SHOW_CAMERA) ? true : false);
   const computedStyle = computed(() => {
-    const hasMatchingPermission = hasPermission('fanLocal:pjfx');
+    const hasMatchingPermission = hasPermission(CONSTS.PERMISSIONS.FAN_LOCAL_PJFX);
     return hasMatchingPermission ? 'max-height: 200px' : '';
   });
-  const fanTitles = globSetting.sysOrgCode === 'zmhjhzmy' ? ['1#风机', '2#风机'] : ['主机', '备机'];
+  const fanTitles = globSetting.sysOrgCode === 'zmhjhzmy' ? ['1#风机', '2#风机'] : [CONSTS.FAN_NAME_MAIN, CONSTS.FAN_NAME_STANDBY];
   const modalTypeArr = reactive({
     leftBtnArr: [
       {
@@ -760,7 +794,7 @@
       },
     ],
   });
-  const sensorList = ref<any[]>([
+  const sensorList = readonly([
     {
       value: '1',
       label: 'T1',
@@ -773,14 +807,14 @@
       value: '3',
       label: 'T3',
     },
-  ]);
+  ] as const);
 
   const scroll = reactive({
-    y: 180,
+    y: CONSTS.SCROLL_Y_DEFAULT,
   });
-  const deviceTypeDicts = getDictItemsByCode('fanlocaltype');
-  const gasWarningVal = ref(0.6); // 瓦斯最大报警值
-  const gasWarningVal1 = ref(0.8); // 瓦斯最大报警值
+  const deviceTypeDicts = getDictItemsByCode(CONSTS.DICT_CODE_FANLOCALTYPE);
+  const gasWarningVal = ref(CONSTS.GAS_WARNING_VAL_DEFAULT);
+  const gasWarningVal1 = ref(CONSTS.GAS_WARNING_VAL1_DEFAULT);
   const playerRef = ref();
   const MonitorDataTable = ref();
   const modalSensor = ref(null);
@@ -810,7 +844,7 @@
   // 设备数据
   const controlType = ref('');
   const modalType = ref('');
-  const mainModelType = ref('fanLocal');
+  const mainModelType = ref(CONSTS.DEVICE_TYPE_FANLOCAL);
   // 监测数据
   const initData = {
     deviceID: '',
@@ -835,17 +869,17 @@
   const currentDeviceData = ref({});
   const rightColumns = ref<BasicColumn[]>([]);
   const leftColumns = ref<BasicColumn[]>([]);
-  const leftColumns1 = ref<any[]>([
+  const leftColumns1 = ref<FanColumnItem[]>([
     { title: '供风充足评价', value: '' },
     { title: '回风流超限评价', value: '' },
     { title: '风筒漏风率评价', value: '' },
   ]);
-  const leftColumns2 = ref<any[]>([
+  const leftColumns2 = ref<FanColumnItem[]>([
     { title: '供风充足评价', value: '充足' },
     { title: '回风流超限评价', value: '正常' },
     { title: '风筒漏风率评价', value: '正常' },
   ]);
-  const devicekind = ref(deviceTypeDicts && deviceTypeDicts.length > 0 ? deviceTypeDicts[0]['value'] : 'fanlocal');
+  const devicekind = ref(deviceTypeDicts && deviceTypeDicts.length > 0 ? deviceTypeDicts[0]['value'] : CONSTS.DEVICE_TYPE_FANLOCAL);
   const deviceType = ref(selectData.deviceType);
   const headElHeight = ref(0);
   let btnClick = ref(true); // 判断按钮是否可点
@@ -933,6 +967,20 @@
     }
   };
 
+  // 优化：封装主备机数据取值方法，避免模板重复逻辑
+  const getFanValue = (dataIndex: string, fanType: 'Fan1' | 'Fan2') => {
+    if (!selectData) return '-';
+    const targetKey = dataIndex.startsWith('Fan') ? dataIndex.replace('Fan', fanType) : dataIndex;
+    return selectData[targetKey] ?? '-';
+  };
+
+  // 优化：重复判断抽离为计算属性，利用缓存减少重复计算
+  const isShowStandbyFan = computed(() => {
+    if (!selectData) return false;
+    const installKind = selectData.install_kind;
+    return installKind ? !installKind.endsWith('_1') : true;
+  });
+
   //报表导出点击
   async function reportDown() {
     openModal1();
@@ -951,7 +999,7 @@
     openModal();
   }
 
-  function goDetailDevice(link需风量DeviceCode) {
+  function goDetailDevice(linkDeviceCode) {
     let linkDeviceId = '';
     if (linkDeviceCode.startsWith('window')) {
       linkDeviceId = linkDeviceInfo.value[linkDeviceCode] ? linkDeviceInfo.value[linkDeviceCode]['id'] : '';
@@ -1054,7 +1102,6 @@
     if (Object.prototype.toString.call(timer) === '[object Null]') {
       timer = await setTimeout(
         async () => {
-          // debugger;
           await getDataSource();
           if (dataSource.value.length > 0 && selectRowIndex.value == -1 && MonitorDataTable.value) {
             // 初始打开页面
@@ -1163,7 +1210,7 @@
   function showModal(obj) {
     if (!btnClick.value) return;
     if (obj.key == 'kkjc') {
-      gasWarningVal.value = 0.6;
+      gasWarningVal.value = CONSTS.GAS_WARNING_VAL_DEFAULT;
       // 工况辅助决策
       openAssistance(true, {});
       return;