UPDATE: VERSION-20260317

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,
     };
   },
 });