wangys/schoolNews
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

web修改ai推荐

Browse Source
This commit is contained in:
wangys
2025-12-25 10:48:08 +08:00
parent 878133fb40
commit a69b3edba3
3 changed files with 111 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
schoolNewsWeb/src/views/public/ai/AIAgent.mobile.vue
View File

@@ -19,7 +19,7 @@
v-model="drawerVisible"
title=""
direction="btt"
size="85%"
size="90%"
:show-close="false"
class="ai-drawer"
>
@@ -80,7 +80,9 @@
<img v-else src="@/assets/imgs/assistant.svg" alt="AI助手" class="welcome-avatar" />
</div>
<h2>你好！我是{{ agentConfig?.name || 'AI助手' }}</h2>
<AIRecommend @select="handleRecommendSelect" />
<div class="recommend-wrapper">
<AIRecommend v-if="isFirstLoad" @select="handleRecommendSelect" />
</div>
</div>
<!-- 对话消息列表 -->
@@ -328,6 +330,8 @@ const messages = ref<AiMessage[]>([]);
const inputMessage = ref('');
const isGenerating = ref(false);
const chatContentRef = ref<HTMLElement | null>(null);
// 是否是第一次加载（用于控制推荐内容只在首次加载时显示）
const isFirstLoad = ref(true);
const inputRef = ref<HTMLTextAreaElement | null>(null);
const uploadedFiles = ref([]);
@@ -381,6 +385,7 @@ function prepareNewConversation() {
currentConversation.value = null;
messages.value = [];
showHistory.value = false;
isFirstLoad.value = false; // 新建对话时不再显示推荐
ElMessage.success('已准备新对话');
}
@@ -494,7 +499,6 @@ async function sendMessage() {
query: message,
files: []
}, {
onStart: () => {},
onInit: (initData) => {
const lastMessage = messages.value[messages.value.length - 1];
if (lastMessage && lastMessage.role === 'assistant') {
@@ -511,7 +515,7 @@ async function sendMessage() {
}
nextTick(() => scrollToBottom());
},
onDifyEvent: () => {},
onDifyEvent: () => {return},
onMessageEnd: () => {
isGenerating.value = false;
},
@@ -867,6 +871,10 @@ onUnmounted(() => {
display: flex;
flex-direction: column;
height: 100%;
max-width: 430px;
margin: 0 auto;
width: 100%;
box-sizing: border-box;
&.with-history {
margin-left: 280px;
@@ -881,6 +889,15 @@ onUnmounted(() => {
padding: 20px;
text-align: center;
overflow-y: auto;
width: 100%;
box-sizing: border-box;
.recommend-wrapper {
width: 100%;
max-width: 380px;
min-width: 0;
box-sizing: border-box;
}
.welcome-icon {
margin-bottom: 20px;

7
schoolNewsWeb/src/views/public/ai/AIAgent.vue
View File

@@ -65,13 +65,13 @@
<!-- 对话内容区域 -->
<div class="current-chat-content" ref="chatContentRef">
<!-- 欢迎消息 -->
<div v-if="messages.length === 0" class="welcome-message">
<div v-if="!currentConversation && messages.length === 0" class="welcome-message">
<div class="welcome-icon">
<img v-if="agentAvatarUrl" :src="agentAvatarUrl" alt="AI助手" class="welcome-avatar" />
<img v-else src="@/assets/imgs/assistant.svg" alt="AI助手" class="welcome-avatar" />
</div>
<h2>你好！我是{{ agentConfig?.name || 'AI助手' }}</h2>
<AIRecommend />
<AIRecommend v-if="isFirstLoad" />
</div>
<!-- 消息列表 -->
@@ -447,6 +447,8 @@ const conversations = ref<AiConversation[]>([]);
const currentConversation = ref<AiConversation | null>(null);
const hasMoreConversations = ref(false);
const conversationPage = ref(1);
// 是否是第一次加载（用于控制推荐内容只在首次加载时显示）
const isFirstLoad = ref(true);
// 加载最近对话
async function loadRecentConversations() {
@@ -482,6 +484,7 @@ async function loadMoreConversations() {
function prepareNewConversation() {
currentConversation.value = null;
messages.value = [];
isFirstLoad.value = false; // 新建对话时不再显示推荐
ElMessage.success('已准备新对话，发送消息后将自动创建');
}

72
schoolNewsWeb/src/views/public/ai/AIRecommend.vue
View File

@@ -80,6 +80,9 @@ onMounted(() => {
background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%);
border-radius: 12px;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
box-sizing: border-box;
min-width: 0;
overflow: hidden;
.recommend-left {
min-width: 80px;
@@ -114,6 +117,8 @@ onMounted(() => {
border-radius: 12px;
padding: 16px;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
min-width: 0;
box-sizing: border-box;
:deep(.recommend-tabs) {
.el-tabs__header {
@@ -217,6 +222,7 @@ onMounted(() => {
text-decoration: none;
color: #303133;
gap: 12px;
min-width: 0; /* 确保flex子元素不会超出父容器 */
.item-title {
flex: 1;
@@ -225,6 +231,7 @@ onMounted(() => {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
min-width: 0; /* 确保flex子元素不会超出父容器 */
&:hover {
color: #C62828;
@@ -260,7 +267,7 @@ onMounted(() => {
@media (max-width: 768px) {
.ai-recommend {
flex-direction: column;
padding: 16px;
padding: 12px;
.recommend-left {
min-width: auto;
@@ -271,6 +278,69 @@ onMounted(() => {
justify-content: center;
}
}
.recommend-right {
padding: 12px;
width: 100%;
box-sizing: border-box;
:deep(.recommend-tabs) {
.el-tabs__item {
font-size: 13px;
}
}
.recommend-list {
width: 100%;
.list-items {
gap: 6px;
width: 100%;
.recommend-item {
padding: 8px 12px;
width: 100%;
box-sizing: border-box;
display: flex;
min-width: 0;
.item-number {
min-width: 20px;
height: 20px;
font-size: 10px;
margin-right: 8px;
flex-shrink: 0;
}
.item-link {
flex: 1;
min-width: 0;
display: flex;
align-items: center;
justify-content: space-between;
overflow: hidden;
.item-title {
font-size: 13px;
flex: 1;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
box-sizing: border-box;
}
.item-arrow {
font-size: 14px;
margin-left: 6px;
flex-shrink: 0;
opacity: 1;
}
}
}
}
}
}
}
}
</style>