fix

src/lang/en.ts

@@ -111,7 +111,13 @@ export default {
 		branchingNodeTree: 'Branching Node Tree',
 		restore: 'Restore',
 		newChat: 'New Chat',
-		delete: 'Delete'
+		delete: 'Delete',
+		deleteChat:'Delete chat?',
+		deleteHint:'Once deleted, you won’t be able to view this conversation again.',
+		restoreChat:'Restore chat?',
+		restoreHint:'Once deleted, you won’t be able to view this conversation again.',
+		cancel: 'cancel',
+		Confirm: 'Confirm',
 	},
 	//generateSketch
 	generateSketch: {

src/views/home/versionTree/components/dialog.vue

@@ -0,0 +1,139 @@
+<script setup lang="ts">
+import { ref, onMounted, onUnmounted, reactive, toRefs } from "vue";
+const props = defineProps({
+	textData: {
+		type: Object,
+		default: () => {}
+	} as any,
+	styleData: {
+		type: Object,
+		default: () => {}
+	} as any,
+	callBack: {
+		type: Function,
+		default: () => {}
+	}
+})
+// const emit = defineEmits([
+// ])
+let data = reactive({
+})
+
+const dialogFormVisible = ref(false)
+
+const confirm = async ()=>{
+	if(props.callBack)await props.callBack()
+	dialogFormVisible.value = false
+}
+
+onMounted(()=>{
+})
+onUnmounted(()=>{
+})
+defineExpose({open:()=>dialogFormVisible.value = true})
+const {} = toRefs(data);
+</script>
+<template>
+	<div class="dialog">
+		<el-dialog 
+			:align-center="true"
+			v-model="dialogFormVisible" 
+			:close-on-click-modal="false"
+			:title="props.textData?.title" 
+			:show-close="false"
+			:width="props.styleData?.width || '50%'">
+			<template #header="{ close, titleId, titleClass }">
+				<div class="my-header">
+					<div class="text">{{ props.textData?.title }}</div>
+					<div class="icon" @click="dialogFormVisible = false">
+						<SvgIcon
+							name="close"
+							size="8"
+						/>
+					</div>
+				</div>
+			</template>
+			<div class="boundary"></div>
+			<div class="dialog-content">
+				{{ props.textData?.text }}
+			</div>
+			<template #footer>
+				<div class="dialog-footer">
+					<div class="dialog-footer-cancel" @click="dialogFormVisible = false">
+						{{ props.textData?.cancelText || 'Cancel' }}
+					</div>
+					<div class="dialog-footer-confirm" type="primary" @click="confirm">
+					{{ props.textData?.submitText || 'Confirm' }}
+					</div>
+				</div>
+			</template>
+		</el-dialog>
+	</div>
+</template>
+<style lang="less" scoped>
+	.dialog{
+		--el-dialog-padding-primary: 1.6rem 1.2rem;
+		--el-dialog-border-radius: .8rem;
+		:deep(.el-dialog){
+			.my-header{
+				display: flex;
+				padding: 0 .5rem;
+				justify-content: space-between;
+				--el-dialog-padding-primary: 1.2rem
+				.text{
+					font-family: 'Semibold';
+					font-size: 1.4rem;
+					line-height: 2rem;
+					letter-spacing: -0.18px;
+				}
+				.icon{
+					cursor: pointer;
+					width: 2rem;
+					height: 2rem;
+					display: flex;
+					justify-content: center;
+					align-items: center;
+				}
+			}
+			.boundary{
+				border-bottom: .7px solid rgba(0, 0, 0, 0.1);
+				width: 100%;
+			}
+			.dialog-content{
+				padding: 0 .5rem;
+				padding-top: 1.2rem;
+				font-family: 'Regular';
+				font-weight: 400;
+				font-size: 1.2rem;
+				line-height: 2rem;
+				letter-spacing: -0.18px;
+			}
+			.dialog-footer{
+				display: flex;
+				justify-content: flex-end;
+				--el-dialog-padding-primary: 1.7rem;
+				> div{
+					font-weight: 500;
+					font-size: 1.2rem;
+					line-height: 2rem;
+					letter-spacing: -0.18px;
+					width: 5.9rem;
+					text-align: center;
+					cursor: pointer;
+					border-radius: 1.5rem;
+					padding: .3rem 0 .4rem;
+				}
+				.dialog-footer-cancel{
+					color: #000;
+					margin-right: .6rem;
+					border: 0.7px solid #0000001A;
+					background: #FFFFFF;
+				}
+				.dialog-footer-confirm{
+					color: #fff;
+					background-color: #f74545;
+				}
+			}
+		}
+	}
+</style>

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

@@ -6,6 +6,7 @@ import SpecialEdge from './speciaiEdge.vue'
 import InputNode from './InputNode.vue'//主
 import SecondaryNode from './secondaryNode.vue'//分支
 import { useLayout } from '../../tools/tools'
+import dialogVue from "../../components/dialog.vue";
 const props = defineProps({
 	selectItem: {
 		type: Object,
@@ -22,6 +23,9 @@ const emit = defineEmits([
 	'versionDelete',
 ])
 
+const dialogDeleteRef = ref()
+const dialogRestoreRef = ref()
+
 // 节点类型：input、output、default、custom
 // input:开始点，output：结尾点，default：普通节点，custom：自定义节点
 const position = { x: 0, y: 0 }
@@ -88,10 +92,11 @@ watch(()=>props.selectItem.id, (newVal, oldVal) => {
 
 const versionRestore = ()=>{
 	emit('versionRestore')
+	dialogRestoreRef.value?.open()
 }
 
 const versionDelete = ()=>{
-	emit('versionDelete')
+	dialogDeleteRef.value?.open()
 }
 
 onMounted(()=>{
@@ -135,6 +140,30 @@ defineExpose({push})
 				</div>
 			</div>
 		</div>
+		<dialogVue 
+			:textData="{
+				title: $t('VersionTree.deleteChat'),
+				text: $t('VersionTree.deleteHint'),
+				submitText: $t('VersionTree.delete'),
+				cancelText: $t('VersionTree.cancel'),
+			}"
+			:styleData="{
+				width: '40.6rem'
+			}"
+			:callBack="()=>emit('versionDelete')"
+			ref="dialogDeleteRef" />
+		<dialogVue 
+			:textData="{
+				title: $t('VersionTree.restoreChat'),
+				text: $t('VersionTree.restoreHint'),
+				submitText: $t('VersionTree.confirm'),
+				cancelText: $t('VersionTree.cancel'),
+			}"
+			:styleData="{
+				width: '40.6rem'
+			}"
+			:callBack="()=>emit('versionRestore')"
+			ref="dialogRestoreRef" />
 	</div>
 </template>
 <style lang="less">