change client service

langchat-aigc/src/main/java/cn/tycoding/langchat/aigc/controller/AigcConversationController.java

@@ -80,7 +80,7 @@ public class AigcConversationController {
      * 获取指定会话下的聊天记录
      */
     @GetMapping("/messages/{conversationId}")
-    public R messages(@PathVariable String conversationId) {
+    public R getMessages(@PathVariable String conversationId) {
         List<AigcMessage> list = aigcMessageService.getMessages(conversationId);
 
         //TODO 处理会话

langchat-aigc/src/main/java/cn/tycoding/langchat/aigc/service/impl/AigcMessageServiceImpl.java

@@ -115,7 +115,7 @@ public class AigcMessageServiceImpl extends ServiceImpl<AigcMessageMapper, AigcM
         // 避免页面渲染压力大，只截取最新的20条数据
         return baseMapper.selectPage(new Page<>(0, 20), Wrappers.<AigcMessage>lambdaQuery()
                 .eq(AigcMessage::getConversationId, conversationId)
-                .orderByDesc(AigcMessage::getCreateTime)
+                .orderByAsc(AigcMessage::getCreateTime)
         ).getRecords();
     }
 

langchat-ui-client/src/views/modules/doc/components/Chat.vue

@@ -25,7 +25,8 @@
   const docStore = useDocStore();
 
   function init() {
-    messages.value = docStore.curMessage;
+    messages.value = docStore.messages as any;
+    console.log('xxx', message.value);
   }
 
   function handleFocus() {
@@ -53,11 +54,11 @@
   const messages = ref<
     {
       id: string;
-      inversion: boolean;
+      role: 'role' | 'assistant';
       error: boolean;
       message: string;
-      time?: number;
-      usedToken?: number;
+      createTime?: any;
+      tokens?: number;
     }[]
   >([]);
 
@@ -74,17 +75,17 @@
       const userChat = {
         id: uuid(),
         error: false,
-        inversion: false,
+        role: 'user',
         message: message.value,
       };
       docStore.addMessage(userChat);
       messages.value.push(userChat, {
         id: id,
         error: false,
-        inversion: true,
+        role: 'assistant',
         message: '',
-        usedToken: 0,
-        time: 0,
+        tokens: 0,
+        createTime: 0,
       });
       const items = messages.value.filter((i) => i.id == id);
       await chat(
@@ -104,8 +105,8 @@
             }
             const { usedToken, done, message, time } = JSON.parse(i.substring(5, i.length));
             if (done) {
-              items[0].usedToken = usedToken;
-              items[0].time = time;
+              items[0].tokens = usedToken;
+              items[0].createTime = time;
               docStore.addMessage(items[0]);
             } else {
               text += message;
@@ -169,7 +170,11 @@
     </header>
     <Message ref="messageRef" :messages="messages" />
 
-    <div v-if="docStore.file.id" class="pt-2 left-0 w-full z-10">
+    <div
+      v-if="docStore.file.id"
+      class="pt-2 left-0 w-full z-10"
+      :class="isMobile ? 'mb-2' : 'mb-6'"
+    >
       <div class="px-8 flex justify-center items-center space-x-2 w-full">
         <n-input
           :disabled="loading"
@@ -178,7 +183,7 @@
           @focus="handleFocus"
           @keypress="handleEnter"
           :autosize="{ minRows: 1, maxRows: 3 }"
-          class="!rounded-full px-2 py-1 mb-2"
+          class="!rounded-full px-2 py-1"
           :placeholder="t('chat.placeholder')"
         >
           <template #suffix>

langchat-ui-client/src/views/modules/doc/components/Message.vue

@@ -7,11 +7,11 @@
 
   interface Props {
     messages: {
-      inversion: boolean;
+      role: 'user' | 'assistant';
       error: boolean;
       message: string;
-      time?: number;
-      usedToken?: number;
+      createTime?: number;
+      tokens?: number;
     }[];
   }
   const message = useMessage();
@@ -89,13 +89,13 @@
       <div class="h-full w-full flex flex-col space-y-3 relative px-5 pt-0">
         <template v-for="item in messages" :key="item">
           <div
-            v-if="!item.inversion"
+            v-if="item.role === 'user'"
             class="flex justify-end p-2 pl-3 pr-3 rounded select-text self-end bg-[#d2f9d1]"
           >
             {{ item.message }}
           </div>
           <div
-            v-if="item.inversion"
+            v-if="item.role === 'assistant'"
             class="flex justify-start items-center rounded-md self-start min-w-[40px] min-h-[33px] bg-[#f4f6f8]"
           >
             <div v-if="item.message == ''" class="flex justify-center items-center w-[55px]">
@@ -105,16 +105,16 @@
               <div v-if="item.error" class="text-red-400" v-text="item.message"></div>
               <div v-else class="markdown-body pb-2" v-html="item.message"></div>
               <div
-                v-if="item.time !== 0"
+                v-if="item.createTime !== 0"
                 class="border-t border-gray-200 pt-2 text-xs text-gray-400 flex flex-row justify-between items-center min-w-[200px]"
               >
                 <div class="flex items-center">
                   <n-button text type="success">
                     <SvgIcon icon="mdi:success" />
                   </n-button>
-                  <span>{{ Number(Number(item.time) / 1000).toFixed(1) }}s</span>
+                  <span>{{ Number(Number(item.createTime) / 1000).toFixed(1) }}s</span>
                   <n-divider class="ml-1 mr-1" vertical />
-                  <span>{{ item.usedToken }} Token</span>
+                  <span>{{ item.tokens }} Token</span>
                 </div>
                 <div class="flex items-center">
                   <n-popover class="custom-popover">

langchat-ui-client/src/views/modules/doc/index.vue

@@ -10,8 +10,8 @@
   const chatRef = ref();
   const docStore = useDocStore();
 
-  function onSelect(item: Oss) {
-    docStore.onSelect(item);
+  async function onSelect(item: Oss) {
+    await docStore.onSelect(item);
     chatRef.value.init();
   }
 </script>

langchat-ui-client/src/views/modules/doc/store/index.ts

@@ -1,16 +1,15 @@
 import { defineStore } from 'pinia';
-import { Oss } from '@/api/models';
 import { toRaw } from 'vue';
+import { getMessages } from '@/api/conversation';
 
 export interface DocState {
-  file: Oss | any;
+  file: any;
   messages:
     | {
         id: string;
         list: any[];
       }[]
     | any[];
-  curMessage: any[];
 }
 
 export const useDocStore = defineStore({
@@ -18,19 +17,13 @@ export const useDocStore = defineStore({
   state: (): DocState => ({
     file: {},
     messages: [],
-    curMessage: [],
   }),
 
   actions: {
-    onSelect(item: Oss) {
+    async onSelect(item: any) {
+      // get messages
+      this.messages = await getMessages(item.id);
       this.file = item;
-      const list = this.messages.filter((i) => i.id == this.file.id);
-      if (list.length > 0) {
-        this.curMessage = list[0].list;
-      } else {
-        this.curMessage = [];
-      }
-      console.log(this.curMessage);
     },
     addMessage(item: any) {
       const list = this.messages.filter((i) => i.id == this.file.id);