sketch生成基础结构

src/views/home/VersionTree.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { ref, onMounted, onUnmounted, reactive, toRefs, computed } from "vue";
 import VersionTreeIndex from './versionTree/index.vue'
+import GenerateSketch from './generateSketch/index.vue'
 //const props = defineProps({
 //})
 //const emit = defineEmits([
@@ -13,6 +14,73 @@ const versionTreeData = ref({
 		return []
 	})
 })
+const generateData = ref({
+	list:[
+		{
+			id:'1',
+			type:'waiting',
+		},
+		{
+			id:'2',
+			type:'success',
+			img:'/img/success.png',
+		},
+		{
+			id:'3',
+			type:'success',
+			img:'/img/success.png',
+		},
+			{
+			id:'4',
+			type:'success',
+			img:'/img/success.png',
+		},
+			{
+			id:'5',
+			type:'success',
+			img:'/img/success.png',
+		},
+			{
+			id:'6',
+			type:'success',
+			img:'/img/success.png',
+		},
+			{
+			id:'7',
+			type:'success',
+			img:'/img/success.png',
+		},
+		{
+			id:'8',
+			type:'success',
+			img:'/img/success.png',
+		},
+		{
+			id:'9',
+			type:'success',
+			img:'/img/success.png',
+		},
+	]
+})
+const generateSketch = ()=>{
+	generateData.value.list.push(
+		{
+			id:'2',
+			type:'waiting',
+			img:'/img/success.png',
+		}
+	)
+	sketchRestore('2')
+}
+
+const sketchRestore = (id)=>{
+	generateData.value.list.forEach((item)=>{
+		if(item.id == id){
+			item.type = 'waiting'
+		}
+	})
+}
+
 onMounted(()=>{
 })
 onUnmounted(()=>{
@@ -22,8 +90,14 @@ const {} = toRefs(data);
 </script>
 <template>
 	<div class="homeNavBox">
-		<el-button type="primary" @click="versionTreeData.drawer = true">open Version Tree</el-button>
+		<div>
+			<el-button type="primary" @click="versionTreeData.drawer = true">open Version Tree</el-button>
+			<el-button type="primary" @click="generateSketch">Generate</el-button>
+		</div>
 		<VersionTreeIndex v-model:versionTreeData="versionTreeData" />
+		<div class="generateSketchBox">
+			<GenerateSketch v-model:generateData="generateData"></GenerateSketch>
+		</div>
 	</div>
 </template>
 <style lang="less" scoped>
@@ -31,5 +105,14 @@ const {} = toRefs(data);
 		width: 100%;
 		height: 100%;
 		position: relative;
+		display: flex;
+		> .generateSketchBox{
+			height: 100%;
+			width: 50%;
+			overflow-y: auto;
+			&::-webkit-scrollbar {
+				display: none;
+			}
+		}
 	}
 </style>