刘湘琪 3 年之前
父节点
当前提交
0b3bdf5927

+ 7 - 0
src/router/index.js

@@ -149,6 +149,13 @@ export const constantRoutes = [
         meta: {title: '项目申报详情'}
       }
     ]
+  },
+  {
+    path: '/enclosurePreview',
+    component: (resolve) => require(['@/views/enclosurePreview/index'], resolve),
+    hidden: true,
+    name: 'enclosurePreview',
+    meta: { title: '文件预览'}
   }
 ]
 

+ 70 - 0
src/views/enclosurePreview/index.vue

@@ -10,10 +10,80 @@
 <script>
   import { getExtend, readBuffer, render } from '@/utils/util';
   import { parse } from 'qs';
+  import axios from 'axios'
   export default {
     data() {
       return {
         loading: false,
+        url: '',
+        fileName: '',
+        id: ''
+      }
+    },
+    created() {
+      this.loading = true
+      this.url = this.$route.query.url || ''
+
+      this.fileName = this.$route.query.fileName || ''
+      this.id = this.$route.query.id || ''
+      console.log(this.url)
+      console.log(this.fileName)
+      console.log(this.id)
+      if(this.url != '') {
+        this.getLoadEnclosure();
+      }
+    },
+    methods: {
+      getLoadEnclosure() {
+        const filename = this.fileName
+        axios({
+          url: "http://124.232.146.72:7015/api/common/attach/"+this.id,
+          method: 'get',
+          responseType: 'blob',
+        }).then(({ data }) => {
+          if (!data) {
+            console.error('文件下载失败');
+          }
+          const file = new File([ data ], filename, {});
+          this.handleChange({ target: { files: [ file ] } });
+        }).finally(() => {
+          this.loading = false;
+        })
+      },
+      async handleChange(e) {
+        this.loading = true;
+        try {
+          const [ file ] = e.target.files;
+          this.filename = file.name && decodeURIComponent(file.name) || '';
+          const arrayBuffer = await readBuffer(file);
+          this.loading = false
+          this.last = await this.displayResult(arrayBuffer, file)
+          console.log("last")
+          console.log(this.last)
+        } catch (e) {
+          console.error(e)
+        } finally {
+          this.loading = false
+        }
+      },
+      displayResult(buffer, file) {
+        // 取得文件名
+        const { name } = file;
+        // 取得扩展名
+        const extend = getExtend(name);
+        // 输出目的地
+        const { output } = this.$refs;
+        // 生成新的dom
+        const node = document.createElement('div');
+        // 添加孩子,防止vue实例替换dom元素
+        if (this.last) {
+          output.removeChild(this.last.$el);
+          this.last.$destroy();
+        }
+        const child = output.appendChild(node);
+        // 调用渲染方法进行渲染
+        return new Promise((resolve, reject) => render(buffer, extend, child)
+            .then(resolve).catch(reject));
       }
     }
   }

+ 24 - 19
src/views/enterprise/declare/components/EnclosureInfo.vue

@@ -243,25 +243,30 @@
       },
       // 从url加载
       loadFromUrl(row) {
-        this.loading = true;
-        // 要预览的文件地址
-        const { url } = row.url;
-        const filename = row.fileName
-        // const filename = url.substr(url.lastIndexOf('/') + 1);
-        // 拼接iframe请求url
-        axios({
-          url: "http://124.232.146.72:7015/api/common/attach/"+row.id,
-          method: 'get',
-          responseType: 'blob',
-        }).then(({ data }) => {
-          if (!data) {
-            console.error('文件下载失败');
-          }
-          const file = new File([ data ], filename, {});
-          this.handleChange({ target: { files: [ file ] } });
-        }).finally(() => {
-          this.loading = false;
-        })
+        let routeUrl = this.$router.resolve({
+          path: '/enclosurePreview',
+          query: {url: row.url,fileName: row.fileName,id: row.id}
+        });
+        window.open(routeUrl.href, "_blank");
+        // this.loading = true;
+        // // 要预览的文件地址
+        // const { url } = row.url;
+        // const filename = row.fileName
+        // // const filename = url.substr(url.lastIndexOf('/') + 1);
+        // // 拼接iframe请求url
+        // axios({
+        //   url: "http://124.232.146.72:7015/api/common/attach/"+row.id,
+        //   method: 'get',
+        //   responseType: 'blob',
+        // }).then(({ data }) => {
+        //   if (!data) {
+        //     console.error('文件下载失败');
+        //   }
+        //   const file = new File([ data ], filename, {});
+        //   this.handleChange({ target: { files: [ file ] } });
+        // }).finally(() => {
+        //   this.loading = false;
+        // })
       },
       async handleChange(e) {
         this.loading = true;

+ 24 - 19
src/views/enterprise/project/components/EnclosureInfo.vue

@@ -126,25 +126,30 @@
       },
       // 从url加载
       handleView(row) {
-        this.loading = true;
-        // 要预览的文件地址
-        const { url } = row.url;
-        const filename = row.fileName
-        // const filename = url.substr(url.lastIndexOf('/') + 1);
-        // 拼接iframe请求url
-        axios({
-          url: "http://124.232.146.72:7015/api/common/attach/"+row.id,
-          method: 'get',
-          responseType: 'blob',
-        }).then(({ data }) => {
-          if (!data) {
-            console.error('文件下载失败');
-          }
-          const file = new File([ data ], filename, {});
-          this.handleChange({ target: { files: [ file ] } });
-        }).finally(() => {
-          this.loading = false;
-        })
+		  let routeUrl = this.$router.resolve({
+		    path: '/enclosurePreview',
+		    query: {url: row.url,fileName: row.fileName,id: row.id}
+		  });
+		  window.open(routeUrl.href, "_blank");
+        // this.loading = true;
+        // // 要预览的文件地址
+        // const { url } = row.url;
+        // const filename = row.fileName
+        // // const filename = url.substr(url.lastIndexOf('/') + 1);
+        // // 拼接iframe请求url
+        // axios({
+        //   url: "http://124.232.146.72:7015/api/common/attach/"+row.id,
+        //   method: 'get',
+        //   responseType: 'blob',
+        // }).then(({ data }) => {
+        //   if (!data) {
+        //     console.error('文件下载失败');
+        //   }
+        //   const file = new File([ data ], filename, {});
+        //   this.handleChange({ target: { files: [ file ] } });
+        // }).finally(() => {
+        //   this.loading = false;
+        // })
       },
       async handleChange(e) {
         this.loading = true;

+ 24 - 19
src/views/enterprise/project/components/EntEnclosure.vue

@@ -119,25 +119,30 @@
       },
       // 从url加载
       handleView(row) {
-        this.loading = true;
-        // 要预览的文件地址
-        const { url } = row.url;
-        const filename = row.fileName
-        // const filename = url.substr(url.lastIndexOf('/') + 1);
-        // 拼接iframe请求url
-        axios({
-          url: "http://124.232.146.72:7015/api/common/attach/"+row.id,
-          method: 'get',
-          responseType: 'blob',
-        }).then(({ data }) => {
-          if (!data) {
-            console.error('文件下载失败');
-          }
-          const file = new File([ data ], filename, {});
-          this.handleChange({ target: { files: [ file ] } });
-        }).finally(() => {
-          this.loading = false;
-        })
+		  let routeUrl = this.$router.resolve({
+		    path: '/enclosurePreview',
+		    query: {url: row.url,fileName: row.fileName,id: row.id}
+		  });
+		  window.open(routeUrl.href, "_blank");
+        // this.loading = true;
+        // // 要预览的文件地址
+        // const { url } = row.url;
+        // const filename = row.fileName
+        // // const filename = url.substr(url.lastIndexOf('/') + 1);
+        // // 拼接iframe请求url
+        // axios({
+        //   url: "http://124.232.146.72:7015/api/common/attach/"+row.id,
+        //   method: 'get',
+        //   responseType: 'blob',
+        // }).then(({ data }) => {
+        //   if (!data) {
+        //     console.error('文件下载失败');
+        //   }
+        //   const file = new File([ data ], filename, {});
+        //   this.handleChange({ target: { files: [ file ] } });
+        // }).finally(() => {
+        //   this.loading = false;
+        // })
       },
       async handleChange(e) {
         this.loading = true;

+ 24 - 19
src/views/enterprise/project/components/FinEnclosure.vue

@@ -119,25 +119,30 @@
       },
       // 从url加载
       handleView(row) {
-        this.loading = true;
-        // 要预览的文件地址
-        const { url } = row.url;
-        const filename = row.fileName
-        // const filename = url.substr(url.lastIndexOf('/') + 1);
-        // 拼接iframe请求url
-        axios({
-          url: "http://124.232.146.72:7015/api/common/attach/"+row.id,
-          method: 'get',
-          responseType: 'blob',
-        }).then(({ data }) => {
-          if (!data) {
-            console.error('文件下载失败');
-          }
-          const file = new File([ data ], filename, {});
-          this.handleChange({ target: { files: [ file ] } });
-        }).finally(() => {
-          this.loading = false;
-        })
+		  let routeUrl = this.$router.resolve({
+		    path: '/enclosurePreview',
+		    query: {url: row.url,fileName: row.fileName,id: row.id}
+		  });
+		  window.open(routeUrl.href, "_blank");
+        // this.loading = true;
+        // // 要预览的文件地址
+        // const { url } = row.url;
+        // const filename = row.fileName
+        // // const filename = url.substr(url.lastIndexOf('/') + 1);
+        // // 拼接iframe请求url
+        // axios({
+        //   url: "http://124.232.146.72:7015/api/common/attach/"+row.id,
+        //   method: 'get',
+        //   responseType: 'blob',
+        // }).then(({ data }) => {
+        //   if (!data) {
+        //     console.error('文件下载失败');
+        //   }
+        //   const file = new File([ data ], filename, {});
+        //   this.handleChange({ target: { files: [ file ] } });
+        // }).finally(() => {
+        //   this.loading = false;
+        // })
       },
       async handleChange(e) {
         this.loading = true;

+ 24 - 19
src/views/enterprise/project/components/TechEnclosure.vue

@@ -119,25 +119,30 @@
       },
       // 从url加载
       handleView(row) {
-        this.loading = true;
-        // 要预览的文件地址
-        const { url } = row.url;
-        const filename = row.fileName
-        // const filename = url.substr(url.lastIndexOf('/') + 1);
-        // 拼接iframe请求url
-        axios({
-          url: "http://124.232.146.72:7015/api/common/attach/"+row.id,
-          method: 'get',
-          responseType: 'blob',
-        }).then(({ data }) => {
-          if (!data) {
-            console.error('文件下载失败');
-          }
-          const file = new File([ data ], filename, {});
-          this.handleChange({ target: { files: [ file ] } });
-        }).finally(() => {
-          this.loading = false;
-        })
+		  let routeUrl = this.$router.resolve({
+		    path: '/enclosurePreview',
+		    query: {url: row.url,fileName: row.fileName,id: row.id}
+		  });
+		  window.open(routeUrl.href, "_blank");
+        // this.loading = true;
+        // // 要预览的文件地址
+        // const { url } = row.url;
+        // const filename = row.fileName
+        // // const filename = url.substr(url.lastIndexOf('/') + 1);
+        // // 拼接iframe请求url
+        // axios({
+        //   url: "http://124.232.146.72:7015/api/common/attach/"+row.id,
+        //   method: 'get',
+        //   responseType: 'blob',
+        // }).then(({ data }) => {
+        //   if (!data) {
+        //     console.error('文件下载失败');
+        //   }
+        //   const file = new File([ data ], filename, {});
+        //   this.handleChange({ target: { files: [ file ] } });
+        // }).finally(() => {
+        //   this.loading = false;
+        // })
       },
       async handleChange(e) {
         this.loading = true;