From 845c207c3a0442a8f3027a8eb7f49863e0668172 Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Wed, 11 Feb 2026 17:21:22 +0800
Subject: [PATCH] perf: chat share

---
 .../component/answer-content/index.vue        |   6 +-
 .../component/chat-input-operate/index.vue    | 657 +++++++++---------
 .../component/question-content/index.vue      |   9 +-
 ui/src/components/ai-chat/index.scss          |  38 +
 ui/src/components/ai-chat/index.vue           | 123 +++-
 .../components/app-icon/icons/application.ts  |  21 +
 ui/src/locales/lang/en-US/ai-chat.ts          |   2 +
 .../lang/en-US/views/application-overview.ts  |   2 -
 ui/src/locales/lang/zh-CN/ai-chat.ts          |   2 +
 .../lang/zh-CN/views/application-overview.ts  |   2 -
 ui/src/locales/lang/zh-Hant/ai-chat.ts        |   2 +
 .../zh-Hant/views/application-overview.ts     |   2 -
 ui/src/styles/app.scss                        |   3 +
 ui/src/views/chat/component/HistoryPanel.vue  |  19 +-
 .../mobile/component/ChatHistoryDrawer.vue    |  14 +-
 ui/src/views/chat/mobile/index.vue            |  14 +-
 ui/src/views/chat/pc/index.vue                |  58 +-
 17 files changed, 546 insertions(+), 428 deletions(-)

diff --git a/ui/src/components/ai-chat/component/answer-content/index.vue b/ui/src/components/ai-chat/component/answer-content/index.vue
index e2bfe8ad391..c718bf95e18 100644
--- a/ui/src/components/ai-chat/component/answer-content/index.vue
+++ b/ui/src/components/ai-chat/component/answer-content/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="item-content mb-16 lighter">
+  <div class="item-content lighter">
     <template v-for="(answer_text, index) in answer_text_list" :key="index">
       <div class="avatar mr-8" v-if="showAvatar">
         <img v-if="application.avatar" :src="application.avatar" height="28px" width="28px" />
@@ -12,7 +12,7 @@
           'padding-right': showUserAvatar ? 'var(--padding-left)' : '0',
         }"
       >
-        <el-card shadow="always" class="mb-8 border-r-8" style="--el-card-padding: 6px 16px">
+        <el-card shadow="always" class="border-r-8" style="--el-card-padding: 6px 16px">
           <MdRenderer
             v-if="
               (chatRecord.write_ed === undefined || chatRecord.write_ed === true) &&
@@ -60,6 +60,7 @@
         'padding-left': showAvatar ? 'var(--padding-left)' : '0',
         'padding-right': showUserAvatar ? 'var(--padding-left)' : '0',
       }"
+      v-if="!selection"
     >
       <OperationButton
         :type="type"
@@ -90,6 +91,7 @@ const props = defineProps<{
   chatManagement: any
   type: 'log' | 'ai-chat' | 'debug-ai-chat'
   executionIsRightPanel?: boolean
+  selection?: boolean
 }>()
 
 const emit = defineEmits([
diff --git a/ui/src/components/ai-chat/component/chat-input-operate/index.vue b/ui/src/components/ai-chat/component/chat-input-operate/index.vue
index fdc96444a68..b7b49cc16fe 100644
--- a/ui/src/components/ai-chat/component/chat-input-operate/index.vue
+++ b/ui/src/components/ai-chat/component/chat-input-operate/index.vue
@@ -42,7 +42,7 @@
                   @mouseleave.stop="mouseleave()"
                 >
                   <div class="flex align-center">
-                    <img :src="getImgUrl(item && item?.name)" alt="" width="24"/>
+                    <img :src="getImgUrl(item && item?.name)" alt="" width="24" />
                     <div class="ml-4 ellipsis-1" :title="item && item?.name">
                       {{ item && item?.name }}
                     </div>
@@ -53,7 +53,7 @@
                     v-if="showDelete === item.url"
                   >
                     <el-icon style="font-size: 16px; top: 2px">
-                      <CircleCloseFilled/>
+                      <CircleCloseFilled />
                     </el-icon>
                   </div>
                 </div>
@@ -80,7 +80,7 @@
                   @mouseleave.stop="mouseleave()"
                 >
                   <div class="flex align-center">
-                    <img :src="getImgUrl(item && item?.name)" alt="" width="24"/>
+                    <img :src="getImgUrl(item && item?.name)" alt="" width="24" />
                     <div class="ml-4 ellipsis-1" :title="item && item?.name">
                       {{ item && item?.name }}
                     </div>
@@ -91,7 +91,7 @@
                     v-if="showDelete === item.url"
                   >
                     <el-icon style="font-size: 16px; top: 2px">
-                      <CircleCloseFilled/>
+                      <CircleCloseFilled />
                     </el-icon>
                   </div>
                 </div>
@@ -115,7 +115,7 @@
                   @mouseleave.stop="mouseleave()"
                 >
                   <div class="flex align-center">
-                    <img :src="getImgUrl(item && item?.name)" alt="" width="24"/>
+                    <img :src="getImgUrl(item && item?.name)" alt="" width="24" />
                     <div class="ml-4 ellipsis-1" :title="item && item?.name">
                       {{ item && item?.name }}
                     </div>
@@ -126,7 +126,7 @@
                     v-if="showDelete === item.url"
                   >
                     <el-icon style="font-size: 16px; top: 2px">
-                      <CircleCloseFilled/>
+                      <CircleCloseFilled />
                     </el-icon>
                   </div>
                 </div>
@@ -146,7 +146,7 @@
                   v-if="showDelete === item.url"
                 >
                   <el-icon style="font-size: 16px; top: 2px">
-                    <CircleCloseFilled/>
+                    <CircleCloseFilled />
                   </el-icon>
                 </div>
                 <el-image
@@ -173,7 +173,7 @@
                   v-if="showDelete === item.url"
                 >
                   <el-icon style="font-size: 16px; top: 2px">
-                    <CircleCloseFilled/>
+                    <CircleCloseFilled />
                   </el-icon>
                 </div>
                 <video
@@ -213,7 +213,7 @@
 
       <div class="operate flex-between">
         <div>
-          <slot name="userInput"/>
+          <slot name="userInput" />
         </div>
         <div class="flex align-center">
           <template v-if="props.applicationDetails.stt_model_enable">
@@ -223,7 +223,7 @@
                 <AppIcon v-if="isMicrophone" iconName="app-keyboard"></AppIcon>
                 <el-icon v-else>
                   <!-- 录音 -->
-                  <Microphone/>
+                  <Microphone />
                 </el-icon>
               </el-button>
             </span>
@@ -235,13 +235,13 @@
                 v-if="recorderStatus === 'STOP'"
               >
                 <el-icon>
-                  <Microphone/>
+                  <Microphone />
                 </el-icon>
               </el-button>
 
               <div v-else class="operate flex align-center">
                 <el-text type="info"
-                >00:{{ recorderTime < 10 ? `0${recorderTime}` : recorderTime }}</el-text
+                  >00:{{ recorderTime < 10 ? `0${recorderTime}` : recorderTime }}</el-text
                 >
                 <el-button
                   text
@@ -256,59 +256,49 @@
           </template>
 
           <template v-if="recorderStatus === 'STOP' || mode === 'mobile'">
-            <span
-              v-if="props.applicationDetails.file_upload_enable"
-              class="flex align-center ml-4">
+            <span v-if="props.applicationDetails.file_upload_enable" class="flex align-center ml-4">
               <!-- 如果URL地址 -->
-          <el-button
-            v-if="props.applicationDetails.file_upload_setting.url_upload"
-            text
-            :disabled="checkMaxFilesLimit() || loading"
-            class="mt-4"
-            @click="openUrlSetting"
-          >
-                <el-icon><Paperclip/></el-icon>
+              <el-button
+                v-if="props.applicationDetails.file_upload_setting.url_upload"
+                text
+                :disabled="checkMaxFilesLimit() || loading"
+                class="mt-4"
+                @click="openUrlSetting"
+              >
+                <el-icon><Paperclip /></el-icon>
               </el-button>
               <!-- 没有URL地址 -->
-                            <el-upload
-                              v-else
-                              action="#"
-                              multiple
-                              :auto-upload="false"
-                              :show-file-list="false"
-                              :accept="getAcceptList()"
-                              :on-change="(file: any, fileList: any) => uploadFile(file, fileList)"
-                              ref="upload"
-                            >
-                              <el-tooltip
-                                :disabled="mode === 'mobile'"
-                                effect="dark"
-                                placement="top"
-                                popper-class="upload-tooltip-width"
-                              >
-                                <template #content>
-                                  <div class="break-all pre-wrap">
-                                    {{ $t('chat.uploadFile.label') }}：{{
-                                      $t('chat.uploadFile.most')
-                                    }}{{
-                                      props.applicationDetails.file_upload_setting.maxFiles
-                                    }}{{ $t('chat.uploadFile.limit') }}
-                                    {{
-                                      props.applicationDetails.file_upload_setting.fileLimit
-                                    }}MB<br/>{{
-                                      $t('chat.uploadFile.fileType')
-                                    }}：{{
-                                      getAcceptList().replace(/\./g, '').replace(/,/g, '、').toUpperCase()
-                                    }}
-                                  </div>
-                                </template>
-                                                                <el-button text
-                                                                           :disabled="checkMaxFilesLimit() || loading"
-                                                                           class="mt-4">
-                                                                  <el-icon><Paperclip/></el-icon>
-                                                                </el-button>
-                              </el-tooltip>
-                            </el-upload>
+              <el-upload
+                v-else
+                action="#"
+                multiple
+                :auto-upload="false"
+                :show-file-list="false"
+                :accept="getAcceptList()"
+                :on-change="(file: any, fileList: any) => uploadFile(file, fileList)"
+                ref="upload"
+              >
+                <el-tooltip
+                  :disabled="mode === 'mobile'"
+                  effect="dark"
+                  placement="top"
+                  popper-class="upload-tooltip-width"
+                >
+                  <template #content>
+                    <div class="break-all pre-wrap">
+                      {{ $t('chat.uploadFile.label') }}：{{ $t('chat.uploadFile.most')
+                      }}{{ props.applicationDetails.file_upload_setting.maxFiles
+                      }}{{ $t('chat.uploadFile.limit') }}
+                      {{ props.applicationDetails.file_upload_setting.fileLimit }}MB<br />{{
+                        $t('chat.uploadFile.fileType')
+                      }}：{{ getAcceptList().replace(/\./g, '').replace(/,/g, '、').toUpperCase() }}
+                    </div>
+                  </template>
+                  <el-button text :disabled="checkMaxFilesLimit() || loading" class="mt-4">
+                    <el-icon><Paperclip /></el-icon>
+                  </el-button>
+                </el-tooltip>
+              </el-upload>
             </span>
             <el-divider
               direction="vertical"
@@ -328,7 +318,7 @@
                 src="@/assets/icon_send.svg"
                 alt=""
               />
-              <SendIcon v-show="!isDisabledChat && !loading && !uploadLoading"/>
+              <SendIcon v-show="!isDisabledChat && !loading && !uploadLoading" />
             </el-button>
           </template>
         </div>
@@ -345,8 +335,12 @@
 
     <!-- 弹出URL设置框 -->
     <div class="popperURLSetting" v-if="showURLSetting">
-      <el-card shadow="always" class="border-r-8" style="--el-card-padding: 16px"
-               v-if="props.applicationDetails.file_upload_setting.url_upload">
+      <el-card
+        shadow="always"
+        class="border-r-8"
+        style="--el-card-padding: 16px"
+        v-if="props.applicationDetails.file_upload_setting.url_upload"
+      >
         <el-form label-position="top" ref="urlFormRef" :model="urlForm">
           <el-form-item>
             <template #label>
@@ -378,13 +372,10 @@
         </el-form>
         <div class="text-right">
           <el-button @click="showURLSetting = false">{{ $t('common.cancel') }}</el-button>
-          <el-button type="primary" @click="saveUrl">{{
-              $t('common.confirm')
-            }}
-          </el-button>
+          <el-button type="primary" @click="saveUrl">{{ $t('common.confirm') }} </el-button>
         </div>
         <div v-if="props.applicationDetails.file_upload_setting.local_upload">
-          <el-divider style="margin: 16px 0"/>
+          <el-divider style="margin: 16px 0" />
           <el-upload
             action="#"
             multiple
@@ -395,9 +386,8 @@
             ref="upload"
             class="import-button"
           >
-            <el-button class="w-full url-upload-button">{{
-                $t('chat.uploadFile.localUpload')
-              }}
+            <el-button class="w-full url-upload-button"
+              >{{ $t('chat.uploadFile.localUpload') }}
             </el-button>
           </el-upload>
         </div>
@@ -406,15 +396,15 @@
   </div>
 </template>
 <script setup lang="ts">
-import {computed, nextTick, onMounted, reactive, ref, type Ref} from 'vue'
-import {t} from '@/locales'
+import { computed, nextTick, onMounted, reactive, ref, type Ref } from 'vue'
+import { t } from '@/locales'
 import Recorder from 'recorder-core'
 import TouchChat from './TouchChat.vue'
 import applicationApi from '@/api/application/application'
-import {MsgAlert, MsgWarning} from '@/utils/message'
-import {type chatType} from '@/api/type/application'
-import {useRoute, useRouter} from 'vue-router'
-import {getImgUrl} from '@/utils/common'
+import { MsgAlert, MsgWarning } from '@/utils/message'
+import { type chatType } from '@/api/type/application'
+import { useRoute, useRouter } from 'vue-router'
+import { getImgUrl } from '@/utils/common'
 import bus from '@/bus'
 import 'recorder-core/src/engine/mp3'
 import 'recorder-core/src/engine/mp3-engine'
@@ -423,7 +413,7 @@ import chatAPI from '@/api/chat/chat'
 const router = useRouter()
 const route = useRoute()
 const {
-  query: {mode, question},
+  query: { mode, question },
 } = route as any
 const quickInputRef = ref()
 const props = withDefaults(
@@ -472,7 +462,6 @@ const urlForm = reactive({
   type: '',
 })
 
-
 const uploadLoading = computed(() => {
   return Object.values(filePromisionDict.value).length > 0
 })
@@ -494,7 +483,7 @@ const audioExtensions = ['MP3', 'WAV', 'OGG', 'AAC', 'M4A']
 const otherExtensions = ref(['PPT', 'DOC'])
 
 const getAcceptList = () => {
-  const {image, document, audio, video, other} = props.applicationDetails.file_upload_setting
+  const { image, document, audio, video, other } = props.applicationDetails.file_upload_setting
   let accepts: any = []
   if (image) {
     accepts = [...imageExtensions]
@@ -524,15 +513,15 @@ const checkMaxFilesLimit = () => {
   return (
     props.applicationDetails.file_upload_setting.maxFiles <=
     uploadImageList.value.length +
-    uploadDocumentList.value.length +
-    uploadAudioList.value.length +
-    uploadVideoList.value.length +
-    uploadOtherList.value.length
+      uploadDocumentList.value.length +
+      uploadAudioList.value.length +
+      uploadVideoList.value.length +
+      uploadOtherList.value.length
   )
 }
 const filePromisionDict: any = ref<any>({})
 const uploadFile = async (file: any, fileList: any) => {
-  const {maxFiles, fileLimit} = props.applicationDetails.file_upload_setting
+  const { maxFiles, fileLimit } = props.applicationDetails.file_upload_setting
   // 单次上传文件数量限制
   const file_limit_once =
     uploadImageList.value.length +
@@ -697,8 +686,7 @@ const TouchEnd = (bool?: boolean) => {
   }
 }
 // 取消录音控制台日志
-Recorder.CLog = function () {
-}
+Recorder.CLog = function () {}
 
 class RecorderManage {
   recorder?: any
@@ -1004,16 +992,16 @@ onMounted(() => {
       // 获取当前路由信息
       const route = router.currentRoute.value
       // 复制query对象
-      const query = {...route.query}
+      const query = { ...route.query }
       // 删除特定的参数
       delete query.question
       const newRoute =
         Object.entries(query)?.length > 0
           ? route.path +
-          '?' +
-          Object.entries(query)
-            .map(([key, value]) => `${key}=${value}`)
-            .join('&')
+            '?' +
+            Object.entries(query)
+              .map(([key, value]) => `${key}=${value}`)
+              .join('&')
           : route.path
 
       history.pushState(null, '', '/chat' + newRoute)
@@ -1027,257 +1015,262 @@ onMounted(() => {
 })
 
 const mime_types = {
-  "html": "text/html",
-  "htm": "text/html",
-  "shtml": "text/html",
-  "css": "text/css",
-  "xml": "text/xml",
-  "gif": "image/gif",
-  "jpeg": "image/jpeg",
-  "jpg": "image/jpeg",
-  "js": "application/javascript",
-  "atom": "application/atom+xml",
-  "rss": "application/rss+xml",
-  "mml": "text/mathml",
-  "txt": "text/plain",
-  "jad": "text/vnd.sun.j2me.app-descriptor",
-  "wml": "text/vnd.wap.wml",
-  "htc": "text/x-component",
-  "avif": "image/avif",
-  "png": "image/png",
-  "svg": "image/svg+xml",
-  "svgz": "image/svg+xml",
-  "tif": "image/tiff",
-  "tiff": "image/tiff",
-  "wbmp": "image/vnd.wap.wbmp",
-  "webp": "image/webp",
-  "ico": "image/x-icon",
-  "jng": "image/x-jng",
-  "bmp": "image/x-ms-bmp",
-  "woff": "font/woff",
-  "woff2": "font/woff2",
-  "jar": "application/java-archive",
-  "war": "application/java-archive",
-  "ear": "application/java-archive",
-  "json": "application/json",
-  "hqx": "application/mac-binhex40",
-  "doc": "application/msword",
-  "pdf": "application/pdf",
-  "ps": "application/postscript",
-  "docx": "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
-  "xlsx": "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
-  "pptx": "application/vnd.openxmlformats-officedocument.presentationml.presentation",
-  "eps": "application/postscript",
-  "ai": "application/postscript",
-  "rtf": "application/rtf",
-  "m3u8": "application/vnd.apple.mpegurl",
-  "kml": "application/vnd.google-earth.kml+xml",
-  "kmz": "application/vnd.google-earth.kmz",
-  "xls": "application/vnd.ms-excel",
-  "eot": "application/vnd.ms-fontobject",
-  "ppt": "application/vnd.ms-powerpoint",
-  "odg": "application/vnd.oasis.opendocument.graphics",
-  "odp": "application/vnd.oasis.opendocument.presentation",
-  "ods": "application/vnd.oasis.opendocument.spreadsheet",
-  "odt": "application/vnd.oasis.opendocument.text",
-  "wmlc": "application/vnd.wap.wmlc",
-  "wasm": "application/wasm",
-  "7z": "application/x-7z-compressed",
-  "cco": "application/x-cocoa",
-  "jardiff": "application/x-java-archive-diff",
-  "jnlp": "application/x-java-jnlp-file",
-  "run": "application/x-makeself",
-  "pl": "application/x-perl",
-  "pm": "application/x-perl",
-  "prc": "application/x-pilot",
-  "pdb": "application/x-pilot",
-  "rar": "application/x-rar-compressed",
-  "rpm": "application/x-redhat-package-manager",
-  "sea": "application/x-sea",
-  "swf": "application/x-shockwave-flash",
-  "sit": "application/x-stuffit",
-  "tcl": "application/x-tcl",
-  "tk": "application/x-tcl",
-  "der": "application/x-x509-ca-cert",
-  "pem": "application/x-x509-ca-cert",
-  "crt": "application/x-x509-ca-cert",
-  "xpi": "application/x-xpinstall",
-  "xhtml": "application/xhtml+xml",
-  "xspf": "application/xspf+xml",
-  "zip": "application/zip",
-  "bin": "application/octet-stream",
-  "exe": "application/octet-stream",
-  "dll": "application/octet-stream",
-  "deb": "application/octet-stream",
-  "dmg": "application/octet-stream",
-  "iso": "application/octet-stream",
-  "img": "application/octet-stream",
-  "msi": "application/octet-stream",
-  "msp": "application/octet-stream",
-  "msm": "application/octet-stream",
-  "mid": "audio/midi",
-  "midi": "audio/midi",
-  "kar": "audio/midi",
-  "mp3": "audio/mpeg",
-  "ogg": "audio/ogg",
-  "m4a": "audio/x-m4a",
-  "ra": "audio/x-realaudio",
-  "3gpp": "video/3gpp",
-  "3gp": "video/3gpp",
-  "ts": "video/mp2t",
-  "mp4": "video/mp4",
-  "mpeg": "video/mpeg",
-  "mpg": "video/mpeg",
-  "mov": "video/quicktime",
-  "webm": "video/webm",
-  "flv": "video/x-flv",
-  "m4v": "video/x-m4v",
-  "mng": "video/x-mng",
-  "asx": "video/x-ms-asf",
-  "asf": "video/x-ms-asf",
-  "wmv": "video/x-ms-wmv",
-  "avi": "video/x-msvideo",
-  "wav": "audio/wav",
-  "flac": "audio/flac",
-  "aac": "audio/aac",
-  "opus": "audio/opus",
-  "csv": "text/csv",
-  "tsv": "text/tab-separated-values",
-  "ics": "text/calendar",
+  html: 'text/html',
+  htm: 'text/html',
+  shtml: 'text/html',
+  css: 'text/css',
+  xml: 'text/xml',
+  gif: 'image/gif',
+  jpeg: 'image/jpeg',
+  jpg: 'image/jpeg',
+  js: 'application/javascript',
+  atom: 'application/atom+xml',
+  rss: 'application/rss+xml',
+  mml: 'text/mathml',
+  txt: 'text/plain',
+  jad: 'text/vnd.sun.j2me.app-descriptor',
+  wml: 'text/vnd.wap.wml',
+  htc: 'text/x-component',
+  avif: 'image/avif',
+  png: 'image/png',
+  svg: 'image/svg+xml',
+  svgz: 'image/svg+xml',
+  tif: 'image/tiff',
+  tiff: 'image/tiff',
+  wbmp: 'image/vnd.wap.wbmp',
+  webp: 'image/webp',
+  ico: 'image/x-icon',
+  jng: 'image/x-jng',
+  bmp: 'image/x-ms-bmp',
+  woff: 'font/woff',
+  woff2: 'font/woff2',
+  jar: 'application/java-archive',
+  war: 'application/java-archive',
+  ear: 'application/java-archive',
+  json: 'application/json',
+  hqx: 'application/mac-binhex40',
+  doc: 'application/msword',
+  pdf: 'application/pdf',
+  ps: 'application/postscript',
+  docx: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
+  xlsx: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
+  pptx: 'application/vnd.openxmlformats-officedocument.presentationml.presentation',
+  eps: 'application/postscript',
+  ai: 'application/postscript',
+  rtf: 'application/rtf',
+  m3u8: 'application/vnd.apple.mpegurl',
+  kml: 'application/vnd.google-earth.kml+xml',
+  kmz: 'application/vnd.google-earth.kmz',
+  xls: 'application/vnd.ms-excel',
+  eot: 'application/vnd.ms-fontobject',
+  ppt: 'application/vnd.ms-powerpoint',
+  odg: 'application/vnd.oasis.opendocument.graphics',
+  odp: 'application/vnd.oasis.opendocument.presentation',
+  ods: 'application/vnd.oasis.opendocument.spreadsheet',
+  odt: 'application/vnd.oasis.opendocument.text',
+  wmlc: 'application/vnd.wap.wmlc',
+  wasm: 'application/wasm',
+  '7z': 'application/x-7z-compressed',
+  cco: 'application/x-cocoa',
+  jardiff: 'application/x-java-archive-diff',
+  jnlp: 'application/x-java-jnlp-file',
+  run: 'application/x-makeself',
+  pl: 'application/x-perl',
+  pm: 'application/x-perl',
+  prc: 'application/x-pilot',
+  pdb: 'application/x-pilot',
+  rar: 'application/x-rar-compressed',
+  rpm: 'application/x-redhat-package-manager',
+  sea: 'application/x-sea',
+  swf: 'application/x-shockwave-flash',
+  sit: 'application/x-stuffit',
+  tcl: 'application/x-tcl',
+  tk: 'application/x-tcl',
+  der: 'application/x-x509-ca-cert',
+  pem: 'application/x-x509-ca-cert',
+  crt: 'application/x-x509-ca-cert',
+  xpi: 'application/x-xpinstall',
+  xhtml: 'application/xhtml+xml',
+  xspf: 'application/xspf+xml',
+  zip: 'application/zip',
+  bin: 'application/octet-stream',
+  exe: 'application/octet-stream',
+  dll: 'application/octet-stream',
+  deb: 'application/octet-stream',
+  dmg: 'application/octet-stream',
+  iso: 'application/octet-stream',
+  img: 'application/octet-stream',
+  msi: 'application/octet-stream',
+  msp: 'application/octet-stream',
+  msm: 'application/octet-stream',
+  mid: 'audio/midi',
+  midi: 'audio/midi',
+  kar: 'audio/midi',
+  mp3: 'audio/mpeg',
+  ogg: 'audio/ogg',
+  m4a: 'audio/x-m4a',
+  ra: 'audio/x-realaudio',
+  '3gpp': 'video/3gpp',
+  '3gp': 'video/3gpp',
+  ts: 'video/mp2t',
+  mp4: 'video/mp4',
+  mpeg: 'video/mpeg',
+  mpg: 'video/mpeg',
+  mov: 'video/quicktime',
+  webm: 'video/webm',
+  flv: 'video/x-flv',
+  m4v: 'video/x-m4v',
+  mng: 'video/x-mng',
+  asx: 'video/x-ms-asf',
+  asf: 'video/x-ms-asf',
+  wmv: 'video/x-ms-wmv',
+  avi: 'video/x-msvideo',
+  wav: 'audio/wav',
+  flac: 'audio/flac',
+  aac: 'audio/aac',
+  opus: 'audio/opus',
+  csv: 'text/csv',
+  tsv: 'text/tab-separated-values',
+  ics: 'text/calendar',
 }
 
 function getExtensionsByMime(mime: string): string[] {
   return Object.entries(mime_types)
     .filter(([key, value]) => value === mime)
-    .map(([key]) => key);
+    .map(([key]) => key)
 }
 
 const fileUploadOptions = computed(() => [
   {
     label: t('common.fileUpload.image'),
     value: 'image',
-    visible: props.applicationDetails.file_upload_setting.image
+    visible: props.applicationDetails.file_upload_setting.image,
   },
   {
     label: t('common.fileUpload.document'),
     value: 'document',
-    visible: props.applicationDetails.file_upload_setting.document
+    visible: props.applicationDetails.file_upload_setting.document,
   },
   {
     label: t('common.fileUpload.video'),
     value: 'video',
-    visible: props.applicationDetails.file_upload_setting.video
+    visible: props.applicationDetails.file_upload_setting.video,
   },
   {
     label: t('common.fileUpload.audio'),
     value: 'audio',
-    visible: props.applicationDetails.file_upload_setting.audio
+    visible: props.applicationDetails.file_upload_setting.audio,
   },
   {
     label: t('common.fileUpload.other'),
     value: 'other',
-    visible: props.applicationDetails.file_upload_setting.other
-  }
+    visible: props.applicationDetails.file_upload_setting.other,
+  },
 ])
 
 function openUrlSetting() {
   showURLSetting.value = true
-  const visibleOptions = fileUploadOptions.value.filter(option => option.visible)
+  const visibleOptions = fileUploadOptions.value.filter((option) => option.visible)
   if (visibleOptions.length > 0) {
     urlForm.type = visibleOptions[0].value
   }
 }
 
-
 async function saveUrl() {
   const urls = urlForm.source_url.split('\n')
   if (urls.length === 0) {
     MsgWarning(t('chat.uploadFile.invalidUrl'))
     return
   }
-  const {maxFiles, fileLimit} = props.applicationDetails.file_upload_setting
+  const { maxFiles, fileLimit } = props.applicationDetails.file_upload_setting
   const file_limit_once =
     uploadImageList.value.length +
     uploadDocumentList.value.length +
     uploadAudioList.value.length +
     uploadVideoList.value.length +
     uploadOtherList.value.length
-  if (file_limit_once >= maxFiles || urls.length + file_limit_once >= fileLimit || urls.length > fileLimit) {
+  if (
+    file_limit_once >= maxFiles ||
+    urls.length + file_limit_once >= fileLimit ||
+    urls.length > fileLimit
+  ) {
     MsgWarning(t('chat.uploadFile.limitMessage1') + maxFiles + t('chat.uploadFile.limitMessage2'))
     return
   }
   // 允许的 MIME 类型
   const allowedTypes: Record<string, string[]> = {
     image: imageExtensions
-      .map(ext => mime_types[ext.toLowerCase() as keyof typeof mime_types])
+      .map((ext) => mime_types[ext.toLowerCase() as keyof typeof mime_types])
       .filter(Boolean) as string[],
     document: documentExtensions
-      .map(ext => mime_types[ext.toLowerCase() as keyof typeof mime_types])
+      .map((ext) => mime_types[ext.toLowerCase() as keyof typeof mime_types])
       .filter(Boolean) as string[],
     audio: audioExtensions
-      .map(ext => mime_types[ext.toLowerCase() as keyof typeof mime_types])
+      .map((ext) => mime_types[ext.toLowerCase() as keyof typeof mime_types])
       .filter(Boolean) as string[],
     video: videoExtensions
-      .map(ext => mime_types[ext.toLowerCase() as keyof typeof mime_types])
+      .map((ext) => mime_types[ext.toLowerCase() as keyof typeof mime_types])
       .filter(Boolean) as string[],
     other: otherExtensions.value
-      .map(ext => mime_types[ext.toLowerCase() as keyof typeof mime_types])
-      .filter(Boolean) as string[]
-  };
+      .map((ext) => mime_types[ext.toLowerCase() as keyof typeof mime_types])
+      .filter(Boolean) as string[],
+  }
 
   // 校验 URL 是否有效
-  const validUrls = urls.map(u => u.trim()).filter(u => {
-    try {
-      new URL(u);
-      return u !== '';
-    } catch {
-      return false;
-    }
-  });
+  const validUrls = urls
+    .map((u) => u.trim())
+    .filter((u) => {
+      try {
+        new URL(u)
+        return u !== ''
+      } catch {
+        return false
+      }
+    })
 
   if (validUrls.length === 0) {
-    MsgWarning(t('chat.uploadFile.invalidUrl'));
-    return;
+    MsgWarning(t('chat.uploadFile.invalidUrl'))
+    return
   }
 
   const type = urlForm.type
-  const expectedTypes = allowedTypes[type] || [];
-  const validFiles: any[] = [];
+  const expectedTypes = allowedTypes[type] || []
+  const validFiles: any[] = []
 
   // 异步校验单个 URL
   async function processUrl(url: string) {
     try {
-      const appId = props.appId || props.applicationDetails?.id;
+      const appId = props.appId || props.applicationDetails?.id
       const res =
         props.type === 'debug-ai-chat'
-          ? await applicationApi.getFile(appId, {url})
-          : await chatAPI.getFile(appId, {url})
+          ? await applicationApi.getFile(appId, { url })
+          : await chatAPI.getFile(appId, { url })
 
       if (res.data['status_code'] !== 200) {
-        MsgWarning(url + ' ' + t('chat.uploadFile.invalidUrl'));
-        return;
+        MsgWarning(url + ' ' + t('chat.uploadFile.invalidUrl'))
+        return
       }
 
-      const contentType = res.data['Content-Type'] || '';
-      const contentLength = res.data['Content-Length'];
-      const fileSize = contentLength ? parseInt(contentLength, 10) : 0;
+      const contentType = res.data['Content-Type'] || ''
+      const contentLength = res.data['Content-Length']
+      const fileSize = contentLength ? parseInt(contentLength, 10) : 0
 
       // 类型校验
-      if (expectedTypes.length > 0 && !expectedTypes.some(type => contentType.includes(type))) {
-        MsgWarning(url + ' ' + t('chat.uploadFile.urlErrorMessage'));
-        return;
+      if (expectedTypes.length > 0 && !expectedTypes.some((type) => contentType.includes(type))) {
+        MsgWarning(url + ' ' + t('chat.uploadFile.urlErrorMessage'))
+        return
       }
 
       if (fileSize > fileLimit * 1024 * 1024) {
         MsgWarning(url + ' ' + t('chat.uploadFile.sizeLimit') + fileLimit + 'MB')
-        return;
+        return
       }
 
       // 文件名处理
-      let fileName = url.substring(url.lastIndexOf('/') + 1);
-      if (!fileName) fileName = `file_${Date.now()}`;
+      let fileName = url.substring(url.lastIndexOf('/') + 1)
+      if (!fileName) fileName = `file_${Date.now()}`
       if (!fileName.includes('.') && getExtensionsByMime(contentType)) {
-        fileName += '.' + getExtensionsByMime(contentType)[0];
+        fileName += '.' + getExtensionsByMime(contentType)[0]
       }
 
       const fileItem = {
@@ -1286,20 +1279,20 @@ async function saveUrl() {
         url: url,
         type: contentType,
         size: fileSize,
-        status: 'success'
-      };
+        status: 'success',
+      }
 
       // 文档/音频类型需要下载后上传
       if (type === 'document' || type === 'audio' || type === 'other') {
-        const base64Data = res.data.content;
-        const byteString = atob(base64Data.split(',')[1] || base64Data);
-        const mimeString = base64Data.split(',')[0]?.split(':')[1]?.split(';')[0] || contentType;
-        const ab = new ArrayBuffer(byteString.length);
-        const ia = new Uint8Array(ab);
-        for (let i = 0; i < byteString.length; i++) ia[i] = byteString.charCodeAt(i);
+        const base64Data = res.data.content
+        const byteString = atob(base64Data.split(',')[1] || base64Data)
+        const mimeString = base64Data.split(',')[0]?.split(':')[1]?.split(';')[0] || contentType
+        const ab = new ArrayBuffer(byteString.length)
+        const ia = new Uint8Array(ab)
+        for (let i = 0; i < byteString.length; i++) ia[i] = byteString.charCodeAt(i)
 
-        const fileBlob = new Blob([ab], {type: mimeString});
-        const fileObj = new File([fileBlob], fileName, {type: mimeString});
+        const fileBlob = new Blob([ab], { type: mimeString })
+        const fileObj = new File([fileBlob], fileName, { type: mimeString })
 
         const uploadFileItem = {
           uid: fileItem.uid,
@@ -1307,116 +1300,110 @@ async function saveUrl() {
           size: fileSize,
           raw: fileObj,
           status: 'ready',
-          percentage: 0
-        };
+          percentage: 0,
+        }
 
-        await uploadFile(uploadFileItem, [uploadFileItem]);
+        await uploadFile(uploadFileItem, [uploadFileItem])
       } else {
-        validFiles.push(reactive(fileItem));
+        validFiles.push(reactive(fileItem))
       }
     } catch (e) {
-      console.error(e);
+      console.error(e)
       return
     }
   }
 
   // 并行处理所有 URL
-  await Promise.all(validUrls.map(url => processUrl(url)));
+  await Promise.all(validUrls.map((url) => processUrl(url)))
 
   if (validFiles.length > 0) {
-    fileAllList.value.push(...validFiles);
+    fileAllList.value.push(...validFiles)
   }
 
-  showURLSetting.value = false;
-  urlForm.source_url = '';
+  showURLSetting.value = false
+  urlForm.source_url = ''
   urlForm.type = ''
 }
-
-
 </script>
 <style lang="scss" scoped>
-.ai-chat {
-  &__operate {
-    position: relative;
-    width: 100%;
+.ai-chat__operate {
+  position: relative;
+  width: 100%;
+  box-sizing: border-box;
+  z-index: 10;
+
+  :deep(.operate-textarea) {
+    box-shadow: 0px 6px 24px 0px rgba(31, 35, 41, 0.08);
+    background-color: #ffffff;
+    border-radius: 8px;
+    border: 1px solid #ffffff;
     box-sizing: border-box;
-    z-index: 10;
 
-    :deep(.operate-textarea) {
-      box-shadow: 0px 6px 24px 0px rgba(31, 35, 41, 0.08);
-      background-color: #ffffff;
-      border-radius: 8px;
-      border: 1px solid #ffffff;
+    &:has(.el-textarea__inner:focus) {
+      border: 1px solid var(--el-color-primary);
+    }
+
+    .el-textarea__inner {
+      border-radius: 8px !important;
+      box-shadow: none;
+      resize: none;
+      padding: 13px 16px;
       box-sizing: border-box;
+      min-height: 47px !important;
+      height: 0;
+    }
 
-      &:has(.el-textarea__inner:focus) {
-        border: 1px solid var(--el-color-primary);
-      }
+    .operate {
+      padding: 6px 10px;
 
-      .el-textarea__inner {
-        border-radius: 8px !important;
-        box-shadow: none;
-        resize: none;
-        padding: 13px 16px;
-        box-sizing: border-box;
-        min-height: 47px !important;
-        height: 0;
+      .el-icon {
+        font-size: 20px;
       }
 
-      .operate {
-        padding: 6px 10px;
+      .sent-button {
+        max-height: none;
 
         .el-icon {
-          font-size: 20px;
-        }
-
-        .sent-button {
-          max-height: none;
-
-          .el-icon {
-            font-size: 24px;
-          }
+          font-size: 24px;
         }
+      }
 
-        .el-loading-spinner {
-          margin-top: -15px;
+      .el-loading-spinner {
+        margin-top: -15px;
 
-          .circular {
-            width: 31px;
-            height: 31px;
-          }
+        .circular {
+          width: 31px;
+          height: 31px;
         }
       }
     }
+  }
 
-    .file-image {
-      position: relative;
-      overflow: inherit;
+  .file-image {
+    position: relative;
+    overflow: inherit;
 
-      .delete-icon {
-        position: absolute;
-        right: -5px;
-        top: -5px;
-        z-index: 1;
-      }
+    .delete-icon {
+      position: absolute;
+      right: -5px;
+      top: -5px;
+      z-index: 1;
     }
+  }
 
-    .upload-tooltip-width {
-      width: 300px;
-    }
+  .upload-tooltip-width {
+    width: 300px;
   }
 }
 
 @media only screen and (max-width: 768px) {
-  .ai-chat {
-    &__operate {
-      position: fixed;
-      bottom: 0;
-      font-size: 1rem;
+  .ai-chat__operate {
+    position: fixed;
+    bottom: 0;
+    font-size: 1rem;
 
-      .el-icon {
-        font-size: 1.4rem !important;
-      }
+    .el-icon {
+      font-size: 1.4rem !important;
     }
   }
   .popperURLSetting {
diff --git a/ui/src/components/ai-chat/component/question-content/index.vue b/ui/src/components/ai-chat/component/question-content/index.vue
index f19911215c0..2d786ca459b 100644
--- a/ui/src/components/ai-chat/component/question-content/index.vue
+++ b/ui/src/components/ai-chat/component/question-content/index.vue
@@ -79,12 +79,12 @@
                 <el-card shadow="never" style="--el-card-padding: 8px" class="download-file cursor">
                   <div class="download-button flex align-center" @click="downloadFile(item)">
                     <el-icon class="mr-4">
-                      <Download/>
+                      <Download />
                     </el-icon>
                     {{ $t('chat.download') }}
                   </div>
                   <div class="show flex align-center">
-                    <img :src="getImgUrl(item && item?.name)" alt="" width="24"/>
+                    <img :src="getImgUrl(item && item?.name)" alt="" width="24" />
                     <div class="ml-4 ellipsis-1" :title="item && item?.name">
                       {{ item && item?.name }}
                     </div>
@@ -164,7 +164,7 @@
         </el-avatar>
       </div>
     </div>
-    <div class="question-edit-button text-right mt-4">
+    <div class="question-edit-button text-right mt-4" v-if="!selection">
       <div v-if="!isReQuestion && showIcon">
         <el-tooltip
           effect="dark"
@@ -190,7 +190,7 @@ import { type chatType } from '@/api/type/application'
 import { getImgUrl, downloadByURL } from '@/utils/common'
 import { useRoute, useRouter } from 'vue-router'
 import { onMounted, computed, ref, nextTick } from 'vue'
-import {getAttrsArray} from '@/utils/array'
+import { getAttrsArray } from '@/utils/array'
 import { copyClick } from '@/utils/clipboard'
 const route = useRoute()
 const {
@@ -203,6 +203,7 @@ const props = defineProps<{
   sendMessage: (question: string, other_params_data?: any, chat?: chatType) => Promise<boolean>
   type: 'log' | 'ai-chat' | 'debug-ai-chat'
   isLast: boolean
+  selection?: boolean
 }>()
 
 const showIcon = ref<boolean>(false)
diff --git a/ui/src/components/ai-chat/index.scss b/ui/src/components/ai-chat/index.scss
index a391498d86d..436a18d6d01 100644
--- a/ui/src/components/ai-chat/index.scss
+++ b/ui/src/components/ai-chat/index.scss
@@ -28,6 +28,30 @@
       }
     }
   }
+  .video-stop-button {
+    box-shadow: 0px 6px 24px 0px rgba(31, 35, 41, 0.08);
+
+    &:hover {
+      background: #ffffff;
+    }
+  }
+  .el-checkbox-group {
+    font-size: inherit;
+    line-height: inherit;
+  }
+  .is-selected {
+    background: rgba(31, 35, 41, 0.08);
+  }
+  .mul-operation {
+    position: fixed;
+    bottom: 0;
+    right: 0;
+    padding: 16px 24px;
+    box-sizing: border-box;
+    background: #ffffff;
+    z-index: 22;
+    box-shadow: 0px -2px 4px 0px rgba(31, 35, 41, 0.08);
+  }
 }
 
 .chat-width {
@@ -51,3 +75,17 @@
     background: none;
   }
 }
+.chat-pc {
+  &.openLeft {
+    .mul-operation {
+      margin-left: 281px;
+      width: calc(100% - 281px);
+    }
+  }
+  &.hideLeft {
+    .mul-operation {
+      margin-left: 65px;
+      width: calc(100% - 65px);
+    }
+  }
+}
diff --git a/ui/src/components/ai-chat/index.vue b/ui/src/components/ai-chat/index.vue
index 49d29fab2b2..4f9cbe3dc72 100644
--- a/ui/src/components/ai-chat/index.vue
+++ b/ui/src/components/ai-chat/index.vue
@@ -25,40 +25,61 @@
     </div>
     <template v-if="!(isUserInput || isAPIInput) || !firsUserInput || type === 'log'">
       <el-scrollbar ref="scrollDiv" @scroll="handleScrollTop">
-        <div ref="dialogScrollbar" class="ai-chat__content p-16" id="chatListId">
+        <div
+          ref="dialogScrollbar"
+          class="ai-chat__content p-16"
+          id="chatListId"
+          :style="{ marginBottom: selection ? '65px' : '' }"
+        >
           <PrologueContent
             :type="type"
             :application="applicationDetails"
             :available="available"
             :send-message="sendMessage"
           ></PrologueContent>
-
-          <template v-for="(item, index) in chatList" :key="index">
-            <!-- 问题 -->
-            <QuestionContent
-              :chat-management="ChatManagement"
-              :type="type"
-              :application="applicationDetails"
-              :send-message="sendMessage"
-              :chat-record="item"
-              :is-last="index >= chatList.length - 1"
-            ></QuestionContent>
-            <!-- 回答 -->
-            <AnswerContent
-              :application="applicationDetails"
-              :loading="loading"
-              v-model:chat-record="chatList[index]"
-              :type="type"
-              :send-message="sendMessage"
-              :chat-management="ChatManagement"
-              :executionIsRightPanel="props.executionIsRightPanel"
-              @open-execution-detail="emit('openExecutionDetail', chatList[index])"
-              @openParagraph="emit('openParagraph', chatList[index])"
-              @openParagraphDocument="
-                (val: any) => emit('openParagraphDocument', chatList[index], val)
-              "
-            ></AnswerContent>
-          </template>
+          <el-checkbox-group v-model="multipleSelectionChat" @change="handleCheckedChatChange">
+            <template v-for="(item, index) in chatList" :key="index">
+              <div class="flex-between w-full">
+                <el-checkbox :value="item.id" v-if="selection" />
+                <div
+                  class="w-full border-r-8"
+                  :class="selection ? 'is-selected p-12 mt-8 mb-8' : 'mt-24'"
+                >
+                  <!-- 问题 -->
+                  <QuestionContent
+                    :chat-management="ChatManagement"
+                    :type="type"
+                    :application="applicationDetails"
+                    :send-message="sendMessage"
+                    :chat-record="item"
+                    :is-last="index >= chatList.length - 1"
+                    :selection="selection"
+                  ></QuestionContent>
+                </div>
+              </div>
+              <div class="flex align-center w-full">
+                <el-checkbox :value="item.id" v-if="selection" />
+                <div class="w-full border-r-8" :class="selection ? 'is-selected p-12' : ''">
+                  <!-- 回答 -->
+                  <AnswerContent
+                    :application="applicationDetails"
+                    :loading="loading"
+                    v-model:chat-record="chatList[index]"
+                    :type="type"
+                    :send-message="sendMessage"
+                    :chat-management="ChatManagement"
+                    :executionIsRightPanel="props.executionIsRightPanel"
+                    @open-execution-detail="emit('openExecutionDetail', chatList[index])"
+                    @openParagraph="emit('openParagraph', chatList[index])"
+                    @openParagraphDocument="
+                      (val: any) => emit('openParagraphDocument', chatList[index], val)
+                    "
+                    :selection="selection"
+                  ></AnswerContent>
+                </div>
+              </div>
+            </template>
+          </el-checkbox-group>
           <TransitionContent
             v-if="transcribing"
             :text="t('chat.inputPlaceholder.recorderLoading')"
@@ -73,6 +94,21 @@
         <el-button v-if="isBottom" circle class="back-bottom-button" @click="setScrollBottom">
           <el-icon><ArrowDownBold /></el-icon>
         </el-button>
+        <div class="mul-operation border-t w-full" v-if="selection === true">
+          <div class="flex-between chat-width">
+            <el-checkbox v-model="checkAll" @change="handleCheckAllChange">
+              {{ $t('common.allCheck') }}</el-checkbox
+            >
+            <div>
+              <el-button @click="cancelCheckHandle">
+                {{ $t('common.cancel') }}
+              </el-button>
+              <el-button type="primary">
+                {{ $t('chat.copyLinkText') }}
+              </el-button>
+            </div>
+          </div>
+        </div>
         <ChatInputOperate
           :app-id="appId"
           :application-details="applicationDetails"
@@ -85,7 +121,7 @@
           v-model:chat-id="chartOpenId"
           v-model:loading="loading"
           v-model:show-user-input="showUserInput"
-          v-if="type !== 'log'"
+          v-else-if="type !== 'log'"
         >
           <template #userInput>
             <el-button
@@ -135,6 +171,7 @@ import ChatInputOperate from '@/components/ai-chat/component/chat-input-operate/
 import PrologueContent from '@/components/ai-chat/component/prologue-content/index.vue'
 import UserForm from '@/components/ai-chat/component/user-form/index.vue'
 import Control from '@/components/ai-chat/component/control/index.vue'
+import type { CheckboxValueType } from 'element-plus'
 import { t } from '@/locales'
 import bus from '@/bus'
 import { throttle } from 'lodash-es'
@@ -159,6 +196,8 @@ const props = withDefaults(
     available?: boolean
     chatId?: string
     executionIsRightPanel?: boolean
+    chatRecord: chatType
+    selection?: boolean
   }>(),
   {
     applicationDetails: () => ({}),
@@ -172,6 +211,7 @@ const emit = defineEmits([
   'openExecutionDetail',
   'openParagraph',
   'openParagraphDocument',
+  'update:selection',
 ])
 const { application, common, chatUser } = useStore()
 const isMobile = computed(() => {
@@ -254,6 +294,23 @@ watch(
   },
 )
 
+// 选择对话分享
+const checkAll = ref(false)
+const multipleSelectionChat = ref<any[]>([])
+
+const handleCheckAllChange = (val: CheckboxValueType) => {
+  multipleSelectionChat.value = val ? chatList.value.map((v) => v.id) : []
+}
+const handleCheckedChatChange = (value: CheckboxValueType[]) => {
+  const checkedCount = value.length
+  checkAll.value = checkedCount === chatList.value.length
+}
+function cancelCheckHandle() {
+  checkAll.value = false
+  multipleSelectionChat.value = []
+  emit('update:selection', false)
+}
+
 const toggleUserInput = () => {
   showUserInput.value = !showUserInput.value
   if (showUserInput.value) {
@@ -800,14 +857,6 @@ defineExpose({
   max-width: 400px;
 }
 
-.video-stop-button {
-  box-shadow: 0px 6px 24px 0px rgba(31, 35, 41, 0.08);
-
-  &:hover {
-    background: #ffffff;
-  }
-}
-
 @media only screen and (max-width: 768px) {
   .firstUserInput {
     .user-form-container {
diff --git a/ui/src/components/app-icon/icons/application.ts b/ui/src/components/app-icon/icons/application.ts
index f3d492dea70..7a27c926203 100644
--- a/ui/src/components/app-icon/icons/application.ts
+++ b/ui/src/components/app-icon/icons/application.ts
@@ -741,4 +741,25 @@ export default {
       ])
     },
   },
+  'app-share': {
+    iconReader: () => {
+      return h('i', [
+        h(
+          'svg',
+          {
+            style: { height: '100%', width: '100%' },
+            viewBox: '0 0 1024 1024',
+            version: '1.1',
+            xmlns: 'http://www.w3.org/2000/svg',
+          },
+          [
+            h('path', {
+              d: 'M512.682667 320.426667V85.76c0-5.76 2.304-11.306667 6.4-15.36a22.186667 22.186667 0 0 1 31.146666 0l421.504 418.816a32.298667 32.298667 0 0 1 0 46.08l-421.546666 418.389333a22.101333 22.101333 0 0 1-15.530667 6.357334 21.845333 21.845333 0 0 1-21.973333-21.717334v-233.642666h-43.861334c-170.197333 0-299.093333 34.176-377.386666 134.698666-6.485333 8.362667-13.525333 16.896-23.808 30.165334a11.861333 11.861333 0 0 1-7.68 4.906666c-5.888 0.768-10.496-2.346667-11.946667-9.216A355.029333 355.029333 0 0 1 42.666667 804.096C42.666667 541.269333 253.098667 320.426667 512.682667 320.426667z m0 85.589333c-168.32 0-324.352 124.714667-363.264 270.805333 87.381333-52.224 238.122667-58.026667 362.154666-58.026666H597.333333v149.248l277.632-255.829334L597.333333 234.666667v170.709333l-84.608 0.64z',
+              fill: 'currentColor',
+            }),
+          ],
+        ),
+      ])
+    },
+  },
 }
diff --git a/ui/src/locales/lang/en-US/ai-chat.ts b/ui/src/locales/lang/en-US/ai-chat.ts
index 5e83a78769b..0d63991a2bb 100644
--- a/ui/src/locales/lang/en-US/ai-chat.ts
+++ b/ui/src/locales/lang/en-US/ai-chat.ts
@@ -144,4 +144,6 @@ export default {
     questionPadded: 'Padded Question',
   },
   editTitle: 'Edit Title',
+  share: 'Share',
+  copyLinkText: 'Copy Link',
 }
diff --git a/ui/src/locales/lang/en-US/views/application-overview.ts b/ui/src/locales/lang/en-US/views/application-overview.ts
index 7f25edfe2b7..120de61462f 100644
--- a/ui/src/locales/lang/en-US/views/application-overview.ts
+++ b/ui/src/locales/lang/en-US/views/application-overview.ts
@@ -4,8 +4,6 @@ export default {
     publicAccessLink: 'Public URL',
     openText: 'On',
     closeText: 'Off',
-    copyLinkText: 'Copy Link',
-    refreshLinkText: 'Refresh Link',
     demo: 'Preview',
     embedInWebsite: 'Get Embed Code',
     accessControl: 'Access Control',
diff --git a/ui/src/locales/lang/zh-CN/ai-chat.ts b/ui/src/locales/lang/zh-CN/ai-chat.ts
index 8b838d2d0bc..068b87149ec 100644
--- a/ui/src/locales/lang/zh-CN/ai-chat.ts
+++ b/ui/src/locales/lang/zh-CN/ai-chat.ts
@@ -141,4 +141,6 @@ export default {
     questionPadded: '优化后问题',
   },
   editTitle: '编辑标题',
+  share: '分享',
+  copyLinkText: '复制链接',
 }
diff --git a/ui/src/locales/lang/zh-CN/views/application-overview.ts b/ui/src/locales/lang/zh-CN/views/application-overview.ts
index de95ebae202..ae01266a31f 100644
--- a/ui/src/locales/lang/zh-CN/views/application-overview.ts
+++ b/ui/src/locales/lang/zh-CN/views/application-overview.ts
@@ -4,8 +4,6 @@ export default {
     publicAccessLink: '公开访问链接',
     openText: '开',
     closeText: '关',
-    copyLinkText: '复制链接',
-    refreshLinkText: '刷新链接',
     demo: '演示',
     embedInWebsite: '嵌入第三方',
     accessControl: '访问限制',
diff --git a/ui/src/locales/lang/zh-Hant/ai-chat.ts b/ui/src/locales/lang/zh-Hant/ai-chat.ts
index 40efceaa1fc..d1ac1419300 100644
--- a/ui/src/locales/lang/zh-Hant/ai-chat.ts
+++ b/ui/src/locales/lang/zh-Hant/ai-chat.ts
@@ -142,4 +142,6 @@ export default {
     questionPadded: '優化後問題',
   },
   editTitle: '編輯標題',
+  share: '分享',
+  copyLinkText: '複製連結',
 }
diff --git a/ui/src/locales/lang/zh-Hant/views/application-overview.ts b/ui/src/locales/lang/zh-Hant/views/application-overview.ts
index 8c7304a2dce..2666205c99d 100644
--- a/ui/src/locales/lang/zh-Hant/views/application-overview.ts
+++ b/ui/src/locales/lang/zh-Hant/views/application-overview.ts
@@ -4,8 +4,6 @@ export default {
     publicAccessLink: '公開訪問連結',
     openText: '開',
     closeText: '關',
-    copyLinkText: '複製連結',
-    refreshLinkText: '重新整理連結',
     demo: '示範',
     embedInWebsite: '嵌入第三方',
     accessControl: '訪問限制',
diff --git a/ui/src/styles/app.scss b/ui/src/styles/app.scss
index deaa298358d..7decf417a92 100644
--- a/ui/src/styles/app.scss
+++ b/ui/src/styles/app.scss
@@ -216,6 +216,9 @@ h5 {
 .p-8 {
   padding: var(--app-base-px);
 }
+.p-12 {
+  padding: calc(var(--app-base-px) + 4px);
+}
 .p-16 {
   padding: calc(var(--app-base-px) * 2);
 }
diff --git a/ui/src/views/chat/component/HistoryPanel.vue b/ui/src/views/chat/component/HistoryPanel.vue
index b3e8c615658..84f5df2e904 100644
--- a/ui/src/views/chat/component/HistoryPanel.vue
+++ b/ui/src/views/chat/component/HistoryPanel.vue
@@ -86,6 +86,13 @@
 
                         <template #dropdown>
                           <el-dropdown-menu>
+                            <el-dropdown-item
+                              @click.stop="shareHandle()"
+                              :disabled="currentChatId !== row.id"
+                            >
+                              <AppIcon iconName="app-share" class="color-secondary"></AppIcon>
+                              {{ $t('chat.share') }}
+                            </el-dropdown-item>
                             <el-dropdown-item @click.stop="editLogTitle(row)">
                               <AppIcon iconName="app-edit" class="color-secondary"></AppIcon>
                               {{ $t('common.edit') }}
@@ -219,7 +226,14 @@ const props = defineProps<{
   currentChatId: string
   isPcCollapse?: boolean
 }>()
-const emit = defineEmits(['newChat', 'clickLog', 'deleteLog', 'refreshFieldTitle', 'clearChat'])
+const emit = defineEmits([
+  'newChat',
+  'clickLog',
+  'deleteLog',
+  'refreshFieldTitle',
+  'clearChat',
+  'clickShare',
+])
 
 const showHistory = computed(() => {
   return props.applicationDetail?.show_history != null || undefined
@@ -242,6 +256,9 @@ function mouseenter(row: any) {
   mouseId.value = row.id
 }
 
+const shareHandle = () => {
+  emit('clickShare')
+}
 const newChat = () => {
   emit('newChat')
 }
diff --git a/ui/src/views/chat/mobile/component/ChatHistoryDrawer.vue b/ui/src/views/chat/mobile/component/ChatHistoryDrawer.vue
index 6826ca51347..60748c3a86b 100644
--- a/ui/src/views/chat/mobile/component/ChatHistoryDrawer.vue
+++ b/ui/src/views/chat/mobile/component/ChatHistoryDrawer.vue
@@ -18,6 +18,7 @@
         @delete-log="deleteChatLog"
         @refreshFieldTitle="refreshFieldTitle"
         @clear-chat="clearChat"
+        @clickShare="clickShareHandle"
       >
         <div class="flex align-center user-info p-16" @click="toUserCenter">
           <el-avatar
@@ -52,10 +53,21 @@ const props = defineProps<{
   currentChatId: string
 }>()
 
-const emit = defineEmits(['newChat', 'clickLog', 'deleteLog', 'refreshFieldTitle', 'clearChat'])
+const emit = defineEmits([
+  'newChat',
+  'clickLog',
+  'deleteLog',
+  'refreshFieldTitle',
+  'clearChat',
+  'clickShare',
+])
 
 const { chatUser } = useStore()
 
+const clickShareHandle = () => {
+  emit('clickShare')
+}
+
 const clearChat = () => {
   emit('clearChat')
 }
diff --git a/ui/src/views/chat/mobile/index.vue b/ui/src/views/chat/mobile/index.vue
index b3a9e3c3d16..cb3c547cc53 100644
--- a/ui/src/views/chat/mobile/index.vue
+++ b/ui/src/views/chat/mobile/index.vue
@@ -1,7 +1,6 @@
 <template>
   <div
     class="chat-mobile layout-bg chat-background"
-    :class="classObj"
     :style="{
       '--el-color-primary': applicationDetail?.custom_theme?.theme_color,
       '--el-color-primary-light-9': hexToRgba(
@@ -66,7 +65,7 @@
           type="ai-chat"
           @refresh="refresh"
           @scroll="handleScroll"
-          class="AiChat-embed"
+          v-model:selection="showSelection"
         >
         </AiChat>
       </div>
@@ -82,6 +81,7 @@
       @delete-log="deleteLog"
       @refreshFieldTitle="refreshFieldTitle"
       @clear-chat="clearChat"
+      @clickShare="clickShareHandle"
     />
   </div>
 </template>
@@ -130,11 +130,11 @@ const customStyle = computed(() => {
   }
 })
 
-const classObj = computed(() => {
-  return {
-    mobile: common.isMobile(),
-  }
-})
+const showSelection = ref(false)
+const clickShareHandle = () => {
+  showSelection.value = true
+  show.value = false
+}
 
 function clearChat() {
   chatAPI.clearChat(left_loading).then(() => {
diff --git a/ui/src/views/chat/pc/index.vue b/ui/src/views/chat/pc/index.vue
index d53b1d70a4f..908969bb94e 100644
--- a/ui/src/views/chat/pc/index.vue
+++ b/ui/src/views/chat/pc/index.vue
@@ -31,6 +31,7 @@
           @delete-log="deleteLog"
           @clear-chat="clearChat"
           @refreshFieldTitle="refreshFieldTitle"
+          @clickShare="clickShareHandle"
           :isPcCollapse="isPcCollapse"
         >
           <div class="user-info p-16 cursor">
@@ -124,12 +125,14 @@
               <span v-if="paginationConfig.total" class="lighter">
                 {{ paginationConfig.total }} {{ $t('chat.question_count') }}
               </span>
+              <el-button text class="ml-12" @click="clickShareHandle">
+                <AppIcon iconName="app-share"></AppIcon>
+              </el-button>
+
               <el-dropdown class="ml-8">
-                <AppIcon
-                  iconName="app-export"
-                  class="cursor"
-                  :title="$t('chat.exportRecords')"
-                ></AppIcon>
+                <el-button text>
+                  <AppIcon iconName="app-export" :title="$t('chat.exportRecords')"></AppIcon>
+                </el-button>
                 <template #dropdown>
                   <el-dropdown-menu>
                     <el-dropdown-item @click="exportMarkdown"
@@ -161,6 +164,7 @@
               @open-execution-detail="openExecutionDetail"
               @openParagraph="openKnowledgeSource"
               @openParagraphDocument="openParagraphDocument"
+              v-model:selection="showSelection"
             >
             </AiChat>
           </div>
@@ -256,16 +260,15 @@ const openPDFExport = () => {
   pdfExportRef.value?.open(document.getElementById('chatListId'))
 }
 const route = useRoute()
-const isCollapse = ref(false)
 const isPcCollapse = ref(false)
-watch(
-  () => common.device,
-  () => {
-    if (common.isMobile()) {
-      isPcCollapse.value = false
-    }
-  },
-)
+// watch(
+//   () => common.device,
+//   () => {
+//     if (common.isMobile()) {
+//       isPcCollapse.value = false
+//     }
+//   },
+// )
 
 const logout = () => {
   chatUser.logout().then(() => {
@@ -275,6 +278,10 @@ const logout = () => {
     })
   })
 }
+const showSelection = ref(false)
+const clickShareHandle = () => {
+  showSelection.value = true
+}
 
 const resetPasswordRef = ref<InstanceType<typeof ResetPassword>>()
 const openResetPassword = () => {
@@ -289,9 +296,8 @@ const handleResetPassword = (param: ResetCurrentUserPasswordRequest) => {
 
 const classObj = computed(() => {
   return {
-    mobile: common.isMobile(),
-    hideLeft: !isCollapse.value,
-    openLeft: isCollapse.value,
+    hideLeft: isPcCollapse.value,
+    openLeft: !isPcCollapse.value,
   }
 })
 
@@ -387,9 +393,6 @@ function newChat() {
   closeExecutionDetail()
   currentChatId.value = 'new'
   currentChatName.value = t('chat.createChat')
-  if (common.isMobile()) {
-    isCollapse.value = false
-  }
 }
 
 const chatLogPagination = ref({
@@ -466,9 +469,6 @@ const clickListHandle = (item: any) => {
       }
     }
   }
-  if (common.isMobile()) {
-    isCollapse.value = false
-  }
 }
 
 function refresh(id: string) {
@@ -619,11 +619,6 @@ function closeExecutionDetail() {
   }
 }
 
-.chat-width {
-  max-width: 80%;
-  margin: 0 auto;
-}
-
 .chat-pc__right {
   width: calc(100vw - 280px);
   --execution-detail-panel-width: 400px;
@@ -632,11 +627,4 @@ function closeExecutionDetail() {
     width: var(--execution-detail-panel-width, 400px);
   }
 }
-
-@media only screen and (max-width: 1000px) {
-  .chat-width {
-    max-width: 100% !important;
-    margin: 0 auto;
-  }
-}
 </style>