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, superiorID?: string }
}
export class StateManager {
	vueFlow: any
	nodes: any
	nodes_: any
	edges: any
	zoom: any
	tool: any
	cursor: any
	nodesDraggable: any
	panOnDrag: any

	// 管理器	
	eventManager: any
	flowManager: any
	nodeManager: any
	toolManager: any
	// 设置管理器
	setManager(options) {
		options.eventManager && (this.eventManager = options.eventManager)
		options.flowManager && (this.flowManager = options.flowManager)
		options.nodeManager && (this.nodeManager = options.nodeManager)
		options.toolManager && (this.toolManager = options.toolManager)
	}
	constructor(options) {
		this.vueFlow = options.vueFlow
		this.zoom = ref(1)
		this.tool = ref("")
		this.cursor = ref("")
		this.nodesDraggable = ref(false)
		this.panOnDrag = ref(false)
		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;
				// }
				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 (!isSuperior && isSubord) {// 没有上级 有下级
					obj.type = NODE_TYPE.INPUT;
				} else if (isSuperior && isSubord) {// 有上级 有下级
					obj.type = NODE_TYPE.SECONDARY;
				} else if (isSuperior && !isSubord) {// 有上级 没有下级
					obj.type = NODE_TYPE.OUTPUT;
				} else {// 其他情况-没有上级 没有下级
					obj.type = NODE_TYPE.ALONE;
				}
				return obj
			})
		})

		this.edges = computed(() => {
			const arr = []
			this.nodes.value.forEach((node, index) => {
				// 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
					arr.push({
						id: `el-${source}-${target}`,
						source: source,
						target: target,
						selectable: false,
						type: 'default'
					})
				}
			})
			return arr
		})

	}
	/** 添加节点 */
	addNode(node: NodesItem) {
		this.nodes.value.push(node)
	}
	/** 删除节点 */
	deleteNode(id: string) {
		this.nodes.value = this.nodes.value.filter((node: NodesItem) => node.id !== id)
	}
	/** 获取节点 */
	getNodeById(id: string) {
		return this.nodes.value.find((node: NodesItem) => node.id === id)
	}
	/** 获取下级节点 */
	getSubordNodeByID(id: string) {
		return this.nodes.value.find((node: NodesItem) => node.data.superiorID === id)
	}
	getLastNode() {
		return this.nodes.value[this.nodes.value.length - 1]
	}
	/** 设置工具 */
	setTool(tool: string) {
		this.tool.value = tool
	}

	/** 设置光标 */
	setCursor(v: string) { this.cursor.value = v }
	/** 设置节点是否可拖动 */
	setNodesDraggable(v: boolean) { this.nodesDraggable.value = v }
	/** 设置是否可以平移画布 */
	setPanOnDrag(v: boolean) { this.panOnDrag.value = v }
	/** 获取节点最大zIndex值 */
	getMaxZIndex() {
		return this.nodes.value.reduce((max, node) => Math.max(max, node.zIndex), 0)
	}
	/** 获取节点最小zIndex值 */
	getMinZIndex() {
		return this.nodes.value.reduce((min, node) => Math.min(min, node.zIndex), 0)
	}
}