77 lines
1.7 KiB
TypeScript
77 lines
1.7 KiB
TypeScript
import { ref, computed } from "vue";
|
|
import { NODE_TYPE } from '../tools/index.d'
|
|
|
|
export interface NodesItem {
|
|
id: string
|
|
type: string
|
|
class: string
|
|
position: { x: number, y: number }
|
|
data: { component: any, type: string }
|
|
}
|
|
export class StateManager {
|
|
vueFlow: any
|
|
nodes: any
|
|
nodes_: any
|
|
edges: any
|
|
zoom: any
|
|
// 管理器
|
|
eventManager: any
|
|
flowManager: any
|
|
nodeManager: any
|
|
// 设置管理器
|
|
setManager(options) {
|
|
options.eventManager && (this.eventManager = options.eventManager)
|
|
options.flowManager && (this.flowManager = options.flowManager)
|
|
options.nodeManager && (this.nodeManager = options.nodeManager)
|
|
}
|
|
constructor(options) {
|
|
this.vueFlow = options.vueFlow
|
|
this.nodes = ref<NodesItem[]>([]);
|
|
this.nodes_ = computed(() => {
|
|
return this.nodes.value.map((node, index) => {
|
|
const obj = {
|
|
...node,
|
|
}
|
|
if (index === 0) {
|
|
obj.type = NODE_TYPE.INPUT;
|
|
} else if (index === this.nodes.value.length - 1) {
|
|
obj.type = NODE_TYPE.OUTPUT;
|
|
} else {
|
|
obj.type = NODE_TYPE.SECONDARY;
|
|
}
|
|
return obj
|
|
})
|
|
})
|
|
|
|
this.edges = computed(() => {
|
|
const arr = []
|
|
this.nodes.value.forEach((node, index) => {
|
|
if (index < this.nodes.value.length - 1) {
|
|
const id = node.id
|
|
const target = this.nodes.value[index + 1].id
|
|
arr.push({
|
|
id: `el-${id}-${target}`,
|
|
source: id,
|
|
target: target,
|
|
type: 'default'
|
|
})
|
|
}
|
|
})
|
|
return arr
|
|
})
|
|
|
|
this.zoom = ref(1)
|
|
}
|
|
/** 添加节点 */
|
|
addNode(node: NodesItem) {
|
|
this.nodes.value.push(node)
|
|
}
|
|
/** 删除节点 */
|
|
deleteNode(id: string) {
|
|
this.nodes.value = this.nodes.value.filter((node: NodesItem) => node.id !== id)
|
|
}
|
|
getLastNode() {
|
|
return this.nodes.value[this.nodes.value.length - 1]
|
|
}
|
|
}
|