From 98db08d2638ed8c1bad84a7acc96bda38dffb2c2 Mon Sep 17 00:00:00 2001
From: wangdan-fit2cloud <dan.wang@fit2cloud.com>
Date: Fri, 22 Nov 2024 17:53:39 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=B8=8A=E4=BC=A0=E6=96=87=E4=BB=B6?=
 =?UTF-8?q?=E5=AF=B9=E8=AF=9D=E5=A2=9E=E5=8A=A0=E6=96=87=E4=BB=B6=E4=B8=8B?=
 =?UTF-8?q?=E8=BD=BD=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../component/chat-input-operate/index.vue    |  2 +-
 .../component/question-content/index.vue      | 49 ++++++++++++++-----
 ui/src/utils/utils.ts                         | 11 +++++
 3 files changed, 48 insertions(+), 14 deletions(-)

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 bb29ba29f..4ca225bd9 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
@@ -24,7 +24,7 @@
                     <el-icon><CircleCloseFilled /></el-icon>
                   </div>
                   <img :src="getImgUrl(item && item?.name)" alt="" width="24" />
-                  <div class="ml-4 ellipsis" :title="item && item?.name">
+                  <div class="ml-4 ellipsis" style="max-width: 160px" :title="item && item?.name">
                     {{ item && item?.name }}
                   </div>
                 </div>
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 6c0bd3915..28355a6e5 100644
--- a/ui/src/components/ai-chat/component/question-content/index.vue
+++ b/ui/src/components/ai-chat/component/question-content/index.vue
@@ -18,10 +18,13 @@
         <div class="mb-8" v-if="document_list.length">
           <el-space wrap>
             <template v-for="(item, index) in document_list" :key="index">
-              <el-card shadow="never" style="--el-card-padding: 8px" class="file cursor">
-                <div class="flex align-center">
+              <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 /></el-icon>点击下载文件
+                </div>
+                <div class="show flex align-center">
                   <img :src="getImgUrl(item && item?.name)" alt="" width="24" />
-                  <div class="ml-4 ellipsis" :title="item && item?.name">
+                  <div class="ml-4 ellipsis" style="max-width: 150px" :title="item && item?.name">
                     {{ item && item?.name }}
                   </div>
                 </div>
@@ -55,7 +58,7 @@
 </template>
 <script setup lang="ts">
 import { type chatType } from '@/api/type/application'
-import { getImgUrl, getAttrsArray } from '@/utils/utils'
+import { getImgUrl, getAttrsArray, downloadByURL } from '@/utils/utils'
 import { onMounted, computed } from 'vue'
 const props = defineProps<{
   application: any
@@ -80,13 +83,33 @@ const image_list = computed(() => {
   }
 })
 
-onMounted(() => {
-  // console.log(props.chatRecord.execution_details)
-  // if (props.chatRecord.execution_details?.length > 0) {
-  //   props.chatRecord.execution_details[0].image_list?.forEach((image: any) => {
-  //     console.log('image', image.name, image.url)
-  //   })
-  // }
-})
+function downloadFile(item: any) {
+  downloadByURL(item.url, item.name)
+}
+
+onMounted(() => {})
 </script>
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.download-file {
+  width: 200px;
+  height: 43px;
+  &:hover {
+    color: var(--el-color-primary);
+    border: 1px solid var(--el-color-primary);
+    .download-button {
+      display: block;
+      text-align: center;
+      line-height: 26px;
+    }
+    .show {
+      display: none;
+    }
+  }
+  .show {
+    display: block;
+  }
+  .download-button {
+    display: none;
+  }
+}
+</style>
diff --git a/ui/src/utils/utils.ts b/ui/src/utils/utils.ts
index b4a87f38c..066399032 100644
--- a/ui/src/utils/utils.ts
+++ b/ui/src/utils/utils.ts
@@ -88,3 +88,14 @@ export function getAttrsArray(array: Array<any>, attr: string) {
 export function getSum(array: Array<any>) {
   return array.reduce((total, item) => total + item, 0)
 }
+
+// 下载
+export function downloadByURL(url: string, name: string) {
+  const a = document.createElement('a')
+  a.setAttribute('href', url)
+  a.setAttribute('target', '_blank')
+  a.setAttribute('download', name)
+  document.body.appendChild(a)
+  a.click()
+  document.body.removeChild(a)
+}