diff --git a/src/api/session/index.ts b/src/api/session/index.ts index 6698c70..a62d1f2 100644 --- a/src/api/session/index.ts +++ b/src/api/session/index.ts @@ -4,12 +4,20 @@ import type { // CreateSessionVO, GetSessionListParams, } from './types'; -import { get, post } from '@/utils/request'; +import { del, get, post, put } from '@/utils/request'; -export function getSessionList(params: GetSessionListParams) { +export function get_session_list(params: GetSessionListParams) { return get('/system/session/list', params); } -export function createSession(data: CreateSessionDTO) { +export function create_session(data: CreateSessionDTO) { return post('/system/session', data); } + +export function update_session(data: ChatSessionVo) { + return put('/system/session', data); +} + +export function delete_session(ids: string[]) { + return del(`/system/session/${ids}`); +} diff --git a/src/api/session/types.ts b/src/api/session/types.ts index 4f41fb9..af19924 100644 --- a/src/api/session/types.ts +++ b/src/api/session/types.ts @@ -1,3 +1,5 @@ +import type { Component } from 'vue'; + export interface GetSessionListParams { /** * 创建者 @@ -68,7 +70,8 @@ export interface ChatSessionVo { /** * 主键 */ - id?: number; + // id?: number + id?: string; /** * 备注 */ @@ -85,6 +88,10 @@ export interface ChatSessionVo { * 用户id */ userId?: number; + /** + * 自定义的消息前缀图标字段 + */ + prefixIcon?: Component; } /** @@ -106,7 +113,8 @@ export interface CreateSessionDTO { /** * 主键 */ - id?: number; + // id?: number; + id?: string; /** * 请求参数 */ @@ -114,11 +122,11 @@ export interface CreateSessionDTO { /** * 备注 */ - remark: string; + remark?: string; /** * 会话内容 */ - sessionContent: string; + sessionContent?: string; /** * 会话标题 */ diff --git a/src/layouts/components/Aside/index.vue b/src/layouts/components/Aside/index.vue index 1009831..a51acbd 100644 --- a/src/layouts/components/Aside/index.vue +++ b/src/layouts/components/Aside/index.vue @@ -4,6 +4,7 @@ import type { ConversationItem, GroupableOptions } from 'vue-element-plus-x/type import type { ChatSessionVo } from '@/api/session/types'; import { useRoute, useRouter } from 'vue-router'; import logo from '@/assets/images/logo.png'; +import SvgIcon from '@/components/SvgIcon/index.vue'; import Collapse from '@/layouts/components/Header/components/Collapse.vue'; import { useDesignStore } from '@/stores'; import { useSessionStore } from '@/stores/modules/session'; @@ -13,19 +14,10 @@ const router = useRouter(); const designStore = useDesignStore(); const sessionStore = useSessionStore(); -// const sessionId = computed(() => Number(route.params?.id)); +const sessionId = computed(() => route.params?.id); const conversationsList = computed(() => sessionStore.sessionList); - -/* 创建会话 开始 */ -function handleCreatChat() { - console.log('创建新会话'); - // 创建会话, 跳转到默认聊天 - sessionStore.createSessionBtn(); -} -/* 创建会话 结束 */ - -/* 会话组件 开始 */ -const active = computed(() => (route.params?.id as string) ?? ''); +const loadMoreLoading = computed(() => sessionStore.isLoadingMore); +const active = ref(); // 自定义分组选项 const customGroupOptions: GroupableOptions = { @@ -38,8 +30,27 @@ const customGroupOptions: GroupableOptions = { }, }; +onMounted(async () => { + // 获取会话列表 + await sessionStore.requestSessionList(); + // 高亮最新会话 + if (conversationsList.value.length > 0 && sessionId.value) { + active.value = sessionId.value; + // 通过 ID 查询详情,设置当前会话 (因为有分页) + // sessionStore.currentSession = sessionStore.getSessionById(sessionId.value); + } +}); + +// 创建会话 +function handleCreatChat() { + // 创建会话, 跳转到默认聊天 + sessionStore.createSessionBtn(); +} + +// 切换会话 function handleChange(item: ConversationItem) { - console.log('点击了会话 item', item); + sessionStore.setCurrentSession(item); + active.value = item.id; router.replace({ name: 'chatWithId', params: { @@ -47,11 +58,83 @@ function handleChange(item: ConversationItem) { }, }); } -/* 会话组件 结束 */ -watchEffect(() => { - console.log('active', active.value, '>>>'); -}); +// 处理组件触发的加载更多事件 +async function handleLoadMore() { + if (!sessionStore.hasMore) + return; // 无更多数据时不加载 + await sessionStore.loadMoreSessions(); +} + +// 右键菜单 +function handleMenuCommand(command: string, item: ConversationItem) { + switch (command) { + case 'delete': + ElMessageBox.confirm('删除后,聊天记录将不可恢复。', '确定删除对话?', { + confirmButtonText: '确定', + cancelButtonText: '取消', + type: 'warning', + confirmButtonClass: 'el-button--danger', + cancelButtonClass: 'el-button--info', + roundButton: true, + }) + .then(() => { + // 删除会话 + sessionStore.deleteSessions([item.id!]); + nextTick(() => { + if (item.id === active.value) { + // 如果删除当前会话 返回到默认页 + sessionStore.createSessionBtn(); + } + }); + }) + .catch(() => { + // 取消删除 + }); + break; + case 'rename': + ElMessageBox.prompt('', '编辑对话名称', { + confirmButtonText: '确定', + cancelButtonText: '取消', + inputErrorMessage: '请输入对话名称', + confirmButtonClass: 'el-button--primary', + cancelButtonClass: 'el-button--info', + roundButton: true, + inputValue: item.sessionTitle, // 设置默认值 + inputValidator: (value) => { + if (!value) { + return false; + } + return true; + }, + }).then(({ value }) => { + sessionStore + .updateSession({ + id: item.id!, + sessionTitle: value, + sessionContent: item.sessionContent, + }) + .then(() => { + ElMessage({ + type: 'success', + message: '修改成功', + }); + nextTick(() => { + // 如果是当前会话,则更新当前选中会话信息 + if (sessionStore.currentSession?.id === item.id) { + sessionStore.setCurrentSession({ + ...item, + sessionTitle: value, + }); + } + }); + }); + }); + break; + default: + break; + } +}