【解决todo】AI Chat 头部模型按钮,如果模型名字过长,会把其他按钮挤出屏幕

This commit is contained in:
cherishsince 2024-05-21 17:52:21 +08:00
parent 88c7dc52be
commit 0803e33d1d

View File

@ -15,19 +15,13 @@
</div>
<div class="btns">
<!-- TODO @fan样式改下这里我已经改成点击后弹出了 -->
<el-button type="primary" @click="openChatConversationUpdateForm">
<el-button type="primary" bg text="plain" size="small" @click="openChatConversationUpdateForm">
<span v-html="activeConversation?.modelName"></span>
<Icon icon="ep:setting" style="margin-left: 10px"/>
</el-button>
<el-button>
<Icon icon="ep:user"/>
</el-button>
<el-button>
<Icon icon="ep:download"/>
</el-button>
<el-button @click="handlerGoTop">
<Icon icon="ep:arrow-up"/>
</el-button>
<el-button size="small" :icon="User" class="btn" />
<el-button size="small" :icon="Download" class="btn" />
<el-button size="small" :icon="Top" class="btn" @click="handlerGoTop" />
</div>
</el-header>
@ -99,6 +93,7 @@ import {ChatMessageApi, ChatMessageVO} from '@/api/ai/chat/message'
import {ChatConversationApi, ChatConversationVO} from '@/api/ai/chat/conversation'
import {useClipboard} from '@vueuse/core'
import ChatConversationUpdateForm from "@/views/ai/chat/components/ChatConversationUpdateForm.vue";
import {Download, Top, User} from "@element-plus/icons-vue";
const route = useRoute() //
const message = useMessage() //
@ -606,7 +601,13 @@ onMounted(async () => {
.btns {
display: flex;
width: 300px;
justify-content: space-between;
flex-direction: row;
justify-content: flex-end;
//justify-content: space-between;
.btn {
padding: 10px;
}
}
}
}