1

package.json

@@ -40,6 +40,7 @@
     "jquery": "^3.7.0",
     "js-cookie": "3.0.1",
     "js-table2excel": "^1.1.2",
+    "jsbarcode": "^3.11.5",
     "jsencrypt": "3.3.1",
     "jspdf": "^2.5.1",
     "lossless-json": "^2.0.8",

src/components/CycleBarcode/index.vue

@@ -0,0 +1,28 @@
+<template>
+  <div>
+    <img :id="'barcode' + index" style="max-width: 100%" />
+  </div>
+</template>
+
+<script setup>
+import JsBarcode from "jsbarcode";
+const props = defineProps({
+  value: {
+    type: String,
+    default: "",
+  },
+  index: {
+    type: Number,
+  },
+});
+onMounted(() => {
+  JsBarcode("#barcode" + props.index, String(props.value), {
+    format: "CODE128",
+    lineColor: "#000",
+    background: "white",
+    width: 1.6,
+    height: 50,
+    displayValue: true,
+  });
+});
+</script>

src/views/production/schedule/production-work-order/index.vue

@@ -29,17 +29,13 @@
         <div>{{ item.province }}, {{ item.city }}, {{ item.county }}, {{ item.detailedAddress }}</div>
       </template>
     </byTable>
-    <!-- style="display: none" -->
-    <div>
+    <div style="display: none">
       <div style="width: 250px" id="printMe">
         <div v-for="(item, index) in QRcodeList" :key="index">
           <div style="height: 442px; padding-top: 2px; overflow: hidden; position: relative">
-            <!-- <div style="border-bottom: 1px solid #000; display: flex; align-items: center; justify-content: center" v-if="item.orderWlnCode">
-              <barcode :value="item.orderWlnCode" :height="50" :width="1.6" />
+            <div style="border-bottom: 1px solid #000; display: flex; align-items: center; justify-content: center">
+              <CycleBarcode :value="item.orderCode" :index="index" style="max-width: 100%"></CycleBarcode>
             </div>
-            <div style="border-bottom: 1px solid #000; display: flex; align-items: center; justify-content: center" v-else>
-              <barcode :value="item.orderCode" :height="50" :width="1.6" />
-            </div> -->
             <div style="display: flex; align-items: center; justify-content: center">
               <div style="width: 150px; height: 150px; margin-top: 8px" :id="'print' + index" :ref="'print' + index">
                 <img src="" alt="" style="vertical-align: middle; height: 100%; width: 100%" />
@@ -69,6 +65,7 @@ import byTable from "/src/components/byTable/index";
 import { getNearDays } from "/src/utils/util";
 import QRCode from "qrcodejs2-fix";
 import { ElMessage } from "element-plus";
+import CycleBarcode from "/src/components/CycleBarcode";
 
 const { proxy } = getCurrentInstance();
 const sourceList = ref({
@@ -86,7 +83,7 @@ const sourceList = ref({
     productionWorkOrderCode: "",
     beginTime: "",
     endTime: "",
-    type: 15,
+    type: 3,
   },
 });
 const loading = ref(false);
@@ -279,9 +276,9 @@ const getList = async (req, status) => {
     sourceList.value.pagination = {
       pageNum: sourceList.value.pagination.pageNum,
       pageSize: sourceList.value.pagination.pageSize,
-      type: 15,
-      beginTime: getNearDays(15).beginTime,
-      endTime: getNearDays(15).endTime,
+      type: 3,
+      beginTime: getNearDays(3).beginTime,
+      endTime: getNearDays(3).endTime,
     };
   } else {
     sourceList.value.pagination = { ...sourceList.value.pagination, ...req };
@@ -304,7 +301,7 @@ const getList = async (req, status) => {
     }, 200);
   });
 };
-getList({ beginTime: getNearDays(15).beginTime, endTime: getNearDays(15).endTime });
+getList({ beginTime: getNearDays(3).beginTime, endTime: getNearDays(3).endTime });
 const clickReset = () => {
   getList("", true);
 };
@@ -348,8 +345,10 @@ const clickPrint = (list) => {
         correctLevel: QRCode.CorrectLevel.H,
       });
     }
-    const btn = document.getElementById("printBtnMini");
-    btn.click();
+    nextTick(() => {
+      const btn = document.getElementById("printBtnMini");
+      btn.click();
+    });
   });
 };
 const clickSelectPrint = () => {