update

hanfei / VueSharedPrinting

Browse code update master
1 parent 0c09fba commit ef925d0eb1b4fce2ee815d621a6dfb2a0e8a3ee4 linda authored on 1 Feb 2024

Patch

Showing 1 changed file

Ignore Space Show notes View src/views/expense.vue
<template> <!-- 费用支付--> <div class="expense"> <navbar :name="name" /> <div :class="['box', 'flex-center', { 'vertical-box-colum': isVertical }]"> <div :class="['left', { 'vertical-box': isVertical }]"> <div class="title">温馨提示</div> <div class="content">请在二维码区域提示的时限内，尽快完成支付。如果操作超时，本次打印业务可能需要重新提交。</div> </div> <div :class="['right', { 'vertical-box': isVertical }]"> <div class="code"> <VueQr v-if="appSrc != ''" :logo-src="require('@/assets/logo.png')" :logoScale="0.2" :logoMargin="0" logoBackgroundColor="white" :size="300" :margin="0" :auto-color="true" :dot-scale="1" :text="appSrc" ></VueQr> </div> <div class="flex-center tip">提示：请在 {{ num }} 秒内完成扫码支付</div> </div> </div> </div> </template> <script> import navbar from '@/components/nav' // import {getPayQrCode, downloadPDF, getPrintTask} from "../api/resultApi"; import { downloadPDF, getPrintTask } from '../api/resultApi' import VueQr from 'vue-qr' import bdRequest from '../utils/bdRequest' export default { name: 'expense', components: { navbar, VueQr }, provide() { return { title: '', type: this.name } }, data() { return { name: this.cite.modeName, appSrc: '', client: '', num: 120, selectedFile: this.cite.selectedFile, listData: { code: '20240104231724631239-0', copies: 1, printFileId: 112, printFileType: 'PDF', printingColor: 'BW', printingFaces: 'SINGLE' }, isVertical: false } }, methods: { skip(href, name) { this.$router.push({ name: href, params: { name: name } }) }, downloadPDF(id, name) { downloadPDF({ id: id }) .then(res => { const fileName = name const blob = new Blob([res], { type: 'application/octet-stream' }) if (window.navigator.msSaveOrOpenBlob) { navigator.msSaveBlob(blob, fileName) } else { let link = document.createElement('a') link.href = window.URL.createObjectURL(blob) link.download = fileName link.click() window.URL.revokeObjectURL(link.href) } }) .catch(() => {}) }, async dayin() { let _this = this let { listData, selectedFile } = _this let i = '', deta = '' selectedFile.forEach((item, index) => { if (listData.printFileId == item.id) { i = index deta = item } }) await this.downloadPDF(listData.printFileId, listData.printFileName) console.log('打印', deta, listData.copies) setTimeout(() => { _this.selectedFile.splice(i, 1) // 按份数循环打印 // for(let i=0;i<listData.copies;i++) { // } let res = bdRequest({ method: 'post', url: '/api/Printer/Print', post: '8080', data: { PrinterName: 'EPSON WF-C5890 Series', // "SourceFile": 'D:\\TZDYSHARE\\TEMPFILES\\'+listData.printFileName, SourceFile: 'C:\\datasource\\' + listData.printFileName, FileType: 'pdf', PrintColor: listData.printingColor \|\| '', DblPrt: listData.printingFaces \|\| '' } }) console.log(res) setTimeout(() => { if (_this.selectedFile.length > 0) { _this.getPrintTask() } else { _this.cite.orderId = '' _this.skip('complete', _this.name) } }, 1000) }, 2000) }, async getPrintTask() { let _this = this if (_this.cite.orderId) { let res = await getPrintTask({ orderId: _this.cite.orderId }) console.log(res, 'getPrintTask数据') if (res) { _this.listData = res _this.dayin() } else { setTimeout(() => { _this.getPrintTask() }, 1000) } } }, load() { let _this = this setTimeout(() => { _this.appSrc = 'https://mps.xlmalls.com/web/payment/' + JSON.stringify(_this.cite.printData) }, 800) // getPayQrCode({orderId: _this.cite.orderId,payMode: 'TZ_PAY'}).then(res => { // // console.log(res.data.qrCode) // if(res.qrCode) { // // _this.appSrc = res.qrCode // // _this.appSrc = 'https://mps.xlmalls.com/web/payment/' + JSON.stringify(_this.cite.printData) // // 循环查询是否需要调打印 // // setTimeout(() =>{ // // // _this.dayin() // // _this.getPrintTask() // // },1000) // } // }) }, countDown() { if (this.$route.name == 'expense') { let num = this.num if (num == 0) { this.quit() return } else if (num > 0) { setTimeout(() => { this.num = num - 1 this.countDown() }, 1000) } } } }, destroyed() { // 销毁监听 // clearTimeout() this.num = -1 }, created() { this.isVertical = this.cite.isVertical }, mounted() { this.num = 120 this.countDown() this.load() } } </script> <style scoped lang="less"> .box { height: 42.13rem; .css1 { height: 100%; background: #ffffff; box-shadow: 0rem 0.31rem 0.63rem 0.06rem rgba(0, 0, 0, 0.14); border-radius: 1.63rem; } .left { width: 46.44rem; margin-right: 1.88rem; .css1(); .title { font-size: 2.88rem; font-weight: bold; color: #d41212; line-height: 4.06rem; padding: 4.13rem 0 2.44rem; } .content { width: 37rem; font-size: 2.25rem; font-weight: bold; color: #323232; line-height: 3rem; margin: 0 auto; text-align: left; } } .right { width: 62.81rem; .css1(); font-size: 2.25rem; font-weight: bold; color: #323232; line-height: 3.13rem; .code { display: inline-block; width: 23.25rem; height: 22.88rem; background: #ffffff; //border: 0.06rem solid #707070; margin: 2.94rem auto 1.19rem; img { width: 100%; height: auto; } } } } .vertical-box { width: 80% !important; height: 35rem !important; } .vertical-box-colum { height: 90rem; flex-direction: column; justify-content: space-around; } </style> <template> <!-- 费用支付--> <div class="expense"> <navbar :name="name" /> <div :class="['box', 'flex-center', { 'vertical-box-colum': isVertical }]"> <div :class="['left', { 'vertical-box': isVertical }]"> <div class="title">温馨提示</div> <div class="content">请在二维码区域提示的时限内，尽快完成支付。如果操作超时，本次打印业务可能需要重新提交。</div> </div> <div :class="['right', { 'vertical-box': isVertical }]"> <div class="code"> <VueQr v-if="appSrc != ''" :logo-src="require('@/assets/logo.png')" :logoScale="0.2" :logoMargin="0" logoBackgroundColor="white" :size="300" :margin="0" :auto-color="true" :dot-scale="1" :text="appSrc" ></VueQr> </div> <div class="flex-center tip">提示：请在 {{ num }} 秒内完成扫码支付</div> </div> </div> </div> </template> <script> import navbar from '@/components/nav' // import {getPayQrCode, downloadPDF, getPrintTask} from "../api/resultApi"; import { downloadPDF, getPrintTask } from '../api/resultApi' import VueQr from 'vue-qr' import bdRequest from '../utils/bdRequest' export default { name: 'expense', components: { navbar, VueQr }, provide() { return { title: '', type: this.name } }, data() { return { name: this.cite.modeName, appSrc: '', client: '', num: 120, selectedFile: this.cite.selectedFile, listData: { code: '20240104231724631239-0', copies: 1, printFileId: 112, printFileType: 'PDF', printingColor: 'BW', printingFaces: 'SINGLE' }, isVertical: false } }, methods: { skip(href, name) { this.$router.push({ name: href, params: { name: name } }) }, downloadPDF(id, name) { downloadPDF({ id: id }) .then(res => { const fileName = name const blob = new Blob([res], { type: 'application/octet-stream' }) if (window.navigator.msSaveOrOpenBlob) { navigator.msSaveBlob(blob, fileName) } else { let link = document.createElement('a') link.href = window.URL.createObjectURL(blob) link.download = fileName link.click() window.URL.revokeObjectURL(link.href) } }) .catch(() => {}) }, async dayin() { let _this = this let { listData, selectedFile } = _this let i = '', deta = '' selectedFile.forEach((item, index) => { if (listData.printFileId == item.id) { i = index deta = item } }) await this.downloadPDF(listData.printFileId, listData.printFileName) console.log('打印', deta, listData.copies) setTimeout(() => { _this.selectedFile.splice(i, 1) // 按份数循环打印 // for(let i=0;i<listData.copies;i++) { // } let res = bdRequest({ method: 'post', url: '/api/Printer/Print', post: '8080', data: { PrinterName: 'EPSON WF-C5890 Series', // "SourceFile": 'D:\\TZDYSHARE\\TEMPFILES\\'+listData.printFileName, SourceFile: 'C:\\datasource\\' + listData.printFileName, FileType: 'pdf', PrintColor: listData.printingColor \|\| '', DblPrt: listData.printingFaces \|\| '' } }) console.log(res) setTimeout(() => { if (_this.selectedFile.length > 0) { _this.getPrintTask() } else { _this.cite.orderId = '' _this.skip('complete', _this.name) } }, 1000) }, 2000) }, async getPrintTask() { let _this = this if (_this.cite.orderId) { let res = await getPrintTask({ orderId: _this.cite.orderId }) console.log(res, 'getPrintTask数据') if (res) { _this.listData = res _this.dayin() } else { setTimeout(() => { _this.getPrintTask() }, 1000) } } }, load() { let _this = this setTimeout(() => { _this.appSrc = 'https://mps.xlmalls.com/web/payment/' + JSON.stringify(_this.cite.printData) }, 800) // getPayQrCode({orderId: _this.cite.orderId,payMode: 'TZ_PAY'}).then(res => { // // console.log(res.data.qrCode) // if(res.qrCode) { // // _this.appSrc = res.qrCode // // _this.appSrc = 'https://mps.xlmalls.com/web/payment/' + JSON.stringify(_this.cite.printData) // // 循环查询是否需要调打印 // // setTimeout(() =>{ // // // _this.dayin() // // _this.getPrintTask() // // },1000) // } // }) }, countDown() { if (this.$route.name == 'expense') { let num = this.num if (num == 0) { this.quit() return } else if (num > 0) { setTimeout(() => { this.num = num - 1 this.countDown() }, 1000) } } } }, destroyed() { // 销毁监听 // clearTimeout() this.num = -1 }, created() { this.isVertical = this.cite.isVertical }, mounted() { this.num = 15 this.countDown() this.load() } } </script> <style scoped lang="less"> .box { height: 42.13rem; .css1 { height: 100%; background: #ffffff; box-shadow: 0rem 0.31rem 0.63rem 0.06rem rgba(0, 0, 0, 0.14); border-radius: 1.63rem; } .left { width: 46.44rem; margin-right: 1.88rem; .css1(); .title { font-size: 2.88rem; font-weight: bold; color: #d41212; line-height: 4.06rem; padding: 4.13rem 0 2.44rem; } .content { width: 37rem; font-size: 2.25rem; font-weight: bold; color: #323232; line-height: 3rem; margin: 0 auto; text-align: left; } } .right { width: 62.81rem; .css1(); font-size: 2.25rem; font-weight: bold; color: #323232; line-height: 3.13rem; .code { display: inline-block; width: 23.25rem; height: 22.88rem; background: #ffffff; //border: 0.06rem solid #707070; margin: 2.94rem auto 1.19rem; img { width: 100%; height: auto; } } } } .vertical-box { width: 80% !important; height: 35rem !important; } .vertical-box-colum { height: 90rem; flex-direction: column; justify-content: space-around; } </style>

Ignore Space Show notes View

src/views/expense.vue

<template>
  
  <div class="expense">
    <navbar :name="name" />
    <div :class="['box', 'flex-center', { 'vertical-box-colum': isVertical }]">
      <div :class="['left', { 'vertical-box': isVertical }]">
        <div class="title">温馨提示</div>
        <div class="content">请在二维码区域提示的时限内，尽快完成支付。如果操作超时，本次打印业务可能需要重新提交。</div>
      </div>
      <div :class="['right', { 'vertical-box': isVertical }]">
        <div class="code">
          <VueQr
            v-if="appSrc != ''"
            :logo-src="require('@/assets/logo.png')"
            :logoScale="0.2"
            :logoMargin="0"
            logoBackgroundColor="white"
            :size="300"
            :margin="0"
            :auto-color="true"
            :dot-scale="1"
            :text="appSrc"
          ></VueQr>
        </div>
        <div class="flex-center tip">提示：请在 {{ num }} 秒内完成扫码支付</div>
      </div>
    </div>
  </div>
</template>

export default {
  name: 'expense',
  components: {
    navbar,
    VueQr
  },
  provide() {
    return {
      title: '',
      type: this.name
    }
  },
  data() {
    return {
      name: this.cite.modeName,
      appSrc: '',
      client: '',
      num: 120,

selectedFile: this.cite.selectedFile,
      listData: {
        code: '20240104231724631239-0',
        copies: 1,
        printFileId: 112,
        printFileType: 'PDF',
        printingColor: 'BW',
        printingFaces: 'SINGLE'
      },
      isVertical: false
    }
  },
  methods: {
    skip(href, name) {
      this.$router.push({
        name: href,
        params: {
          name: name
        }
      })
    },
    downloadPDF(id, name) {
      downloadPDF({ id: id })
        .then(res => {
          const fileName = name
          const blob = new Blob([res], { type: 'application/octet-stream' })
          if (window.navigator.msSaveOrOpenBlob) {
            navigator.msSaveBlob(blob, fileName)
          } else {
            let link = document.createElement('a')
            link.href = window.URL.createObjectURL(blob)
            link.download = fileName
            link.click()
            window.URL.revokeObjectURL(link.href)
          }
        })
        .catch(() => {})
    },
    async dayin() {
      let _this = this
      let { listData, selectedFile } = _this
      let i = '',
        deta = ''
      selectedFile.forEach((item, index) => {
        if (listData.printFileId == item.id) {
          i = index
          deta = item
        }
      })
      await this.downloadPDF(listData.printFileId, listData.printFileName)
      console.log('打印', deta, listData.copies)
      setTimeout(() => {
        _this.selectedFile.splice(i, 1)
        // 按份数循环打印
        // for(let i=0;i<listData.copies;i++) {
        // }

let res = bdRequest({
          method: 'post',
          url: '/api/Printer/Print',
          post: '8080',
          data: {
            PrinterName: 'EPSON WF-C5890 Series',
            // "SourceFile": 'D:\\TZDYSHARE\\TEMPFILES\\'+listData.printFileName,
            SourceFile: 'C:\\datasource\\' + listData.printFileName,
            FileType: 'pdf',
            PrintColor: listData.printingColor || '',
            DblPrt: listData.printingFaces || ''
          }
        })
        console.log(res)

setTimeout(() => {
          if (_this.selectedFile.length > 0) {
            _this.getPrintTask()
          } else {
            _this.cite.orderId = ''
            _this.skip('complete', _this.name)
          }
        }, 1000)
      }, 2000)
    },
    async getPrintTask() {
      let _this = this
      if (_this.cite.orderId) {
        let res = await getPrintTask({ orderId: _this.cite.orderId })
        console.log(res, 'getPrintTask数据')
        if (res) {
          _this.listData = res
          _this.dayin()
        } else {
          setTimeout(() => {
            _this.getPrintTask()
          }, 1000)
        }
      }
    },
    load() {
      let _this = this

setTimeout(() => {
        _this.appSrc = 'https://mps.xlmalls.com/web/payment/' + JSON.stringify(_this.cite.printData)
      }, 800)

// getPayQrCode({orderId: _this.cite.orderId,payMode: 'TZ_PAY'}).then(res => {
      //   // console.log(res.data.qrCode)
      //   if(res.qrCode) {
      //     // _this.appSrc = res.qrCode
      //
      //     _this.appSrc = 'https://mps.xlmalls.com/web/payment/' + JSON.stringify(_this.cite.printData)
      //     // 循环查询是否需要调打印
      //     // setTimeout(() =>{
      //     //   // _this.dayin()
      //     //   _this.getPrintTask()
      //     // },1000)
      //   }
      // })
    },
    countDown() {
      if (this.$route.name == 'expense') {
        let num = this.num
        if (num == 0) {
          this.quit()
          return
        } else if (num > 0) {
          setTimeout(() => {
            this.num = num - 1
            this.countDown()
          }, 1000)
        }
      }
    }
  },
  destroyed() {
    // 销毁监听
    // clearTimeout()
    this.num = -1
  },
  created() {
    this.isVertical = this.cite.isVertical
  },
  mounted() {
    this.num = 120
    this.countDown()
    this.load()
  }
}
</script>

setTimeout(() => {
        _this.appSrc = 'https://mps.xlmalls.com/web/payment/' + JSON.stringify(_this.cite.printData)
      }, 800)

// getPayQrCode({orderId: _this.cite.orderId,payMode: 'TZ_PAY'}).then(res => {
      //   // console.log(res.data.qrCode)
      //   if(res.qrCode) {
      //     // _this.appSrc = res.qrCode
      //
      //     _this.appSrc = 'https://mps.xlmalls.com/web/payment/' + JSON.stringify(_this.cite.printData)
      //     // 循环查询是否需要调打印
      //     // setTimeout(() =>{
      //     //   // _this.dayin()
      //     //   _this.getPrintTask()
      //     // },1000)
      //   }
      // })
    },
    countDown() {
      if (this.$route.name == 'expense') {
        let num = this.num
        if (num == 0) {
          this.quit()
          return
        } else if (num > 0) {
          setTimeout(() => {
            this.num = num - 1
            this.countDown()
          }, 1000)
        }
      }
    }
  },
  destroyed() {
    // 销毁监听
    // clearTimeout()
    this.num = -1
  },
  created() {
    this.isVertical = this.cite.isVertical
  },
  mounted() {
    this.num = 15
    this.countDown()
    this.load()
  }
}
</script>

Show line notes below