提交测试versionTree

src/views/home/versionTree/tree/view1Item.vue

@@ -0,0 +1,70 @@
+<script setup lang="ts">
+import { ref, onMounted, onUnmounted, reactive, toRefs } from "vue";
+const props = defineProps({
+	item: {
+		type: Object,
+		default: () => ({})
+	}
+})
+//const emit = defineEmits([
+//])
+let data = reactive({
+})
+onMounted(()=>{
+})
+onUnmounted(()=>{
+})
+defineExpose({})
+const {} = toRefs(data);
+</script>
+<template>
+	<div class="btn">
+		{{ item.name }}
+	</div>
+</template>
+<style lang="less" scoped>
+	.btn{
+		font-size: 1.2rem;
+		width: 5rem;
+		height: 5rem;
+		font-weight: 500;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		border-radius: 50%;
+		border: 2px solid #000;
+		color: #000;
+		cursor: pointer;
+		margin-bottom: 4rem;
+		position: relative;
+		&::after{
+			content: '';
+			cursor: auto;	
+			position: absolute;
+			top: calc(100% + 2px);
+			height: 4rem;
+			left: 50%;
+			width: 1.8px;
+			transform: translateX(-50%);
+			background: 
+				repeating-linear-gradient(0deg, #333 0, #333 5px, transparent 5px, transparent 10px),
+				linear-gradient(white, white);
+			background-clip: padding-box, border-box;
+			background-origin: border-box;
+		}
+		&.active{
+			background-color: #e6e6e6;
+		}
+	}
+	.btn:nth-child(1){
+		background-color: #7A7A7A;
+		color: #FFF;
+		border: 2px solid #7A7A7A;
+	}
+	.btn:last-child{
+		margin-bottom: 0;
+		&::after{
+			display: none;
+		}
+	}
+</style>