uni_h5/pages/index/mixins/mixins.js

// import { hiPrintPlugin } from 'vue-plugin-hiprint'
// import { io } from "socket.io-client";
import { webviewGetMessage } from "@/utils/appToWebview";
import {getPrintTemplateList} from "@/api/rawInBound";
export const mixins = {
  data() {
    return {
        hiprintTemplate: null,
        socket: null,
        globalThis: {},
        printerList: [],
        liveClient: '',
        appMsg: '',
        templateJson: {},
        // templateData: {groupName: '挤压班组204A', specification: 'L20*30*2000',  weight: 298, batchNum: '202409022#B10'},
        templateData: {},

    };
  },
   created() {
       // this.changeTemplate()
       webviewGetMessage("msgFromApp", (params) => {
               this.templateJson = params.templateJson;
               this.templateData = params.templateData;
               this.changeTemplate()
               // this.appMsg = params;
       });
  },
  mounted() {


  },

    // watch: {
    //     hiprintTemplate :{
    //         handler(val) {
    //             console.log("hiprintTemplate", val)
    //             if(val && !this.printerList.length){
    //                 this.getPrintList()
    //             }
    //         }
    //     },
    // },
  methods: {

      getPrintList() {
          if (window.hiwebSocket.opened || window.hiwebSocket.printerList.length) {
              this.printerList = window.hiwebSocket.printerList;
              console.log("printerList",this.printerList)
              if(this.printerList && this.printerList.length){
                  this.liveClient = this.printerList[0].name;
                  this.print()
              }
              return
          }
          alert('客户端未连接,无法直接打印')
      },

      changeTemplate() {
          this.hiprintTemplate = new this.$pluginName.PrintTemplate({
              template: this.templateJson
          })

          this.hiprintTemplate.on('printSuccess', function () {
              console.log('打印成功');
              uni.showToast({title:'打印成功',icon:'success'})
          });
          this.hiprintTemplate.on('printError', function () {
              console.log('打印失败');
              uni.showToast({title:'打印失败',icon:'error'})
          });

          setTimeout(() => {
              this.getPrintList()
          }, 1000)
      },

    initHiprint(url,token, templateCode) {

        hiprint.init({
            host: url, // 打印客户端的地址
            token: token, // 与打印客户端相同的 token
        })

        //
        // let templateJson = '{"panels":[{"index":0,"name":1,"height":90,"width":150,"paperHeader":0,"paperFooter":255.1181102362205,"printElements":[{"options":{"left":0,"top":3,"height":177,"width":415.5,"right":423,"bottom":181.5,"vCenter":215.25,"hCenter":93},"printElementType":{"title":"矩形","type":"rect"}},{"options":{"left":118.5,"top":12,"height":22.5,"width":184.5,"title":"贵溪永宏铜材有限公司","coordinateSync":false,"widthHeightSync":false,"fontSize":18,"lineHeight":18,"qrCodeLevel":0,"right":303,"bottom":33,"vCenter":210.75,"hCenter":21.75},"printElementType":{"title":"文本","type":"text"}},{"options":{"left":4.5,"top":34.5,"height":21,"width":289.5,"title":"班组：","coordinateSync":false,"widthHeightSync":false,"fontSize":18,"lineHeight":18,"qrCodeLevel":0,"field":"groupName","testData":"${groupName}","right":202.5,"bottom":55.5,"vCenter":102.75,"hCenter":45},"printElementType":{"title":"文本","type":"text"}},{"options":{"left":321,"top":52.5,"height":80,"width":80,"title":"二维码","qrcodeType":"qrcode","testData":"${batchNum}","field":"batchNum","coordinateSync":false,"widthHeightSync":false,"right":400.25,"bottom":130.25,"vCenter":360.25,"hCenter":90.25},"printElementType":{"title":"二维码","type":"qrcode"}},{"options":{"left":4.5,"top":61.5,"height":22.5,"width":289.5,"title":"规格：","coordinateSync":false,"widthHeightSync":false,"fontSize":18,"lineHeight":18,"qrCodeLevel":0,"right":136.5,"bottom":146.9999953508377,"vCenter":76.5,"hCenter":135.7499953508377,"field":"specification","testData":"${specification}"},"printElementType":{"title":"文本","type":"text"}},{"options":{"left":6,"top":87,"height":22.5,"width":288,"title":"重量：","coordinateSync":false,"widthHeightSync":false,"fontSize":18,"lineHeight":18,"qrCodeLevel":0,"field":"weight","testData":"${weight}"},"printElementType":{"title":"文本","type":"text"}},{"options":{"left":4.5,"top":115.5,"height":24,"width":291,"title":"批号：","coordinateSync":false,"widthHeightSync":false,"fontSize":18,"lineHeight":18,"qrCodeLevel":0,"right":125.2500228881836,"bottom":138.7500067949295,"vCenter":65.2500228881836,"hCenter":126.7500067949295,"field":"batchNum","testData":"${batchNum}"},"printElementType":{"title":"文本","type":"text"}}],"paperNumberLeft":310,"paperNumberTop":40,"paperNumberDisabled":true,"paperNumberContinue":true,"watermarkOptions":{}}]}'
        // this.hiprintTemplate = new this.$pluginName.PrintTemplate({
        //     template: JSON.parse(templateJson)
        // })

        // setTimeout(() => {
        //     console.log("window.hiwebSocket.onopen", window.hiwebSocket.opened)
        //     uni.showToast({title:'window.hiwebSocket.opened',icon:'error'})
        //     alert(window.hiwebSocket.opened)
        //     this.getPrintList()
        // }, 1000)

        // getPrintTemplateList({ templateCode: templateCode, status: 1 }).then(async res => {
        //     if (res.code === 200) {
        //         let temp = JSON.parse(res.rows[0].content);
        //
        //         console.log("temp",temp)
        //         this.hiprintTemplate = new this.$pluginName.PrintTemplate({
        //             template: temp
        //         })
        //
        //         this.hiprintTemplate.on('printSuccess', function () {
        //             console.log('打印成功');
        //             uni.showToast({title:'打印成功',icon:'success'})
        //         });
        //         this.hiprintTemplate.on('printError', function () {
        //             console.log('打印失败');
        //             uni.showToast({title:'打印失败',icon:'error'})
        //         });
        //
        //         setTimeout(() => {
        //             console.log("window.hiwebSocket.onopen", window.hiwebSocket.opened)
        //             this.getPrintList()
        //         }, 1000)
        //     }
        // })

    },
      print(){
          // if(!this.globalThis.connect){
          //     return uni.showToast({title:'打印失败，请检查打印机状态',icon:'error'})
          // }

          if (window.hiwebSocket.opened === false) {
              return uni.showToast({title:'打印失败，请检查打印机状态',icon:'error'})
          }
          uni.showToast({title:'开始打印',icon:'success'})
          // let data = {groupName: '挤压班组204A', specification: 'L20*30*2000',  weight: 298, batchNum: '202409022#B10'}
          this.hiprintTemplate.print2(this.templateData,{
              printer: this.liveClient, // 打印机名称，不填则默认打印机
              title: 'app测试打印',

          });//直接打印，需要安装客户端 下面会提到客户端的安装

      },

  },
};