diff --git a/src/App.vue b/src/App.vue
index 3307b0f..2ab9232 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,12 +1,8 @@
-
+
@@ -35,19 +31,32 @@ const fontColor = computed(() => {
});
\ No newline at end of file
diff --git a/src/components/flow/nodes/BaseNode.js b/src/components/flow/nodes/BaseNode.js
index c778076..eae7b1a 100644
--- a/src/components/flow/nodes/BaseNode.js
+++ b/src/components/flow/nodes/BaseNode.js
@@ -1,27 +1,34 @@
-import { RectNode, RectNodeModel, h } from "@logicflow/core"
-import { getBytesLength } from '../util'
-
+import { RectNode, RectNodeModel, h } from "@logicflow/core";
+import { getBytesLength } from "../util";
class RedNodeModel extends RectNodeModel {
/**
* 初始化
*/
initNodeData(data) {
- super.initNodeData(data)
+ super.initNodeData(data);
this.width = 200;
this.height = 30;
this.radius = 5;
- this.text.x = this.x + 10;
- this.defaultFill = data.fill||'rgb(253, 208, 162)'
+ this.text.x = this.x + 10;
+ this.defaultFill = data.fill || "rgb(253, 208, 162)";
+
+ const startOnlyAsTarget={
+ message:"开始结点只能连接结束节点",
+ validate: (sourceNode, targetNode, sourceAnchor, targetAnchor) => {
+ return sourceAnchor.type !== targetAnchor.type;
+ },
+ };
+ this.sourceRules.push(startOnlyAsTarget);
}
- getData () {
- const data = super.getData()
- data.properties.ui = 'node-ai'
- return data
+ getData() {
+ const data = super.getData();
+ data.properties.ui = "node-ai";
+ return data;
}
-
+
updateText(val) {
- super.updateText(val)
+ super.updateText(val);
this.setAttributes();
}
/**
@@ -32,10 +39,10 @@ class RedNodeModel extends RectNodeModel {
const dataStyle = this.properties.style || {};
if (this.isSelected) {
style.strokeWidth = Number(dataStyle.borderWidth) || 2;
- style.stroke = dataStyle.borderColor || '#ff7f0e';
+ style.stroke = dataStyle.borderColor || "#ff7f0e";
} else {
style.strokeWidth = Number(dataStyle.borderWidth) || 1;
- style.stroke = dataStyle.borderColor || '#999';
+ style.stroke = dataStyle.borderColor || "#999";
}
style.fill = dataStyle.backgroundColor || this.defaultFill;
return style;
@@ -47,82 +54,85 @@ class RedNodeModel extends RectNodeModel {
const { x, y, id, width, height } = this;
const anchors = [
{
- x: x ,
- y: y+ height / 2,
+ x: x,
+ y: y - height / 2,
id: `${id}_right`,
- type: "right"
+ type: "start",
+ className: "anchors-start",
},
{
- x: x ,
- y: y- height / 2,
+ x: x,
+ y: y + height / 2,
id: `${id}_left`,
- type: "left"
- }
+ type: "end",
+ className: "anchors-end",
+ },
];
return anchors;
}
/**
- *
+ *
*/
getOutlineStyle() {
const style = super.getOutlineStyle();
- style.stroke = 'transparent';
- style.hover.stroke = 'transparent';
+ style.stroke = "transparent";
+ style.hover.stroke = "transparent";
return style;
}
- handleContextMenu(ev){
- debugger
+ handleContextMenu(ev) {
+ debugger;
}
}
class RedNode extends RectNode {
-
/**
* 1.1.7版本后支持在view中重写锚点形状。
* 重写锚点新增
*/
getAnchorShape(anchorData) {
- const { x, y, type } = anchorData;
- return h("rect", {
+ const { x, y, type, className } = anchorData;
+ if(type=="start"){
+ return h( "circle", {
+ cx: x - 0,
+ cy: y - 5,
+ r:6,
+ className: "custom-anchor " + className,
+ title:'开始'
+ });
+ }
+ return h( "rect", {
x: x - 5,
- y: y - 5,
+ y: y - 5,
width: 10,
height: 10,
- className: 'custom-anchor'
+ className: "custom-anchor " + className,
+ title:'结束'
});
- }
+ }
getShape() {
- const {
- text,
- x,
- y,
- width,
- height,
- radius
- } = this.props.model;
- const style = this.props.model.getNodeStyle()
+ const { text, x, y, width, height, radius } = this.props.model;
+ const style = this.props.model.getNodeStyle();
return h(
- 'g',
+ "g",
{
- className: 'lf-ai-node'
+ className: "lf-ai-node",
},
[
- h('rect', {
+ h("rect", {
...style,
x: x - width / 2,
y: y - height / 2,
width,
height,
rx: radius,
- ry: radius
- })
+ ry: radius,
+ }),
]
- )
+ );
}
}
-
export default {
- type: 'ai-node',
+ type: "ai-node",
model: RedNodeModel,
- view: RedNode
-}
+ view: RedNode,
+};
diff --git a/src/views/connection/detail.vue b/src/views/connection/detail.vue
index 2210650..cef905b 100644
--- a/src/views/connection/detail.vue
+++ b/src/views/connection/detail.vue
@@ -109,7 +109,7 @@
-
+
\ No newline at end of file
diff --git a/src/views/connection/nodePanel.vue b/src/views/connection/nodePanel.vue
index bb92e56..7021e8b 100644
--- a/src/views/connection/nodePanel.vue
+++ b/src/views/connection/nodePanel.vue
@@ -84,12 +84,12 @@ const list2 = reactive([
const updateNode = (nodes) => {
let nds = nodes.nodes.map(d => d.properties.node);
- list2.forEach(d => {
- d.show = nds.indexOf(d.id) == -1
- })
- list1.forEach(d => {
- d.show = nds.indexOf(d.id) == -1
- })
+ if(info.all){
+ info.all.forEach(d => {
+ d.show = nds.indexOf(d.id) == -1
+ });
+ }
+
}
const doEdit=(nd)=>{
@@ -98,6 +98,7 @@ const doEdit=(nd)=>{
if(tmps.length>0){
tmps[0].inputParams=nd.inputParams;
tmps[0].outputParams=nd.inputParams;
+ tmps[0].process=nd.process;
}
}
defineExpose({
@@ -111,8 +112,12 @@ const initData = () => {
it.show = true;
it.text = it.operator_name;
it.id = it.operator_id
- it.inputParams="";
- it.outputParams="";
+ it.inputParams={
+ a:10,b:20,c:30,d:40,e:50,
+ a2:10,b2:20,c2:30,d2:40,e2:50,
+ };
+ it.outputParams={};
+ it.process={};
return it;
});
info.all=tmps;