2025-11-13

销售发货装托的标签打印

src/views/modules/boxManage/PalletLabelPrint.vue

@@ -0,0 +1,95 @@
+<template>
+  <div class="pallet-label-container">
+    <!-- No. 区域 -->
+    <div class="info-row">
+      <span class="info-text">No.: {{ palletData.orderNo || '' }}</span>
+    </div>
+    
+    <!-- 横线1 -->
+    <div class="divider-line"></div>
+    
+    <!-- Pallet No. 区域 -->
+    <div class="info-row">
+      <span class="info-text">Pallet No.: {{ palletData.palletNo || '' }}</span>
+    </div>
+    
+    <!-- 横线2 -->
+    <div class="divider-line"></div>
+    
+    <!-- 二维码区域 -->
+    <div class="qrcode-row">
+      <img :src="qrCodeDataUrl" />
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'PalletLabelPrint',
+  props: {
+    palletData: {
+      type: Object,
+      required: true,
+      default: () => ({
+        orderNo: '',
+        palletNo: ''
+      })
+    },
+    qrCodeDataUrl: {
+      type: String,
+      required: true,
+      default: ''
+    }
+  }
+}
+</script>
+
+<style scoped>
+.pallet-label-container {
+  width: 100mm;
+  height: 80mm;
+  display: flex;
+  flex-direction: column;
+  box-sizing: border-box;
+  border: 1px solid #333;
+  background: #fff;
+  font-family: "Microsoft YaHei", Arial, sans-serif;
+}
+
+/* 信息行 */
+.info-row {
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  padding-left: 5mm;
+  height: 18mm;
+}
+
+.info-text {
+  font-size: 12pt;
+  font-family: "Microsoft YaHei", Arial, sans-serif;
+  color: #000;
+  font-weight: bold;
+}
+
+/* 横向分隔线 */
+.divider-line {
+  height: 1px;
+  background: #333;
+}
+
+/* 二维码区域 */
+.qrcode-row {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.qrcode-row img {
+  width: 40mm;
+  height: 40mm;
+  display: block;
+}
+</style>
+

src/views/modules/boxManage/com_saleBoxManage_pallet.vue

@@ -4,6 +4,7 @@
         <el-form-item >
           <el-button type="primary" @click="searchTable()">查询</el-button>
           <el-button v-if="searchData.orderStatus === '待包装'" type="primary" @click="newPallet()">新增托</el-button>
+          <el-button type="primary" @click="printPalletLabels()" :disabled="selectedPallets.length <= 0">打印</el-button>
         </el-form-item>
     </el-form>
     <el-table
@@ -11,7 +12,14 @@
       :height=searchData.height
       border
       v-loading="dataListLoading"
+      @selection-change="handleSelectionChange"
       style="width: 100%; ">
+      <el-table-column
+        type="selection"
+        header-align="center"
+        align="center"
+        width="50">
+      </el-table-column>
       <el-table-column
         v-for="(item,index) in columnList" :key="index"
         :sortable="item.columnSortable"
@@ -222,6 +230,10 @@ import {
   deletePalletBox,
   searchBoxRollDetail
 } from '../../../api/boxManage/boxManage'
+import PalletLabelPrint from './PalletLabelPrint.vue'
+import Vue from 'vue'
+import getLodop from '@/utils/LodopFuncs.js'
+import QRCode from 'qrcode'
 
 export default {
   components: {
@@ -369,6 +381,7 @@ export default {
       boxRollDetailDialogVisible: false,
       boxRollDetailList: [],
       boxRollDetailLoading: false,
+      selectedPallets: [], // 选中的托盘列表
     }
   },
   methods: {
@@ -585,6 +598,78 @@ export default {
         }
       })
     },
+    // 多选变化
+    handleSelectionChange(val) {
+      this.selectedPallets = val
+    },
+    // 打印托盘标签
+    async printPalletLabels() {
+      if (this.selectedPallets.length === 0) {
+        this.$message.warning('请选择要打印的托盘!')
+        return
+      }
+
+      const LODOP = getLodop()
+      if (!LODOP) {
+        this.$message.error('未检测到打印控件，请安装CLodop打印控件!')
+        return
+      }
+
+      try {
+        // 初始化打印
+        LODOP.PRINT_INIT('托盘标签打印')
+
+        // 设置纸张尺寸：100mm x 80mm
+        LODOP.SET_PRINT_PAGESIZE(0, 1000, 800, '')
+
+        // 循环打印每个选中的托盘
+        for (let i = 0; i < this.selectedPallets.length; i++) {
+          const pallet = this.selectedPallets[i]
+
+          if (i > 0) {
+            LODOP.NEWPAGE() // 新页
+          }
+
+          // 绘制外边框
+          LODOP.ADD_PRINT_RECT('2mm', '2mm', '96mm', '76mm', 0, 1)
+
+          // 绘制第一条横线（No. 下方）
+          LODOP.ADD_PRINT_LINE('20mm', '2mm', '20mm', '98mm', 0, 1)
+
+          // 绘制第二条横线（Pallet No. 下方）
+          LODOP.ADD_PRINT_LINE('38mm', '2mm', '38mm', '98mm', 0, 1)
+
+          // No. 文字信息（靠左，上下居中）
+          // No. 区域高度 18mm，文字垂直居中
+          const text1 = LODOP.ADD_PRINT_TEXT('10mm', '5mm', '90mm', '8mm', 'No.: ' + (this.searchData.orderNo || ''))
+          LODOP.SET_PRINT_STYLEA(text1, "FontName", "Microsoft YaHei")
+          LODOP.SET_PRINT_STYLEA(text1, "FontSize", 12)
+          LODOP.SET_PRINT_STYLEA(text1, "Bold", 1)
+
+          // Pallet No. 文字信息（靠左，上下居中）
+          // Pallet No. 区域高度 18mm，文字垂直居中
+          const text2 = LODOP.ADD_PRINT_TEXT('28mm', '5mm', '90mm', '8mm', 'Pallet No.: ' + (pallet.palletNo || ''))
+          LODOP.SET_PRINT_STYLEA(text2, "FontName", "Microsoft YaHei")
+          LODOP.SET_PRINT_STYLEA(text2, "FontSize", 12)
+          LODOP.SET_PRINT_STYLEA(text2, "Bold", 1)
+
+          // 二维码（在下方区域居中，向上移动）
+          // 下方区域：38mm到78mm = 40mm高度
+          // 二维码40mm，左右居中：2mm + (96mm-40mm)/2 = 30mm
+          // 垂直居中：38mm
+          const qrIndex = LODOP.ADD_PRINT_BARCODE('41mm', '30mm', '40mm', '40mm', 'QRCode', pallet.palletNo)
+          LODOP.SET_PRINT_STYLEA(qrIndex, "QRCodeVersion", 5)
+          LODOP.SET_PRINT_STYLEA(qrIndex, "QRCodeErrorLevel", "M")
+        }
+
+        // 预览打印
+        LODOP.PREVIEW()
+
+      } catch (error) {
+        console.error('打印失败:', error)
+        this.$message.error('打印失败: ' + error.message)
+      }
+    },
     // 查看装箱明细
     viewBoxRollDetail(row){
       this.boxRollDetailList = []