renxiaodong/lingji-work-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(agent): 重构智能体页面样式和路由配置，优化历史对话组件

Browse Source
This commit is contained in:
林志军
2025-07-25 13:48:49 +08:00
parent 149831ebc9
commit 11579a647a
11 changed files with 607 additions and 218 deletions
Download Patch File Download Diff File Expand all files Collapse all files

91
src/views/agent/chat/components/HistoryChat.vue
View File

@ -1,45 +1,58 @@
<template>
<div>
<div class="logo">
<img :src="cozeInfo?.icon_url" class="agent-img" />
</div>
<a-menu mode="inline" theme="light">
<a-menu-item key="1">
<span class="menu-title">{{ cozeInfo.name }}</span>
<span style="color: #8492ff; font-size: 12px">{{ cozeInfo.type == 1 ? '智能体' : '对话式' }}</span>
<span style="float: right">{{ cozeInfo.views }}次使用</span>
<p>{{ cozeInfo.description }}</p>
</a-menu-item>
<div v-for="(item, index) in conversations" :key="index">
<a-dropdown-button>
<span> {{ item.content }} </span>
<template #content>
<a-doption>重命名</a-doption>
<a-popconfirm
content="确认删除对话吗？删除后，聊天记录将不可恢复。"
@ok="delMessage(item.chat_id, item.conversation_id)"
type="error"
>
<a-button>删除</a-button>
</a-popconfirm>
</template>
</a-dropdown-button>
<div class="agent-card">
<div class="header-section">
<div class="image-container">
<img :src="cozeInfo.icon_url" alt="" />
</div>
</a-menu>
</div>
<div class="info-section">
<div class="title-group">
<div class="title">{{cozeInfo.name}}</div>
<div class="tag">
<div class="">
<img
class="status-icon"
:src="chatbotIcon"
/>
</div>
<div class="text">对话式</div>
</div>
</div>
<div class="usage-info">
<div class="count">{{cozeInfo.views}}</div>
<div class="label">次使用</div>
</div>
</div>
<div class="description-section">
<div class="description">
{{cozeInfo.description}}
</div>
</div>
<div class="divider"></div>
<div class="history-section">
<div class="history-title">
<div class="text">历史对话</div>
</div>
<!-- <div class="history-list">-->
<!-- <div class="history-item">-->
<!-- <div class="item-text">梳理这次舆情的时间线和关键节点</div>-->
<!-- </div>-->
<!-- -->
<!-- </div>-->
</div>
</div>
</template>
<script lang="ts" setup>
import { defineProps } from 'vue';
import { delAgentMessage, getHistoryChat } from '@/api/all/agent';
import chatbotIcon from '@/assets/svg/chatbot.svg';
const props = defineProps({
cozeInfo: {
type: Object as () => any,
default: () => ({}),
}
},
});
const delMessage = async (chatId, conversationId) => {
@ -63,27 +76,9 @@ const truncateText = (text: string, maxLength = 30) => {
};
onMounted(() => {
getHistoryChatData(props.cozeInfo.bot_id);
});
</script>
<style scoped>
.logo {
margin-bottom: 20px;
}
.menu-title {
color: var(--Text-1, #211f24);
font-size: 18px;
font-family: Alibaba PuHuiTi;
font-weight: 400;
line-height: 26px;
word-wrap: break-word;
}
.agent-img {
width: 100%;
height: 230px;
border-radius: 4px;
}
@import './history.scss';
</style>