文件下载相关

src/components/Pdf2Word/Pdf2Word.vue

@@ -50,6 +50,7 @@
         </div>
         <div class="sunmit_btn" @click="addlibraryImg">添加文库文件</div>
       </div>
+      <el-button @click="test">测试</el-button>
     </div>
     <div v-if="thisStep === 'loading'" class="load-box">
       <div class="light_box">
@@ -106,152 +107,173 @@
     :fileUserTreeData="treeData"
     @fileChangeMsg="fileChangeMsg"
   ></PicTree>
-  <div
-    v-loading.fullscreen="loadingPreview"
-    v-if="loadingPreview"
-    class="lodingBox"
-  ></div>
+  <div v-loading.fullscreen="loadingPreview" v-if="loadingPreview" class="lodingBox"></div>
 </template>
-  
-  <script setup>
-import { onMounted, ref, toRaw, watch, inject } from "vue";
-import { ElMessage } from "element-plus";
-import Clipboard from "clipboard";
-import Loading from "@/components/Loading/Loading.vue";
-import PicTree from "@/components/PicTree/PicTree.vue"; //选择文件发送的列表
-import { picTree, pdfTree } from "@/api/search/search.js";
-import { ocrRemark, preview } from "@/api/common/common.js";
-import Cookies from "js-cookie";
-const textData = ref(""); //解析出来的文字
-const showImg = ref(); //上传的图片
-const isOpen = ref(props.openFile);
-const thisStep = ref("start"); //解析进度 start,loading,end,
-const openFile = ref(false); //控制tree显示
-const treeData = ref(); //树节点数据
-const actionUrl = ref(
-  `${window.location.origin}${
-    import.meta.env.VITE_APP_BASE_API
-  }/biz/info/pdf2word`
-);
+
+<script setup>
+import { onMounted, ref, toRaw, watch, inject } from 'vue'
+import { ElMessage } from 'element-plus'
+import Clipboard from 'clipboard'
+import Loading from '@/components/Loading/Loading.vue'
+import PicTree from '@/components/PicTree/PicTree.vue' //选择文件发送的列表
+import { picTree, pdfTree } from '@/api/search/search.js'
+import { ocrRemark, preview } from '@/api/common/common.js'
+import Cookies from 'js-cookie'
+import axios from 'axios'
+const textData = ref('') //解析出来的文字
+const showImg = ref() //上传的图片
+const isOpen = ref(props.openFile)
+const thisStep = ref('start') //解析进度 start,loading,end,
+const openFile = ref(false) //控制tree显示
+const treeData = ref() //树节点数据
+const actionUrl = ref(`${window.location.origin}${import.meta.env.VITE_APP_BASE_API}/biz/info/pdf2word`)
 const headersObj = ref({
-  Authorization: Cookies.get("Admin-Token"),
-});
+  Authorization: Cookies.get('Admin-Token')
+})
 // const actionUrl = ref(`${window.location.origin}/upload`);
-const loadingPreview = ref(false);
-const addFolderAdd = inject("addFolderAdd");
+const loadingPreview = ref(false)
+const addFolderAdd = inject('addFolderAdd')
 
 const props = defineProps({
   openFile: {
     type: Boolean,
-    default: false,
-  },
-});
+    default: false
+  }
+})
 watch(
   () => props.openFile,
   (newValue) => {
     // console.log(111);
-    isOpen.value = newValue;
+    isOpen.value = newValue
   }
-);
-onMounted(async () => {});
+)
+
+const test=function(){
+	const url=`${window.location.origin}${import.meta.env.VITE_APP_BASE_API}/api/test`;
+	 return axios({
+	        method:'get',
+	        url:url,
+	        responseType:'blob'
+	    }).then(function(res){
+	        if(res.headers['content-disposition'] !== undefined){
+	            let blob = new Blob([res.data], { type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document' })
+	            let fileName = decodeURI(res.headers['content-disposition']) 
+	          if (fileName) { 
+	            fileName = fileName.substring(fileName.indexOf('=') + 1)
+				alert(fileName)
+	          }
+	          const elink = document.createElement('a') 
+	          elink.download = fileName 
+	          elink.style.display = 'none'
+	          elink.href = URL.createObjectURL(blob) 
+	          document.body.appendChild(elink) 
+	          elink.click() 
+	          URL.revokeObjectURL(elink.href) 
+	          document.body.removeChild(elink) 
+	        }
+	    })
+}
+
+onMounted(async () => {})
+
 const handleAvatarSuccess = (msg, file) => {
-  console.log("re", msg);
-  const flieData = toRaw(file);
-  console.log("file", flieData);
+  console.log('re', msg)
+  const flieData = toRaw(file)
+  console.log('file', flieData)
   // setTimeout(() => {
   //   downLoadfile(flieData.raw,file);
   // }, 500);
-  const blob = new Blob([msg]); //excel,pdf等
-  const href = URL.createObjectURL(blob); //创建新的URL表示指定的blob对象
-  const a = document.createElement("a"); //创建a标签
-  a.style.display = "none";
-  a.href = href; // 指定下载链接
-  a.download =file.name+ ".pdf"; //指定下载文件名
-  a.click(); //触发下载
-  URL.revokeObjectURL(a.href); //释放URL对象
-  ElMessage({ message: "转换成功，已下载到本地", type: "success" });
+  const blob = new Blob([msg]) //excel,pdf等
+  const href = URL.createObjectURL(blob) //创建新的URL表示指定的blob对象
+  const a = document.createElement('a') //创建a标签
+  a.style.display = 'none'
+  a.href = href // 指定下载链接
+  a.download = file.name + '.docx' //指定下载文件名
+  a.click() //触发下载
+  URL.revokeObjectURL(a.href) //释放URL对象
+  ElMessage({ message: '转换成功，已下载到本地', type: 'success' })
   loadingPreview.value = false
-};
+}
 //文件上传前的钩子
 const beforeUp = (raw) => {
   // console.log('raw',raw);
   // showImg.value = URL.createObjectURL(raw);
   loadingPreview.value = true
   // thisStep.value = "loading";
-};
+}
 // 复制功能调用的方法
 const copyQbUrl = () => {
-  let clipboard = new Clipboard(".copy-qb", {
+  let clipboard = new Clipboard('.copy-qb', {
     text: () => {
-      return textData.value;
-    },
-  });
-  clipboard.on("success", () => {
+      return textData.value
+    }
+  })
+  clipboard.on('success', () => {
     // console.log('success');
-    ElMessage({ message: "复制成功", type: "success" });
-    clipboard.destroy();
-  });
-  clipboard.on("error", () => {
+    ElMessage({ message: '复制成功', type: 'success' })
+    clipboard.destroy()
+  })
+  clipboard.on('error', () => {
     // console.log('err');
-    clipboard.destroy();
-  });
-};
+    clipboard.destroy()
+  })
+}
 // 选取文库图片
 const addlibraryImg = async () => {
-  const res = await pdfTree();
-  console.log("res", res);
-  treeData.value = res;
-  openFile.value = true;
-};
+  const res = await pdfTree()
+  console.log('res', res)
+  treeData.value = res
+  openFile.value = true
+}
 //确定选中图片
 const fileChangeMsg = async (val) => {
-  console.log("val", toRaw(val));
-  const data = toRaw(val);
-  const imgRes = await preview(data.id);
-  thisStep.value = "loading";
-  showImg.value = URL.createObjectURL(imgRes);
-  const res = await ocrRemark(data.remark);
-  thisStep.value = "end";
-  textData.value = res.msg;
+  console.log('val', toRaw(val))
+  const data = toRaw(val)
+  const imgRes = await preview(data.id)
+  thisStep.value = 'loading'
+  showImg.value = URL.createObjectURL(imgRes)
+  const res = await ocrRemark(data.remark)
+  thisStep.value = 'end'
+  textData.value = res.msg
   // console.log("res", res);
   // console.log("imgRes", imgRes);
-};
+}
 const reClick = () => {
-  thisStep.value = "start";
-  textData.value = null;
-  showImg.value = null;
-};
+  thisStep.value = 'start'
+  textData.value = null
+  showImg.value = null
+}
 // 文件下载
 const downLoadfile = (res, file) => {
   // console.log('downLoadfileres',res);
-  var reader = new FileReader();
+  var reader = new FileReader()
   reader.onloadend = function (event) {
     //event 就是你要的返回内容
     //因为返回的报错格式是字符串，手动转换成对象，转换成功表示请求失败
     //转换失败就意味着你拿到的result是文件流，那么直接手动下载就好
     try {
-      let data = JSON.parse(event.target.result);
+      let data = JSON.parse(event.target.result)
     } catch (err) {
-      const time = Date.now();
+      const time = Date.now()
       // console.log('time',time);
-      const link = document.createElement("a"); // 创建a标签
-      let blob = new Blob([res]);
-      link.style.display = "none";
-      link.href = URL.createObjectURL(blob); // 创建下载的链接
+      const link = document.createElement('a') // 创建a标签
+      let blob = new Blob([res])
+      link.style.display = 'none'
+      link.href = URL.createObjectURL(blob) // 创建下载的链接
       // link.setAttribute("download", clickRow.value.fileName); // 给下载后的文件命名
-      link.setAttribute("download", file.name + ".docx"); // 给下载后的文件命名
-      document.body.appendChild(link);
-      link.click(); // 点击下载
-      document.body.removeChild(link); //  完成移除元素
-      window.URL.revokeObjectURL(link.href); // 释放blob对象
+      link.setAttribute('download', file.name + '.docx') // 给下载后的文件命名
+      document.body.appendChild(link)
+      link.click() // 点击下载
+      document.body.removeChild(link) //  完成移除元素
+      window.URL.revokeObjectURL(link.href) // 释放blob对象
     }
-  };
+  }
   // console.log('downLoadfileres',res);
-  reader.readAsText(res);
-};
+  reader.readAsText(res)
+}
 </script>
-  
-  <style lang="scss" scoped>
+
+<style lang="scss" scoped>
 .lodingBox {
   position: absolute;
   top: 0;
@@ -392,7 +414,7 @@ const downLoadfile = (res, file) => {
     .light_box {
       width: 500px;
       height: 500px;
-      background-image: url("@/assets/images/light_boder.png");
+      background-image: url('@/assets/images/light_boder.png');
       background-repeat: no-repeat;
       background-size: contain;
       position: relative;
@@ -487,4 +509,3 @@ const downLoadfile = (res, file) => {
   text-align: center;
 }
 </style>
-