111

src/components/Canvas/FlowCanvas/components/node-el.vue

@@ -1,5 +1,5 @@
 <template>
-	<div class="node" :class="{ center: posCenter, mask: mask }">
+	<div class="node-el" :class="{ center: posCenter, mask: mask }">
 		<Handle
 			v-for="handle in handles[type] || []"
 			:key="handle.id"
@@ -19,8 +19,7 @@
 </template>
 <script lang="ts" setup>
 	import { Handle, Position } from '@vue-flow/core'
-	import { NODE_TYPE } from '../tools/index.d'
-	import { NODE_DATATYPE, NODE_DATATIER } from '../tools/index.d'
+	import { NODE_DATATYPE, NODE_DATATIER, NODE_TYPE } from '../tools/index.d'
 	import { computed, ref, inject } from 'vue'
 	const handles = ref({
 		[NODE_TYPE.INPUT]: [{ id: 'Right', type: 'source', position: Position.Right }],
@@ -54,7 +53,10 @@
 	const isSubord = computed(() => nodes.value.some((v) => v.data.superiorID === props.node.id))
 	const tier = computed(() => Number(props.node?.data?.tier || 0))
 	const isReturned = computed(() => {
-		return props.node.data.type == NODE_DATATYPE.RESULT_IMAGE && props.node.data.data.imageProcessTasks[0].status == 'RETURNED'
+		return (
+			props.node.data.type == NODE_DATATYPE.RESULT_IMAGE &&
+			props.node.data.data.imageProcessTasks[0].status == 'RETURNED'
+		)
 	})
 	const isAdd = computed(
 		() =>
@@ -66,7 +68,9 @@
 	const onAdd = () => {
 		const tier_ = tier.value + 1
 		// 从data中获取originalImage
-		let nodeData = props.node?.data?.data.imageProcessTasks.filter((v) => v.taskId === props.node?.data?.data.selectTaskId)
+		let nodeData = props.node?.data?.data.imageProcessTasks.filter(
+			(v) => v.taskId === props.node?.data?.data.selectTaskId
+		)
 		const originalImage = nodeData[0]?.url
 		if (!originalImage) console.log('originalImage 找不到原始图片')
 		props.stateManager.nodeManager.createCardsSelect({
@@ -80,7 +84,7 @@
 </script>
 
 <style lang="less" scoped>
-	.node {
+	.node-el {
 		position: relative;
 		--top: 50px;
 		&.mask *,

src/components/Canvas/FlowCanvas/flow-canvas.vue

@@ -17,7 +17,7 @@
 			:style="{ '--custom-cursor': stateManager.cursor.value }"
 		>
 			<template v-for="v in nodeTypes" :key="v" #[`node-${v}`]="node">
-				<node
+				<node-el
 					:type="v"
 					:stateManager="stateManager"
 					:node="node"
@@ -41,7 +41,7 @@
 						@bring-to-font="bringToFont(node.id)"
 						@send-to-back="sendToBack(node.id)"
 					/>
-				</node>
+				</node-el>
 			</template>
 		</VueFlow>
 	</div>
@@ -73,13 +73,13 @@
 	// 工具
 	import threeModel from './components/tools/threeModel/index.vue'
 	// 节点
-	import node from './components/node.vue'
+	import nodeEl from './components/node-el.vue'
 	import resultImage from './components/nodes/result-image.vue'
 	import card from './components/nodes/cards/index.vue'
 	import text from './components/nodes/text.vue'
 
 	const components = {
-		[NODE_COMPONENT.RESULT_IMAGE]: text,
+		[NODE_COMPONENT.RESULT_IMAGE]: resultImage,
 		[NODE_COMPONENT.CARD]: card,
 		[NODE_COMPONENT.TEXT]: text
 	}
@@ -236,15 +236,14 @@
 								id: props.config.imgId,
 								url: props.config.url,
 								status: 'RETURNED',
-								taskId: timestamp + '',
-							},
+								taskId: timestamp + ''
+							}
 						],
-						selectTaskId: timestamp + '',
+						selectTaskId: timestamp + ''
 					}
 				}
 			})
 		}
-		
 	})
 	onBeforeMount(() => {
 		stateManager.dispose()