11

src/components/byForm/index.vue

@@ -432,7 +432,7 @@ formDataInit();
 loadInit();
 </script>
 
-<style>
+<style scope>
 .form-title {
   font-size: 14px;
   font-weight: bold;

src/views/MES/productionOrder/index.vue

@@ -26,7 +26,7 @@
         <template #list="{ item }">
           <div style="width:100%">
             <span v-for="(product ,index) in item.produceOrderDetailList" style="margin-right:15px">
-              <el-popover placement="top-start" :width="300" trigger="hover">
+              <el-popover placement="top-start" :width="400" trigger="hover">
                 <div>
                   <div>产品编码：{{product.productCode}}</div>
                   <div>产品名称：{{product.productName}}</div>
@@ -510,7 +510,7 @@ const productionRules = ref({
 const clickDistributeProduction = (row) => {
   formData.data = {
     id: row.id,
-    produceTime: "",
+    produceTime: moment().format("yyyy-MM-DD HH:mm:ss"),
   };
   productionDialog.value = true;
 };
@@ -522,6 +522,7 @@ const submitProduction = () => {
       formLoading.value = false;
       productionDialog.value = false;
       getList();
+      getRightData();
     });
   });
 };

src/views/MES/productionTask/index.vue

@@ -2,9 +2,17 @@
   <div class="pageIndexClass">
     <div>
       <byTable :source="sourceList.data" :pagination="sourceList.pagination" :config="config" :loading="loading" highlight-current-row
-               :selectConfig="selectConfig" :action-list="[
+               :selectConfig="selectConfig" :action-list="[ {
+                text: '打印二维码',
+                action: () => openModal('add'),
+                disabled: printList.length==0,
+              } 
               
-        ]" @get-list="getList">
+        ]" :table-events="{
+          //element talbe事件都能传
+          select: selectRow,
+       'select-all':selectRow
+        }" @get-list="getList">
 
         <template #pic="{ item }">
           <div v-if="item.fileList &&item.fileList.length > 0">
@@ -38,22 +46,156 @@
 
       </byTable>
     </div>
-    <el-dialog :title="'打印二维码'" v-model="dialogVisible" width="350px" destroy-on-close>
-      <div>
+    <el-dialog :title="'打印二维码'" v-model="dialogVisible" width="640px" destroy-on-close :before-close="beforeClose">
+      <div style="height:calc(100vh - 150px);overflow:auto;padding: 0 10px">
         <div id="pdfDom" style="width:100%">
           <!-- <div style="font-size:20px;text-align:center">
             {{printData.name}}
           </div> -->
-          <div style="border-top: 1px solid #000;border-bottom: 1px solid #000; padding: 10px 0; margin:10px auto;text-align:center">
+          <div v-for="item in printList" :key="item.id" style="margin-bottom:20px">
+            <div style="font-size:32px;font-weight:700;color:#000;text-align:center">
+              生产任务单
+            </div>
+            <div style="float:right;margin: 20px 0px 5px 0;">
+              {{printTime}}
+            </div>
+            <table class="table" border>
+              <tr>
+                <td style="width:25%">
+                  <div :ref="item.id">
+                  </div>
+                </td>
+                <td style="width:75%">
+                  <div style="display:flex;margin-bottom:10px">
+                    <div style="width:50%">
+                      <div class="top-title">
+                        订单号
+                      </div>
+                      <div>
+                        {{item.orderCode}}
+                      </div>
+                    </div>
+                    <div style="width:50%">
+                      <div class="top-title">
+                        交期
+                      </div>
+                      <div v-if="item.deliveryPeriod">
+                        {{item.deliveryPeriod.substr(0,10)}}
+                      </div>
+                    </div>
+                  </div>
+                  <div style="display:flex;margin-bottom:10px">
+                    <div style="width:50%">
+                      <div class="top-title">
+                        产品编码
+                      </div>
+                      <div>
+                        {{item.productCode}}
+                      </div>
+                    </div>
+                    <div style="width:50%">
+                      <div class="top-title">
+                        生产数量
+                      </div>
+                      <div>
+                        {{item.quantity}}
+                      </div>
+                    </div>
+                  </div>
+                  <div style="margin-bottom:10px">
+                    <div class="top-title">
+                      产品名称
+                    </div>
+                    <div>
+                      {{item.productName}}
+                    </div>
+                  </div>
+                  <div style="margin-bottom:10px">
+                    <div class="top-title">
+                      产品尺寸(cm)
+                    </div>
+                    <div>
+                      {{item.productLength}} * {{item.productWidth}} * {{item.productHeight}}
+                    </div>
+                  </div>
+                  <div>
+                    <div class="top-title">
+                      产品备注
+                    </div>
+                    <div>
+                      {{item.productRemark}}
+                    </div>
+                  </div>
+                </td>
+              </tr>
+              <tr>
+                <td style="text-align:center" rowspan="3">
+                  <div>
+                    <div style="font-weight:700">产品图</div>
+                    <img v-if="item.fileList &&item.fileList.length > 0" class="bigImg" :src="item.fileList[0].fileUrl" alt="">
+                  </div>
+                  <div>
+                    <div style="font-weight:700">设计图</div>
+                    <img v-if="item.fileListOne &&item.fileListOne.length > 0" class="bigImg" :src="item.fileListOne[0].fileUrl" alt="">
+                  </div>
+                </td>
+                <td>
+                  <div class="top-title">
+                    生产工序
+                  </div>
+                  <div>
+                    <span v-for="proess in item.productionTaskProgressList" :key="proess.processesId"
+                          style="margin-right:10px">{{proess.progressName}}</span>
+                  </div>
+                </td>
+              </tr>
+              <tr>
+                <td>
+                  <div style="margin-bottom:10px">
+                    <div class="top-title">
+                      原材料编码
+                    </div>
+                    <div>
+                      {{item.rawMaterialCode}}
+                    </div>
+                  </div>
+                  <div>
+                    <div class="top-title">
+                      原材料名称
+                    </div>
+                    <div>
+                      {{item.rawMaterialName}}
+                    </div>
+                  </div>
+                </td>
+              </tr>
+              <tr>
+                <td>
+                  <div class="top-title">BOM</div>
+                  <div>
+                    <table border class="table son">
+                      <tr>
+                        <td style="width:60%">名称</td>
+                        <td style="width:20%">单量</td>
+                        <td style="width:20%">总量</td>
+
+                      </tr>
+                    </table>
+                  </div>
+                </td>
+              </tr>
+
+            </table>
+            <div style="page-break-after: always"></div>
+          </div>
+          <!-- <div style="border-top: 1px solid #000;border-bottom: 1px solid #000; padding: 10px 0; margin:10px auto;text-align:center">
             <div :ref="printData.id" style="width:200px;margin-left:55px">
             </div>
             <div style="font-size:20px;text-align:center;font-weight:700;margin-top:10px">
               {{printData.createTime}}
             </div>
-            <!-- 换页 -->
-            <!-- <div style="page-break-after: always"></div> -->
-          </div>
-          <div style="margin-left:10px;display:flex;flex-direction:column;justify-content:space-around">
+          </div> -->
+          <!-- <div style="margin-left:10px;display:flex;flex-direction:column;justify-content:space-around">
             <div style="font-size:14px;margin-top:8px"> 产品编码：{{printData.productCode}}</div>
             <div style="font-size:14px;margin-top:8px">
               产品名称：{{printData.productName}}
@@ -64,7 +206,7 @@
             <div style="font-size:14px;margin-top:8px">
               原材料名称：{{printData.rawMaterialName}}
             </div>
-          </div>
+          </div> -->
         </div>
       </div>
       <template #footer>
@@ -79,6 +221,7 @@
 import byTable from "@/components/byTable/index";
 import byForm from "@/components/byForm/index";
 import QRCode from "qrcodejs2-fix";
+import moment from "moment";
 
 const { proxy } = getCurrentInstance();
 const loading = ref(false);
@@ -139,6 +282,13 @@ const selectConfig = computed(() => [
 ]);
 const config = ref([
   {
+    type: "selection",
+    attrs: {
+      checkAtt: "isCheck",
+      width: 60,
+    },
+  },
+  {
     attrs: {
       label: "订单号",
       prop: "orderCode",
@@ -147,15 +297,15 @@ const config = ref([
   },
   {
     attrs: {
-      label: "设计图",
-      slot: "picOne",
+      label: "产品图片",
+      slot: "pic",
       width: 80,
     },
   },
   {
     attrs: {
-      label: "产品图片",
-      slot: "pic",
+      label: "设计图",
+      slot: "picOne",
       width: 80,
     },
   },
@@ -170,7 +320,7 @@ const config = ref([
     attrs: {
       label: "产品名称",
       prop: "productName",
-      "min-width": 130,
+      "min-width": 200,
     },
   },
   {
@@ -275,7 +425,7 @@ const getList = async (req) => {
   proxy
     .post("/produceOrderDetail/page", sourceList.value.pagination)
     .then((res) => {
-      sourceList.value.data = res.rows;
+      sourceList.value.data = res.rows.map((x) => ({ ...x, isCheck: true }));
       sourceList.value.pagination.total = res.total;
       setTimeout(() => {
         loading.value = false;
@@ -299,17 +449,28 @@ const getList = async (req) => {
     });
 };
 
+const printList = ref([]);
+const selectRow = (data) => {
+  printList.value = data;
+};
+const printTime = ref("");
 const openModal = () => {
+  printTime.value = moment().format("yyyy-MM-DD HH:mm:ss");
   dialogVisible.value = true;
-  modalType.value = "add";
-  formData.data = {
-    definition: "2",
-    fileList: [],
-  };
-  if (currencyData.value && currencyData.value.length > 0) {
-    formData.data.currency = currencyData.value[0].dictKey;
-    formData.data.costCurrency = currencyData.value[0].dictKey;
-  }
+  nextTick(() => {
+    for (let i = 0; i < printList.value.length; i++) {
+      const row = printList.value[i];
+      proxy.$refs[row.id][0].innerHTML = ""; //清除二维码方法一
+      new QRCode(proxy.$refs[row.id][0], {
+        text: row.id,
+        width: 200,
+        height: 200,
+        colorDark: "#000000",
+        colorLight: "#ffffff",
+        correctLevel: QRCode.CorrectLevel.H,
+      });
+    }
+  });
 };
 
 const submitForm = () => {
@@ -383,21 +544,18 @@ const getProcesses = () => {
 };
 getProcesses();
 getList();
-const printData = ref({});
+const printType = ref(false);
+
 const printQrCode = (row) => {
-  printData.value = row;
-  dialogVisible.value = true;
-  nextTick(() => {
-    proxy.$refs[row.id].innerHTML = ""; //清除二维码方法一
-    new QRCode(proxy.$refs[row.id], {
-      text: row.id,
-      width: 200,
-      height: 200,
-      colorDark: "#000000",
-      colorLight: "#ffffff",
-      correctLevel: QRCode.CorrectLevel.H,
-    });
-  });
+  printType.value = true;
+  printList.value = [row];
+  openModal();
+};
+const beforeClose = () => {
+  if (printType.value) {
+    printList.value = [];
+  }
+  dialogVisible.value = false;
 };
 const printObj = ref({
   id: "pdfDom",
@@ -448,4 +606,32 @@ const showCotent = (slot, item) => {
   cursor: pointer;
   vertical-align: middle;
 }
+.table {
+  border-collapse: collapse;
+  border-spacing: 0;
+  width: 100%;
+  td {
+    text-align: left;
+    padding: 10px;
+    // padding: 5px 10px;
+    .top-title {
+      font-weight: 700;
+      margin-bottom: 5px;
+    }
+    .bigImg {
+      object-fit: contain;
+      width: 140px;
+      height: 300px;
+      cursor: pointer;
+      margin-top: 10px;
+      vertical-align: middle;
+    }
+  }
+}
+.son {
+  td {
+    text-align: left;
+    padding: 5px !important;
+  }
+}
 </style>