#

whycq

2023-04-28 a536410e1b8987bc7fc42e17574b42bce096320f

 pages/print/print.vue

@@ -2,10 +2,25 @@
   <view>
      <view class="print-model" :style="style">
         <view class="display" :style="">
            <table >
               <tr><td>料号</td><td>{{mat.matnr}}</td><td colspan="1" rowspan="2" style="width: 150px;"></td></tr>
               <tr><td>商品</td><td colspan="1">{{mat.matkx}}</td></tr>
               <tr><td>日期</td><td colspan="2">2023-04-24 15:25:32</td></tr>
            <table>
               <tr>
                  <td>料号</td>
                  <td>{{mat.matnr}}</td>
                  <td colspan="1" rowspan="2" style="width: 150px;">
                     <!-- 二维码 -->
                     <view class="qr-box">
                        <canvas canvas-id="qrcode" v-show="qrShow" style="width: 300rpx;margin: 0 auto;" />
                     </view>
                  </td>
               </tr>
               <tr>
                  <td>商品</td>
                  <td colspan="1">{{mat.matkx}}</td>
               </tr>
               <tr>
                  <td>日期</td>
                  <td colspan="2">2023-04-24 15:25:32</td>
               </tr>
            </table>
         </view>
      </view>
@@ -13,11 +28,18 @@
</template>

<script>
   import uQRCode from '@/static/js/uqrcode.js' //引入uqrcode.js
   export default {
      data() {
         return {
            style: {height:'3px'},
            mat: {matnr: '1200128-10055',matkx: 'X5S-4-M03/333'}
            style: {
               height: '3px'
            },
            mat: {
               matnr: '1200128-10055',
               matkx: 'X5S-4-M03/333'
            },
            qrShow: false
         }
      },
      onShow() {
@@ -28,10 +50,29 @@
         console.log(getWindowInfo.windowWidth); //可操作页面宽度
         console.log(getWindowInfo);
         console.log('获取窗口信息');
         let height = (getWindowInfo.screenWidth + 10 ) * 48 / 74
         let height = (getWindowInfo.screenWidth + 10) * 48 / 74
         console.log(height);
         this.style.height = height + 'px'
			
         this.qrFun("1200128-10055")

      },
      methods: {
         //**生成二维码**//
         qrFun(text) {
            this.qrShow = true
            uQRCode.make({
               canvasId: 'qrcode',
               componentInstance: this,
               text: text,
               size: 150,
               margin: 0,
               backgroundColor: '#ffffff',
               foregroundColor: '#000000',
               fileType: 'jpg',
               errorCorrectLevel: uQRCode.errorCorrectLevel.H,
               success: res => {}
            })
         }
      }
   }
</script>
@@ -44,6 +85,7 @@
      align-items: center;
      justify-content: center;
   }

   .display {
      width: 96%;
      height: 96%;
@@ -54,17 +96,20 @@
      align-items: center;
      justify-content: center;
   }

   .display-pak {
      margin: 2%;
      height: 92%;
      border: 1px solid #8a8a8a;
   }

   table {
      width: 92%;
      height: 92%;
      border: 0;
      border-collapse: collapse;
   }

   td {
      border: 1px solid #8a8a8a;
      text-align: center;