提交测试versionTree

src/views/home/versionTree/tree/view2/index.vue

@@ -0,0 +1,63 @@
+<script setup lang="ts">
+import { ref, onMounted, onUnmounted, reactive, toRefs } from "vue";
+import type { Node, Edge } from '@vue-flow/core'  
+import { VueFlow } from '@vue-flow/core'
+import SpecialEdge from './speciaiEdge.vue'
+import SpecialNode from './speciaiNode.vue'
+const props = defineProps({
+	item: {
+		type: Object,
+		default: () => ({})
+	}
+})
+//const emit = defineEmits([
+//])
+let data = reactive({
+})
+
+const nodes = ref<Node[]>([
+  { id: '1', type: 'input', label: 'Node 1', position: { x: 250, y: 0 } },
+  { id: '2', type: 'output', label: 'Node 2', position: { x: 100, y: 100 } },
+  { id: '3', type: 'custom', label: 'Node 3', position: { x: 400, y: 100 } },
+  { id: '4', type: 'custom', label: 'Node 3', position: { x: 400, y: 200 } },
+])
+
+const edges = ref<Edge[]>([
+  { id: 'e1-2', source: '1', target: '2', type: 'custom' },
+  { id: 'e1-3', source: '1', target: '3', animated: true },
+  { id: 'e1-4', source: '1', target: '4', },
+])
+
+
+onMounted(()=>{
+})
+onUnmounted(()=>{
+})
+defineExpose({})
+const {} = toRefs(data);
+</script>
+<template>
+	<div class="view2">
+		<VueFlow :nodes="nodes" :edges="edges">
+			<!-- bind your custom node type to a c omponent by using slots, slot names are always `node-<type>` -->
+			<template #node-custom="nodeProps">
+				<SpecialNode v-bind="nodeProps" />
+			</template>
+
+			<!-- <template #edge-custom="edgeProps">
+				<SpecialEdge v-bind="edgeProps" />
+			</template> -->
+		</VueFlow>
+	</div>
+</template>
+<style lang="less">
+@import "@vue-flow/core/dist/style.css";
+@import "@vue-flow/core/dist/theme-default.css";
+</style>
+<style lang="less" scoped>
+	.view2{
+		width: 100%;
+		height: 100%;
+		overflow: hidden;
+	}
+</style>