fix: update logout behavior to redirect to login page and clean up formatting in ChatHistoryDrawer.vue and ResetPasswordDrawer.vue

Author: wxg0103

ui/src/views/chat/embed/component/ChatHistoryDrawer.vue

@@ -138,7 +138,7 @@ const openResetPassword = () => {
 
 const handleResetPassword = (param: ResetCurrentUserPasswordRequest) => {
   chatAPI.resetCurrentPassword(param).then(() => {
-    logout()
+    router.push({name: 'login'})
   })
 }
 

ui/src/views/chat/mobile/component/ResetPasswordDrawer.vue

@@ -102,9 +102,7 @@ function resetPassword() {
   resetPasswordFormRef.value?.validate().then(() => {
     chatAPI.resetCurrentPassword(resetPasswordForm.value).then(() => {
       MsgSuccess(t('common.modifySuccess'))
-      chatUser.logout().then(() => {
-        router.push({ name: 'login' })
-      })
+      router.push({name: 'login'})
     })
   })
 }

ui/src/views/chat/pc/index.vue

@@ -40,24 +40,24 @@
                 chatUser.chat_profile.authentication_type === 'password'
               "
             >
-              <img src="@/assets/user-icon.svg" style="width: 54%" alt="" />
+              <img src="@/assets/user-icon.svg" style="width: 54%" alt=""/>
             </el-avatar>
             <el-dropdown v-else trigger="click" type="primary" class="w-full">
               <div class="flex align-center">
                 <el-avatar :size="32">
-                  <img src="@/assets/user-icon.svg" style="width: 54%" alt="" />
+                  <img src="@/assets/user-icon.svg" style="width: 54%" alt=""/>
                 </el-avatar>
                 <span v-show="!isPcCollapse" class="ml-8 color-text-primary">{{
-                  chatUser.chatUserProfile?.nick_name
-                }}</span>
+                    chatUser.chatUserProfile?.nick_name
+                  }}</span>
               </div>
 
               <template #dropdown>
                 <el-dropdown-menu style="min-width: 260px">
                   <div class="flex align-center p-8">
                     <div class="mr-8 flex align-center">
                       <el-avatar :size="40">
-                        <img src="@/assets/user-icon.svg" style="width: 54%" alt="" />
+                        <img src="@/assets/user-icon.svg" style="width: 54%" alt=""/>
                       </el-avatar>
                     </div>
                     <div>
@@ -73,7 +73,9 @@
                     style="padding-top: 8px; padding-bottom: 8px"
                     @click="openResetPassword"
                   >
-                    <el-icon><Lock /></el-icon>
+                    <el-icon>
+                      <Lock/>
+                    </el-icon>
                     {{ $t('views.login.resetPassword') }}
                   </el-dropdown-item>
                   <el-dropdown-item
@@ -82,7 +84,7 @@
                     style="padding-top: 8px; padding-bottom: 8px"
                     @click="logout"
                   >
-                    <AppIcon iconName="app-export" />
+                    <AppIcon iconName="app-export"/>
                     {{ $t('layout.logout') }}
                   </el-dropdown-item>
                 </el-dropdown-menu>
@@ -97,21 +99,21 @@
           @click="isPcCollapse = !isPcCollapse"
         >
           <el-icon>
-            <component :is="isPcCollapse ? 'ArrowRightBold' : 'ArrowLeftBold'" />
+            <component :is="isPcCollapse ? 'ArrowRightBold' : 'ArrowLeftBold'"/>
           </el-icon>
         </el-button>
       </div>
       <div
         class="chat-pc__right chat-background"
         :style="{ backgroundImage: `url(${applicationDetail?.chat_background})` }"
       >
-          <div style="flex: 1">
-            <div class="p-16-24 flex-between">
-              <h4 class="ellipsis-1" style="width: 66%">
-                {{ currentChatName }}
-              </h4>
+        <div style="flex: 1">
+          <div class="p-16-24 flex-between">
+            <h4 class="ellipsis-1" style="width: 66%">
+              {{ currentChatName }}
+            </h4>
 
-              <span class="flex align-center" v-if="currentRecordList.length">
+            <span class="flex align-center" v-if="currentRecordList.length">
                 <AppIcon
                   v-if="paginationConfig.total"
                   iconName="app-chat-record"
@@ -130,73 +132,73 @@
                   <template #dropdown>
                     <el-dropdown-menu>
                       <el-dropdown-item @click="exportMarkdown"
-                        >{{ $t('common.export') }} Markdown</el-dropdown-item
+                      >{{ $t('common.export') }} Markdown</el-dropdown-item
                       >
                       <el-dropdown-item @click="exportHTML"
-                        >{{ $t('common.export') }} HTML</el-dropdown-item
+                      >{{ $t('common.export') }} HTML</el-dropdown-item
                       >
                     </el-dropdown-menu>
                   </template>
                 </el-dropdown>
               </span>
-            </div>
-            <div class="right-height chat-width">
-              <AiChat
-                ref="AiChatRef"
-                v-model:applicationDetails="applicationDetail"
-                :available="applicationAvailable"
-                type="ai-chat"
-                :appId="applicationDetail?.id"
-                :record="currentRecordList"
-                :chatId="currentChatId"
-                executionIsRightPanel
-                @refresh="refresh"
-                @scroll="handleScroll"
-                @open-execution-detail="openExecutionDetail"
-                @openParagraph="openKnowledgeSource"
-                @openParagraphDocument="openParagraphDocument"
-              >
-              </AiChat>
-            </div>
           </div>
-          <div
-            class="execution-detail-panel"
-            :style="`width: ${ rightPanelSize }px`"
-            :resizable="false"
-            collapsible
-          >
-            <div class="p-16 flex-between border-b">
-              <h4 class="medium ellipsis" :title="rightPanelTitle">{{ rightPanelTitle }}</h4>
-              　
-              <div class="flex align-center">
+          <div class="right-height chat-width">
+            <AiChat
+              ref="AiChatRef"
+              v-model:applicationDetails="applicationDetail"
+              :available="applicationAvailable"
+              type="ai-chat"
+              :appId="applicationDetail?.id"
+              :record="currentRecordList"
+              :chatId="currentChatId"
+              executionIsRightPanel
+              @refresh="refresh"
+              @scroll="handleScroll"
+              @open-execution-detail="openExecutionDetail"
+              @openParagraph="openKnowledgeSource"
+              @openParagraphDocument="openParagraphDocument"
+            >
+            </AiChat>
+          </div>
+        </div>
+        <div
+          class="execution-detail-panel"
+          :style="`width: ${ rightPanelSize }px`"
+          :resizable="false"
+          collapsible
+        >
+          <div class="p-16 flex-between border-b">
+            <h4 class="medium ellipsis" :title="rightPanelTitle">{{ rightPanelTitle }}</h4>
+            　
+            <div class="flex align-center">
                 <span v-if="rightPanelType === 'paragraphDocument'" class="mr-4">
                   <el-button text>
-                    <el-icon> <Download /> </el-icon>
+                    <el-icon> <Download/> </el-icon>
                   </el-button>
                 </span>
-                <span v-if="rightPanelType === 'paragraphDocument'">
-                  <el-button text> <app-icon iconName="app-export" size="20" /></el-button>
+              <span v-if="rightPanelType === 'paragraphDocument'">
+                  <el-button text> <app-icon iconName="app-export" size="20"/></el-button>
                 </span>
-                <span>
+              <span>
                   <el-button text @click="closeExecutionDetail">
-                    <el-icon size="20"><Close /></el-icon
-                  ></el-button>
+                    <el-icon size="20"><Close/></el-icon
+                    ></el-button>
                 </span>
-              </div>
-            </div>
-            <div class="execution-detail-content" v-loading="rightPanelLoading">
-              <ParagraphSourceContent
-                v-if="rightPanelType === 'knowledgeSource'"
-                :detail="rightPanelDetail"
-              />
-              <ExecutionDetailContent
-                v-if="rightPanelType === 'executionDetail'"
-                :detail="executionDetail"
-                :type="applicationDetail?.type"
-              />
-              <ParagraphDocumentContent :detail="rightPanelDetail" v-else />
             </div>
           </div>
+          <div class="execution-detail-content" v-loading="rightPanelLoading">
+            <ParagraphSourceContent
+              v-if="rightPanelType === 'knowledgeSource'"
+              :detail="rightPanelDetail"
+            />
+            <ExecutionDetailContent
+              v-if="rightPanelType === 'executionDetail'"
+              :detail="executionDetail"
+              :type="applicationDetail?.type"
+            />
+            <ParagraphDocumentContent :detail="rightPanelDetail" v-else/>
+          </div>
+        </div>
       </div>
     </div>
 
@@ -209,27 +211,30 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted, nextTick, computed, watch } from 'vue'
-import { marked } from 'marked'
-import { saveAs } from 'file-saver'
+import {ref, onMounted, nextTick, computed, watch} from 'vue'
+import {marked} from 'marked'
+import {saveAs} from 'file-saver'
 import chatAPI from '@/api/chat/chat'
 
 import useStore from '@/stores'
 import useResize from '@/layout/hooks/useResize'
-import { hexToRgba } from '@/utils/theme'
-import { useRouter } from 'vue-router'
+import {hexToRgba} from '@/utils/theme'
+import {useRouter} from 'vue-router'
 import ResetPassword from '@/layout/layout-header/avatar/ResetPassword.vue'
-import { t } from '@/locales'
-import type { ResetCurrentUserPasswordRequest } from '@/api/type/user'
-import ExecutionDetailContent from '@/components/ai-chat/component/knowledge-source-component/ExecutionDetailContent.vue'
-import ParagraphSourceContent from '@/components/ai-chat/component/knowledge-source-component/ParagraphSourceContent.vue'
-import ParagraphDocumentContent from '@/components/ai-chat/component/knowledge-source-component/ParagraphDocumentContent.vue'
+import {t} from '@/locales'
+import type {ResetCurrentUserPasswordRequest} from '@/api/type/user'
+import ExecutionDetailContent
+  from '@/components/ai-chat/component/knowledge-source-component/ExecutionDetailContent.vue'
+import ParagraphSourceContent
+  from '@/components/ai-chat/component/knowledge-source-component/ParagraphSourceContent.vue'
+import ParagraphDocumentContent
+  from '@/components/ai-chat/component/knowledge-source-component/ParagraphDocumentContent.vue'
 import HistoryPanel from '@/views/chat/component/HistoryPanel.vue'
-import { cloneDeep } from 'lodash'
+import {cloneDeep} from 'lodash'
 
 useResize()
 
-const { common, chatUser } = useStore()
+const {common, chatUser} = useStore()
 const router = useRouter()
 
 const isCollapse = ref(false)
@@ -245,7 +250,7 @@ watch(
 
 const logout = () => {
   chatUser.logout().then(() => {
-    router.push({ name: 'login' })
+    router.push({name: 'login'})
   })
 }
 
@@ -256,7 +261,7 @@ const openResetPassword = () => {
 
 const handleResetPassword = (param: ResetCurrentUserPasswordRequest) => {
   chatAPI.resetCurrentPassword(param).then(() => {
-    logout()
+    router.push({name: 'login'})
   })
 }
 
@@ -284,7 +289,8 @@ const applicationDetail = computed({
   get: () => {
     return props.application_profile
   },
-  set: (v) => {},
+  set: (v) => {
+  },
 })
 
 const chatLogData = ref<any[]>([])
@@ -305,6 +311,7 @@ function refreshFieldTitle(chatId: string, abstract: string) {
     find.abstract = abstract
   }
 }
+
 function deleteLog(row: any) {
   chatAPI.deleteChat(row.id, left_loading).then(() => {
     if (currentChatId.value === row.id) {
@@ -435,7 +442,7 @@ async function exportMarkdown(): Promise<void> {
     .map((record: any) => `# ${record.problem_text}\n\n${record.answer_text}\n\n`)
     .join('\n')
 
-  const blob: Blob = new Blob([markdownContent], { type: 'text/markdown;charset=utf-8' })
+  const blob: Blob = new Blob([markdownContent], {type: 'text/markdown;charset=utf-8'})
   saveAs(blob, suggestedName)
 }
 
@@ -446,7 +453,7 @@ async function exportHTML(): Promise<void> {
     .join('\n')
   const htmlContent: any = marked(markdownContent)
 
-  const blob: Blob = new Blob([htmlContent], { type: 'text/html;charset=utf-8' })
+  const blob: Blob = new Blob([htmlContent], {type: 'text/html;charset=utf-8'})
   saveAs(blob, suggestedName)
 }
 
@@ -466,6 +473,7 @@ const rightPanelType = ref('')
 const rightPanelLoading = ref(false)
 const executionDetail = ref<any[]>([])
 const rightPanelDetail = ref<any>()
+
 async function openExecutionDetail(row: any) {
   rightPanelSize.value = 400
   rightPanelTitle.value = t('chat.executionDetails.title')
@@ -534,10 +542,12 @@ function closeExecutionDetail() {
       background: #ffffff;
       height: 100%;
       overflow: hidden;
+
       .execution-detail-content {
         flex: 1;
         overflow: hidden;
         height: calc(100% - 63px);
+
         .execution-details {
           padding: 16px;
         }
@@ -550,6 +560,7 @@ function closeExecutionDetail() {
   max-width: 80%;
   margin: 0 auto;
 }
+
 @media only screen and (max-width: 1000px) {
   .chat-width {
     max-width: 100% !important;