修改申请表预览打印下载

2 years ago · 801c354629
2 changed files with 76 additions and 105 deletions
--- a/src/views/accessrecords/statement/ProcessMaterialsPlanStatement.vue
+++ b/src/views/accessrecords/statement/ProcessMaterialsPlanStatement.vue
@ -4,7 +4,7 @@
    <a-button type="primary" style="left: 10px" @click="previewWord">预览并打印</a-button>

    <div style="width: 100%;height: 100%;">
-      <pdf ref="pdfWord" :src="pdfSrc" class="pdf" style=""></pdf>
+      <pdf v-show="false" ref="pdfWord" :src="pdfSrc" class="pdf" style=""></pdf>
    </div>
  </div>

@ -53,8 +53,8 @@
        pdfSrc: '',
        url: {
          list: '/hy/processUdgetPlan/getPlanTable',
-          queryPlandDownWord: '/word/queryPlandDownWord',
-          queryPlanPrevie: '/word/queryPlanPrevie'
+          queryPlandDownWord: '/word/queryPlandTableDownWord',
+          queryPlanPrevie: '/word/queryPlanTablePrevie'
        },
        Wslist: null
      }
@ -63,11 +63,12 @@
      this.showSessionId = window.location.search
    },
    created() {
-     /* downFile(this.url.queryPlanPrevie, { id: this.queryParam.id }).then((data) => {
+      downFile(this.url.queryPlanPrevie, { id: this.queryParam.id }).then((data) => {
        console.log(data)
        const blob = new Blob([data], { type: 'application/pdf' })
        this.pdfWord = window.URL.createObjectURL(blob)
-      })*/
+
+      })
      // this.loadData();
    },
    activated() {
@ -88,7 +89,7 @@
          const blob = new Blob([data]) // 把得到的结果用流对象转一下
          var a = document.createElement('a') //创建一个<a></a>标签
          a.href = URL.createObjectURL(blob) // 将流文件写入a标签的href属性值
-          a.download = '采购通知书.docx' //设置文件名
+          a.download = '采购申请表.docx' //设置文件名
          a.style.display = 'none' // 障眼法藏起来a标签
          document.body.appendChild(a) // 将a标签追加到文档对象中
          a.click() // 模拟点击了a标签，会触发a标签的href的读取，浏览器就会自动下载了
--- a/src/views/accessrecords/statement/ProcessMaterialsPlanStatement2.vue
+++ b/src/views/accessrecords/statement/ProcessMaterialsPlanStatement2.vue
@ -1,45 +1,31 @@
 <template>
-  <div >
-    <a-card :bordered="false" style="width: 100%;height: 730px">
-
-      <div class="table-operator" style="width: 18%">
-        <!--            <a-button type="primary">-->
-        <!--              预览-->
-        <!--            </a-button>-->
-<!--       <spen size="200px">采购申请表</spen>-->
-<!--                    <a-button type="primary">-->
-<!--                      打印-->
-<!--                    </a-button>-->
-      </div>
-      <div style="width: 100%;height: 100%">
-        <iframe class="iframe"
-                :src="srcHtml"
-                frameborder="0"
-                ref="iframes"
-                style="width: 100%;height: 100%"
-        >
-
-        </iframe>
-      </div>
-
-
-
-    </a-card>
+  <div>
+    <a-button type="primary" icon="download" @click="downWord">下载</a-button>
+    <a-button type="primary" style="left: 10px" @click="previewWord">预览并打印</a-button>

+    <div style="width: 100%;height: 100%;">
+      <pdf v-show="false" ref="pdfWord" :src="pdfSrc" class="pdf" style=""></pdf>
+    </div>
  </div>
+
 </template>

 <script>
-  import { getAction } from '@api/manage'
+  const VALIDATE_NO_PASSED = Symbol()
+  import pick from 'lodash.pick'
  import { mixinDevice } from '@/utils/mixin'
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
+  import { getAction, downFile } from '@/api/manage'
+  import pdf from 'vue-pdf-signature'
+  import CMapReaderFactory from 'vue-pdf-signature/src/CMapReaderFactory'

  export default {
-    name: "ProcessMaterialPlantz",
-    mixins:[JeecgListMixin,mixinDevice],
-    props:{
-      materWared:{
-        type: String,
+    name: 'ProcessMaterialPlan',
+    mixins: [JeecgListMixin, mixinDevice],
+    components: { pdf, CMapReaderFactory },
+    props: {
+      materWared: {
+        type: String
      },
      /**/
      procInstId: {
@ -58,93 +44,77 @@
      }
    },

-    data(){
-      return{
-        showSessionId : '',
-        srcHtml : '',
-        url:{
-          list: "/hy/processUdgetPlan/getPlanTable",
+    data() {
+      return {
+        showSessionId: '',
+        srcHtml: '',
+        modalLsVisible: false,
+        pdfWord: '',
+        pdfSrc: '',
+        url: {
+          list: '/hy/processUdgetPlan/getPlanTable',
+          queryPlandDownWord: '/word/queryPlandDownWord',
+          queryPlanPrevie: '/word/queryPlanPrevie'
        },
-        Wslist: null,
+        Wslist: null
      }
    },
    mounted() {
-      this.showSessionId = window.location.search;
-      this.srcHtml = '../static/采购通知书.html';
-      // this.sendMesFroIframe();
+      this.showSessionId = window.location.search
    },
    created() {
-      this.sendMesFroIframe();
+      downFile(this.url.queryPlanPrevie, { id: this.queryParam.id }).then((data) => {
+        console.log(data)
+        const blob = new Blob([data], { type: 'application/pdf' })
+        this.pdfWord = window.URL.createObjectURL(blob)
+
+      })
      // this.loadData();
    },
    activated() {
-      this.sendMesFroIframe();
+
    },
    beforeMount() {

    },
-    methods:{
-      //方法：
-      async sendMesFroIframe() {
-        await this.loadData();
-        let a = this.Wslist
-        console.log("执行了>>>>>>>>>>>>>>>>>>>>>>>",a);
-
-
-        const mapFrame = this.$refs['iframes']
-        if (mapFrame.attachEvent) { // 兼容浏览器判断
-          mapFrame.attachEvent('onload', function() {
-            const iframeWin = mapFrame.contentWindow
-            iframeWin.postMessage(a, '*')
-            // data传递的参数   *写成子页面的域名或者是ip
-          })
-        } else {
-          mapFrame.onload = function() {
-            const iframeWin = mapFrame.contentWindow
-            iframeWin.postMessage(a, '*')
-          }
-        }
+    computed: {
+      importExcelUrl: function() {
+        return `${window._CONFIG['domianURL']}/${this.url.queryPlanApply}`
+      }
+    },
+    methods: {
+      // 下载
+      downWord() {
+        downFile(this.url.queryPlandDownWord, { id: this.queryParam.id }).then((data) => {
+          const blob = new Blob([data]) // 把得到的结果用流对象转一下
+          var a = document.createElement('a') //创建一个<a></a>标签
+          a.href = URL.createObjectURL(blob) // 将流文件写入a标签的href属性值
+          a.download = '采购通知书.docx' //设置文件名
+          a.style.display = 'none' // 障眼法藏起来a标签
+          document.body.appendChild(a) // 将a标签追加到文档对象中
+          a.click() // 模拟点击了a标签，会触发a标签的href的读取，浏览器就会自动下载了
+          a.remove()
+        })

      },
-
-      loadData()  {
-        return new Promise((resolve, reject) => {
-          if(!this.url.list){
-            this.$message.error("请设置url.list属性!")
-            return
-          }
-          console.log("KLJKLJKLJKLJKL",this.materWared);
-          this.queryParam.id = this.materWared;
-          getAction(this.url.list, this.queryParam).then((res) => {
-            console.log(res);
-            if (res.success) {
-              this.Wslist = res.result;
-              console.log("this.Wslist>>>>>>>>>>>>>>>>>>>>>>>>>>>>", res.result)
-            }
-            if(res.code===510){
-              this.$message.warning(res.message)
-            }
-            this.loading = false;
-            resolve( this.Wslist );
-          })
-
+      previewWord() {
+        downFile(this.url.queryPlanPrevie, { id: this.queryParam.id }).then((data) => {
+          console.log(data)
+          const blob = new Blob([data], { type: 'application/pdf' })
+          this.pdfSrc = window.URL.createObjectURL(blob)
+          console.log(this.pdfSrc)
+          window.open(this.pdfSrc)//新窗口打开，借用浏览器去打印
        })
      },
+      loadData() {
+        this.queryParam.id = this.materWared
+      },
+
+
    }
  }
 </script>

-<style scoped>
-  .iframe {
+<style lang="less" scoped>

-    position: absolute;
-    left: 0;
-    right: 0;
-    top: 0;
-    bottom: 0;
-    width: 100%;
-    height: 100%;
-    background: #fff;
-    overflow-y: hidden;
-  }
 </style>