修复进本类型错误

app/components/Flow/Nodes/DelayNode.vue

@@ -1,7 +1,10 @@
 <template>
 	<div class="delay-node" :style="{ borderColor: node.data?.color || '#ff6b35' }">
 		<div class="node-header">
-			<ClockIcon class="node-icon" />
+			<svg class="node-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor">
+				<circle cx="12" cy="12" r="10" stroke-width="2" />
+				<path d="M12 6v6l4 2" stroke-width="2" stroke-linecap="round" />
+			</svg>
 			<span class="node-title">延时</span>
 		</div>
 		<div class="node-content">
@@ -24,7 +27,6 @@
 
 <script setup lang="ts">
 	import { Handle, Position } from "@vue-flow/core";
-	import { ClockIcon } from "lucide-vue-next";
 
 	const _props = defineProps<{
 		node: any

app/components/Flow/Nodes/LogNode.vue

@@ -1,7 +1,13 @@
 <template>
 	<div class="log-node" :style="{ borderColor: node.data?.color || '#10b981' }">
 		<div class="node-header">
-			<FileTextIcon class="node-icon" />
+			<svg class="node-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor">
+				<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" stroke-width="2" />
+				<path d="M14 2v6h6" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
+				<path d="M16 13H8" stroke-width="2" stroke-linecap="round" />
+				<path d="M16 17H8" stroke-width="2" stroke-linecap="round" />
+				<path d="M10 9H8" stroke-width="2" stroke-linecap="round" />
+			</svg>
 			<span class="node-title">日志</span>
 		</div>
 		<div class="node-content">
@@ -24,7 +30,6 @@
 
 <script setup lang="ts">
 	import { Handle, Position } from "@vue-flow/core";
-	import { FileTextIcon } from "lucide-vue-next";
 
 	const _props = defineProps<{
 		node: any

app/layouts/flow.vue

@@ -0,0 +1,5 @@
+<template>
+	<div>
+		<slot />
+	</div>
+</template>

app/pages/index.vue

@@ -70,17 +70,4 @@
 	definePageMeta({
 		layout: "home"
 	});
-
-	const navigateToWorkflow = async () => {
-		console.log("Navigating to workflow page");
-		try {
-			// 尝试使用 navigateTo
-			await navigateTo("/workflows/flow");
-			console.log("Navigation successful");
-		} catch (error) {
-			console.error("Navigation failed:", error);
-			// 备用方案：使用 window.location
-			window.location.href = "/workflows/flow";
-		}
-	};
 </script>

app/pages/workflows/flow.vue

@@ -49,10 +49,11 @@
 				<VueFlow
 					v-model:nodes="nodes"
 					v-model:edges="edges"
+					:node-types="nodeTypes"
 					:fit-view-on-init="true"
-					@dragover="onDragOver"
+					@dragover.prevent
 					@drop="onDrop"
-					@node-double-click="onNodeDoubleClick"
+					@node-double-click="(event: NodeMouseEvent) => onNodeDoubleClick(event)"
 				>
 					<Background />
 					<Controls />
@@ -64,20 +65,35 @@
 </template>
 
 <script setup lang="ts">
+	import type { NodeMouseEvent } from "@vue-flow/core";
+	import type { Component } from "vue";
 	import type { FlowNode } from "~/types/flow";
 	import { Background } from "@vue-flow/background";
 	import { Controls } from "@vue-flow/controls";
 	import { useVueFlow, VueFlow } from "@vue-flow/core";
 	import { MiniMap } from "@vue-flow/minimap";
-	import { v4 as uuidv4 } from "uuid";
 
-	import { computed, ref } from "vue";
+	import { v4 as uuidv4 } from "uuid";
+	import { computed, defineAsyncComponent, ref } from "vue";
 	import { getNodeDefinitionsByCategory } from "~/components/Flow/Nodes";
 
-	const flowNodes = ref(getNodeDefinitionsByCategory());
-	const { nodes, edges, onDragOver, addNodes, project } = useVueFlow();
+	definePageMeta({
+		layout: "flow"
+	});
 
-	const nodeCategories = computed(() => getNodeDefinitionsByCategory());
+	const nodeCategories = ref(getNodeDefinitionsByCategory());
+	const { nodes, edges, addNodes, project } = useVueFlow();
+
+	// 注册节点类型
+	const nodeTypes: Record<string, Component> = {
+		delay: defineAsyncComponent(() => import("~/components/Flow/Nodes/DelayNode.vue")),
+		log: defineAsyncComponent(() => import("~/components/Flow/Nodes/LogNode.vue"))
+	};
+
+	const allNodeDefinitions = computed(() => {
+		const categories = nodeCategories.value;
+		return Object.values(categories).flat();
+	});
 
 	const onDragStart = (event: DragEvent, node: any) => {
 		event.dataTransfer?.setData("application/vueflow", node.type);
@@ -90,7 +106,7 @@
 
 		const position = project({ x: event.clientX, y: event.clientY });
 
-		const nodeDefinition = flowNodes.value.find((n) => n.type === nodeType);
+		const nodeDefinition = allNodeDefinitions.value.find((n) => n.type === nodeType);
 		if (!nodeDefinition) return;
 
 		const newNode: FlowNode = {
@@ -105,8 +121,8 @@
 		addNodes([newNode]);
 	};
 
-	const onNodeDoubleClick = (event: any, node: FlowNode) => {
-		console.log("编辑节点:", node);
+	const onNodeDoubleClick = (event: NodeMouseEvent) => {
+		console.log("编辑节点:", event.node);
 		// 这里可以打开右侧抽屉或弹窗编辑节点配置
 	};
 

tsconfig.tsbuildinfo

@@ -0,0 +1 @@
+{"fileNames":[],"fileInfos":[],"root":[],"options":{"composite":true,"module":99,"target":99},"version":"5.7.3"}