perf(views): 优化“环境监控”模块选择框提示文本与温湿度下拉框位置更换

src/types/index.ts

@@ -1536,16 +1536,16 @@ export interface MonitoringForm {
   regionId?: number;
   returnDevGroupId?: number;
   returnDevId?: number;
-  returnTempParamCode: string;
-  returnHumidityParamCode: string;
+  returnTempParamCode?: string;
+  returnHumidityParamCode?: string;
   supplyDevGroupId?: number;
   supplyDevId?: number;
-  supplyTempParamCode: string;
-  supplyHumidityParamCode: string;
+  supplyTempParamCode?: string;
+  supplyHumidityParamCode?: string;
   outdoorDevGroupId?: number;
   outdoorDevId?: number;
-  outdoorTempParamCode: string;
-  outdoorHumidityParamCode: string;
+  outdoorTempParamCode?: string;
+  outdoorHumidityParamCode?: string;
   tempUpper?: number;
   tempLower?: number;
   tempPreset?: number;
@@ -1557,9 +1557,9 @@ export interface MonitoringForm {
   supplyUpperTempDiff?: number;
   runStatusDevGroupId?: number;
   runStatusDevId?: number;
-  runStatusParamCode: string;
-  runStatusConditionCode: string;
-  runStatusConditionValue: string;
+  runStatusParamCode?: string;
+  runStatusConditionCode?: string;
+  runStatusConditionValue?: string;
 }
 
 export interface RegionQuery {

src/views/env-monitor/EnvMonitor.vue

@@ -120,15 +120,15 @@ const monitoringForm = ref<MonitoringForm>({
   regionId: undefined,
   returnDevGroupId: undefined,
   returnDevId: undefined,
-  returnTempParamCode: '',
-  returnHumidityParamCode: '',
+  returnTempParamCode: undefined,
+  returnHumidityParamCode: undefined,
   supplyDevGroupId: undefined,
-  supplyTempParamCode: '',
-  supplyHumidityParamCode: '',
+  supplyTempParamCode: undefined,
+  supplyHumidityParamCode: undefined,
   outdoorDevGroupId: undefined,
   outdoorDevId: undefined,
-  outdoorTempParamCode: '',
-  outdoorHumidityParamCode: '',
+  outdoorTempParamCode: undefined,
+  outdoorHumidityParamCode: undefined,
   tempUpper: undefined,
   tempLower: undefined,
   tempPreset: undefined,
@@ -140,9 +140,9 @@ const monitoringForm = ref<MonitoringForm>({
   supplyUpperTempDiff: undefined,
   runStatusDevGroupId: undefined,
   runStatusDevId: undefined,
-  runStatusParamCode: '',
-  runStatusConditionCode: '',
-  runStatusConditionValue: '',
+  runStatusParamCode: undefined,
+  runStatusConditionCode: undefined,
+  runStatusConditionValue: undefined,
 });
 
 const outdooForm = ref<OutdooForm>({
@@ -365,9 +365,9 @@ const adddDevice = (value: SelectValue, option: DefaultOptionType, judgment: num
 };
 
 const adddRunStatusDevice = (value: SelectValue, option: DefaultOptionType) => {
-  monitoringForm.value.runStatusParamCode = '';
-  monitoringForm.value.runStatusConditionCode = '';
-  monitoringForm.value.runStatusConditionValue = '';
+  monitoringForm.value.runStatusParamCode = undefined;
+  monitoringForm.value.runStatusConditionCode = undefined;
+  monitoringForm.value.runStatusConditionValue = undefined;
   getDeviceListOptionsList(option.id, false, '');
 };
 
@@ -415,14 +415,14 @@ const getDeviceParamsList = (id: number, judgment: number, show: boolean) => {
     if (judgment === HumitureType.ReturnAir) {
       returnDeviceParamsList.value = data;
       if (show) {
-        monitoringForm.value.returnHumidityParamCode = '';
-        monitoringForm.value.returnTempParamCode = '';
+        monitoringForm.value.returnHumidityParamCode = undefined;
+        monitoringForm.value.returnTempParamCode = undefined;
       }
     } else if (judgment === HumitureType.SupplyAir) {
       supplyDeviceParamsList.value = data;
       if (show) {
-        monitoringForm.value.supplyHumidityParamCode = '';
-        monitoringForm.value.supplyTempParamCode = '';
+        monitoringForm.value.supplyHumidityParamCode = undefined;
+        monitoringForm.value.supplyTempParamCode = undefined;
       }
     } else if (judgment === HumitureType.Outdoor) {
       outdoorDeviceParamsList.value = data;
@@ -434,8 +434,8 @@ const getDeviceParamsList = (id: number, judgment: number, show: boolean) => {
     } else if (judgment === HumitureType.FreshAir) {
       freshDeviceParamsList.value = data;
       if (show) {
-        monitoringForm.value.outdoorTempParamCode = '';
-        monitoringForm.value.outdoorHumidityParamCode = '';
+        monitoringForm.value.outdoorTempParamCode = undefined;
+        monitoringForm.value.outdoorHumidityParamCode = undefined;
       }
     }
   });
@@ -452,15 +452,15 @@ const getDevicesGroupList = (id: number, judgment: number, show: boolean) => {
       returnDevicesList.value = records;
       if (show) {
         monitoringForm.value.returnDevId = undefined;
-        monitoringForm.value.returnHumidityParamCode = '';
-        monitoringForm.value.returnTempParamCode = '';
+        monitoringForm.value.returnHumidityParamCode = undefined;
+        monitoringForm.value.returnTempParamCode = undefined;
       }
     } else if (judgment === HumitureType.SupplyAir) {
       supplyDevicesList.value = records;
       if (show) {
         monitoringForm.value.supplyDevId = undefined;
-        monitoringForm.value.supplyHumidityParamCode = '';
-        monitoringForm.value.supplyTempParamCode = '';
+        monitoringForm.value.supplyHumidityParamCode = undefined;
+        monitoringForm.value.supplyTempParamCode = undefined;
       }
     } else if (judgment === HumitureType.Outdoor) {
       outdoorDevicesList.value = records;
@@ -474,16 +474,16 @@ const getDevicesGroupList = (id: number, judgment: number, show: boolean) => {
       freshDevicesList.value = records;
       if (show) {
         monitoringForm.value.outdoorDevId = undefined;
-        monitoringForm.value.outdoorTempParamCode = '';
-        monitoringForm.value.outdoorHumidityParamCode = '';
+        monitoringForm.value.outdoorTempParamCode = undefined;
+        monitoringForm.value.outdoorHumidityParamCode = undefined;
       }
     } else if (judgment === HumitureType.OperatingStatus) {
       runDevicesList.value = records;
       if (show) {
         monitoringForm.value.runStatusDevId = undefined;
-        monitoringForm.value.runStatusParamCode = '';
-        monitoringForm.value.runStatusConditionCode = '';
-        monitoringForm.value.runStatusConditionValue = '';
+        monitoringForm.value.runStatusParamCode = undefined;
+        monitoringForm.value.runStatusConditionCode = undefined;
+        monitoringForm.value.runStatusConditionValue = undefined;
       }
     }
   });
@@ -636,7 +636,9 @@ const editorClick = (monitoringPointId: number) => {
         getDevicesGroupList(runStatusDevGroupId, HumitureType.OperatingStatus, false);
       }
       if (runStatusDevId) {
-        getDeviceListOptionsList(runStatusDevId, true, runStatusParamCode);
+        if (runStatusParamCode) {
+          getDeviceListOptionsList(runStatusDevId, true, runStatusParamCode);
+        }
       }
     }
 
@@ -662,15 +664,15 @@ const closeModal = () => {
     regionId: undefined,
     returnDevGroupId: undefined,
     returnDevId: undefined,
-    returnTempParamCode: '',
-    returnHumidityParamCode: '',
+    returnTempParamCode: undefined,
+    returnHumidityParamCode: undefined,
     supplyDevGroupId: undefined,
-    supplyTempParamCode: '',
-    supplyHumidityParamCode: '',
+    supplyTempParamCode: undefined,
+    supplyHumidityParamCode: undefined,
     outdoorDevGroupId: undefined,
     outdoorDevId: undefined,
-    outdoorTempParamCode: '',
-    outdoorHumidityParamCode: '',
+    outdoorTempParamCode: undefined,
+    outdoorHumidityParamCode: undefined,
     tempUpper: undefined,
     tempLower: undefined,
     tempPreset: undefined,
@@ -682,9 +684,9 @@ const closeModal = () => {
     supplyUpperTempDiff: undefined,
     runStatusDevGroupId: undefined,
     runStatusDevId: undefined,
-    runStatusParamCode: '',
-    runStatusConditionCode: '',
-    runStatusConditionValue: '',
+    runStatusParamCode: undefined,
+    runStatusConditionCode: undefined,
+    runStatusConditionValue: undefined,
   };
 
   formRef.value?.resetFields();
@@ -1042,7 +1044,7 @@ const copyAreaCanvas = () => {
               v-model:value="gradeTwo"
               :options="twoDeviceGroup"
               :field-names="{ label: 'groupName', value: 'id' }"
-              :placeholder="$t('common.plzSelect')"
+              :placeholder="$t('common.plzSelect', { name: t('createDevice.groupName') })"
             />
           </div>
         </AFlex>
@@ -1220,7 +1222,7 @@ const copyAreaCanvas = () => {
           <AFormItem :label="t('envMonitor.humidityTemperatureControl')" name="tempHumidityControlMode">
             <ARadioGroup v-model:value="monitoringForm.tempHumidityControlMode" class="radio-group">
               <ARadio value="2">{{ $t('envMonitor.returnControl') }}</ARadio>
-              <!-- <ARadio value="1">{{ $t('envMonitor.supplyControl') }}</ARadio> -->
+              <ARadio value="1">{{ $t('envMonitor.supplyControl') }}</ARadio>
             </ARadioGroup>
           </AFormItem>
 
@@ -1236,7 +1238,7 @@ const copyAreaCanvas = () => {
                   v-model:value="monitoringForm.returnDevGroupId"
                   :options="twoDeviceGroup"
                   :field-names="{ label: 'groupName', value: 'id' }"
-                  :placeholder="$t('common.plzSelect')"
+                  :placeholder="$t('common.plzSelect', { name: t('createDevice.groupName') })"
                   @change="(value, option) => adddDeviceGroup(value, option, HumitureType.ReturnAir)"
                 />
               </AFormItem>
@@ -1246,27 +1248,30 @@ const copyAreaCanvas = () => {
                   v-model:value="monitoringForm.returnDevId"
                   :options="returnDevicesList"
                   :field-names="{ label: 'deviceName', value: 'id' }"
-                  :placeholder="$t('common.plzSelect')"
+                  :placeholder="$t('common.plzSelect', { name: t('deviceList.equipmentName') })"
                   @change="(value, option) => adddDevice(value, option, HumitureType.ReturnAir)"
                 />
               </AFormItem>
-
-              <AFormItem name="returnTempParamCode">
+              <AFormItem name="returnHumidityParamCode">
                 <ASelect
                   class="input-wdith"
-                  v-model:value="monitoringForm.returnTempParamCode"
+                  v-model:value="monitoringForm.returnHumidityParamCode"
                   :options="returnDeviceParamsList"
                   :field-names="{ label: 'deviceParamName', value: 'deviceParamCode' }"
-                  :placeholder="$t('common.plzSelect')"
+                  :placeholder="
+                    $t('common.plzSelect', { name: t('envMonitor.humidity') + t('createDevice.parameters') })
+                  "
                 />
               </AFormItem>
-              <AFormItem name="returnHumidityParamCode">
+              <AFormItem name="returnTempParamCode">
                 <ASelect
                   class="input-wdith"
-                  v-model:value="monitoringForm.returnHumidityParamCode"
+                  v-model:value="monitoringForm.returnTempParamCode"
                   :options="returnDeviceParamsList"
                   :field-names="{ label: 'deviceParamName', value: 'deviceParamCode' }"
-                  :placeholder="$t('common.plzSelect')"
+                  :placeholder="
+                    $t('common.plzSelect', { name: t('envMonitor.temperature') + t('createDevice.parameters') })
+                  "
                 />
               </AFormItem>
             </div>
@@ -1277,7 +1282,7 @@ const copyAreaCanvas = () => {
                   v-model:value="monitoringForm.supplyDevGroupId"
                   :options="twoDeviceGroup"
                   :field-names="{ label: 'groupName', value: 'id' }"
-                  :placeholder="$t('common.plzSelect')"
+                  :placeholder="$t('common.plzSelect', { name: t('createDevice.groupName') })"
                   @change="(value, option) => adddDeviceGroup(value, option, HumitureType.SupplyAir)"
                 />
               </AFormItem>
@@ -1287,27 +1292,30 @@ const copyAreaCanvas = () => {
                   v-model:value="monitoringForm.supplyDevId"
                   :options="supplyDevicesList"
                   :field-names="{ label: 'deviceName', value: 'id' }"
-                  :placeholder="$t('common.plzSelect')"
+                  :placeholder="$t('common.plzSelect', { name: t('deviceList.equipmentName') })"
                   @change="(value, option) => adddDevice(value, option, HumitureType.SupplyAir)"
                 />
               </AFormItem>
-
-              <AFormItem name="supplyTempParamCode">
+              <AFormItem name="supplyHumidityParamCode">
                 <ASelect
                   class="input-wdith"
-                  v-model:value="monitoringForm.supplyTempParamCode"
+                  v-model:value="monitoringForm.supplyHumidityParamCode"
                   :options="supplyDeviceParamsList"
                   :field-names="{ label: 'deviceParamName', value: 'deviceParamCode' }"
-                  :placeholder="$t('common.plzSelect')"
+                  :placeholder="
+                    $t('common.plzSelect', { name: t('envMonitor.humidity') + t('createDevice.parameters') })
+                  "
                 />
               </AFormItem>
-              <AFormItem name="supplyHumidityParamCode">
+              <AFormItem name="supplyTempParamCode">
                 <ASelect
                   class="input-wdith"
-                  v-model:value="monitoringForm.supplyHumidityParamCode"
+                  v-model:value="monitoringForm.supplyTempParamCode"
                   :options="supplyDeviceParamsList"
                   :field-names="{ label: 'deviceParamName', value: 'deviceParamCode' }"
-                  :placeholder="$t('common.plzSelect')"
+                  :placeholder="
+                    $t('common.plzSelect', { name: t('envMonitor.temperature') + t('createDevice.parameters') })
+                  "
                 />
               </AFormItem>
             </div>
@@ -1323,7 +1331,7 @@ const copyAreaCanvas = () => {
                 v-model:value="monitoringForm.outdoorDevGroupId"
                 :options="twoDeviceGroup"
                 :field-names="{ label: 'groupName', value: 'id' }"
-                :placeholder="$t('common.plzSelect')"
+                :placeholder="$t('common.plzSelect', { name: t('createDevice.groupName') })"
                 @change="(value, option) => adddDeviceGroup(value, option, HumitureType.FreshAir)"
               />
             </AFormItem>
@@ -1333,27 +1341,28 @@ const copyAreaCanvas = () => {
                 v-model:value="monitoringForm.outdoorDevId"
                 :options="freshDevicesList"
                 :field-names="{ label: 'deviceName', value: 'id' }"
-                :placeholder="$t('common.plzSelect')"
+                :placeholder="$t('common.plzSelect', { name: t('deviceList.equipmentName') })"
                 @change="(value, option) => adddDevice(value, option, HumitureType.FreshAir)"
               />
             </AFormItem>
-
-            <AFormItem name="outdoorTempParamCode">
+            <AFormItem name="outdoorHumidityParamCode">
               <ASelect
                 class="input-wdith"
-                v-model:value="monitoringForm.outdoorTempParamCode"
+                v-model:value="monitoringForm.outdoorHumidityParamCode"
                 :options="freshDeviceParamsList"
                 :field-names="{ label: 'deviceParamName', value: 'deviceParamCode' }"
-                :placeholder="$t('common.plzSelect')"
+                :placeholder="$t('common.plzSelect', { name: t('envMonitor.humidity') + t('createDevice.parameters') })"
               />
             </AFormItem>
-            <AFormItem name="outdoorHumidityParamCode">
+            <AFormItem name="outdoorTempParamCode">
               <ASelect
                 class="input-wdith"
-                v-model:value="monitoringForm.outdoorHumidityParamCode"
+                v-model:value="monitoringForm.outdoorTempParamCode"
                 :options="freshDeviceParamsList"
                 :field-names="{ label: 'deviceParamName', value: 'deviceParamCode' }"
-                :placeholder="$t('common.plzSelect')"
+                :placeholder="
+                  $t('common.plzSelect', { name: t('envMonitor.temperature') + t('createDevice.parameters') })
+                "
               />
             </AFormItem>
           </div>
@@ -1487,7 +1496,7 @@ const copyAreaCanvas = () => {
                 v-model:value="monitoringForm.runStatusDevGroupId"
                 :options="twoDeviceGroup"
                 :field-names="{ label: 'groupName', value: 'id' }"
-                :placeholder="$t('common.plzSelect')"
+                :placeholder="$t('common.plzSelect', { name: t('createDevice.groupName') })"
                 @change="(value, option) => adddDeviceGroup(value, option, HumitureType.OperatingStatus)"
               />
             </AFormItem>
@@ -1497,7 +1506,7 @@ const copyAreaCanvas = () => {
                 v-model:value="monitoringForm.runStatusDevId"
                 :options="runDevicesList"
                 :field-names="{ label: 'deviceName', value: 'id' }"
-                :placeholder="$t('common.plzSelect')"
+                :placeholder="$t('common.plzSelect', { name: t('deviceList.equipmentName') })"
                 @change="(value, option) => adddRunStatusDevice(value, option)"
               />
             </AFormItem>
@@ -1507,7 +1516,7 @@ const copyAreaCanvas = () => {
                 v-model:value="monitoringForm.runStatusParamCode"
                 :options="runDeviceParamsList"
                 :field-names="{ label: 'deviceParamName', value: 'deviceParamCode' }"
-                :placeholder="$t('common.plzSelect')"
+                :placeholder="$t('common.plzSelect', { name: t('alarmManage.equipmentParameters') })"
                 @change="(value, option) => adddParametersDevice(value, option)"
               />
             </AFormItem>
@@ -1516,7 +1525,7 @@ const copyAreaCanvas = () => {
                 class="input-wdith"
                 v-model:value="monitoringForm.runStatusConditionCode"
                 :options="inputType === 1 ? temperatureDifference : paramAlgOperator"
-                :placeholder="$t('common.plzSelect')"
+                :placeholder="$t('common.plzSelect', { name: t('alarmManage.operator') })"
                 :field-names="{ label: 'dictValue', value: 'dictValue' }"
               />
             </AFormItem>
@@ -1568,7 +1577,7 @@ const copyAreaCanvas = () => {
               v-model:value="outdooForm.outsideDevGroupId"
               :options="twoDeviceGroup"
               :field-names="{ label: 'groupName', value: 'id' }"
-              :placeholder="$t('common.plzSelect')"
+              :placeholder="$t('common.plzSelect', { name: t('createDevice.groupName') })"
               @change="(value, option) => adddDeviceGroup(value, option, HumitureType.Outdoor)"
             />
           </AFormItem>
@@ -1578,33 +1587,36 @@ const copyAreaCanvas = () => {
               v-model:value="outdooForm.outsideDevId"
               :options="outdoorDevicesList"
               :field-names="{ label: 'deviceName', value: 'id' }"
-              :placeholder="$t('common.plzSelect')"
+              :placeholder="$t('common.plzSelect', { name: t('deviceList.equipmentName') })"
               @change="(value, option) => adddDevice(value, option, HumitureType.Outdoor)"
             />
           </AFormItem>
-          <AFormItem name="outsideTempParamCode">
+          <AFormItem name="outsideHumidityParamCode">
             <ASelect
               class="input-wdith"
-              v-model:value="outdooForm.outsideTempParamCode"
+              v-model:value="outdooForm.outsideHumidityParamCode"
               :options="outdoorDeviceParamsList"
               :field-names="{ label: 'deviceParamName', value: 'deviceParamCode' }"
-              :placeholder="$t('common.plzSelect')"
+              :placeholder="$t('common.plzSelect', { name: t('envMonitor.humidity') + t('createDevice.parameters') })"
             />
           </AFormItem>
-          <AFormItem name="outsideHumidityParamCode">
+          <AFormItem name="outsideTempParamCode">
             <ASelect
               class="input-wdith"
-              v-model:value="outdooForm.outsideHumidityParamCode"
+              v-model:value="outdooForm.outsideTempParamCode"
               :options="outdoorDeviceParamsList"
               :field-names="{ label: 'deviceParamName', value: 'deviceParamCode' }"
-              :placeholder="$t('common.plzSelect')"
+              :placeholder="
+                $t('common.plzSelect', { name: t('envMonitor.temperature') + t('createDevice.parameters') })
+              "
             />
           </AFormItem>
+
           <AFormItem name="outsideEnthalpyParamCode">
             <ASelect
               class="input-wdith"
               v-model:value="outdooForm.outsideEnthalpyParamCode"
-              :placeholder="$t('common.plzSelect')"
+              :placeholder="$t('common.plzSelect', { name: t('envMonitor.hanValue') })"
             >
               <ASelectOption value="温度">{{ t('envMonitor.temperature') }}</ASelectOption>
               <ASelectOption value="湿度">{{ t('envMonitor.humidity') }}</ASelectOption>