feat: 文章管理增加附件上传/删除/下载功能

src/views/article-management/detail.vue

@@ -9,9 +9,12 @@
       </div>
       <el-row gutter="20">
         <el-col :span="24">
-          <el-form-item>
-<!--            <div class="article-a" v-html="formData.articleContent" @click="clickHandle"></div>-->
-          </el-form-item>
+          <div style="display: flex;flex-direction: column">
+            <div v-for="(item,index) in formData.fileList" style="display: flex;align-items: center">
+              附件{{ index + 1 }}： <a :href="item.url" style="color: #409eff;" class="a-style" target="_blank">{{ item.originalFileName }}</a>
+              <el-button type="primary" link @click="handleDownload(item)" style="font-size: 16px;margin-left: 10px">下载</el-button>
+            </div>
+          </div>
         </el-col>
       </el-row>
     </el-form>
@@ -64,6 +67,15 @@ const clickHandle = (e) => {
 //     })
 //   })
 // }
+const handleDownload = (row) => {
+  downloadFile(row.fileId).then(res => {
+    const blob = new Blob([res])
+    let a = document.createElement('a')
+    a.href = URL.createObjectURL(blob)
+    a.download = row.originalFileName
+    a.click()
+  })
+}
 const download = (row) => {
   const x = new window.XMLHttpRequest();
   x.open('GET', row.url, true);
@@ -101,6 +113,7 @@ onMounted(async () => {
 </script>
 
 <style lang="scss">
+
 .article-a {
   a {
     color: #409eff !important;
@@ -112,7 +125,9 @@ onMounted(async () => {
 }
 </style>
 <style scoped lang="scss">
-
+.a-style:hover{
+  text-decoration: underline !important;
+}
 .article-detail {
   padding: 0 30px;
   padding-top: 15px;