|
@@ -0,0 +1,220 @@
|
|
|
|
|
+<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: 18px; font-weight: 800;">{{ groupName }}送货单</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.createTime || '' }}</div>
|
|
|
|
|
+ <div style="flex: 1; text-align: left;">单据编号:{{ infoData.allotCode || '' }}</div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div style="display: flex; margin-bottom: 8px;">
|
|
|
|
|
+ <div style="flex: 1; text-align: left;">调出仓库:{{ infoData.sourceWarehouse || '' }}</div>
|
|
|
|
|
+ <div style="flex: 1; text-align: left;">调入仓库:{{ infoData.targetWarehouse || '' }}</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: 5%;">序号</th>
|
|
|
|
|
+ <th style="border: 1px solid #000; padding: 8px; text-align: center; width: 15%;">存货编码</th>
|
|
|
|
|
+ <!-- <th style="border: 1px solid #000; padding: 8px; text-align: center; width: 15%;">存货名称</th> -->
|
|
|
|
|
+ <!-- <th style="border: 1px solid #000; padding: 8px; text-align: center; width: 15%;">规格型号</th> -->
|
|
|
|
|
+ <th style="border: 1px solid #000; padding: 8px; text-align: center; width: 8%;">颜色</th>
|
|
|
|
|
+ <th style="border: 1px solid #000; padding: 8px; text-align: center; width: 15%;">型号</th>
|
|
|
|
|
+ <th style="border: 1px solid #000; padding: 8px; text-align: center; width: 8%;">计量单位</th>
|
|
|
|
|
+ <th style="border: 1px solid #000; padding: 8px; text-align: center; width: 8%;">数量</th>
|
|
|
|
|
+ <th style="border: 1px solid #000; padding: 8px; text-align: center; width: 8%;">批号</th>
|
|
|
|
|
+ <th style="border: 1px solid #000; padding: 8px; text-align: center; width: 8%;">裁线米段</th>
|
|
|
|
|
+ <th style="border: 1px solid #000; padding: 8px; text-align: center; width: 10%;">备注</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.categoryCode || '' }}</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.categoryModel || '' }}</td> -->
|
|
|
|
|
+ <td style="border: 1px solid #000; padding: 8px; text-align: center;">{{ item.colorKey || '' }}</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.measureUnit || '' }}</td>
|
|
|
|
|
+ <td style="border: 1px solid #000; padding: 8px; text-align: center;">{{ item.quantity || '' }}</td>
|
|
|
|
|
+ <td style="border: 1px solid #000; padding: 8px; text-align: center;">{{ item.batchNo || '' }}</td>
|
|
|
|
|
+ <td style="border: 1px solid #000; padding: 8px; text-align: center;">{{ item.cuttingLength || '' }}</td>
|
|
|
|
|
+ <td style="border: 1px solid #000; padding: 8px; text-align: center;">
|
|
|
|
|
+ <span v-if="isPrint">{{ item.remark }}</span>
|
|
|
|
|
+ <el-input
|
|
|
|
|
+ v-else
|
|
|
|
|
+ type="textarea"
|
|
|
|
|
+ style="width: 100%; border: none;"
|
|
|
|
|
+ placeholder=""
|
|
|
|
|
+ v-model="item.remark"
|
|
|
|
|
+ class="input-with-select"
|
|
|
|
|
+ autosize
|
|
|
|
|
+ ></el-input>
|
|
|
|
|
+ </td>
|
|
|
|
|
+ </tr>
|
|
|
|
|
+ <tr style="height: 40px;">
|
|
|
|
|
+ <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> -->
|
|
|
|
|
+ <!-- <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>
|
|
|
|
|
+ <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.quantity || 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; width: 100%;">
|
|
|
|
|
+ <div style="flex: 1;">制单人:{{ infoData.allotName || '' }}</div>
|
|
|
|
|
+ <div style="flex: 1;">经手人:</div>
|
|
|
|
|
+ <div style="flex: 1;">签收人:</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 {
|
|
|
|
|
+ props: {
|
|
|
|
|
+ groupName: {
|
|
|
|
|
+ type: String,
|
|
|
|
|
+ default: ''
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+ data () {
|
|
|
|
|
+ return {
|
|
|
|
|
+ visible: false,
|
|
|
|
|
+ isPrint: 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 () {
|
|
|
|
|
+ this.isPrint = true;
|
|
|
|
|
+ this.$nextTick(() => {
|
|
|
|
|
+ this.print();
|
|
|
|
|
+ });
|
|
|
|
|
+ },
|
|
|
|
|
+ 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.onbeforeunload = function() {
|
|
|
|
|
+ self.isPrint = false;
|
|
|
|
|
+ };
|
|
|
|
|
+
|
|
|
|
|
+ printWindow.onunload = function() {
|
|
|
|
|
+ self.isPrint = false;
|
|
|
|
|
+ };
|
|
|
|
|
+
|
|
|
|
|
+ printWindow.onafterprint = function() {
|
|
|
|
|
+ self.isPrint = false;
|
|
|
|
|
+ };
|
|
|
|
|
+
|
|
|
|
|
+ printWindow.onload = function () {
|
|
|
|
|
+ printWindow.print();
|
|
|
|
|
+ };
|
|
|
|
|
+ },
|
|
|
|
|
+ cancel () {
|
|
|
|
|
+ this.visible = false
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+</script>
|
|
|
|
|
+
|
|
|
|
|
+<style lang="scss" scoped>
|
|
|
|
|
+
|
|
|
|
|
+</style>
|