perf(views): 优化实时监测页面智能寻优接口请求

src/api/index.ts

@@ -8,6 +8,7 @@ import type {
   AgreementUpdate,
   AIAdvancedParamItem,
   AIOptimizeDetail,
+  AIOptimizeDevData,
   AIStartStopDeviceItem,
   AIStartStopDeviceParams,
   AIStartStopOptimizeInfo,
@@ -1156,6 +1157,11 @@ export const updateAIStartStopData = async (params: AIStartStopDeviceParams) =>
   });
 };
 
+export const getAIOptimizeDevData = async (groupId: number) => {
+  const data = await request<AIOptimizeDevData>(apiBiz(`/moduleInfoAi/get/info/${groupId}`));
+  return data;
+};
+
 export const getAIOptimizeDetail = async (groupId: number, deviceType: number) => {
   const data = await request<AIOptimizeDetail>(apiBiz('/moduleInfoAi/infoDetail'), {
     method: 'POST',

src/types/index.ts

@@ -2222,6 +2222,35 @@ export interface AIStartStopOptimizeInfo {
   aiStartType?: CtrlCabinetStartType;
 }
 
+export interface AIOptimizeDevData {
+  deviceGroupId: number;
+  controllerDeviceId: number;
+  deviceName: string;
+  deviceIds: string;
+  runningStatus: number;
+  moduleId: number;
+  enableHostWaterSet: boolean;
+  enableTowerWaterSet: boolean;
+  moduleInfoAi: {
+    id: number;
+    createTime: string;
+    updateTime: string;
+    createUserId: number;
+    updateUserId: number;
+    moduleId: number;
+    aiStartType: number;
+    aiSeekHostWaterTempValue: number;
+    aiSeekHostWaterTempButton: boolean;
+    aiSeekTowerWaterTempValue: number;
+    aiSeekTowerWaterTempButton: boolean;
+    aiSeekChildPumpValue: number;
+    aiSeekChildPumpButton: boolean;
+    aiSeekCoolingPumpValue: number;
+    aiSeekCoolingPumpButton: boolean;
+  };
+  systemStatus: string;
+}
+
 export interface AIOptimizeDetail {
   deviceList: AIOptimizeDeviceItem[];
   algorithmConfig: Partial<AlgorithmConfigInfo>;

src/views/real-time-monitor/device-control/AIOptimization.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { computed, onMounted, ref, shallowRef, useTemplateRef, watch } from 'vue';
+import { computed, onMounted, onUnmounted, ref, shallowRef, useTemplateRef } from 'vue';
 import { Modal } from 'ant-design-vue';
 
 import { DeviceType } from '@/views/device-work-status/device-card';
@@ -7,7 +7,7 @@ import SvgIcon from '@/components/SvgIcon.vue';
 import { useRequest } from '@/hooks/request';
 import { useViewVisible } from '@/hooks/view-visible';
 import { t } from '@/i18n';
-import { getAlgorithmConfigInfo, updateAIStartStopOptimize } from '@/api';
+import { getAIOptimizeDevData, updateAIStartStopOptimize } from '@/api';
 import { isNotEmptyVal } from '@/utils';
 
 import ChillerUnitOptimize from '../device-optimize/ChillerUnitOptimize.vue';
@@ -15,7 +15,7 @@ import CoolingTowerOptimize from '../device-optimize/CoolingTowerOptimize.vue';
 
 import type { Component } from 'vue';
 import type { ColumnType } from 'ant-design-vue/es/table';
-import type { AIOptimizeSetItemInstance, GroupModuleInfo } from '@/types';
+import type { AIOptimizeDevData, AIOptimizeSetItemInstance, GroupModuleInfo } from '@/types';
 
 interface Props {
   info: GroupModuleInfo;
@@ -25,8 +25,8 @@ const props = defineProps<Props>();
 
 interface OptimizeAlgorithmItem {
   algorithm: string;
-  setValue: number;
-  isEnabled: boolean;
+  setValue?: number;
+  isEnabled?: boolean;
   valuePropName: string;
   enablePropName: string;
   unit?: string;
@@ -36,29 +36,48 @@ interface OptimizeAlgorithmItem {
 }
 
 const { isLoading, handleRequest } = useRequest();
-const chillerUnitWaterTemp = ref(props.info.moduleInfoAi.aiSeekHostWaterTempValue);
-const coolingTowerWaterTemp = ref(props.info.moduleInfoAi.aiSeekTowerWaterTempValue);
-
-watch(
-  () => props.info.moduleInfoAi,
-  (newVal) => {
-    chillerUnitWaterTemp.value = newVal.aiSeekHostWaterTempValue;
-    coolingTowerWaterTemp.value = newVal.aiSeekTowerWaterTempValue;
-  },
-);
+const optimizeDevData = ref<AIOptimizeDevData>();
+let optimizeTimer: number | undefined;
+
+onMounted(() => {
+  getOptimizeDevData();
+});
+
+onUnmounted(() => {
+  optimizeDevData.value = undefined;
+  clearTimeout(optimizeTimer);
+});
+
+const getOptimizeDevData = () => {
+  clearTimeout(optimizeTimer);
+
+  handleRequest(async () => {
+    const groupId = props.info.groupId;
+    const data = await getAIOptimizeDevData(groupId);
+    optimizeDevData.value = data;
+    enableChillerUnit.value = data.enableHostWaterSet;
+    enableCoolingTower.value = data.enableTowerWaterSet;
+    chillerUnitWaterTemp.value = data.moduleInfoAi.aiSeekHostWaterTempValue;
+    coolingTowerWaterTemp.value = data.moduleInfoAi.aiSeekTowerWaterTempValue;
+  });
 
+  optimizeTimer = window.setTimeout(getOptimizeDevData, 3000);
+};
+
+const chillerUnitWaterTemp = ref<number>();
+const coolingTowerWaterTemp = ref<number>();
 const enableChillerUnit = ref(false);
 const enableCoolingTower = ref(false);
 
 const dataSource = computed<OptimizeAlgorithmItem[]>(() => {
   const list: OptimizeAlgorithmItem[] = [];
-  const { moduleInfoAi } = props.info;
+  const moduleInfoAi = optimizeDevData.value?.moduleInfoAi;
 
   if (enableChillerUnit.value) {
     list.push({
       algorithm: '冷机水温寻优',
-      setValue: moduleInfoAi.aiSeekHostWaterTempValue,
-      isEnabled: moduleInfoAi.aiSeekHostWaterTempButton,
+      setValue: moduleInfoAi?.aiSeekHostWaterTempValue,
+      isEnabled: moduleInfoAi?.aiSeekHostWaterTempButton,
       valuePropName: 'aiSeekHostWaterTempValue',
       enablePropName: 'aiSeekHostWaterTempButton',
       unit: '°C',
@@ -70,8 +89,8 @@ const dataSource = computed<OptimizeAlgorithmItem[]>(() => {
   if (enableCoolingTower.value) {
     list.push({
       algorithm: '塔出水温度寻优',
-      setValue: moduleInfoAi.aiSeekTowerWaterTempValue,
-      isEnabled: moduleInfoAi.aiSeekTowerWaterTempButton,
+      setValue: moduleInfoAi?.aiSeekTowerWaterTempValue,
+      isEnabled: moduleInfoAi?.aiSeekTowerWaterTempButton,
       valuePropName: 'aiSeekTowerWaterTempValue',
       enablePropName: 'aiSeekTowerWaterTempButton',
       unit: '°C',
@@ -118,21 +137,12 @@ const columns = computed<ColumnType<OptimizeAlgorithmItem>[]>(() => [
   },
 ]);
 
-onMounted(() => {
-  handleRequest(async () => {
-    const { groupId } = props.info;
-    const { enabled, enableCoolingPipeDynamicSet } = await getAlgorithmConfigInfo(groupId);
-    enableChillerUnit.value = enabled;
-    enableCoolingTower.value = enableCoolingPipeDynamicSet;
-  });
-});
-
 const handleTempChange = (record: OptimizeAlgorithmItem, value: string | number | null) => {
   handleRequest(async () => {
-    const id = props.info.moduleInfoAi.id;
+    const id = optimizeDevData.value?.moduleInfoAi.id;
     const groupId = props.info.groupId;
 
-    if (isNotEmptyVal(value)) {
+    if (id && isNotEmptyVal(value)) {
       await updateAIStartStopOptimize({
         id,
         groupId,
@@ -151,14 +161,16 @@ const handleSwitchClick = (record: OptimizeAlgorithmItem) => {
     centered: true,
     onOk() {
       handleRequest(async () => {
-        const id = props.info.moduleInfoAi.id;
+        const id = optimizeDevData.value?.moduleInfoAi.id;
         const groupId = props.info.groupId;
 
-        await updateAIStartStopOptimize({
-          id,
-          groupId,
-          [record.enablePropName]: !record.isEnabled,
-        });
+        if (id) {
+          await updateAIStartStopOptimize({
+            id,
+            groupId,
+            [record.enablePropName]: !record.isEnabled,
+          });
+        }
       });
     },
   });