From e8365bbe4d85dd21c2512206750a03ffbc36b949 Mon Sep 17 00:00:00 2001
From: Chuck1sn <chuck1inzl@gmail.com>
Date: Wed, 21 May 2025 21:48:00 +0800
Subject: [PATCH] fix bugs

---
 .../zl/mjga/config/ai/ChatModelConfig.java    |  2 +-
 .../mjga/config/ai/DeepSeekChatAssistant.java |  1 -
 frontend/src/components/icons/LoadingIcon.vue | 20 ++++++++++---
 frontend/src/composables/ai/useAiChat.ts      |  1 -
 frontend/src/views/AiChatView.vue             | 29 ++++++++++++-------
 frontend/src/views/PositionView.vue           |  4 +--
 6 files changed, 38 insertions(+), 19 deletions(-)

diff --git a/backend/src/main/java/com/zl/mjga/config/ai/ChatModelConfig.java b/backend/src/main/java/com/zl/mjga/config/ai/ChatModelConfig.java
index b8d57bb..1dbefa4 100644
--- a/backend/src/main/java/com/zl/mjga/config/ai/ChatModelConfig.java
+++ b/backend/src/main/java/com/zl/mjga/config/ai/ChatModelConfig.java
@@ -26,7 +26,7 @@ public class ChatModelConfig {
   public DeepSeekChatAssistant deepSeekChatAssistant(OpenAiStreamingChatModel deepSeekChatModel) {
     return AiServices.builder(DeepSeekChatAssistant.class)
         .streamingChatModel(deepSeekChatModel)
-        .systemMessageProvider(chatMemoryId -> "你是一个叫做「知路 AI」的企业级 AI 助手，能帮助用户回答任何问题。")
+        .systemMessageProvider(chatMemoryId -> deepSeekConfiguration.getPrompt().getSystem())
         .chatMemoryProvider(memoryId -> MessageWindowChatMemory.withMaxMessages(10))
         .build();
   }
diff --git a/backend/src/main/java/com/zl/mjga/config/ai/DeepSeekChatAssistant.java b/backend/src/main/java/com/zl/mjga/config/ai/DeepSeekChatAssistant.java
index 8cfe8cd..7b2f9e1 100644
--- a/backend/src/main/java/com/zl/mjga/config/ai/DeepSeekChatAssistant.java
+++ b/backend/src/main/java/com/zl/mjga/config/ai/DeepSeekChatAssistant.java
@@ -1,7 +1,6 @@
 package com.zl.mjga.config.ai;
 
 import dev.langchain4j.service.MemoryId;
-import dev.langchain4j.service.SystemMessage;
 import dev.langchain4j.service.TokenStream;
 import dev.langchain4j.service.UserMessage;
 import dev.langchain4j.service.memory.ChatMemoryAccess;
diff --git a/frontend/src/components/icons/LoadingIcon.vue b/frontend/src/components/icons/LoadingIcon.vue
index 2a0f62f..5df718d 100644
--- a/frontend/src/components/icons/LoadingIcon.vue
+++ b/frontend/src/components/icons/LoadingIcon.vue
@@ -1,6 +1,18 @@
 <template>
-<svg aria-hidden="true" role="status" class="inline w-4 h-4 me-3 text-white animate-spin" viewBox="0 0 100 101" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z" fill="#E5E7EB"/>
-<path d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z" fill="currentColor"/>
-</svg>
+  <svg aria-hidden="true" role="status" :class="`inline ${size} h-4 me-3 ${textColor} animate-spin`"
+    viewBox="0 0 100 101" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+      d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z"
+      fill="#E5E7EB" />
+    <path
+      d="M93.9676 39.0409C96.393 38.4038 97.8624 35.9116 97.0079 33.5539C95.2932 28.8227 92.871 24.3692 89.8167 20.348C85.8452 15.1192 80.8826 10.7238 75.2124 7.41289C69.5422 4.10194 63.2754 1.94025 56.7698 1.05124C51.7666 0.367541 46.6976 0.446843 41.7345 1.27873C39.2613 1.69328 37.813 4.19778 38.4501 6.62326C39.0873 9.04874 41.5694 10.4717 44.0505 10.1071C47.8511 9.54855 51.7191 9.52689 55.5402 10.0491C60.8642 10.7766 65.9928 12.5457 70.6331 15.2552C75.2735 17.9648 79.3347 21.5619 82.5849 25.841C84.9175 28.9121 86.7997 32.2913 88.1811 35.8758C89.083 38.2158 91.5421 39.6781 93.9676 39.0409Z"
+      fill="currentColor" />
+  </svg>
 </template>
+
+<script setup lang="ts">
+const { size = 'w-4 h-4' , textColor = 'text-white' } = defineProps<{
+  size?: string;
+  textColor?: string;
+}>();
+</script>
diff --git a/frontend/src/composables/ai/useAiChat.ts b/frontend/src/composables/ai/useAiChat.ts
index 0853c22..72ac244 100644
--- a/frontend/src/composables/ai/useAiChat.ts
+++ b/frontend/src/composables/ai/useAiChat.ts
@@ -19,7 +19,6 @@ export const useAiChat = () => {
 
 		try {
 			const baseUrl = `${import.meta.env.VITE_BASE_URL}`;
-
 			await fetchEventSource(`${baseUrl}/ai/chat`, {
 				method: "POST",
 				headers: {
diff --git a/frontend/src/views/AiChatView.vue b/frontend/src/views/AiChatView.vue
index 38b2203..2661044 100644
--- a/frontend/src/views/AiChatView.vue
+++ b/frontend/src/views/AiChatView.vue
@@ -1,15 +1,19 @@
 <template>
-  <div class="flex flex-col px-80 box-border pt-14 min-h-screen max-h-screen overflow-auto" ref="chatContainer">
+  <div class="flex flex-col px-96 box-border pt-14 min-h-screen max-h-screen overflow-auto" ref="chatContainer">
     <div class="flex flex-col gap-y-5 flex-1 pt-14">
-      <li v-for="chatElement in chatElements" :key="chatElement.content" :dir="chatElement.isUser ? 'rtl' : 'ltr'"
-        class="flex items-start gap-2.5">
+      <li v-for="chatElement in chatElements" :key="chatElement.content"
+        :class="['flex items-start gap-2.5', chatElement.isUser ? 'flex-row-reverse' : 'flex-row']">
         <img class="w-8 h-8 rounded-full" src="/trump.jpg" alt="Jese image">
         <div
-          :class="['flex flex-col leading-1.5 p-4 border-gray-200 rounded-e-xl rounded-es-xl dark:bg-gray-700', chatElement.isUser ? 'bg-gray-100' : 'bg-blue-100']">
+          :class="['flex flex-col leading-1.5 p-4 border-gray-200 rounded-e-xl rounded-es-xl dark:bg-gray-700', chatElement.isUser ? 'bg-blue-100' : 'bg-gray-100']">
           <div class="flex items-center space-x-2 rtl:space-x-reverse">
             <span class="text-sm font-semibold text-gray-900 dark:text-white">{{ chatElement.username }}</span>
+            <LoadingIcon textColor="text-gray-900"
+              v-if="isLoading && !chatElement.isUser && chatElement.content === ''" />
           </div>
-          <p class="text-base font-normal py-2.5 text-gray-900 dark:text-white">{{ chatElement.content }}</p>
+          <p class="text-base font-normal py-2.5 text-gray-900 dark:text-white">
+            {{ chatElement.content }}
+          </p>
         </div>
       </li>
     </div>
@@ -19,12 +23,12 @@
         <div class="px-4 py-2 bg-white rounded-t-lg dark:bg-gray-800">
           <label for="comment" class="sr-only"></label>
           <textarea id="comment" rows="3" v-model="inputMessage"
-            class="w-full px-0  text-gray-900 bg-white border-0 dark:bg-gray-800 focus:ring-0 dark:text-white dark:placeholder-gray-400"
+            class="w-full px-0 text-gray-900 bg-white border-0 dark:bg-gray-800 focus:ring-0 dark:text-white dark:placeholder-gray-400"
             placeholder="给知路智能体发送消息" required></textarea>
         </div>
         <div class="flex items-center justify-between px-3 py-2 border-t dark:border-gray-600 border-gray-200">
-          <Button :disabled="inputMessage === ''" :isLoading="isLoading" :loadingContent="'发送中...'"
-            :submitContent="'发送'" :disabledStyle="'bg-blue-400'" :handleClick="handleSendClick" />
+          <Button :disabled="isLoading" :isLoading="isLoading" :loadingContent="'发送中...'" :submitContent="'发送'"
+            :disabledStyle="'bg-blue-400'" :handleClick="handleSendClick" />
           <div class="flex ps-0 space-x-1 rtl:space-x-reverse sm:ps-2">
             <button type="button"
               class="inline-flex justify-center items-center p-2 text-gray-500 rounded-sm cursor-pointer hover:text-gray-900 hover:bg-gray-100 dark:text-gray-400 dark:hover:text-white dark:hover:bg-gray-600">
@@ -65,6 +69,7 @@ import { computed, nextTick, onUnmounted, ref, watch } from "vue";
 import Button from "../components/Button.vue";
 import { useAiChat } from "../composables/ai/useAiChat";
 import useUserStore from "../composables/store/useUserStore";
+import LoadingIcon from "@/components/icons/LoadingIcon.vue";
 
 const { messages, chat, isLoading, cancel } = useAiChat();
 const { user } = useUserStore();
@@ -76,7 +81,7 @@ const chatElements = computed(() => {
 		return {
 			content: message,
 			username: index % 2 === 0 ? user.username : "DeepSeek",
-			isUser: index % 2 !== 0,
+			isUser: index % 2 === 0,
 		};
 	});
 });
@@ -97,7 +102,7 @@ const scrollToBottom = () => {
 };
 
 const handleSendClick = async (event: Event) => {
-  chat(inputMessage.value);
+  await chat(inputMessage.value);
 	inputMessage.value = "";
 	scrollToBottom();
 };
@@ -105,4 +110,8 @@ const handleSendClick = async (event: Event) => {
 onUnmounted(() => {
 	cancel();
 });
+
+const handleStopClick = () => {
+  cancel();
+}
 </script>
diff --git a/frontend/src/views/PositionView.vue b/frontend/src/views/PositionView.vue
index 1c79fd2..4db56b0 100644
--- a/frontend/src/views/PositionView.vue
+++ b/frontend/src/views/PositionView.vue
@@ -62,7 +62,7 @@
             <td class="px-6 py-4 max-w-sm overflow-hidden text-ellipsis">
               <div class="flex items-center gap-x-2">
                 <button @click="handleUpsertPositionClick(position)"
-                  class="flex items-center justify-center min-w-25 gap-x-1  text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5      "
+                  class="flex items-center justify-center whitespace-nowrap gap-x-1  text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-sm px-5 py-2.5      "
                   type="button">
                   <svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
                     <path d="M17.414 2.586a2 2 0 00-2.828 0L7 10.172V13h2.828l7.586-7.586a2 2 0 000-2.828z"></path>
@@ -73,7 +73,7 @@
                   <span>编辑</span>
                 </button>
                 <button
-                  class="flex items-center justify-center min-w-25 gap-x-1
+                  class="flex items-center justify-center whitespace-nowrap gap-x-1
               bg-red-700 hover:bg-red-800   
               focus:ring-red-500  text-white focus:ring-4 focus:outline-none font-medium rounded-lg text-sm px-5 py-2.5 text-center"
                   @click="handleDeletePositionClick(position)" type="button">