fix : 修复文章下载文件名问题

src/views/article-management/detail.vue

@@ -10,7 +10,7 @@
       <el-row gutter="20">
         <el-col :span="24">
           <el-form-item>
-            <div class="article-a" v-html="formData.articleContent"></div>
+            <div class="article-a" v-html="formData.articleContent" @click="clickHandle"></div>
           </el-form-item>
         </el-col>
       </el-row>
@@ -19,12 +19,64 @@
 </template>
 
 <script setup>
-import {ElNotification} from "element-plus";
+import {ElLoading, ElNotification} from "element-plus";
 import {getArticleDetail} from "@/api/article";
+import {downloadFile} from "@/api/project-demand";
 
 const loading = ref(false)
 const formData = ref({})
 const route = useRoute()
+const clickHandle = (e) => {
+  e.preventDefault()
+  if (e.target.nodeName == "A") {
+    let url = e.target.href.split('?')[0];
+    const searchParams = new URLSearchParams(e.target.href.split('?')[1])
+    const fileId = searchParams.get('fileId');
+    const fileName = searchParams.get('fileName');
+    // if(localStorage.getItem("fileUrlList")){
+    // let fileUrlList=JSON.parse(localStorage.getItem("fileUrlList"));
+    // fileUrlList.forEach(item=>{
+    //   if(item.url == e.target.href){
+    //     console.info("🚀 ~method:item -----", item)
+    let item = {
+      url,
+      fileName
+    }
+        // handleDownload(fileId,fileName)
+    download(item)
+    // }else {
+    // e.preventDefault()
+    // }
+    // })
+    // }
+  }
+}
+// const handleDownload = (fileId,fileName) => {
+//   const loading = ElLoading.service({fullscreen: true})
+//   downloadFile(fileId).then(res => {
+//     const blob = new Blob([res])
+//     let a = document.createElement('a')
+//     a.href = URL.createObjectURL(blob)
+//     nextTick(() => {
+//       a.download = fileName
+//       a.click()
+//       loading.close()
+//     })
+//   })
+// }
+const download = (row) => {
+  const x = new window.XMLHttpRequest();
+  x.open('GET', row.url, true);
+  x.responseType = 'blob';
+  x.onload = () => {
+    const url = window.URL.createObjectURL(x.response);
+    const a = document.createElement('a');
+    a.href = url;
+    a.download = row.fileName;
+    a.click();
+  };
+  x.send();
+}
 const getDetailInfo = async () => {
   loading.value = true
   getArticleDetail(route.query.id).then(res => {
@@ -49,9 +101,11 @@ onMounted(async () => {
 
 <style lang="scss">
 .article-a {
-  p {
-    a {
-      color: #409eff;
+  a {
+    color: #409eff !important;
+
+    &:hover {
+      text-decoration: underline !important;
     }
   }
 }