refactor(ui): 优化表格显示和对话框布局

- 修改发货单打印对话框宽度为固定值
- 订单列表显示供应商名称替代ID
- 收货单和退货单显示订单编号替代ID
- 调整发货单明细查询逻辑
- 退货单新增订单选择功能
- 发货单组件添加负责人信息输入
- 调整发货单打印样式和布局

klp-ui/src/views/erp/order/index.vue

@@ -52,7 +52,7 @@
       </div>
       <el-table :data="orderList" border stripe highlight-current-row size="small" v-loading="orderLoading">
         <el-table-column prop="orderCode" label="订单编号" width="150" fixed="left" />
-        <el-table-column prop="supplierId" label="供应商ID" />
+        <el-table-column prop="supplierName" label="供应商" />
         <el-table-column prop="orderDate" label="下单日期" />
         <el-table-column prop="expectedArrival" label="期望到货" />
         <el-table-column prop="orderType" label="类型" />

klp-ui/src/views/erp/receipt/index.vue

@@ -20,9 +20,8 @@
         </div>
       </div>
       <el-table :data="list" border size="small" v-loading="loading">
-        <el-table-column prop="receiptId" label="ID" width="80" />
-        <el-table-column prop="orderId" label="订单ID" />
-        <el-table-column prop="itemId" label="明细ID" />
+        <el-table-column prop="orderCode" label="订单编号" />
+        <el-table-column prop="itemId" label="明细编号" />
         <el-table-column prop="receivedQty" label="收货数量" />
         <el-table-column prop="qualityResult" label="质检结果">
           <template slot-scope="scope">

klp-ui/src/views/erp/return/index.vue

@@ -55,7 +55,7 @@
         <el-button type="primary" size="small" @click="openReturnItemDialog()">新增明细</el-button>
       </header>
       <div class="inline-filter">
-        <el-input v-model="returnItemQuery.returnId" placeholder="退货单ID" size="small" clearable />
+        <!-- <el-input v-model="returnItemQuery.returnId" placeholder="退货单ID" size="small" clearable /> -->
         <OrderSelect v-model="returnItemQuery.orderId" />
         <OrderDetailSelect v-model="returnItemQuery.itemId" :orderId="returnItemQuery.orderId" />
         <div class="filter-actions">
@@ -64,9 +64,8 @@
         </div>
       </div>
       <el-table :data="returnItemList" border size="small" v-loading="returnItemLoading">
-        <el-table-column prop="returnItemId" label="ID" width="80" />
-        <el-table-column prop="returnId" label="退货单ID" />
-        <el-table-column prop="itemId" label="订单明细ID" />
+        <!-- <el-table-column prop="returnId" label="退货单ID" /> -->
+        <el-table-column prop="itemId" label="订单明细编号" />
         <el-table-column prop="returnQty" label="数量" />
         <el-table-column label="问题照片">
           <template slot-scope="scope">
@@ -120,15 +119,20 @@
 
     <el-dialog :title="returnItemDialog.title" :visible.sync="returnItemDialog.visible" width="500px">
       <el-form :model="returnItemDialog.form" :rules="returnItemRules" ref="returnItemForm" label-width="120px" size="small">
-        <el-form-item label="退货单ID" prop="returnId">
+        <!-- <el-form-item label="退货单ID" prop="returnId">
           <el-input v-model="returnItemDialog.form.returnId" />
+        </el-form-item> -->
+        <!-- 先选择订单id,再选择订单明细id, -->
+        <el-form-item label="选择订单" prop="orderId">
+          <!-- <el-input v-model="returnItemDialog.form.orderId" /> -->
+          <OrderSelect v-model="returnItemDialog.form.orderId" />
         </el-form-item>
-        <el-form-item label="订单明细ID" prop="itemId">
+        <el-form-item label="订单明细编号" prop="itemId">
           <!-- <el-input v-model="returnItemDialog.form.itemId" /> -->
           <OrderDetailSelect v-model="returnItemDialog.form.itemId" :orderId="returnItemDialog.form.orderId" />
         </el-form-item>
         <el-form-item label="退货数量" prop="returnQty">
-          <el-input-number v-model="returnItemDialog.form.returnQty" :min="0" :precision="3" />
+          <el-input-number size="mini" v-model="returnItemDialog.form.returnQty" :min="0" :precision="3" />
         </el-form-item>
         <el-form-item label="问题照片">
           <el-input v-model="returnItemDialog.form.photos" placeholder="多张以逗号分隔" />

klp-ui/src/views/wms/delivery/components/detailTable.vue

@@ -116,9 +116,9 @@ export default {
   watch: {
     waybillId: {
       handler(newVal, oldVal) {
-        if (newVal) {
+        // if (newVal) {
           this.getList();
-        }
+        // }
       },
       immediate: true
     }
@@ -176,7 +176,7 @@ export default {
     /** 查询发货单明细列表 */
     getList() {
       this.loading = true;
-      listDeliveryWaybillDetail(this.queryParams).then(response => {
+      listDeliveryWaybillDetail({ ...this.queryParams, waybillId: this.waybillId }).then(response => {
         this.deliveryWaybillDetailList = response.rows;
         this.total = response.total;
         this.loading = false;

klp-ui/src/views/wms/delivery/components/wayBill.vue

@@ -22,6 +22,21 @@
         </div>
       </div>
 
+       <div class="waybill-header">
+        <div class="header-left">
+          <span class="label">负责人：</span>
+          <input type="text" class="editable-input transparent-input" v-model="localWaybill.principal" />
+        </div>
+        <div class="header-right">
+          <span class="label">电话：</span>
+          <input type="text" class="editable-input transparent-input" v-model="localWaybill.principalPhone" />
+        </div>
+        <div class="header-center">
+          <span class="label">车牌：</span>
+          <input type="text" class="editable-input transparent-input" v-model="localWaybill.licensePlate" />
+        </div>
+      </div>
+
       <!-- 表格 -->
       <table class="waybill-table">
         <thead>
@@ -134,7 +149,10 @@ export default {
         senderUnit: '',
         deliveryYear: '',
         deliveryMonth: '',
-        deliveryDay: ''
+        deliveryDay: '',
+        principal: '',
+        principalPhone: '',
+        licensePlate: ''
       },
       // 本地可编辑的发货单明细
       localWaybillDetails: []
@@ -150,7 +168,10 @@ export default {
             senderUnit: newVal.senderUnit || '',
             deliveryYear: this.getYearFromDate(newVal.deliveryTime) || '',
             deliveryMonth: this.getMonthFromDate(newVal.deliveryTime) || '',
-            deliveryDay: this.getDayFromDate(newVal.deliveryTime) || ''
+            deliveryDay: this.getDayFromDate(newVal.deliveryTime) || '',
+            principal: newVal.principal || '',
+            principalPhone: newVal.principalPhone || '',
+            licensePlate: newVal.licensePlate || ''
           };
         }
       },
@@ -294,9 +315,9 @@ export default {
 
 <style scoped>
 .waybill-container {
-  width: auto;
+  width: 850px;
   max-width: none;
-  min-width: 1200px;
+  min-width: 850px;
   margin: 0 auto;
   padding: 20px;
   background: white;
@@ -329,7 +350,6 @@ export default {
 
 .label {
   font-weight: bold;
-  margin-right: 10px;
   display: inline-block;
   width: 80px;
   text-align: right;
@@ -337,10 +357,9 @@ export default {
 }
 
 .date-label {
-  width: 16px;
+  width: 1em;
 }
 
-
 /* 可编辑输入框样式 */
 .editable-input {
   padding: 4px 8px;
@@ -358,7 +377,7 @@ export default {
 }
 
 .date-input {
-  width: 60px;
+  width: 30px;
   text-align: center;
   margin-right: 5px;
 }
@@ -424,12 +443,12 @@ export default {
 
 .waybill-table th:nth-child(6),
 .waybill-table td:nth-child(6) {
-  width: 80px; /* 卷号 */
+  width: 100px; /* 卷号 */
 }
 
 .waybill-table th:nth-child(7),
 .waybill-table td:nth-child(7) {
-  width: 60px; /* 规格 */
+  width: 80px; /* 规格 */
 }
 
 .waybill-table th:nth-child(8),

klp-ui/src/views/wms/delivery/waybill/index.vue

@@ -131,7 +131,7 @@
     </el-dialog>
 
     <!-- 打印发货单对话框 -->
-    <el-dialog title="打印发货单" :visible.sync="printDialogVisible" width="90%" append-to-body center>
+    <el-dialog title="打印发货单" :visible.sync="printDialogVisible" width="900px" append-to-body center>
       <WayBill :waybill="currentWaybill" :waybillDetails="currentWaybillDetails" />
     </el-dialog>
   </div>