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

2026-02-09 17:29:34 +08:00
parent c1e3b7835e
commit 422fa6ecbd
6 changed files with 73 additions and 114 deletions
--- 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>