aidlab/FiDA_Front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: agent聊天样式

Browse Source
This commit is contained in:
zhangyahui
2026-02-10 13:05:24 +08:00
parent 40cf156e2e
commit 8feda12724
18 changed files with 1392 additions and 1053 deletions
Download Patch File Download Diff File Expand all files Collapse all files

148
src/views/home/versionTree/index.vue
View File

@@ -1,47 +1,44 @@
<script setup lang="ts">
import { ref, onMounted, onUnmounted, reactive, toRefs } from "vue";
import { ref, onMounted, onUnmounted, reactive, toRefs } from 'vue'
import Tree from './tree/index.vue'
import Detail from './detail/index.vue'
const props = defineProps({
versionTreeData:{
type:Object,
default:()=>{
versionTreeData: {
type: Object,
default: () => {
return {
drawer:false,
list:[],
drawer: false,
list: []
}
},
},
}
}
})
//const emit = defineEmits([
//])
const treeState = ref(true)//
const treeState = ref(true) //
const selectItem = ref({})
const openTree = ()=>{
const openTree = () => {
treeState.value = !treeState.value
}
let data = reactive({
})
onMounted(()=>{
})
onUnmounted(()=>{
})
let data = reactive({})
onMounted(() => {})
onUnmounted(() => {})
defineExpose({})
const {} = toRefs(data);
const {} = toRefs(data)
</script>
<template>
<div class="versionTree">
<el-drawer
v-model="versionTreeData.drawer"
<el-drawer
v-model="versionTreeData.drawer"
:close-on-press-escape="false"
:close-on-click-modal="false"
:size="treeState?'109rem':'49rem'"
:size="treeState ? '109rem' : '49rem'"
body-class="versionTreeBody"
:with-header="false">
:with-header="false"
>
<div class="versionTreeTitle">
<span>Version Tree: Retro Sofa Sketch</span>
<div class="closeBtn" @click="versionTreeData.drawer = false">
@@ -50,9 +47,9 @@ const {} = toRefs(data);
</div>
</div>
</div>
<div style="display: flex;" class="expandBtnBox">
<el-button class="expandBtn" @click="openTree" style="width: 5rem;">+</el-button>
<el-button class="expandBtn" @click="openTree" style="width: 5rem;">-</el-button>
<div style="display: flex" class="expandBtnBox">
<el-button class="expandBtn" @click="openTree" style="width: 5rem">+</el-button>
<el-button class="expandBtn" @click="openTree" style="width: 5rem">-</el-button>
</div>
<div class="versionTreeBox">
<div class="tree">
@@ -66,58 +63,57 @@ const {} = toRefs(data);
</div>
</template>
<style lang="less" scoped>
.versionTree{
--border-radius: 1rem;
--treeItem-width: 5.4rem;
--treeItem-height: 5.4rem;
--treeItem-raduis: 50%;
--treeItem-border: 2px solid #000;
--treeItem-background: #ffffff;
--treeItem-active-background: #e6e6e6;
.versionTree {
--border-radius: 1rem;
--treeItem-width: 5.4rem;
--treeItem-height: 5.4rem;
--treeItem-raduis: 50%;
--treeItem-border: 2px solid #000;
--treeItem-background: #ffffff;
--treeItem-active-background: #e6e6e6;
:deep(.versionTreeBody){
--el-drawer-padding-primary: 0rem;
display: flex;
flex-direction: column;
:deep(.versionTreeBody) {
--el-drawer-padding-primary: 0rem;
display: flex;
flex-direction: column;
}
.versionTreeTitle {
width: 100%;
height: 8rem;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 0.8rem 0 2.4rem;
border-bottom: 1px solid #c9c9c9;
> span {
font-size: 2rem;
font-weight: 600;
font-family: 'SemiBold';
}
.versionTreeTitle{
width: 100%;
height: 8rem;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 .8rem 0 2.4rem;
border-bottom: 1px solid #C9C9C9;
> span{
font-size: 2rem;
font-weight: 600;
font-family: 'SemiBold';
}
> .closeBtn{
width: 2.4rem;
height: 2.4rem;
cursor: pointer;
}
}
.expandBtnBox{
}
.versionTreeBox{
flex: 1;
display: flex;
overflow: hidden;
> .tree{
flex: 1;
height: 100%;
overflow: hidden;
padding: 2.1rem 0 5.4rem 2.2rem;
}
> .detail{
width: 35rem;
margin: 2.1rem 3rem 5.4rem 3.4rem;
height: calc(100% - 2.1rem - 5.4rem);
overflow: hidden;
}
> .closeBtn {
width: 2.4rem;
height: 2.4rem;
cursor: pointer;
}
}
</style>
.expandBtnBox {
}
.versionTreeBox {
flex: 1;
display: flex;
overflow: hidden;
> .tree {
flex: 1;
height: 100%;
overflow: hidden;
padding: 2.1rem 0 5.4rem 2.2rem;
}
> .detail {
width: 35rem;
margin: 2.1rem 3rem 5.4rem 3.4rem;
height: calc(100% - 2.1rem - 5.4rem);
overflow: hidden;
}
}
}
</style>