xiaozhi/xiaozhi-admin-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update 优化 !pr850 相关代码用法与问题

Browse Source
This commit is contained in:
疯狂的狮子Li
2026-05-26 13:54:35 +08:00
parent f2c09f33c9
commit 779b42c653
4 changed files with 51 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/ai/chat/index.vue
+21 -9
View File
@@ -93,6 +93,14 @@ async function onSelectAgent(agent: AgentItem) {
await loadConversations(agent.id);
}
async function handleNewChat() {
if (!currentAgent.value && agents.value.length) {
currentAgent.value = agents.value[0];
await loadConversations(currentAgent.value.id);
}
currentConversationId.value = '';
}
async function onDeleteConversation(conversationId: string) {
if (!currentAgent.value) return;
try {
@@ -140,7 +148,7 @@ onMounted(() => {
@select-agent="onSelectAgent"
@select-conversation="currentConversationId = $event"
@delete-conversation="onDeleteConversation"
@new-chat="currentConversationId = ''"
@new-chat="handleNewChat"
/>
<ChatMain
:agent="currentAgent"
@@ -155,16 +163,20 @@ onMounted(() => {
.ai-chat-page {
display: flex;
flex-direction: column;
height: calc(100vh - 84px);
height: calc(100vh - 123px);
min-height: 0;
background: var(--el-bg-color-page);
border-radius: var(--app-radius-base);
overflow: hidden;
}
.chat-header {
height: 46px;
padding: 0 14px;
flex: 0 0 38px;
height: 38px;
padding: 0 12px;
border-bottom: 1px solid var(--app-surface-border);
border-top-left-radius: var(--app-radius-base);
border-top-right-radius: var(--app-radius-base);
background: var(--app-surface-bg);
display: flex;
align-items: center;
@@ -175,14 +187,14 @@ onMounted(() => {
align-items: center;
gap: 8px;
color: var(--app-text-title);
font-size: 18px;
font-size: 16px;
font-weight: 600;
}
.brand-dot {
width: 16px;
height: 16px;
border-radius: 50%;
width: 12px;
height: 12px;
border-radius: var(--app-radius-sm);
background: var(--el-color-primary);
}
@@ -195,7 +207,7 @@ onMounted(() => {
@media (max-width: 768px) {
.ai-chat-page {
height: calc(100vh - 64px);
height: calc(100vh - 88px);
}
.chat-body {
src/views/ai/chat/modules/chat-input.vue
+3 -3
View File
@@ -39,16 +39,16 @@ function submit() {
<style scoped lang="scss">
.chat-input-wrap {
padding: 10px 18px 14px;
padding: 8px 14px 10px;
}
.chat-input-box {
max-width: 920px;
margin: 0 auto;
border-radius: 8px;
border-radius: var(--app-radius-base);
border: 1px solid var(--app-surface-border);
background: var(--app-surface-bg);
padding: 12px;
padding: 10px;
box-shadow: var(--app-shadow-sm);
}
src/views/ai/chat/modules/chat-main.vue
+18 -18
View File
@@ -319,7 +319,7 @@ onBeforeUnmount(() => {
.chat-scroll {
flex: 1;
padding: 16px 18px 0;
padding: 10px 14px 0;
min-height: 0;
}
@@ -332,9 +332,9 @@ onBeforeUnmount(() => {
.welcome-card {
background: var(--app-surface-bg);
border: 1px solid var(--app-surface-border);
border-radius: 8px;
padding: 16px;
margin-bottom: 14px;
border-radius: var(--app-radius-base);
padding: 12px;
margin-bottom: 10px;
box-shadow: var(--app-shadow-sm);
}
@@ -349,43 +349,43 @@ onBeforeUnmount(() => {
}
.agent-name {
font-size: 20px;
font-size: 18px;
font-weight: 700;
color: var(--app-text-title);
}
.agent-desc {
margin-top: 4px;
margin-top: 2px;
color: var(--app-text-muted);
line-height: 1.6;
line-height: 1.5;
}
.greeting {
margin-top: 12px;
margin-top: 8px;
color: var(--app-text-title);
}
.question-title {
margin-top: 14px;
padding-top: 10px;
margin-top: 10px;
padding-top: 8px;
border-top: 1px solid var(--app-surface-border);
color: var(--app-text-muted);
font-size: 13px;
}
.question-list {
margin-top: 8px;
margin-top: 6px;
display: flex;
flex-wrap: wrap;
gap: 8px;
gap: 6px;
}
.question-pill {
border: 1px solid var(--app-surface-border);
background: var(--app-surface-bg);
color: var(--app-text-title);
border-radius: 8px;
padding: 6px 12px;
border-radius: var(--app-radius-md);
padding: 5px 10px;
cursor: pointer;
}
@@ -396,7 +396,7 @@ onBeforeUnmount(() => {
.msg-row {
display: flex;
margin-bottom: 12px;
margin-bottom: 8px;
}
.msg-row.user {
@@ -406,11 +406,11 @@ onBeforeUnmount(() => {
.msg-bubble {
max-width: 80%;
white-space: pre-wrap;
line-height: 1.7;
line-height: 1.6;
background: var(--app-surface-bg);
border: 1px solid var(--app-surface-border);
border-radius: 8px;
padding: 10px 12px;
border-radius: var(--app-radius-base);
padding: 8px 10px;
color: var(--app-text-title);
box-shadow: var(--app-shadow-sm);
}
src/views/ai/chat/modules/chat-sidebar.vue
+9 -9
View File
@@ -35,7 +35,7 @@ const avatarText = computed(() => (displayNickname.value ? displayNickname.value
<template>
<aside class="chat-sidebar">
<div class="sidebar-block sidebar-head">
<el-button class="new-btn" type="primary" plain :disabled="!currentAgent" @click="emit('newChat')">
<el-button class="new-btn" type="primary" plain :disabled="!agents.length" @click="emit('newChat')">
<el-icon><Plus /></el-icon>
<span>新对话</span>
</el-button>
@@ -96,7 +96,7 @@ const avatarText = computed(() => (displayNickname.value ? displayNickname.value
}
.sidebar-head {
padding-bottom: 8px;
padding-bottom: 6px;
}
.new-btn {
@@ -108,19 +108,19 @@ const avatarText = computed(() => (displayNickname.value ? displayNickname.value
}
.sidebar-block {
padding: 12px;
padding: 10px 12px;
}
.block-title {
margin-bottom: 10px;
margin-bottom: 8px;
color: var(--app-text-muted);
font-size: 12px;
}
.agent-item,
.conv-item {
height: 36px;
border-radius: 8px;
height: 32px;
border-radius: var(--app-radius-md);
padding: 0 10px;
display: flex;
align-items: center;
@@ -143,7 +143,7 @@ const avatarText = computed(() => (displayNickname.value ? displayNickname.value
.avatar-dot {
width: 14px;
height: 14px;
border-radius: 50%;
border-radius: var(--el-border-radius-round);
background: var(--el-color-primary);
}
@@ -179,7 +179,7 @@ const avatarText = computed(() => (displayNickname.value ? displayNickname.value
.sidebar-foot {
border-top: 1px solid var(--app-surface-border);
padding: 10px 12px;
padding: 8px 12px;
display: flex;
align-items: center;
gap: 10px;
@@ -189,7 +189,7 @@ const avatarText = computed(() => (displayNickname.value ? displayNickname.value
.user-avatar {
width: 30px;
height: 30px;
border-radius: 50%;
border-radius: var(--el-border-radius-round);
background: var(--el-color-success);
color: var(--el-color-white);
display: flex;