UPDATE: VERSION-20260317

2026-03-17 00:36:16 +08:00
parent 974f403784
commit 6dd4392f0c
3 changed files with 114 additions and 97 deletions
--- a/modeler/src/views/decision/rule/PlatformSelect.vue
+++ b/modeler/src/views/decision/rule/PlatformSelect.vue
@@ -20,10 +20,10 @@
      style="width:280px;"
      v-model:value="selectedComponentId"
      :placeholder="'请选择组件'"
-      :disabled="!selectedPlatformId"
+      :disabled="!selectedPlatform"
    >
      <a-select-option
-        v-for="item in filteredComponents"
+        v-for="item in selectedPlatformComponents"
        :key="item.id"
        :value="item.id"
      >
@@ -44,124 +44,124 @@ export default defineComponent({
      type: String,
      default: '',
    },
-    platform: {
-      type: [Object,null] as PropType<Platform | null>,
+    payload: {
+      type: [Object,null] as PropType<PlatformComponentPayload | null>,
      required: false,
-      default: () => ({}), // 设置默认空对象，避免undefined
-    },
-    component: {
-      type: [Object, null] as PropType<PlatformComponent | null>,
-      required: false,
-      default: () => ({}), // 设置默认空对象，避免undefined
+      default: ({
+        platform: null,
+        component: null,
+      }),
    },
  },
  emits: [
-    // 只保留统一的update事件
-    'update',
+    'change',
  ],
  setup(props, { emit }) {
-    // 平台列表
    const platforms = ref<PlatformWithComponents[]>([]);
-    // 选中的平台ID（兼容props初始值）
-    const selectedPlatformId = ref<number | undefined>(props.platform?.id);
-    // 选中的组件ID（兼容props初始值）
-    const selectedComponentId = ref<number | undefined>(props.component?.id);
-
-    // 平台映射表
    const platformMapping = ref<Map<number, PlatformWithComponents>>(new Map());
+    const componentsMapping = ref<Map<number, PlatformComponent>>(new Map());

-    // 计算属性：根据选中的平台过滤对应的组件列表
-    const filteredComponents = computed<PlatformComponent[]>(() => {
-      if (!selectedPlatformId.value) return [];
-      const currentPlatform = platformMapping.value.get(selectedPlatformId.value);
-      return currentPlatform?.components ?? [];
-    });
+    const selectedPlatformComponents = ref<PlatformComponent[]>([])

-    // 封装统一的update事件触发函数
-    const triggerUpdateEvent = () => {
-      // 获取当前选中的平台对象
-      const selectedPlatform = selectedPlatformId.value
-        ? platformMapping.value.get(selectedPlatformId.value) || ({} as Platform)
-        : ({} as Platform);
+    const selectedPlatform = ref<PlatformWithComponents|null>(null);
+    const selectedPlatformId = ref<number|null>(null);

-      // 获取当前选中的组件对象
-      const selectedComponent = selectedComponentId.value
-        ? filteredComponents.value.find(item => item.id === selectedComponentId.value) || ({} as PlatformComponent)
-        : ({} as PlatformComponent);
+    const selectedComponent = ref<PlatformComponent|null>(null);
+    const selectedComponentId = ref<number|null>(null);

-      // 触发统一的update事件，传递平台和组件信息
-      emit('update', {
-        platform: {
-          id: selectedPlatform.id,
-          name: selectedPlatform.name,
-          description: selectedPlatform.description,
-        },
-        component: selectedComponent,
-      } as PlatformComponentPayload);
-    };
-
-    // 加载平台和组件数据
    const load = () => {
      platforms.value = [];
      platformMapping.value.clear();
+      componentsMapping.value.clear();

      findAllPlatformWithComponents().then(re => {
        platforms.value = re.data ?? [];
-
-        // 构建平台映射表
        platforms.value.forEach(platform => {
          platformMapping.value.set(platform.id, platform);
-        });
-
-        // 数据加载完成后，若有初始平台值，自动匹配组件列表
-        if (props.platform?.id) {
-          selectedPlatformId.value = props.platform.id;
-          // 若有初始组件值，校验是否属于当前平台
-          if (props.component?.id) {
-            const currentComponents = filteredComponents.value;
-            const hasComponent = currentComponents.some(item => item.id === Number(props.component?.id ?? 0));
-            // 若初始组件不属于当前平台，清空组件选中值
-            if (!hasComponent) {
-              selectedComponentId.value = undefined;
-            }
+          if(platform.components){
+            platform.components.forEach(comp=> {
+              componentsMapping.value.set(comp.id, comp)
+            })
          }
-        }
-        // 数据加载完成后触发一次update事件
-        triggerUpdateEvent();
+        });
      }).catch(err => {
        console.error('加载平台组件数据失败：', err);
      });
    };

-    // 监听平台选择变化
-    watch(selectedPlatformId, () => {
-      // 平台变更时，清空组件选中值
-      selectedComponentId.value = undefined;
-      // 触发统一的update事件
-      triggerUpdateEvent();
-    });
+    const triggerChange = ()=> {
+      emit('change', {
+        platform: selectedPlatform.value ? {
+          id: selectedPlatform.value?.id,
+          name: selectedPlatform.value?.name,
+          description: selectedPlatform.value?.description,
+        } : null,
+        component: selectedComponent.value ? {
+          id: selectedComponent.value.id,
+          name: selectedComponent.value.name,
+          description: selectedComponent.value.description,
+          num: selectedComponent.value.num,
+          platformId: selectedComponent.value.platformId,
+          type: selectedComponent.value.type,
+        } : null,
+      })
+    }

-    // 监听组件选择变化
-    watch(selectedComponentId, () => {
-      // 触发统一的update事件
-      triggerUpdateEvent();
-    });
+    watch(()=> props.payload, (n: PlatformComponentPayload | null | undefined)=> {
+      if(n && n.platform){
+        selectedPlatform.value = platformMapping.value.get(n.platform?.id) ?? null;
+        selectedPlatformId.value = selectedPlatform.value?.id ?? null;
+        selectedPlatformComponents.value = selectedPlatform.value?.components ?? []
+      } else {
+        selectedPlatform.value = null;
+        selectedPlatformId.value = null;
+        selectedPlatformComponents.value = []
+      }

-    watch(() => props.platform?.id, (newVal) => {
-      selectedPlatformId.value = newVal;
-    }, { immediate: true }); // 立即执行，确保初始值同步
+      if(n && n.component){
+        selectedComponent.value = n.component;
+        selectedComponentId.value = selectedComponent.value?.id ?? null;
+      } else {
+        selectedComponent.value = null;
+        selectedComponentId.value = null;
+      }

-    watch(() => props.component?.id, (newVal) => {
-      selectedComponentId.value = newVal;
-    }, { immediate: true }); // 立即执行，确保初始值同步
+      console.error('watch',n)
+    }, {deep: true, immediate: true})
+
+
+    watch(()=> selectedPlatformId.value,(n: null | number)=> {
+      if(n && platformMapping.value.get(n)){
+        selectedPlatform.value = platformMapping.value.get(n) ?? null;
+        selectedPlatformComponents.value = selectedPlatform.value?.components ?? []
+      } else {
+        selectedPlatform.value = null;
+        selectedPlatformComponents.value = []
+      }
+      selectedComponentId.value = null;
+
+      triggerChange();
+    })
+
+    watch(()=> selectedComponentId.value,(n: null | number)=> {
+      if(n && componentsMapping.value.get(n)){
+        selectedComponent.value = componentsMapping.value.get(n) ?? null;
+      } else {
+        selectedComponent.value = null;
+      }
+
+      triggerChange();
+    })

    onMounted(() => load());

    return {
      platforms,
+      selectedPlatformComponents,
+      selectedPlatform,
      selectedPlatformId,
+      selectedComponent,
      selectedComponentId,
-      filteredComponents,
    };
  },
 });
--- a/modeler/src/views/decision/rule/management.vue
+++ b/modeler/src/views/decision/rule/management.vue
@@ -83,8 +83,8 @@
                      <div class="ks-sidebar-list-param-item" v-for="(item,index) in selectedFireRule.conditionsArray">
                        <a-row :gutter="15">
                          <a-col :span="21">
-                            <PlatformSelect @update="(payload: PlatformComponentPayload)=> handleUpdateCondition(payload, index)"
-                                            :platform="item.platform" :component="item.component"/>
+                            <PlatformSelect @change="(payload: PlatformComponentPayload)=> handleUpdateCondition(payload, index)"
+                                            :payload="item"/>
                          </a-col>
                          <a-col :span="3">
                            <a-space class="ks-sidebar-list-param-actions">
@@ -108,8 +108,8 @@
                      <div class="ks-sidebar-list-param-item" v-for="(item,index) in selectedFireRule.actionsArray">
                        <a-row :gutter="15">
                          <a-col :span="21">
-                            <PlatformSelect @update="(payload: PlatformComponentPayload)=> handleUpdateAction(payload, index)"
-                                            :platform="item.platform" :component="item.component"/>
+                            <PlatformSelect @change="(payload: PlatformComponentPayload)=> handleUpdateAction(payload, index)"
+                                            :payload="item"/>
                          </a-col>
                          <a-col :span="3">
                            <a-space class="ks-sidebar-list-param-actions">
@@ -168,7 +168,7 @@
 </template>

 <script setup lang="ts">
-import { onMounted, ref } from 'vue';
+import { onMounted, ref, nextTick } from 'vue';
 import { type FormInstance, message } from 'ant-design-vue';
 import { MinusCircleOutlined, PlusCircleOutlined, PlusOutlined } from '@ant-design/icons-vue';
 import Layout from '../layout.vue';
@@ -222,11 +222,15 @@ const getSceneTypeName = (item: FireRule): string => {
 };

 const resolveItem = (item: FireRule) => {
-  let newItem = JSON.parse(JSON.stringify(item)) as FireRule;
-  try{
-    newItem.conditionsArray = JSON.parse(newItem.conditions as string);
-  } catch(e: any){
+  let newItem: FireRule = JSON.parse(JSON.stringify(item)) as FireRule;
+  if (typeof item.conditions === 'string') {
+    try{
+      newItem.conditionsArray = JSON.parse(item.conditions as string);
+    } catch(e: any){
+      newItem.conditionsArray = []
+    }
  }
+
  if(!newItem.conditionsArray) {
    newItem.conditionsArray = []
  }
@@ -237,10 +241,14 @@ const resolveItem = (item: FireRule) => {
    })
  }

-  try{
-    newItem.actionsArray = JSON.parse(newItem.actions as string);
-  } catch(e: any){
+  if (typeof item.actions === 'string') {
+    try{
+      newItem.actionsArray = JSON.parse(item.actions as string);
+    } catch(e: any){
+      newItem.actionsArray = []
+    }
  }
+
  if(!newItem.actionsArray){
    newItem.actionsArray = []
  }
@@ -250,6 +258,7 @@ const resolveItem = (item: FireRule) => {
      component: null,
    })
  }
+
  return newItem;
 };

@@ -276,8 +285,12 @@ const handleCreate = () => {
 };

 const handleSelect = (item: FireRule) => {
-  selectedFireRule.value = resolveItem(item);
+  // 1. 先重置表单
  formRef.value?.resetFields();
+  // 2. 再赋值（使用nextTick确保DOM更新完成）
+  nextTick(() => {
+    selectedFireRule.value = resolveItem(item);
+  });
 };

 const handleDelete = () => {
@@ -368,6 +381,7 @@ const handleAddAction = (_index: number)=> {
 }

 const handleUpdateCondition = (payload: PlatformComponentPayload, index: number)=> {
+  console.error('handleUpdateCondition', payload)
  if(selectedFireRule.value && selectedFireRule.value.conditionsArray[index]){
    selectedFireRule.value.conditionsArray[index] = payload;
  }
--- a/modeler/src/views/decision/types/platform.ts
+++ b/modeler/src/views/decision/types/platform.ts
@@ -24,15 +24,18 @@ export interface PlatformComponent {
  type: NullableString,
  description: NullableString,
  platformId: number,
+  [key: string]: unknown;
 }

 export interface PlatformWithComponents extends Platform {
  components: PlatformComponent[],
+  [key: string]: unknown;
 }

 export interface PlatformComponentPayload {
  platform: Platform | null;
  component: PlatformComponent | null;
+  [key: string]: unknown;
 }

 export interface PlatformWithComponentsResponse extends ApiDataResponse<PlatformWithComponents[]> {