emis-frontend/src/views/emis/EmisBaseTools/TanexPrinterPanel.vue

<template>
  <div>

    <!-- 打印机状态 -->
    <!-- style="padding:5px 0px;text-align: right;position: fixed;top: 150px;right: 10px; z-index: 9999;" -->
    <div >
        <div style="display: inline-flex;">
          <div v-if="printerStatus==0" style="display: inline-flex;">
            <el-tag type="danger" >{{ printerStatusMessage }}</el-tag>
          </div>
          <div v-if="printerStatus==1" style="display: inline-flex;">
                <div v-if="isShowPinters==1" style="font-size: 12px; line-height: 28px;font-weight: 600;">模板:</div>
                <div v-if="isShowTpl==1"  style="width: 150px;">
                  <el-select v-model="selTplCode" size="mini" placeholder="选择打印模板" clearable filterable>
                      <template slot="prefix">
                        <span style="padding: 5px;line-height: 28px;font-size: 16px;color: rgb(111 111 111);cursor: pointer;" @click="refreshPrintTpl()">
                          <i class="el-icon-refresh"></i>
                        </span>
                      </template>
                      <el-option
                        v-for="item in printTplList"
                        :key="item.tplCode"
                        :label="item.tplName"
                        :value="item.tplCode"
                      />
                  </el-select>
                </div>
                <div v-if="selTplCode=='TAN-GC-130' && isShowSubBillRange" class="subBillRange" style="display: inline-flex;font-size: 12px; line-height: 28px; font-weight: 600;">
                      <span >子单范围:
                      <el-input size="mini" style="width:40px" v-model="subBillStart" type="text"  maxlength="4" ></el-input>
                      -
                      <el-input size="mini" style="width:40px" v-model="subBillEnd" type="text"  maxlength="4" ></el-input>
                      </span>
                </div>

                <div v-if="isShowPinters==1"  style="font-size: 12px;line-height: 28px;font-weight: 600;">打印机:</div>
                <div v-if="isShowPinters==1"  style="width: 150px;">
                    <el-select v-model="selPrinterName" size="mini" placeholder="打印机" clearable filterable>
                      <el-option
                        v-for="item in printerList"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      />
                    </el-select>
                 </div>
          </div>
          <div v-if="printerStatus==1" style="display: inline-flex;">
            <!-- <span style="color: green;font-weight: 600;font-size:13px;">【Printer Online】</span> -->
            <span style="color: #b12e29;font-size:23px;" class="icon iconfont icon-printer" title="Printer Online"></span>
          </div>
          <div v-if="printerStatus==0" style="display: inline-flex;">
            <a :href="printerDownUrl"  style="color: blue;font-weight: 600;font-size:13px;text-decoration: underline">下载打印组件</a>
          </div>


        </div>
    </div>

    <el-dialog class="printPreDialog" title="预览" :visible.sync="openPdfView" width="95%"  height="100%" :close-on-click-modal="false" v-dialogDrag append-to-body>
      <div style="height:100%;width:100%;overflow: auto;">
        <PdfViewer ref="pdfViewer" :pdfList="pdfList"  @onPrint="onPdfViewPrint" ></PdfViewer>
      </div>
    </el-dialog>

  </div>


</template>
<script>
  import emitter from 'element-ui/src/mixins/emitter';
  import PdfViewer from '@/components/PdfViewer/viewer.vue';
  import PdfUtils from '@/utils/pdfUtils'

  export default {
    name: "TanexPrinterPanel",
    components: {
      PdfViewer,
    },
    mixins: [emitter],
    props: {
      value: {
        type: [Number],
        required: false
      },
      placeholder:{
        type: [String],
        required: false
      },
      isShowPinters:{
        type: [Boolean],
        required: false,
        default: false
      },
      isShowTpl:{
        type: [Boolean],
        required: false,
        default: false
      },
      isShowSubBillRange:{
        type: [Boolean],
        required: false,
        default: false
      }
    },
    data() {
      return {
        svalue: this.value,
        subBillStart:1,
        subBillEnd:1,
        openPdfView:false,
        pdfList:[],

        tanexPrinter:null,
        printerDownUrl:null,

        printerStatus:0,
        printerStatusMessage:'打印组件未连接',

        orderList:[],

        printerList:[],
        printTplList:[],

        selTplCode:null,
        selPrinterName:null,

        currentSelection:[],
      };
    },
    watch: {
      value(newVal) {
        this.svalue = newVal;
        if(this.svalue!=null) {
        }
      },
    },
    created() {
      this.initTanexPrinterSdk();
    },
    beforeDestroy(){
      // this.tanexPrinter.close();
    },
    methods: {
      initTanexPrinterSdk(){
        this.tanexPrinter = this.$tanexPrinter;

        this.getConfigKey("sys.printer.downurl").then(response => {
          this.printerDownUrl = response.msg;
        });

        this.tanexPrinter.init();

        this.tanexPrinter.setOnOpen(this.onPrinterOpen);
        this.tanexPrinter.setOnClose(this.onPrinterClose);
        this.tanexPrinter.setOnError(this.onPrinterError);
        this.tanexPrinter.setOnGetPrinter(this.onGetPrinter);
        this.tanexPrinter.setOnGetPrintTpl(this.onGetPrintTpl);

      },
      onPrinterOpen(evt){
        // console.log("onPrinterOpen")
        this.printerStatus = 1;
        this.$emit("input",this.printerStatus);
        this.printerStatusMessage="打印组件已连接,可以打印.";

      },
      onPrinterClose(evt){
        // console.log("onPrinterClose")
        this.printerStatus = 0;
        this.$emit("input",this.printerStatus);
        this.printerStatusMessage="打印组件已断开！";
      },
      onPrinterError(evt){
        // console.log("onPrinterError")
        this.printerStatus = 0;
        this.$emit("input",this.printerStatus);
        this.printerStatusMessage="打印组件已断开！";
      },
      onGetPrinter(msg){
        // console.log("onGetPrinter")
        this.printerList=this.tanexPrinter.getPrinterTplList();
        this.selPrinterName=this.tanexPrinter.getDefaultPrinter();
      },
      onGetPrintTpl(msg){
        // console.log("onGetPrintTpl")

        this.printTplList=[];

        this.printTplList=this.tanexPrinter.getPrintTplList();
        // console.log(this.printTplList)

        this.selTplCode=this.printTplList[0].tplCode;
      },
      getDefaultPrinter(){
          return this.tanexPrinter.getDefaultPrinter();
      },
      refreshPrintTpl(){
        this.printTplList=[];
        this.selTplCode=null;
        this.tanexPrinter.refreshPrintTpl()
      },
      lpadZero(val,len) {
        return (new Array(len + 1).join('0') + val).slice(-len);
      },
      /*
        高级批量打印
        [
            {
              "tplCode":tplCode,
              "printerName":printerName,
              "orderList":orderList.toString()
            }
          ]

      */

      batchPrintAdv(printDataList){
        if(this.printerStatus !=1){
          this.$modal.msgError("打印机未连接");
          return;
        }

        this.tanexPrinter.batchPrintAdv(printDataList);
      },

      batchPrint(orderList,tplCode){

        if(this.printerStatus !=1){
          this.$modal.msgError("打印机未连接");
          return;
        }

        let that = this;
        let newOrderList=[];
        if(orderList){
          this.orderList=[...orderList]
        }

        if(tplCode){
          this.selTplCode=tplCode
        }

        newOrderList=[...orderList];

        that.tanexPrinter.batchPrint(that.selTplCode,that.selPrinterName,newOrderList)
      },

      printPreviewAdv(printDataList,billCount){

        if(this.printerStatus !=1){
          this.$modal.msgError("打印机未连接");
          return;
        }

        let that = this;
        const loadingInstance = this.$loading({
                text: '正在生成预览...'
        })

        that.pdfList=[];
        this.tanexPrinter.batchGetPDFAdv(printDataList,billCount,async function(code,msg,data){
              console.log(msg);
              console.log(code);
              if(code == 500){
                that.$modal.msgError("打印出错:"+msg);
              }
              else if(code == 200){

                  console.log("=====11111==>");
                  console.log(data);

                  loadingInstance.close();

                  let pdfUtils=new PdfUtils({});


                  let blobUrl= await pdfUtils.getBlobUrl(date.file);
                  let pdfInfo={
                    "billCode":date.ydSn,
                    "pdfUrl":blobUrl
                  }
                  that.pdfList.push(pdfInfo);
                  that.openPdfView = true;

                    // const pdfDataList=[...pdfList];
                  // for(let i=0;i<pdfDataList.length;i++){
                  //   let url= await pdfUtils.getBlobUrl(item);
                  //     // that.pdfUrl=url;
                  //     let pdfInfo={
                  //       "billCode":"1"+new Date().getTime(),
                  //       "pdfUrl":url
                  //     }
                  //     console.log(pdfInfo);
                  //     that.pdfList.push(pdfInfo);
                  // }
                  // pdfUtils.mergePdf3(pdfDataList, (new Date()).getTime()+".pdf",false )
                  // .then(url=>{
                  //   loadingInstance.close();
                  //   that.pdfUrl=url;
                  //   that.openPdfView = true;
                  // })
                  // .catch(error => {
                  //   // console.log(error)
                  //   that.$modal.msgError("打印出错:"+erroMsg);
                  // });


              }
              else if(code == 800){
                // 全部获取完成
                console.log("===全部获取完成====>");
              }

          });
      },
      printPreview(orderList,tplCode,subStart,subEnd){

        if(this.printerStatus !=1){
          this.$modal.msgError("打印机未连接");
          return;
        }

        let that = this;
        let newOrderList=[];
        if(orderList){
          this.orderList=[...orderList]
        }
        if(tplCode){
          this.selTplCode=tplCode
        }

        if(subStart){
          this.subBillStart=subStart;
        }

        if(subEnd){
          this.subBillEnd=subEnd;
        }
        newOrderList=[...orderList];

        const loadingInstance = this.$loading({
                text: '正在生成预览...'
        })

        this.pdfList=[];
        // this.$refs.pdfViewer.clearList();

        this.tanexPrinter.batchGetPDF(this.selTplCode,this.selPrinterName,newOrderList,async function(code,msg,pdfData){
              if(code == 500){
                that.$modal.msgError("打印出错:"+msg);
              }
              else if(code == 200){

                  loadingInstance.close();
                  let pdfUtils=new PdfUtils({});
                  let blobUrl= await pdfUtils.getBlobUrl(pdfData.file);
                  let pdfInfo={
                    "billCode":pdfData.ydSn,
                    "pdfUrl":blobUrl
                  }
                  that.pdfList.push(pdfInfo);
                  // this.$refs.pdfViewer.addPdfUrl(pdfData.ydSn,blobUrl);
                  that.openPdfView = true;

                    // const pdfDataList=[...pdfList];
                  // for(let i=0;i<pdfDataList.length;i++){
                  //   let url= await pdfUtils.getBlobUrl(item);
                  //     // that.pdfUrl=url;
                  //     let pdfInfo={
                  //       "billCode":"1"+new Date().getTime(),
                  //       "pdfUrl":url
                  //     }
                  //     console.log(pdfInfo);
                  //     that.pdfList.push(pdfInfo);
                  // }
                  // pdfUtils.mergePdf3(pdfDataList, (new Date()).getTime()+".pdf",false )
                  // .then(url=>{
                  //   loadingInstance.close();
                  //   that.pdfUrl=url;
                  //   that.openPdfView = true;
                  // })
                  // .catch(error => {
                  //   // console.log(error)
                  //   that.$modal.msgError("打印出错:"+erroMsg);
                  // });

              }
              else if(code == 800){
                // 全部获取完成
                console.log("===全部获取完成====>");
              }
          });
      },
      downPDF(orderList){

        if(this.printerStatus !=1){
          this.$modal.msgError("打印机未连接");
          return;
        }


        let that = this;
        let newOrderList=[];
        if(orderList){
          this.orderList=[...orderList]
        }

        // 打印子单
        if(this.selTplCode=="TAN-GC-130"){
          for(let i=0;i<this.orderList.length;i++){
            let billCode=this.orderList[i];
            // 循环子单范围
            for(let i=this.subBillStart;i<=this.subBillEnd;i++){
                let subBillCode = billCode+""+this.lpadZero(i,4);
                newOrderList.push(subBillCode);
            }
          }
        }else{
          newOrderList=[...orderList];
        }

        let fileName = newOrderList.join("");

        const loadingInstance = this.$loading({
                text: '正在下载...'
        })
        this.tanexPrinter.batchGetPDF(this.selTplCode,this.selPrinterName,newOrderList,function(code,msg,pdfData){
              loadingInstance.close();

              if(code == 500){
                that.$modal.msgError("下载出错:"+msg);
              }
              else if(code == 200){

                  console.log("=====3333==>");
                  console.log(pdfData);

                  loadingInstance.close();

                  let pdfUtils=new PdfUtils({});
                  let pdfDataList=[];
                  pdfDataList.push(pdfData.file)

                  pdfUtils.mergePdf3(pdfDataList, pdfData.ydSn+".pdf",true )

                  // let blobUrl= await pdfUtils.getBlobUrl(pdfData.file);
                  // let pdfInfo={
                  //   "billCode":pdfData.ydSn,
                  //   "pdfUrl":blobUrl
                  // }
                  // that.pdfList.push(pdfInfo);
                  // that.openPdfView = true;

                    // const pdfDataList=[...pdfList];
                  // for(let i=0;i<pdfDataList.length;i++){
                  //   let url= await pdfUtils.getBlobUrl(item);
                  //     // that.pdfUrl=url;
                  //     let pdfInfo={
                  //       "billCode":"1"+new Date().getTime(),
                  //       "pdfUrl":url
                  //     }
                  //     console.log(pdfInfo);
                  //     that.pdfList.push(pdfInfo);
                  // }
                  // pdfUtils.mergePdf3(pdfDataList, (new Date()).getTime()+".pdf",false )
                  // .then(url=>{
                  //   loadingInstance.close();
                  //   that.pdfUrl=url;
                  //   that.openPdfView = true;
                  // })
                  // .catch(error => {
                  //   // console.log(error)
                  //   that.$modal.msgError("打印出错:"+erroMsg);
                  // });

              }
              else if(code == 800){
                // 全部获取完成
                console.log("===全部获取完成====>");
              }

              // if(success){
              //     const pdfDataList=[...pdfList];
              //     let pdfUtils=new PdfUtils({});
              //     // for()
              //     // pdfUtils.mergePdf3(pdfDataList, (new Date()).getTime()+".pdf",true )
              //     pdfUtils.mergePdf3(pdfDataList, fileName+".pdf",true )

              // }else{
              //   that.$modal.msgError("下载出错:"+erroMsg);
              // }
        });
      },

      // 响应PDF预览
      onPdfViewPrint(){
        this.$emit("onPrint");
      }

    }
  };
</script>

<style lang="scss">

  .printPreDialog .el-dialog__body {
    margin: 0px!important;
  }

  .subBillRange .el-input__inner {
    padding:0px;
    text-align: center;
  }


</style>