From 0926c3710e6c5df5ebc33cd897f1420bdd2d2833 Mon Sep 17 00:00:00 2001 From: wang-xh Date: Sat, 1 Nov 2025 15:38:16 +0800 Subject: [PATCH] =?UTF-8?q?feauture:=20=E6=94=AF=E6=8C=81=E5=8A=A8?= =?UTF-8?q?=E6=80=81=E7=BB=84=E4=BB=B6=E7=9A=84=E5=A4=8D=E6=9D=82=E7=B1=BB?= =?UTF-8?q?=E5=B1=9E=E6=80=A7=E9=85=8D=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- .../use-property-config-resolver.ts | 2 +- .../function-call-node.component.tsx | 10 +++++ .../function-call-node.property-config.ts | 43 +++++++++++++++++++ .../components/flow-node-item.component.tsx | 6 ++- .../flow-canvas/src/flow-canvas.component.tsx | 22 ++++++---- packages/ui-vue/index.html | 8 ++++ .../node-dist/function-call-node.systemjs.js | 4 +- .../function-call-node/function-call-node.js | 4 +- .../assets/flow-canvas/property-config.json | 1 - 10 files changed, 85 insertions(+), 17 deletions(-) create mode 100644 packages/ui-vue/components/flow-canvas-node/src/function-call-node/property-config/function-call-node.property-config.ts diff --git a/package.json b/package.json index 3369ab02ae..ea14f41d7a 100644 --- a/package.json +++ b/package.json @@ -84,7 +84,7 @@ "fs-extra": "^11.2.0", "happy-dom": "^14.12.0", "highlight.js": "^11.9.0", - "husky": "^8.0.0", + "husky": "^9.1.7", "inquirer": "^9.1.1", "intersection-observer": "^0.12.2", "jest": "^29.0.0", diff --git a/packages/ui-vue/components/dynamic-resolver/src/resolver/property-config/use-property-config-resolver.ts b/packages/ui-vue/components/dynamic-resolver/src/resolver/property-config/use-property-config-resolver.ts index 06c4f9fb6e..4534ffc14f 100644 --- a/packages/ui-vue/components/dynamic-resolver/src/resolver/property-config/use-property-config-resolver.ts +++ b/packages/ui-vue/components/dynamic-resolver/src/resolver/property-config/use-property-config-resolver.ts @@ -218,7 +218,7 @@ export function usePropertyConfigResolver(propertyConfigSchemaMap: Record ); } + /** + * 获取属性配置 + */ + function getPropConfig() { + const componentProp = new FunctionCallNodeProperty(); + + return componentProp.getPropertyConfig(schema.value); + } + context.expose({ getPropConfig }); return () => { return ( diff --git a/packages/ui-vue/components/flow-canvas-node/src/function-call-node/property-config/function-call-node.property-config.ts b/packages/ui-vue/components/flow-canvas-node/src/function-call-node/property-config/function-call-node.property-config.ts new file mode 100644 index 0000000000..ef39b0e5df --- /dev/null +++ b/packages/ui-vue/components/flow-canvas-node/src/function-call-node/property-config/function-call-node.property-config.ts @@ -0,0 +1,43 @@ + +export class FunctionCallNodeProperty { + private propertyConfig = { + type: 'object', + categories: {} + }; + + public getPropertyConfig(propertyData: any) { + + // 基本信息 + this.propertyConfig.categories['basic'] = this.getBasicPropConfig(propertyData); + + return this.propertyConfig; + } + getBasicPropConfig(propertyData: any): any { + return { + description: 'Basic Information', + title: '基本信息', + properties: { + id: { + description: '组件标识', + title: '标识', + type: 'string', + readonly: true + }, + type: { + description: '组件类型', + title: '控件类型', + type: 'select', + editor: { + type: 'combo-list', + textField: 'name', + valueField: 'value', + idField: 'value', + editable: false, + data: [{ value: propertyData.type, name: '执行函数节点' }] + } + } + } + }; + + } +} \ No newline at end of file diff --git a/packages/ui-vue/components/flow-canvas/src/components/flow-node-item.component.tsx b/packages/ui-vue/components/flow-canvas/src/components/flow-node-item.component.tsx index bce4f92ac0..340bb2cb3f 100644 --- a/packages/ui-vue/components/flow-canvas/src/components/flow-node-item.component.tsx +++ b/packages/ui-vue/components/flow-canvas/src/components/flow-node-item.component.tsx @@ -1,4 +1,4 @@ -import { computed, defineComponent, inject, ref, watch } from "vue"; +import { Component, computed, defineComponent, inject, Ref, ref, watch } from "vue"; import { FlowNodeItemProps, flowNodeItemProps } from "./flow-node-item.props"; import { UseBezierCurve, UseConnections, UseDrawingBezier, UseSelection } from "../composition/types"; import { getNodeComponentByType } from "./node-map"; @@ -13,6 +13,7 @@ export default defineComponent({ const id = ref(props.node?.id || props.id); const schema = ref(props.modelValue || props.node); // const isSelected = ref(false); + const componentInstance = ref() as Ref; const nodeX = computed(() => props.node?.position?.x || props.x || 0); const nodeY = computed(() => props.node?.position?.y || props.y || 0); @@ -185,6 +186,7 @@ export default defineComponent({ const NodeContentComponent: any = getNodeComponentByType(nodeTypeValue); return { @@ -213,7 +215,7 @@ export default defineComponent({ onOutputMouseDown: handleOutputPortMouseDown }); } - + context.expose({ componentInstance, schema }); return () => { return (
{ useNodeSchemaComposition.loadNodeSchema(); @@ -424,10 +425,13 @@ export default defineComponent({ }; }; - function openPropertyPanel(schemaType: string, schemaValue: any) { + function openPropertyPanel(schemaValue: any, flowNodeRef: Ref) { + const { type: schemaType } = schemaValue; + propertyPanelRef.value?.updateDesignerItem(flowNodeRef.value.componentInstance, flowNodeRef.value.schema); + propertyName.value = schemaType; focusingSchema.value = schemaValue; - const propertyCategories = getPropertyConfigBySchemaForDesigner(schemaValue, schemaService as SchemaService, null, ''); + const propertyCategories = getPropertyConfigBySchemaForDesigner(schemaValue, schemaService as SchemaService, flowNodeRef.value.componentInstance, flowNodeRef.value.schema.id); propertyConfig.value = propertyCategories; const shouldShowPropertyPanel = propertyCategories.length > 0; showPropertyPanel.value = shouldShowPropertyPanel; @@ -440,8 +444,8 @@ export default defineComponent({ showPropertyPanel.value = false; } - function handleNodeMouseDown(nodeId: string, schemaType: string, schemaValue: any) { - openPropertyPanel(schemaType, schemaValue); + function handleNodeMouseDown(schemaValue: any, flowNodeRef: Ref) { + openPropertyPanel(schemaValue, flowNodeRef); } const handleNodeClick = (nodeId: string, schemaType: string, schemaValue: any): void => { @@ -610,10 +614,11 @@ export default defineComponent({ .map((flowNodeItem: Record) => { const nodePosition = schema.value.diagram?.nodes?.find((node: any) => node.id === flowNodeItem.id); const position = nodePosition?.position || { x: 0, y: 0 }; - // const isSelected = selectedNodeId.value === flowNodeItem.id; + const flowNodeRef = ref(); return ( handleNodeClick(flowNodeItem.id, flowNodeItem.type, flowNodeItem)} onContextmenu={(event: MouseEvent) => handleNodeContextMenu(flowNodeItem.id, event)} - onMousedown={() => handleNodeMouseDown(flowNodeItem.id, flowNodeItem.type, flowNodeItem)} + onMousedown={() => handleNodeMouseDown(flowNodeItem, flowNodeRef)} onNodeDrag={handleNodeDrag} /> ); @@ -663,6 +668,7 @@ export default defineComponent({ position="right" >
+ + diff --git a/packages/ui-vue/node-dist/function-call-node.systemjs.js b/packages/ui-vue/node-dist/function-call-node.systemjs.js index be2a4f4548..c399f27188 100644 --- a/packages/ui-vue/node-dist/function-call-node.systemjs.js +++ b/packages/ui-vue/node-dist/function-call-node.systemjs.js @@ -1,2 +1,2 @@ -/* Last Update Time: 2025-09-25 19:05:44 */ -System.register(["vue"],function(e,t){"use strict";let n,o,d,i;return{setters:[e=>{n=e.defineComponent,o=e.ref,d=e.createVNode,i=e.createTextVNode}],execute:function(){const t=e("functionCallNodeProps",{id:{type:String,default:""},type:{type:String,default:""},modelValue:{type:Object},x:{type:Number,default:0},y:{type:Number,default:0}}),l=e("FFunctionCallNode",n({name:"FFunctionCallNode",props:t,emits:["connection-start","node-select","node-mouse-down"],setup(e,t){o(e.id),o(e.modelValue);const n=o(!1),l=o=>{o.stopPropagation(),n.value=!n.value,t.emit("node-select",{nodeId:e.id,selected:n.value})};function s(){t.emit("node-mouse-down")}return()=>d("div",{class:"if-node-content "+(n.value?"selected":""),onMousedown:s,onClick:l},[d("div",{class:"if-node-header"},[d("div",{class:"if-node-icon"},[i("fx")]),d("div",{class:"if-node-title"},[i("执行函数")])])])}}));l.install=e=>{e.component(l.name,l)},l.register=(e,t,n,o)=>{e["function-call-node"]=l},l.registerDesigner=(e,t,n)=>{e["function-call-node"]=l}}}}); +/*! Last Update Time: 2025-11-01 14:26:05 */ +var __defProp=Object.defineProperty,__defNormalProp=(e,t,o)=>t in e?__defProp(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,__publicField=(e,t,o)=>(__defNormalProp(e,"symbol"!=typeof t?t+"":t,o),o);System.register(["vue"],function(e,t){"use strict";var o,i,n,r;return{setters:[e=>{o=e.defineComponent,i=e.ref,n=e.createVNode,r=e.createTextVNode}],execute:function(){const t=e("functionCallNodeProps",{id:{type:String,default:""},type:{type:String,default:""},modelValue:{type:Object},x:{type:Number,default:0},y:{type:Number,default:0}});class l{constructor(){__publicField(this,"propertyConfig",{type:"object",categories:{}})}getPropertyConfig(e){return this.propertyConfig.categories.basic=this.getBasicPropConfig(e),this.propertyConfig}getBasicPropConfig(e){return{description:"Basic Information",title:"基本信息",properties:{id:{description:"组件标识",title:"标识",type:"string",readonly:!0},type:{description:"组件类型",title:"控件类型",type:"select",editor:{type:"combo-list",textField:"name",valueField:"value",idField:"value",editable:!1,data:[{value:e.type,name:"执行函数节点"}]}}}}}}const d=e("FFunctionCallNode",o({name:"FFunctionCallNode",props:t,emits:["connection-start","node-select","node-mouse-down"],setup(e,t){i(e.id);const o=i(e.modelValue),d=i(!1),s=o=>{o.stopPropagation(),d.value=!d.value,t.emit("node-select",{nodeId:e.id,selected:d.value})};function a(){t.emit("node-mouse-down")}return t.expose({getPropConfig:function(e){return(new l).getPropertyConfig(o.value)}}),()=>n("div",{class:"if-node-content "+(d.value?"selected":""),onMousedown:a,onClick:s},[n("div",{class:"if-node-header"},[n("div",{class:"if-node-icon"},[r("fx")]),n("div",{class:"if-node-title"},[r("执行函数")])])])}}));d.install=e=>{e.component(d.name,d)},d.register=(e,t,o,i)=>{e["function-call-node"]=d},d.registerDesigner=(e,t,o)=>{e["function-call-node"]=d}}}}); diff --git a/packages/ui-vue/public/assets/flow-canvas/function-call-node/function-call-node.js b/packages/ui-vue/public/assets/flow-canvas/function-call-node/function-call-node.js index be2a4f4548..c399f27188 100644 --- a/packages/ui-vue/public/assets/flow-canvas/function-call-node/function-call-node.js +++ b/packages/ui-vue/public/assets/flow-canvas/function-call-node/function-call-node.js @@ -1,2 +1,2 @@ -/* Last Update Time: 2025-09-25 19:05:44 */ -System.register(["vue"],function(e,t){"use strict";let n,o,d,i;return{setters:[e=>{n=e.defineComponent,o=e.ref,d=e.createVNode,i=e.createTextVNode}],execute:function(){const t=e("functionCallNodeProps",{id:{type:String,default:""},type:{type:String,default:""},modelValue:{type:Object},x:{type:Number,default:0},y:{type:Number,default:0}}),l=e("FFunctionCallNode",n({name:"FFunctionCallNode",props:t,emits:["connection-start","node-select","node-mouse-down"],setup(e,t){o(e.id),o(e.modelValue);const n=o(!1),l=o=>{o.stopPropagation(),n.value=!n.value,t.emit("node-select",{nodeId:e.id,selected:n.value})};function s(){t.emit("node-mouse-down")}return()=>d("div",{class:"if-node-content "+(n.value?"selected":""),onMousedown:s,onClick:l},[d("div",{class:"if-node-header"},[d("div",{class:"if-node-icon"},[i("fx")]),d("div",{class:"if-node-title"},[i("执行函数")])])])}}));l.install=e=>{e.component(l.name,l)},l.register=(e,t,n,o)=>{e["function-call-node"]=l},l.registerDesigner=(e,t,n)=>{e["function-call-node"]=l}}}}); +/*! Last Update Time: 2025-11-01 14:26:05 */ +var __defProp=Object.defineProperty,__defNormalProp=(e,t,o)=>t in e?__defProp(e,t,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[t]=o,__publicField=(e,t,o)=>(__defNormalProp(e,"symbol"!=typeof t?t+"":t,o),o);System.register(["vue"],function(e,t){"use strict";var o,i,n,r;return{setters:[e=>{o=e.defineComponent,i=e.ref,n=e.createVNode,r=e.createTextVNode}],execute:function(){const t=e("functionCallNodeProps",{id:{type:String,default:""},type:{type:String,default:""},modelValue:{type:Object},x:{type:Number,default:0},y:{type:Number,default:0}});class l{constructor(){__publicField(this,"propertyConfig",{type:"object",categories:{}})}getPropertyConfig(e){return this.propertyConfig.categories.basic=this.getBasicPropConfig(e),this.propertyConfig}getBasicPropConfig(e){return{description:"Basic Information",title:"基本信息",properties:{id:{description:"组件标识",title:"标识",type:"string",readonly:!0},type:{description:"组件类型",title:"控件类型",type:"select",editor:{type:"combo-list",textField:"name",valueField:"value",idField:"value",editable:!1,data:[{value:e.type,name:"执行函数节点"}]}}}}}}const d=e("FFunctionCallNode",o({name:"FFunctionCallNode",props:t,emits:["connection-start","node-select","node-mouse-down"],setup(e,t){i(e.id);const o=i(e.modelValue),d=i(!1),s=o=>{o.stopPropagation(),d.value=!d.value,t.emit("node-select",{nodeId:e.id,selected:d.value})};function a(){t.emit("node-mouse-down")}return t.expose({getPropConfig:function(e){return(new l).getPropertyConfig(o.value)}}),()=>n("div",{class:"if-node-content "+(d.value?"selected":""),onMousedown:a,onClick:s},[n("div",{class:"if-node-header"},[n("div",{class:"if-node-icon"},[r("fx")]),n("div",{class:"if-node-title"},[r("执行函数")])])])}}));d.install=e=>{e.component(d.name,d)},d.register=(e,t,o,i)=>{e["function-call-node"]=d},d.registerDesigner=(e,t,o)=>{e["function-call-node"]=d}}}}); diff --git a/packages/ui-vue/public/assets/flow-canvas/property-config.json b/packages/ui-vue/public/assets/flow-canvas/property-config.json index ea66f1c88a..124efacfcf 100644 --- a/packages/ui-vue/public/assets/flow-canvas/property-config.json +++ b/packages/ui-vue/public/assets/flow-canvas/property-config.json @@ -1,4 +1,3 @@ { - "function-call-node": "/assets/flow-canvas/function-call-node/function-call-node.property-config.json", "if-node": "/assets/flow-canvas/if-node/if-node.property-config.json" } \ No newline at end of file -- Gitee