feat(库存管理): 添加生产要求字段和打印送货单功能

src/views/warehouseManagement/inventoryAllocation/components/DeliveryNoteDialog.vue

@@ -0,0 +1,179 @@
+<template>
+  <el-dialog
+    title="送货单详情"
+    :visible.sync="visible"
+    center
+    append-to-body
+    width="70%"
+    :close-on-click-modal="false"
+
+>
+
+    <div id="printSection">
+      <div style="text-align: center; padding-bottom: 20px;">
+        <h3 style="margin: 0; font-size: 20px; font-weight: 800;">送货单</h3>
+      </div>
+
+      <div style="margin-bottom: 15px; width: 100%;">
+        <div style="display: flex; margin-bottom: 8px; width: 100%;">
+          <div style="flex: 1; text-align: left;">客户名称：{{ infoData.customerName || '' }}</div>
+          <div style="flex: 1; text-align: left;">发货单号：{{ infoData.deliveryNumber || '' }}</div>
+        </div>
+        <div style="display: flex; margin-bottom: 8px;">
+          <div style="flex: 1; text-align: left;">发货日期：{{ infoData.deliveryDate || '' }}</div>
+          <div style="flex: 1; text-align: left;">联系人：{{ infoData.contactPerson || '' }}</div>
+        </div>
+        <div style="display: flex;">
+          <div style="flex: 1; text-align: left;">联系电话：{{ infoData.contactPhone || '' }}</div>
+        </div>
+      </div>
+
+      <table style="width: 100%; border-collapse: collapse; margin-bottom: 20px;">
+        <thead>
+          <tr>
+            <th style="border: 1px solid #000; padding: 8px; text-align: center;" width="50px;">序号</th>
+            <th style="border: 1px solid #000; padding: 8px; text-align: center;">型号</th>
+            <th style="border: 1px solid #000; padding: 8px; text-align: center; width: 160px;">零件名</th>
+            <th style="border: 1px solid #000; padding: 8px; text-align: center;">单位</th>
+            <th style="border: 1px solid #000; padding: 8px; text-align: center;">送货数量</th>
+            <th style="border: 1px solid #000; padding: 8px; text-align: center;">验收数量</th>
+            <th style="border: 1px solid #000; padding: 8px; text-align: center;">备注</th>
+            <th style="border: 1px solid #000; padding: 8px; text-align: center;">订单号</th>
+            <th style="border: 1px solid #000; padding: 8px; text-align: center;">加工工艺</th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr v-for="(item, index) in detailList" :key="index">
+            <td style="border: 1px solid #000; padding: 8px; text-align: center;">{{ index + 1 }}</td>
+            <td style="border: 1px solid #000; padding: 8px; text-align: center;">{{ item.categoryModel || '' }}</td>
+            <td style="border: 1px solid #000; padding: 8px; text-align: center;">{{ item.categoryName || '' }}</td>
+            <td style="border: 1px solid #000; padding: 8px; text-align: center;">{{ item.measureUnit || '' }}</td>
+            <td style="border: 1px solid #000; padding: 8px; text-align: center;">{{ item.measureQuantity || '' }}</td>
+            <td style="border: 1px solid #000; padding: 8px; text-align: center;">{{ item.measureQuantity || '' }}</td>
+            <td style="border: 1px solid #000; padding: 8px; text-align: center;">{{ item.remark || '' }}</td>
+            <td style="border: 1px solid #000; padding: 8px; text-align: center;">{{ item.orderNumber || '' }}</td>
+            <td style="border: 1px solid #000; padding: 8px; text-align: center;">{{ item.processingTechnology || '' }}</td>
+          </tr>
+          <tr style="height: 40px;">
+            <td style="border: 1px solid #000; padding: 8px; text-align: center;"></td>
+            <td colspan="2" style="border: 1px solid #000; padding: 8px; text-align: center;">合计</td>
+            <!-- <td style="border: 1px solid #000; padding: 8px; text-align: center;"></td> -->
+            <td style="border: 1px solid #000; padding: 8px; text-align: center;"></td>
+            <td style="border: 1px solid #000; padding: 8px; text-align: center;">{{ detailList.reduce((total, item) => total + Number(item.measureQuantity || 0), 0) || ''}}</td>
+            <td style="border: 1px solid #000; padding: 8px; text-align: center;">{{ detailList.reduce((total, item) => total + Number(item.measureQuantity || 0), 0) || ''}}</td>
+            <td style="border: 1px solid #000; padding: 8px; text-align: center;"></td>
+            <td style="border: 1px solid #000; padding: 8px; text-align: center;"></td>
+            <td style="border: 1px solid #000; padding: 8px; text-align: center;"></td>
+          </tr>
+        </tbody>
+      </table>
+
+      <div style="display: flex; margin-top: 20px; width: 100%;">
+        <div style="flex: 1;">发货人：{{ infoData.deliverer || '' }}</div>
+        <div style="flex: 1;">送货人：{{ infoData.carrier || '' }}</div>
+        <div style="flex: 1;">收货人：{{ infoData.receiver || '' }}</div>
+      </div>
+    </div>
+
+    <div
+      slot="footer"
+      style="text-align: right"
+    >
+      <el-button type="primary" @click="confirm">打印预览</el-button>
+      <el-button @click="cancel">返回</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import storageApi from '@/api/warehouseManagement/index.js';
+export default {
+  data () {
+    return {
+      visible: false,
+      row: {
+        customerName: '',
+        contactPerson: '',
+        contactPhone: '',
+        items: [{
+          model: '',
+          partName: '',
+          unit: '',
+          deliveryQuantity: '',
+          receivedQuantity: '',
+          remark: '',
+          orderNumber: '',
+          processingTechnology: '',
+        }],
+        deliverer: '',
+        carrier: '',
+        receiver: '',
+      },
+      detailList: [],
+      infoData: {},
+    }
+  },
+  computed: {
+
+  },
+  methods: {
+    async open (row) {
+      console.log('row', row)
+      this.row = row;
+      this.getData();
+      this.visible = true;
+    },
+    async getData() {
+      const res = await storageApi.getAllotDetailList({
+          applyId: this.row.id
+        });
+        const data = await storageApi.getAllotDetail(this.row.id);
+        this.infoData = data;
+        if (this.infoData.type == 1) {
+          // 库内调拨
+          /* this.infoData.auditStatus = 2; */
+          this.infoData.auditStatus = data.status;
+        } else {
+          // 库外调拨
+          this.infoData.auditStatus = data.status;
+        }
+        this.detailList = res.map((item) => {
+          return {
+            ...item,
+            categoryCode: this.infoData.categoryCode,
+            categoryName: this.infoData.categoryName,
+            brandNum: this.infoData.brandNum,
+            categoryModel: this.infoData.model,
+            specification: this.infoData.specification
+          };
+        });
+        console.log('infoData', this.infoData)
+        console.log('detailList', this.detailList)
+    },
+    confirm () {
+     const printSection = document.getElementById('printSection');
+      // 创建打印任务
+      const printWindow = window.open('', '_blank');
+      printWindow.document.open();
+      printWindow.document.write('<html><head><title>打印预览</title>');
+      printWindow.document.write(
+        '<link rel="stylesheet" href="your-stylesheet-url.css" type="text/css" />'
+      );
+      printWindow.document.write('</head><body>');
+      printWindow.document.write(printSection.innerHTML);
+      printWindow.document.write('</body></html>');
+      printWindow.document.close();
+      printWindow.onload = function () {
+        printWindow.print();
+      };
+    },
+    cancel () {
+      this.visible = false
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/warehouseManagement/inventoryAllocation/components/print-template-bs.vue

@@ -0,0 +1,226 @@
+<template>
+  <ele-modal
+    title="出库单"
+    :visible.sync="QRvisible"
+    v-if="QRvisible"
+    width="90%"
+  >
+    <div
+      id="printSection"
+      style="
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        flex-direction: column;
+      "
+    >
+      <div
+        style="
+          position: relative;
+          width: 100%;
+          height: 100px;
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+        "
+      >
+        <!-- <img
+          v-if="groupName.includes('宝盛')"
+          style="width: 80px; height: 80px; position: absolute; left: 20px"
+          src="@/assets/bslogo.png"
+          alt=""
+        /> -->
+        <div
+          style="
+            font-size: 20px;
+            font-weight: 800;
+            text-align: center;
+            width: 100%;
+          "
+          >{{ groupName || '长沙宝盛汽车配件有限公司' }}</div
+        >
+        <div
+          style="
+            font-size: 18px;
+            font-weight: 800;
+            text-align: center;
+            width: 100%;
+          "
+          >送货单</div
+        >
+      </div>
+      <div
+        style="
+          width: 100%;
+          font-size: 12px;
+          display: flex;
+          justify-content: space-between;
+          margin-bottom: 10px;
+        "
+      >
+        <span style="width: 40%">客户名称：{{ formData.contactName }}</span>
+        <span style="width: 40%"
+          >发货单号：{{ formData.printNo || formData.docNo }}</span
+        >
+      </div>
+      <div
+        style="
+          width: 100%;
+          font-size: 12px;
+          display: flex;
+          justify-content: space-between;
+          margin-bottom: 10px;
+        "
+      >
+        <span style="width: 40%">发货日期：{{ formData.createTime }}</span>
+        <span style="width: 40%"
+          >联系人：{{ formData.linkName }}
+
+          联系电话：{{ formData.linkPhone }}
+        </span>
+        <span> 车牌号：{{ formData.carNo }} </span>
+      </div>
+      <table
+        cellspacing="0"
+        border
+        style="
+          width: 100%;
+          table-layout: fixed;
+          word-break: break-all;
+          word-wrap: break-word;
+          font-size: 12px;
+        "
+      >
+        <tbody>
+          <tr align="center">
+            <td style="padding: 5px; width: 35px"> 序号 </td>
+            <td style="padding: 5px"> 编码 </td>
+            <td style="padding: 5px"> 零件名 </td>
+            <td style="padding: 5px; width: 50px"> 单位</td>
+            <td style="padding: 5px"> 送货数量</td>
+            <td style="padding: 5px"> 验收数量</td>
+            <td style="padding: 5px"> 备注</td>
+            <td style="padding: 5px"> 订单号</td>
+            <td style="padding: 5px"> 加工工艺</td>
+          </tr>
+
+          <tr align="center" v-for="(item, index) in formData.productList">
+            <td style="padding: 5px"> {{ index + 1 }} </td>
+            <td style="padding: 5px">
+              {{ item.productCode }}
+            </td>
+            <td style="padding: 5px"> {{ item.productName }} </td>
+            <td style="padding: 5px"> {{ item.measuringUnit }}</td>
+            <td style="padding: 5px"> {{ item.totalCount }}</td>
+            <td style="padding: 5px"> {{ item.totalCount }}</td>
+            <td style="padding: 5px"> </td>
+            <td style="padding: 5px">{{ item.orderNo }} </td>
+            <td style="padding: 5px"> </td>
+          </tr>
+        </tbody>
+      </table>
+      <div
+        style="
+          width: 100%;
+          font-size: 12px;
+          display: flex;
+          justify-content: space-between;
+          margin-top: 10px;
+        "
+      >
+        <div style="flex: 1">
+          <div>发货人：</div>
+        </div>
+        <div style="flex: 1">
+          <div>送货人：</div>
+        </div>
+        <div style="flex: 1"> 收货人: </div>
+        <div style="flex: 1"> 托盘:{{   formData.trayNum }} </div>
+      
+      </div>
+    </div>
+
+    <div slot="footer">
+      <el-button @click="print">打印预览</el-button>
+      <el-button @click="close">关闭</el-button>
+    </div>
+  </ele-modal>
+</template>
+
+<script>
+  // import { getSendSaleOrderrecordDetailSplit } from '@/api/saleManage/saleordersendrecord';
+  import { mapGetters } from 'vuex';
+  export default {
+    name: 'print',
+    computed: {
+      ...mapGetters(['user'])
+    },
+    props: {
+      groupName: ''
+    },
+    data() {
+      return {
+        checked: '',
+        QRvisible: false,
+        isPrintPrice: false,
+        formData: {},
+        outBound: {}
+      };
+    },
+
+    methods: {
+      async open(id) {
+        // this.formData = await getSendSaleOrderrecordDetailSplit(id);
+        // this.QRvisible = true;
+        // let dataArray = await getInfoBySourceBizNoAll(this.formData.docNo);
+        // this.outBound = JSON.parse(JSON.stringify(dataArray[0]));
+        // this.outBound['outInDetailRecordRequestList'] = [];
+
+        // dataArray.forEach((item) => {
+        //   item.outInDetailList.forEach((val) => {
+        //     val['orderNo'] = item.orderNo;
+        //     if (val.outInDetailRecordRequestList.length) {
+        //       val.outInDetailRecordRequestList.forEach((j) => {
+        //         j['categoryName'] = val.categoryName;
+        //         j['categoryModel'] = val.categoryModel;
+        //         j['specification'] = val.specification;
+        //         j['categoryCode'] = val.categoryCode;
+        //         j['orderNo'] = item.orderNo;
+
+        //       });
+        //       this.outBound['outInDetailRecordRequestList'].push(
+        //         ...val.outInDetailRecordRequestList
+        //       );
+        //     } else {
+        //       this.outBound['outInDetailRecordRequestList'].push(val);
+        //     }
+        //   });
+        // });
+        //包装维度
+      },
+      close() {
+        this.QRvisible = false;
+      },
+
+      print() {
+        const printSection = document.getElementById('printSection');
+        // 创建打印任务
+        const printWindow = window.open('', '_blank');
+        printWindow.document.open();
+        printWindow.document.write('<html><head><title>打印预览</title>');
+        printWindow.document.write(
+          '<link rel="stylesheet" href="your-stylesheet-url.css" type="text/css" />'
+        );
+        printWindow.document.write('</head><body>');
+        printWindow.document.write(printSection.innerHTML);
+        printWindow.document.write('</body></html>');
+        printWindow.document.close();
+        printWindow.onload = function () {
+          printWindow.print();
+        };
+      }
+    }
+  };
+</script>
+
+<style lang="scss"></style>

src/views/warehouseManagement/inventoryAllocation/index.vue

@@ -10,11 +10,15 @@
         :pageSize="20"
         :datasource="datasource"
         cache-key="systemRoleTable"
+        :selection.sync="selection"
       >
         <template v-slot:toolbar>
           <el-button icon="el-icon-plus" type="primary" @click="add"
             >新建</el-button
           >
+          <!-- <el-button :disabled="selection.length > 1" icon="el-icon-download" type="primary" @click="printExl"
+            >打印</el-button
+          > -->
         </template>
         <!-- 单号链接 -->
         <template v-slot:allotCode="{ row }">
@@ -61,6 +65,8 @@
         </template>
       </ele-pro-table>
     </el-card>
+    <!-- 打印弹窗 -->
+    <delivery-note-dialog ref="deliveryNoteDialogRef"></delivery-note-dialog>
   </div>
 </template>
 
@@ -68,11 +74,13 @@
   import { allocationType } from '@/utils/dict/warehouse';
   import storageApi from '@/api/warehouseManagement/index.js';
   import InventorySearch from './components/inventory-search.vue';
+  import DeliveryNoteDialog from './components/DeliveryNoteDialog.vue';
   import warehouseDefinition from '@/api/warehouseManagement/warehouseDefinition';
   import { pageRoles } from '@/api/system/role';
   export default {
     components: {
-      InventorySearch
+      InventorySearch,
+      DeliveryNoteDialog
     },
     data() {
       return {
@@ -93,6 +101,13 @@
             showOverflowTooltip: true,
             fixed: 'left'
           },
+          {
+            width: 45,
+            type: 'selection',
+            columnKey: 'selection',
+            align: 'center',
+            fixed: 'left'
+          },
           {
             prop: 'name',
             label: '调拨名称',
@@ -181,11 +196,21 @@
           }
         ],
         // 加载状态
-        loading: false
+        loading: false,
+        // 选中的行
+        selection: []
       };
     },
     computed: {},
     methods: {
+      printExl() {
+        console.log('selection', this.selection)
+        if (this.selection.length == 0) {
+          this.$message.warning('请选择要导出的记录');
+          return;
+        }
+        this.$refs.deliveryNoteDialogRef.open(this.selection[0]);
+      },
       // 删除
       async deleted(row) {
         const data = await storageApi.deleteAllot([row.id]);

src/views/warehouseManagement/stockManagement/details.vue

@@ -92,6 +92,11 @@
                   >
                 </el-form-item>
               </el-col>
+              <el-col :span="24">
+                <el-form-item label="生产要求:">
+                  <span>{{ infoData.productionRequirements }}</span>
+                </el-form-item>
+              </el-col>
               <el-col :span="24">
                 <el-form-item label="备注:">
                   <span>{{ infoData.remark }}</span>