fix chat page

langchat-server/src/main/java/cn/tycoding/langchat/server/controller/ConversationController.java

@@ -52,8 +52,7 @@ public class ConversationController {
      */
     @PostMapping
     public R addConversation(@RequestBody LcConversation conversation) {
-        messageService.addConversation(conversation);
-        return R.ok();
+        return R.ok(messageService.addConversation(conversation));
     }
 
     /**

langchat-server/src/main/java/cn/tycoding/langchat/server/service/MessageService.java

@@ -26,7 +26,7 @@ public interface MessageService extends IService<LcMessage> {
     /**
      * 新增会话
      */
-    void addConversation(LcConversation conversation);
+    LcConversation addConversation(LcConversation conversation);
 
     /**
      * 修改会话

langchat-server/src/main/java/cn/tycoding/langchat/server/service/impl/MessageServiceImpl.java

@@ -46,11 +46,16 @@ public class MessageServiceImpl extends ServiceImpl<MessageMapper, LcMessage> im
     }
 
     @Override
-    public void addConversation(LcConversation conversation) {
+    public LcConversation addConversation(LcConversation conversation) {
         String title = conversation.getTitle();
-        conversation.setTitle(StrUtil.isBlank(title) ? "New Chat" : title)
+        if (StrUtil.isBlank(title)) {
+            Long count = conversationMapper.selectCount(Wrappers.lambdaQuery());
+            title = "New Chat" + (count + 1);
+        }
+        conversation.setTitle(title)
                 .setUserId(AuthUtil.getUserId()).setCreateTime(new Date());
         conversationMapper.insert(conversation);
+        return conversation;
     }
 
     @Override

langchat-ui/src/views/modules/chat/index.vue

@@ -29,8 +29,6 @@
   const aiChatId = ref<string>('');
   const inputRef = ref<Ref | null>(null);
 
-  // 初始化加载数据
-  chatStore.loadData();
   const dataSources = computed(() => {
     // 获取当前聊天窗口的数据
     scrollToBottom();
@@ -77,7 +75,7 @@
             role: 'user',
             conversationId: chatStore.curConversation?.id,
           },
-          ({ event }) => {
+          async ({ event }) => {
             const list = event.target.responseText.split('\n\n');
 
             let text = '';
@@ -92,13 +90,10 @@
               }
               text += content;
             });
-            chatStore.updateMessage(aiChatId.value, text, false);
-            scrollToBottomIfAtBottom();
+            await chatStore.updateMessage(aiChatId.value, text, false);
+            await scrollToBottomIfAtBottom();
           }
-        ).catch((err: any) => {
-          console.error(err);
-          chatStore.updateMessage(aiChatId.value, err, true);
-        });
+        ).catch(() => {});
       };
 
       // 调用接口
@@ -170,6 +165,7 @@
   });
 
   onMounted(() => {
+    chatStore.loadData();
     if (inputRef.value && !isMobile.value) {
       inputRef.value?.focus();
     }

langchat-ui/src/views/modules/chat/store/useChatStore.ts

@@ -40,23 +40,20 @@ export const useChatStore = defineStore('chat-store', {
     },
 
     /**
-     * 加载会话窗口和聊天信息
+     * init conversation list and messages
      */
     async loadData() {
       try {
-        // 加载conversation列表
         const data = await getConversations({});
+        const conversationId = router.currentRoute.value.query.conversationId as string;
+        if (conversationId !== undefined && conversationId !== null) {
+          this.active = conversationId;
+          this.messages = await getMessages(conversationId);
+        }
         if (data && data.length > 0) {
-          if (!this.active) {
-            this.active = data[0].id;
-            this.curConversation = data[0];
-            await this.selectConversation(data[0]);
-            await this.selectPath(data[0].id);
-          }
           this.conversations = data;
         } else {
           this.conversations = [];
-          await this.selectPath(undefined);
         }
       } finally {
         this.sideIsLoading = false;
@@ -64,12 +61,20 @@ export const useChatStore = defineStore('chat-store', {
       }
     },
 
-    async selectPath(id: string | undefined) {
-      const chatPath = '/' + router.currentRoute.value.path.split('/')[1];
-      if (id) {
-        return router.replace(chatPath + '/' + id);
+    async selectPath(conversationId: string | undefined, promptId: string | undefined) {
+      const query: any = {};
+      const cur = router.currentRoute.value;
+      if (conversationId !== undefined) {
+        query.conversationId = conversationId;
+      }
+      if (promptId !== undefined) {
+        query.promptId = promptId;
       }
-      return router.replace(chatPath);
+      if (cur.query.promptId !== undefined) {
+        query.promptId = cur.query.promptId;
+      }
+
+      await router.replace({ path: router.currentRoute.value.path, query });
     },
 
     /**
@@ -90,7 +95,7 @@ export const useChatStore = defineStore('chat-store', {
       await this.setEdit('');
       this.curConversation = params;
       this.messages = await getMessages(params.id);
-      await this.selectPath(params.id);
+      await this.selectPath(params.id, undefined);
     },
 
     /**

langchat-ui/src/views/modules/home/components/CardList.vue

@@ -4,16 +4,22 @@
   import { Bot } from '@/api/models';
   import { useRouter } from 'vue-router';
   import { t } from '@/locales';
+  import { useChatStore } from '@/views/modules/chat/store/useChatStore';
+  import { add as addConversation } from '@/api/conversation';
+  import { Conversation } from '@/typings/chat';
 
   interface Props {
     list: Array<Bot>;
   }
-
-  const router = useRouter();
   const props = defineProps<Props>();
+  const chatStore = useChatStore();
+  const router = useRouter();
 
-  async function onUse(id: number) {
-    await router.push({ name: 'Chat', query: { botId: id } });
+  async function onUse(id: string) {
+    const data = (await addConversation({})) as Conversation;
+    chatStore.curConversation = data;
+    await router.push({ name: 'Chat', query: { conversationId: data.id, promptId: id } });
+    chatStore.active = '';
   }
 </script>
 
@@ -49,9 +55,9 @@
                 <div class="flex gap-1">
                   <n-tag v-for="tag in item.tags" :key="tag" size="small">{{ tag }}</n-tag>
                 </div>
-                <n-button @click="onUse(item.id)" size="small" type="success" secondary round>{{
-                  t('home.use')
-                }}</n-button>
+                <n-button @click="onUse(item.id)" size="small" type="success" secondary round>
+                  {{ t('home.use') }}
+                </n-button>
               </div>
             </template>
           </n-thing>

langchat-ui/src/views/modules/home/index.vue

@@ -4,7 +4,7 @@
   import Typed from 'typed.js';
   import CardList from './components/CardList.vue';
   import { Bot } from '@/api/models';
-  import { getBotPage, getTagsList } from '@/api/prompt';
+  import { getBotPage } from '@/api/prompt';
   import { useRouter } from 'vue-router';
   import { t } from '@/locales';