Files
FiDA_Front/src/components/Canvas/FlowCanvas/manager/StateManager.ts

101 lines
2.8 KiB
TypeScript
Raw Normal View History

2026-02-26 11:45:32 +08:00
import { ref, computed } from "vue";
2026-02-27 14:58:36 +08:00
import { NODE_TYPE } from '../tools/index.d'
2026-02-26 11:45:32 +08:00
2026-02-27 14:58:36 +08:00
export interface NodesItem {
id: string
type: string
class: string
position: { x: number, y: number }
2026-03-03 15:39:54 +08:00
data: { component: any, type: string, superiorID?: string }
2026-02-27 14:58:36 +08:00
}
2026-02-26 11:45:32 +08:00
export class StateManager {
vueFlow: any
nodes: any
2026-02-27 11:43:27 +08:00
nodes_: any
2026-02-26 11:45:32 +08:00
edges: any
zoom: any
2026-02-27 09:56:49 +08:00
// 管理器
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)
}
2026-02-26 11:45:32 +08:00
constructor(options) {
this.vueFlow = options.vueFlow
2026-03-03 11:10:43 +08:00
this.zoom = ref(1)
2026-02-27 14:58:36 +08:00
this.nodes = ref<NodesItem[]>([]);
2026-02-27 11:43:27 +08:00
this.nodes_ = computed(() => {
return this.nodes.value.map((node, index) => {
2026-03-03 15:39:54 +08:00
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;
// }
const superiorID = node.data.superiorID;
const isSuperior = this.nodes.value.some((v) => v.id === superiorID)
const isSubord = this.nodes.value.some((v) => v.data.superiorID === node.id)
if (!superiorID) {// 没有上级ID
2026-02-27 14:58:36 +08:00
obj.type = NODE_TYPE.INPUT;
2026-03-03 15:39:54 +08:00
} else if (isSuperior && isSubord) {// 有上级ID并找到下级
2026-02-27 14:58:36 +08:00
obj.type = NODE_TYPE.SECONDARY;
2026-03-03 15:39:54 +08:00
} else if (isSuperior && !isSubord) {// 有上级ID但未找到下级
obj.type = NODE_TYPE.OUTPUT;
} else {// 其他情况-有上级ID未找到上级
obj.type = NODE_TYPE.INPUT;
2026-02-27 11:43:27 +08:00
}
return obj
})
})
2026-02-26 11:45:32 +08:00
this.edges = computed(() => {
const arr = []
this.nodes.value.forEach((node, index) => {
2026-03-03 15:39:54 +08:00
// if (index < this.nodes.value.length - 1) {
// const source = node.id
// const target = this.nodes.value[index + 1].id
// arr.push({
// id: `el-${source}-${target}`,
// source: source,
// target: target,
// selectable: false,
// type: 'default'
// })
// }
const superiorID = node.data.superiorID;
const isSuperior = this.nodes.value.some((v) => v.id === superiorID)
if (superiorID && isSuperior) {
const source = node.data.superiorID
const target = node.id
2026-02-26 11:45:32 +08:00
arr.push({
2026-03-03 15:39:54 +08:00
id: `el-${source}-${target}`,
source: source,
2026-02-26 11:45:32 +08:00
target: target,
2026-03-02 16:24:32 +08:00
selectable: false,
2026-03-02 13:51:14 +08:00
type: 'default'
2026-02-26 11:45:32 +08:00
})
}
})
return arr
})
}
2026-02-27 14:58:36 +08:00
/** 添加节点 */
addNode(node: NodesItem) {
this.nodes.value.push(node)
}
/** 删除节点 */
deleteNode(id: string) {
this.nodes.value = this.nodes.value.filter((node: NodesItem) => node.id !== id)
}
2026-02-27 11:43:27 +08:00
getLastNode() {
return this.nodes.value[this.nodes.value.length - 1]
}
2026-02-26 11:45:32 +08:00
}