version界面调整，版本只保留树状图

2026-02-09 17:29:34 +08:00
parent c1e3b7835e
commit 422fa6ecbd
6 changed files with 73 additions and 114 deletions
--- a/src/assets/icons/versionDelete.svg
+++ b/src/assets/icons/versionDelete.svg
@@ -1,3 +1,5 @@
-<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M13.5 4.5L4.5 13.5M4.5 4.5L13.5 13.5" stroke="#5A5A5A" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"/>
+<svg width="13" height="13" viewBox="0 0 13 13" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.77778 5.85C5.77778 5.49101 5.45443 5.2 5.05556 5.2C4.65668 5.2 4.33333 5.49101 4.33333 5.85V9.1C4.33333 9.45898 4.65668 9.75 5.05556 9.75C5.45443 9.75 5.77778 9.45898 5.77778 9.1V5.85Z" fill="#5A5A5A"/>
+<path d="M8.66667 5.85C8.66667 5.49101 8.34332 5.2 7.94444 5.2C7.54557 5.2 7.22222 5.49101 7.22222 5.85V9.1C7.22222 9.45898 7.54557 9.75 7.94444 9.75C8.34332 9.75 8.66667 9.45898 8.66667 9.1V5.85Z" fill="#5A5A5A"/>
+<path d="M6.97498 0C8.3006 0 9.45611 0.811973 9.77762 1.96941L9.95278 2.6H11.5453C11.5515 2.59993 11.5578 2.59993 11.564 2.6H12.2778C12.6766 2.6 13 2.89101 13 3.25C13 3.60898 12.6766 3.9 12.2778 3.9H12.2045L11.3977 10.677C11.2405 11.9981 10.0017 13 8.5253 13H4.4747C2.99834 13 1.75954 11.9981 1.60225 10.677L0.79547 3.9H0.722222C0.32335 3.9 0 3.60898 0 3.25C0 2.89101 0.32335 2.6 0.722222 2.6H1.43598C1.44223 2.59993 1.44846 2.59993 1.45467 2.6H3.04722L3.22238 1.96941C3.54389 0.811972 4.6994 0 6.02502 0H6.97498ZM9.40399 3.9C9.39353 3.90021 9.3831 3.9002 9.37269 3.9H3.6273C3.6169 3.9002 3.60647 3.90021 3.59601 3.9H2.24818L3.03848 10.5385C3.11712 11.1991 3.73652 11.7 4.4747 11.7H8.5253C9.26348 11.7 9.88288 11.1991 9.96152 10.5385L10.7518 3.9H9.40399ZM4.62369 2.2847L4.53611 2.6H8.46387L8.37629 2.2847C8.21554 1.70599 7.63778 1.3 6.97497 1.3H6.025C5.3622 1.3 4.78444 1.70599 4.62369 2.2847Z" fill="#5A5A5A"/>
 </svg>
--- a/src/views/home/versionTree/detail/index.vue
+++ b/src/views/home/versionTree/detail/index.vue
@@ -5,8 +5,6 @@ import ChatHistory from './chatHistory.vue'
 //const props = defineProps({
 //})
 const emit = defineEmits([
-	'versionRestore',
-	'versionDelete',
 ])
 const detailData = ref({
 	id:1,
@@ -34,8 +32,6 @@ defineExpose({})
 		<div class="versionDetail">
 			<VersionDetail 
 				:versionDetail="detailData.versionDetail"
-				@versionRestore="()=>emit('versionRestore')"
-				@versionDelete="emit('versionDelete')"
 			></VersionDetail>
 		</div>
 		<div class="useInput">
--- a/src/views/home/versionTree/detail/versionDetail.vue
+++ b/src/views/home/versionTree/detail/versionDetail.vue
@@ -15,21 +15,6 @@ const emit = defineEmits([
 let data = reactive({
 })

-const morePopoverRef = ref(null)
-const handleClick = ()=>{
-	morePopoverRef.value?.hide()
-}
-
-const versionRestore = ()=>{
-	emit('versionRestore')
-	handleClick()
-}
-
-const versionDelete = ()=>{
-	emit('versionDelete')
-	handleClick()
-}
-
 onMounted(()=>{
 })
 onUnmounted(()=>{
@@ -43,41 +28,6 @@ const {} = toRefs(data);
 			<span class="titleText">
 				{{ $t('VersionTree.versionInformation') }}
 			</span>
-			<el-popover
-				width="24rem"
-				ref="morePopoverRef"
-				trigger="click"
-				popper-class="moreBox"
-				placement="bottom-end"
-			>
-				<template #reference>
-					<span class="icon"><svg-icon name="more" size="25" /></span>
-				</template>
-				<template #default>
-					<div class="topBtn">
-						<div class="item" @click="versionRestore">
-							<div class="icon">
-								<SvgIcon name="versionRestore" size="18" />
-							</div>
-							<span>{{ $t('VersionTree.restore') }}</span>
-						</div>
-						<!-- <div class="item" @click="$emit('versionNewChat')">
-							<div class="icon">
-								<SvgIcon name="versionNewChat" size="18" />
-							</div>
-							<span>{{ $t('VersionTree.newChat') }}</span>
-						</div> -->
-					</div>
-					<div class="bottomBtn">
-						<div class="item" @click="versionDelete">
-							<div class="icon">
-								<SvgIcon name="versionDelete" size="18" />
-							</div>
-							<span>{{ $t('VersionTree.delete') }}</span>
-						</div>
-					</div>
-				</template>
-			</el-popover>
 		</div>
 		<div class="version">{{versionDetail.version}}</div>
 		<div class="time marBott1">{{versionDetail.versionTime}}</div>
@@ -85,42 +35,6 @@ const {} = toRefs(data);
 		<div class="time gray">{{versionDetail.versionSketchTime}}</div>
 	</div>
 </template>
-<style lang="less">
-	.el-popover.el-popper.moreBox{
-		border-radius: .8rem;
-		padding: 0;
-		.topBtn,.bottomBtn{
-			display: flex;
-			flex-direction: column;
-			justify-content: center;
-			padding: .8rem;
-			.item{
-				display: flex;
-				padding: 0rem 1rem;
-				cursor: pointer;
-				line-height: 3.2rem;
-				border-radius: .4rem;
-				height: 3.2rem;
-				align-items: center;
-				&:hover{
-					background-color: #f6f6f6;
-				}
-				> .icon{
-					margin-right: 1rem;
-				}
-				> span{
-					color: #000;
-					font-weight: 500;
-					font-size: 1.5rem;
-					line-height: 100%;
-				}
-			}
-		}
-		.topBtn{
-			border-bottom: 1px solid #d4d4d4;
-		}
-	}
-</style>
 <style lang="less" scoped>
 	.versionDetail{
 		width: 100%;
@@ -139,18 +53,6 @@ const {} = toRefs(data);
 				font-weight: 600;
 				font-family: 'SemiBold';
 			}
-			.icon{
-				color: #5a5a5a;
-				width: 3.6rem;
-				height: 100%;
-				border-radius: .6rem;
-				cursor: pointer;
-				transition: all .3s;
-				&:hover{
-					background-color: #E5E5E5;
-				}
-
-			}
 		}
 		> .version{
 			font-family: 'SemiBold';
--- a/src/views/home/versionTree/index.vue
+++ b/src/views/home/versionTree/index.vue
@@ -91,7 +91,7 @@ const {} = toRefs(data);
 					</div>
 				</div>
 			</div>
-			<div class="expandBtnBox">
+			<!-- <div class="expandBtnBox">
 				<div class="btn" @click="openTree(true)">
 					<div class="bg left" :class="{'active':treeState}"></div>
 					<span>{{ $t('VersionTree.linearNodeTree') }}</span>	
@@ -100,7 +100,7 @@ const {} = toRefs(data);
 					<div class="bg right" :class="{'active':!treeState}"></div>
 					<span>{{ $t('VersionTree.branchingNodeTree') }}</span>	
 				</div>
-			</div>
+			</div> -->
 			<div class="versionTreeBox">
 				<div class="tree">
 					<Tree 
@@ -108,14 +108,14 @@ const {} = toRefs(data);
 						:versionsList="versionsList"
 						:treeState="treeState" 
 						v-model:selectItem="selectItem"
+						@versionRestore="versionRestore"
+						@versionDelete="versionDelete"
 						:key="treeKey"
 					></Tree>
 				</div>
 				<div class="detail">
 					<Detail 
 						v-model:selectItem="selectItem"
-						@versionRestore="versionRestore"
-						@versionDelete="versionDelete"
 					></Detail>
 				</div>
 			</div>
--- a/src/views/home/versionTree/tree/index.vue
+++ b/src/views/home/versionTree/tree/index.vue
@@ -17,7 +17,9 @@ const props = defineProps({
 	} as any,
 })
 const emit = defineEmits([
-	'update:selectItem'
+	'update:selectItem',
+	'versionRestore',
+	'versionDelete',
 ])
 let data = reactive({
 })
@@ -82,12 +84,12 @@ const scrollToActive = ()=>{

 watch(()=>treeStateTime.value,(newVal,oldVal)=>{
 	if((props.treeState + '') == 'false'){
-		scrollToActive()
+		// scrollToActive()
 	}
 })

 watch(()=>props.selectItem,(newVal,oldVal)=>{
-	scrollToActive()
+	// scrollToActive()
 },{immediate: true})

 onMounted(()=>{
@@ -100,15 +102,17 @@ const {} = toRefs(data);
 </script>
 <template>
 	<div class="tree" v-show="treeStateTime" v-if="isLoad">
-		<div v-show="!treeState" class="box view1" ref="view1Ref">
+		<!-- <div v-show="!treeState" class="box view1" ref="view1Ref">
 			<view1Item v-for="item in treeList" :key="item.name" :selectItem="props.selectItem" :item="item" @click="setSelectItem(item)"></view1Item>
-		</div>
+		</div> -->
 		<div v-show="treeState" class="box view2">
 			<view2 
 				ref="view2Ref" 
 				@setSelectItem="setSelectItem"
 				:treeList="treeList"
 				:selectItem="props.selectItem"
+				@versionRestore="()=>emit('versionRestore')"
+				@versionDelete="emit('versionDelete')"
 			></view2>
 		</div>
 	</div>
--- a/src/views/home/versionTree/tree/view2/index.vue
+++ b/src/views/home/versionTree/tree/view2/index.vue
@@ -18,6 +18,8 @@ const props = defineProps({
 })
 const emit = defineEmits([
 	'setSelectItem',
+	'versionRestore',
+	'versionDelete',
 ])

 // 节点类型：input、output、default、custom
@@ -84,6 +86,14 @@ watch(()=>props.treeList.length, (newVal, oldVal) => {
 watch(()=>props.selectItem.id, (newVal, oldVal) => {
 })

+const versionRestore = ()=>{
+	emit('versionRestore')
+}
+
+const versionDelete = ()=>{
+	emit('versionDelete')
+}
+
 onMounted(()=>{
 })
 onUnmounted(()=>{
@@ -110,8 +120,21 @@ defineExpose({push})
 					<SpecialEdge v-bind="edgeProps" />
 				</template> -->
 			</VueFlow>
+			<div class="btnBox">
+				<div class="item" @click="versionRestore">
+					<div class="icon">
+						<SvgIcon name="versionRestore" size="12" />
+					</div>
+					<span>{{ $t('VersionTree.restore') }}</span>
+				</div>
+				<div class="item" @click="versionDelete">
+					<div class="icon">
+						<SvgIcon name="versionDelete" size="12" />
+					</div>
+					<span>{{ $t('VersionTree.delete') }}</span>
+				</div>
+			</div>
 		</div>
-		
 	</div>
 </template>
 <style lang="less">
@@ -156,5 +179,37 @@ defineExpose({push})
 				}
 			}
 		}
+		.btnBox{
+			position: absolute;
+			z-index: 1;
+			bottom: 3rem;
+			right: 2rem;
+			> .item{
+				width: 14.5rem;
+				line-height: 3.3rem;
+				border-radius: .8rem;
+				border: 1px solid #d9d9d9;
+				display: flex;
+				justify-content: center;
+				margin-bottom: 2rem;
+				background-color: #ffffff;
+				cursor: pointer;
+				&:hover{
+					background-color: #f5f5f5;
+				}
+				&:last-child{
+					margin-bottom: 0;
+				}
+				> .icon{
+					margin-right: .4rem;
+					color: rgba(0, 0, 0, 0.5);
+				}
+				> span{
+					font-weight: 500;
+					font-size: 1.4rem;
+					color: rgba(0, 0, 0, 0.5);
+				}
+			}
+		}
 	}
 </style>