修改二维码生成

ruoyi-ui/src/views/in/stockIn/index.vue

@@ -171,6 +171,16 @@
       :limit.sync="queryDetailParams.pageSize"
       @pagination="getDetailList"
     />
+
+    <!-- 打印模板 -->
+    <vue-easy-print v-show="true" ref="easyPrint2">
+      <div v-for="item  in printData" :key="item.stockinDetailId" style="page-break-after:always" class="vue-easy-print">
+        <vue-qr :text='item.stockinDetailId' :size="150" :margin="10" :align-item="center" :correctLevel="2"></vue-qr>
+        <div>
+          <span class="num">{{ item.stockinDetailId }}</span>
+        </div>
+      </div>
+    </vue-easy-print>
   </div>
 </template>
 
@@ -188,11 +198,18 @@ import {
 import {listStockInDetail, barcodePrinting} from "@/api/in/stockInDetail"
 import {getLodop} from "@/plugins/LodopFuncs.js"
 import {listWarehouse} from "@/api/bas/warehouse";
+import vueEasyPrint from 'vue-easy-print'
+import VueQr from 'vue-qr'
+
 
 
 export default {
   name: "StockIn",
   dicts: ['bill_resource', 'in_bill_status', 'in_bill_type'],
+  components: {
+    vueEasyPrint,
+    VueQr
+  },
   data() {
     return {
       // 遮罩层
@@ -205,6 +222,7 @@ export default {
       // 主表选中的数据
       stockInListSelected: [],
       stockInDetailListSelected: [],
+      printData:[],
       // 非单个禁用
       single: true,
       detailSingle: true,
@@ -401,50 +419,16 @@ export default {
     },
     /** 打印条码按钮操作 */
     handleBarcodePrinting(row){
-      let printData = this.stockInDetailListSelected
-
-
-
-      if (printData.length === 0) {
+      this.printData = this.stockInDetailListSelected
+      if (this.printData.length === 0) {
         this.$modal.msgWarning(this.$t('inStockin.selectPrintData'))
         return
       }
-      console.log(printData)
-
-      this.printBarcode(printData)
-    },
-    /** 打印条码 */
-    printBarcode(printData) {
-      try {
-        // 获取Lodop打印对象
-        let LODOP = getLodop()
-        if (!LODOP) {
-          this.$modal.msgError(this.$t('inStockin.printFail'))
-          return
-        }
-        LODOP.SET_SHOW_MODE("LANGUAGE", 0);
-        LODOP.PRINT_INITA(10, 10, 1000, 800, "物资条码");
-        LODOP.SET_PRINT_PAGESIZE(1, 1000, 500, 0);
-        LODOP.SET_PRINT_MODE("AUTO_CLOSE_PREWINDOW", 1);
-
-        for (let i = 0; i < printData.length; i++) {
-          LODOP.NewPage();
-          LODOP.ADD_PRINT_BARCODE(17,35,120,120,"QRCode",printData[i].stockinDetailId);
-          LODOP.ADD_PRINT_TEXT(22,147,72,20,this.$t('inReceiveStockin.productId')+":");
-          LODOP.ADD_PRINT_TEXT(22,205,180,20,printData[i].productId);
-          LODOP.ADD_PRINT_TEXT(44,147,66,20,this.$t('inReceiveStockin.materialDesc')+":");
-          LODOP.ADD_PRINT_TEXT(44,206,180,35,printData[i].extraField.materialDesc);
-          LODOP.ADD_PRINT_TEXT(66,148,64,20,this.$t('inReceiveStockin.englishDesc')+":");
-          LODOP.ADD_PRINT_TEXT(66,205,180,20,printData[i].extraField.englishDesc);
-          LODOP.ADD_PRINT_TEXT(88,148,64,20,this.$t('inReceiveStockin.packingMethod')+":");
-          LODOP.ADD_PRINT_TEXT(88,205,180,20,printData[i].extraField.packingMethod);
-          LODOP.ADD_PRINT_TEXT(110,147,61,20,this.$t('inReceiveStockin.cartonNo')+":");
-          LODOP.ADD_PRINT_TEXT(110,196,180,20,printData[i].extraField.cartonNo);
-        }
-        LODOP.PREVIEW();
-      } catch (error) {
-        this.$modal.msgError(this.$t('inStockin.printFail1') + error.message)
-      }
+      this.$nextTick(() => {
+        setTimeout(() => {
+          this.$refs.easyPrint2.print()
+        }, 100)
+      })
     },
     getDetailList(stockinId) {
       this.detailLoading = true;
@@ -475,4 +459,46 @@ export default {
   width: auto;
   min-width: fit-content;
 }
+/* 打印样式 */
+.vue-easy-print {
+  text-align: center;
+}
+
+.num {
+  display: block;
+  text-align: center;
+  font-size: 16px;
+  margin-top: 15px;
+  font-family: Arial, sans-serif;
+}
+
+.vue-qr {
+  display: block;
+  margin: 20px auto;
+  max-width: 100%;
+}
+
+@media print {
+  @page {
+    size: A4;
+    margin: 0;
+  }
+
+  body {
+    margin: 0;
+  }
+
+  .vue-easy-print {
+    padding: 20px;
+  }
+
+  .num {
+    font-size: 14px;
+    margin-top: 10px;
+  }
+
+  .vue-qr {
+    margin: 10px auto;
+  }
+}
 </style>