fix:预警配置下拉框bug解决

src/views/warn/config/warn.data.ts

@@ -2,8 +2,8 @@ import type { BasicColumn, FormSchema } from '@/components/Table'
 import {getAlarmLevelList} from "@/api/alert/warn";
 import {subSystemListApi} from "@/api/alert/model/select";
 import {getInstantList,getInstantPoint} from "@/api/alert/run/instant";
-import {ref} from "vue";
-
+import {h,ref} from "vue";
+import { Tag } from 'ant-design-vue'
 const alarmLevelList = await getAlarmLevelList();
 
 
@@ -401,6 +401,7 @@ unitList.value = Array.from(
     ]),
   ).values(),
 )
+console.log(666,unitList.value)
 const typeList=ref([]);
 typeList.value = Array.from(
   new Map(
@@ -414,11 +415,13 @@ typeList.value = Array.from(
       ]),
   ).values(),
 )
+console.log(777,typeList.value)
+
 const systemList=ref([]);
 systemList.value = Array.from(
   new Map(
     selectList
-      .filter(item => item.systemTypeId === unitList.value[0].systemTypeId && item.unitId === unitList.value[0].unitId)
+      .filter(item => item.systemTypeId === typeList.value[0].systemTypeId && item.unitId === typeList.value[0].unitId)
       .map(item => [
         item.systemId,
         {
@@ -427,11 +430,13 @@ systemList.value = Array.from(
       ]),
   ).values(),
 )
+console.log(888,systemList.value)
+
 const mpList=ref([]);
 mpList.value = Array.from(
   new Map(
     selectList
-      .filter(item => item.systemId === unitList.value[0].systemId)
+      .filter(item => item.systemId === systemList.value[0].systemId)
       .map(item => [
         item.mpId,
         {
@@ -459,28 +464,12 @@ export const InstantForm: FormSchema[] = [
         value: unit.unitId,
         label: unit.unitName,
       })),
-      onChange:  (unit: number) => {
-        // ⭐ 根据 unitId 从 selectList 计算系统下拉
-        typeList.value = Array.from(
-          new Map(
-            selectList
-              .filter(item => item.unitId === unit)
-              .map(item => [
-                item.systemTypeId,
-                {
-                 ...item
-                },
-              ]),
-          ).values(),
-        )
-        // ✅ 默认选中第一个系统
-           formModel.type = typeList.value[0].systemTypeId
-          formActionType.setFieldsValue({
-            type: typeList.value[0].systemTypeId,
-          })
+      onChange:  async(unit: number)=>{
+        formModel.unit=unit;
 
-      },
-    }),
+        handleUnitChange(formModel.unit,formActionType)
+      }
+    })
   },
 
   {
@@ -496,28 +485,12 @@ export const InstantForm: FormSchema[] = [
         value: type.systemTypeId,
         label: type.systemTypeName,
       })),
-      onChange:  (type: number) => {
-        alert("系统改变事件")
-        // ⭐ 根据 unitId 和 system_type_id 从 selectList 计算系统下拉
-        systemList.value = Array.from(
-          new Map(
-            selectList
-              .filter(item => item.systemTypeId === type && item.unitId === formModel.unit)
-              .map(item => [
-                item.systemId,
-                {
-                  ...item
-                },
-              ]),
-          ).values(),
-        )
-        // ✅ 默认选中第一个系统
-          formModel.system = systemList.value[0].systemId
-          formActionType.setFieldsValue({
-           system: systemList.value[0].systemId,
-          })
-      },
-    }),
+      onChange: (type: number)=>{
+
+        formModel.type=type;
+        handleTypeChange(formModel.unit,formModel.type,formActionType)
+      }
+    })
   },
 
   {
@@ -533,33 +506,10 @@ export const InstantForm: FormSchema[] = [
         value: sys.systemId,
         label: sys.systemName,
       })),
-      onChange:  (system: number) => {
-        alert("子系统改变事件")
-        console.log(111,system)
-        console.log(selectList)
-        console.log(system)
-
-        // ⭐ 根据 unitId 从 selectList 计算系统下拉
-        mpList.value = Array.from(
-          new Map(
-            selectList
-              .filter(item => item.systemId === system)
-              .map(item => [
-                item.mpId,
-                {
-                  ...item
-                },
-              ]),
-          ).values(),
-        )
-        console.log(mpList.value)
-        // ✅ 默认选中第一个系统
-        formModel.mpId = mpList.value[0].mpId
-        formActionType.setFieldsValue({
-            mpId: mpList.value[0].mpId,
-          })
-
-      },
+      onChange: (system: number)=>{
+        formModel.system=system;
+        handleSystemChange(formModel.system,formActionType)
+      }
     })
   },
   {
@@ -575,15 +525,9 @@ export const InstantForm: FormSchema[] = [
         value: instant.mpId,
         label: instant.mpName,
       })),
-      onChange: async (mpId: number) => {
-        // alert("模型实例改变事件")
-        const res = await getInstantPoint(mpId)
-        console.log(res)
-        pointList.value=res;
-        formModel.inputName = res[0]?.inputName
-        formActionType.setFieldsValue({
-          inputName: res[0]?.inputName,
-        })
+      onChange: (mpId: number)=>{
+        formModel.mpId=mpId;
+        handleMpChange(formModel.mpId,formActionType)
       }
     })},
   {
@@ -595,12 +539,87 @@ export const InstantForm: FormSchema[] = [
     componentProps: () => ({
       placeholder: '预警点号',
       allowClear: false,
+      // options:pointList.value.map(point => ({
+      //   value: point.inputName,
+      //   label: point.inputName,
+      // })),
       options:pointList.value.map(point => ({
         value: point.inputName,
-        label: point.inputName,
-      })),
+        label: h('span', {}, [
+        point.inputName,
+        h(
+          Tag,
+          {
+            color: point.type === true ? 'green' : 'red',
+            style: { marginLeft: '6px' },
+          },
+          () => (point.type === true ? '输出' : '输入')
+        ),
+      ]),
+    })),
       onChange: async (inputName: string) => {
         // alert("预警点号改变事件")
+        formModel.inputName=inputName;
       }
     })}
 ]
+
+
+const handleUnitChange = (unit: number,formActionType: FormActionType) => {
+  // formModel.unit = unit
+
+  typeList.value = Array.from(
+    new Map(
+      selectList
+        .filter(i => i.unitId === unit)
+        .map(i => [i.systemTypeId, i]),
+    ).values(),
+  )
+  formActionType.setFieldsValue({
+    type: typeList.value[0].systemTypeId
+  })
+  if (typeList.value.length) {
+    handleTypeChange(unit,typeList.value[0].systemTypeId,formActionType)
+  }
+}
+
+const handleTypeChange = (unit:number,type: number,formActionType: FormActionType) => {
+
+  systemList.value = Array.from(
+    new Map(
+      selectList
+        .filter(i => i.unitId === unit && i.systemTypeId === type)
+        .map(i => [i.systemId, i]),
+    ).values(),
+  )
+  formActionType.setFieldsValue({
+    system: systemList.value[0].systemId
+  })
+  if (systemList.value.length) {
+    handleSystemChange(systemList.value[0].systemId,formActionType)
+  }
+}
+const handleSystemChange = (system: number,formActionType: FormActionType) => {
+
+  mpList.value = Array.from(
+    new Map(
+      selectList
+        .filter(i => i.systemId === system)
+        .map(i => [i.mpId, i]),
+    ).values(),
+  )
+  formActionType.setFieldsValue({
+    mpId: mpList.value[0].mpId
+  })
+  if (mpList.value.length) {
+    handleMpChange(mpList.value[0].mpId,formActionType)
+  }
+}
+const handleMpChange = async (mpId: number,formActionType: FormActionType) => {
+  const res = await getInstantPoint(mpId)
+  pointList.value = res
+  formActionType.setFieldsValue({
+    inputName: pointList.value[0].inputName
+  })
+}
+