package.json

@@ -32,7 +32,10 @@
    "lodash.pick": "^4.4.0",
    "md5": "^2.2.1",
    "nprogress": "^0.2.0",
    "print-js": "^1.6.0",
    "qiankun": "^2.5.1",
    "qrcode": "^1.5.4",
    "qrcode.js": "^0.0.1",
    "tinymce": "5.4.1",
    "viser-vue": "^2.4.8",
    "vue": "^2.6.10",

 src/views/mes/MesMaterialTransferDetailList.vue

ÎļþÒÑɾ³ý

 src/views/mes/MesProductionWorkOrderListView.vue

@@ -195,7 +195,6 @@
    <mes-production-work-order-modal ref="modalForm" @ok="modalFormOk"></mes-production-work-order-modal>
    <mes-production-order-modal ref="MesProductionOrderModal"></mes-production-order-modal>
    <MesMaterialUnloadingList ref="MesMaterialUnloadingList"></MesMaterialUnloadingList>
    <MesMaterialTransferDetailList ref="MesMaterialTransferDetailList"></MesMaterialTransferDetailList>
    <MesProductionWorkOrderScheduleModal ref="MesProductionWorkOrderScheduleModal" @ok="modalFormOk"></MesProductionWorkOrderScheduleModal>
    <MesProductionWorkOrderRepublishModal ref="MesProductionWorkOrderRepublishModal" @ok="modalFormOk"></MesProductionWorkOrderRepublishModal>
    <MesProductionWorkOrderReportModal ref="MesProductionWorkOrderReportModal" @ok="modalFormOk"></MesProductionWorkOrderReportModal>
@@ -215,7 +214,6 @@
import { getAction, requestPut } from '@api/manage'
import MesProductionOrderModal from '@views/mes/modules/MesProductionOrderModal.vue'
import MesMaterialUnloadingList from '@views/mes/MesMaterialUnloadingList.vue'
import MesMaterialTransferDetailList from '@views/mes/MesMaterialTransferDetailList.vue'
import MesProductionWorkOrderScheduleModal from '@views/mes/modules/MesProductionWorkOrderScheduleModal.vue'
import MesProductionWorkOrderRepublishModal from '@views/mes/modules/MesProductionWorkOrderRepublishModal.vue'
import MesProductionWorkOrderReportModal from '@views/mes/modules/MesProductionWorkOrderReportModal.vue'
@@ -228,7 +226,6 @@
    MesProductionWorkOrderModal,
    MesProductionOrderModal,
    MesMaterialUnloadingList,
    MesMaterialTransferDetailList,
    MesProductionWorkOrderScheduleModal,
    MesProductionWorkOrderRepublishModal,
    MesProductionWorkOrderReportModal,
@@ -583,7 +580,6 @@
        queryCompletenessCheckByWorkOrderId:'/mes/mesKittingCompletenessCheck/queryCompletenessCheckByWorkOrderId',
        queryOrderById:'/mes/productionOrder/queryById',
        queryUnloadingByLoadingId:'/mes/mesMaterialUnloading/queryUnloadingByLoadingId',
        queryTransferDetailBy:'/mes/mesMaterialTransferDetail/queryTransferDetailBy',
        publish: '/mes/mesProductionWorkOrder/publish',
        execute: '/mes/mesProductionWorkOrder/execute',
      },
@@ -631,12 +627,6 @@
    },
    handleCompletenessCheck(record) {
      this.$refs.MesProductionWorkOrderCompletenessCheckModal.check(record)
    },
    async handleTransferDetail(row){
      console.log('row---->',row)
      const transferDetailResult = await getAction(this.url.queryTransferDetailBy,{'requestId':row.id})
      this.$refs.MesMaterialTransferDetailList.visible = true
      this.$refs.MesMaterialTransferDetailList.dataSource = transferDetailResult.result.records
    },
    async handleUnLoadingDetail(row){
      console.log('row---->',row)

 src/views/mes/modules/MesMaterialTransferDetailForm.vue

ÎļþÒÑɾ³ý

 src/views/mes/modules/MesMaterialTransferDetailModal.vue

ÎļþÒÑɾ³ý

 src/views/mes/modules/MesProductionWorkOrderReportModal.vue

@@ -54,11 +54,69 @@
        </a-form-model>
      </j-form-container>
    </a-spin>

    <!-- æ‰“印标签容器 -->
    <div id="printLabel" style="visibility: hidden; position: absolute; left: -9999px; width: 300px; height: 200px; border: 1px solid #000; font-family: 'Microsoft YaHei', sans-serif; padding: 8px; box-sizing: border-box;">
      <!-- æ ‡ç­¾å®¹å™¨ -->
      <div style="display: flex; flex-direction: column; height: 100%;">
        <!-- å¤´éƒ¨ï¼šæ ‡é¢˜ + Logo -->
        <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; width: 100%;">
          <h3 style="margin: 0; color: white; background-color: black; padding: 4px 8px; border-radius: 4px; font-size: 14px; font-weight: bold;">成品托标签</h3>
          <img src="/logo.png" alt="公司Logo" style="width: 40px; height: 40px;" />
        </div>

        <!-- ä¸»ä½“内容：左侧文本 + å³ä¾§äºŒç»´ç  -->
        <div style="display: flex; flex: 1; gap: 20px;">
          <!-- å·¦ä¾§ï¼šæ ‡ç­¾ä¿¡æ¯ -->
          <div style="flex: 1; line-height: 1.4; font-size: 10px;">
            <table style="width: 100%; border-collapse: collapse;">
              <tr>
                <td style="width: 60px; font-weight: bold; white-space: nowrap;">批次号：</td>
                <td>{{ finishedProductLabel.batchNumber }}</td>
              </tr>
              <tr>
                <td style="width: 60px; font-weight: bold; white-space: nowrap;">产品型号：</td>
                <td>{{ finishedProductLabel.materialName }}</td>
              </tr>
              <tr>
                <td style="width: 60px; font-weight: bold; white-space: nowrap;">库存地点：</td>
                <td>{{ finishedProductLabel.warehouseCode }}</td>
              </tr>
              <tr>
                <td style="width: 60px; font-weight: bold; white-space: nowrap;">工单号：</td>
                <td>{{ finishedProductLabel.orderCode }}</td>
              </tr>
              <tr>
                <td style="width: 60px; font-weight: bold; white-space: nowrap;">任务号：</td>
                <td>{{ finishedProductLabel.workOrderCode }}</td>
              </tr>
              <tr>
                <td style="width: 60px; font-weight: bold; white-space: nowrap;">数量：</td>
                <td>{{ finishedProductLabel.quantity }}</td>
              </tr>
            </table>
          </div>

          <!-- å³ä¾§ï¼šäºŒç»´ç  -->
          <div style="flex: 0 0 60px; text-align: center;">
            <canvas id="qrcodeCanvas" width="60" height="60"></canvas>
          </div>
        </div>

        <!-- åº•éƒ¨ï¼šæ‰˜å· -->
        <div style="text-align: center; margin-top: 8px; font-size: 10px; font-weight: bold;">
          {{ finishedProductLabel.palletNumber }}
        </div>
      </div>

    </div>
  </j-modal>
</template>

<script>
import { postAction, getAction } from '@api/manage'
import printJS from 'print-js'
import QRCode from 'qrcode'

export default {
  name: 'MesProductionWorkOrderReportModal',
@@ -84,7 +142,8 @@
        report: '/mes/mesWorkReporting/add',
        selectReportWorkOrderList: '/mes/productionOrder/selectReportWorkOrderList'
      },
      workOrderOptions: []
      workOrderOptions: [],
      finishedProductLabel: {}
    }
  },
  computed: {
@@ -93,6 +152,90 @@
    },
  },
  methods: {
    // ç”ŸæˆäºŒç»´ç 
    generateQRCode(text) {
      const canvas = document.getElementById('qrcodeCanvas');
      // æ¸…空画布
      const ctx = canvas.getContext('2d');
      ctx.clearRect(0, 0, canvas.width, canvas.height);

      // ç”ŸæˆäºŒç»´ç 
      QRCode.toCanvas(canvas, text, {
        width: 60,
        margin: 1,
        errorCorrectionLevel: 'M'
      }, (error) => {
        if (error) {
          console.error('二维码生成失败:', error);
        }
      });
    },
    // æ‰“印标签
    printLabel() {
      this.generateQRCode('成品托标签'); // å…ˆç”ŸæˆäºŒç»´ç 
      setTimeout(() => {
        printJS({
          printable: 'printLabel',
          type: 'html',
          targetStyles: ['*'],
          style: `        @page {
          margin: 0;
          size: A4;
        }
        #printLabel {
          visibility: visible !important;
          position: static !important;
          left: 0 !important;
          top: 0 !important;
          width: 300px !important;
          height: 200px !important;
          border: 1px solid #000;
          font-family: 'Microsoft YaHei', sans-serif;
          padding: 8px;
          box-sizing: border-box;
          margin: 0;
        }
        #printLabel h3 {
          margin: 0;
          color: white;
          background-color: #000;
          padding: 4px 8px;
          border-radius: 4px;
          font-size: 14px;
          font-weight: bold;
        }
        #printLabel img {
          width: 40px;
          height: 40px;
        }
        #printLabel table {
          width: 100%;
          border-collapse: collapse;
        }
        #printLabel td {
          padding: 2px 0;
        }
        #printLabel canvas {
          width: 60px;
          height: 60px;
        }
        @media print {
          * {
            background: inherit !important;
            color: inherit !important;
            filter: none !important;
            -webkit-filter: none !important;
          }
          #printLabel h3 {
            background-color: #000 !important;
            color: white !important;
          }
        }
      `,
          scanStyles: false
        });
      }, 100);
    },
    add (record) {
      // é‡ç½®è¡¨å•
      this.$refs.form && this.$refs.form.resetFields()
@@ -119,9 +262,26 @@
            factoryId: this.model.factoryId,
            quantity: this.model.quantity
          }
          const workOrderOption = this.workOrderOptions.find(item => item.value === this.model.orderId)
          postAction(this.url.report, formData).then(res => {
            if (res.success) {
              this.$message.success(res.message)
              const data = res.result
              if (data.reportType === 'FINISHED') {
                this.finishedProductLabel = {
                  batchNumber: data.batchNumber,//批次号
                  materialName: this.model.materialName,//产品型号（物料名称）
                  warehouseCode: data.warehouseCode,//库存地点（线边仓编号）
                  orderCode: workOrderOption.label,//工单号（生产订单号）
                  workOrderCode: data.workOrderCode,//任务号（排产工单号）
                  quantity: data.quantity,//报工数量
                  palletNumber: data.palletNumber//托号
                }
                //成品托标签打印
                this.$nextTick(() => {
                  this.printLabel()
                })
              }
              this.submitCallback()
            } else {
              this.$message.warning(res.message)