仓库-出库单：出库计划，样式功能调整，打印功能添加

src/api/wmsManagement/wmOutOrder.js

@@ -74,4 +74,26 @@ export function getMaterialList(params) {
 		method: 'get',
 		params
 	})
-}
+}
+/**
+ * 根据出货单号，查询出货单物料信息
+ */
+export function getOutoderMatrials(params) {
+	return request({
+		url: '/mes/wm/WmOutOrder/getoutorder_matrials',
+		method: 'get',
+		params
+	})
+}
+
+/**
+ * 根据出货单号 4 生成出货单的出货计划
+ */
+export function generateOutorderplan(params) {
+	return request({
+		url: '/mes/wm/WmOutOrder/generate_outorderplan',
+		method: 'get',
+		params
+	})
+}
+

src/components/Print/出库单.vue

@@ -1,6 +1,6 @@
 <template>
 	<div>
-		<el-dialog v-bind="$attrs" v-on="$listeners" @open="onOpen" @close="onClose" title="出库单打印" width="860px">
+		<el-dialog v-loading="loading" v-bind="$attrs" v-on="$listeners" @open="onOpen" @close="onClose" title="出库单打印" width="860px">
 			<div class="print" id="printDom" ref="printRef">
 				<div class="print-body-box">
 					<div class="title">出库单 {{ printData.shipmentNum }}</div>
@@ -42,10 +42,10 @@
 							<tbody>
 								<tr v-for="item in printData.materialList">
 									<td>{{ item.partnumber }}</td>
-									<td>{{ item.description }}</td>
+									<td>{{ item.productName }}</td>
 									<td>{{ item.requireOutNum }}</td>
-									<td>20</td>
-									<td>200</td>
+									<td>{{ item.packageNum }}</td>
+									<td>{{ item.itemNum }}</td>
 									<!-- <td>{{ item.stockQuantity }}</td>
       						<td>{{ item.stockQuantity2 }}</td> -->
 								</tr>
@@ -70,15 +70,15 @@
 								</tr>
 							</thead>
 							<tbody>
-								<tr v-if="item.package_code_client !==null" v-for="item in printData.planlList">
-									<td>{{ item.package_code_client }}</td>
-									<td>{{ item.partnumber }}</td>
-									<td>{{ item.location_code }}</td>
-									<td>{{ item.count }}</td>
-									<td>{{ item.goods_num_action_count }}</td>
-									<td>{{ item.outhouse_num }}</td>
-									<td>{{ item.time }}</td>
-									<td>{{ item.sort }}</td>
+								<tr v-if="item.package_code_client !== null" v-for="item in printData.planlList">
+									<td>{{ item.patchcode }}</td>
+									<td>{{ item.materialCode }}</td>
+									<td>{{ item.warehouseCode }}</td>
+									<td>{{ item.packageNum }}</td>
+									<td>{{ item.partnumberNum }}</td>
+									<td>{{ item.requireNum }}</td>
+									<td>{{ item.patchtime }}</td>
+									<td>{{ item.outorder }}</td>
 								</tr>
 								<tr v-else>
 									<td :colspan="8"><div class="line"></div></td>
@@ -96,7 +96,7 @@
 	</div>
 </template>
 <script>
-import { getWmOutOrder } from '@/api/wmsManagement/wmOutOrder.js'
+import * as WmOutOrderApi from '@/api/wmsManagement/wmOutOrder.js'
 import print from 'print-js'
 export default {
 	inheritAttrs: false,
@@ -108,6 +108,7 @@ export default {
 	},
 	data() {
 		return {
+			loading: false,
 			clearData: {},
 			// 待打印的数据
 			printData: {
@@ -143,60 +144,40 @@ export default {
 			this.$emit('update:visible', false)
 		},
 		getPrintData() {
+			this.loading = true
+			setTimeout(() => {
+				this.loading = false
+			}, 30000)
 			// 出库单主键
 			const getKey = this.printKey
 			if (getKey === null) {
 				this.$message('打印参数异常！', getKey)
 				return
 			}
-			getWmOutOrder(getKey).then((res) => {
+			WmOutOrderApi.getWmOutOrder(getKey).then((res) => {
 				const { code, data } = res
 				if (code == 200) {
+					// 基本数据
 					this.printData = data
-					this.printData.planlList = [
-						{
-							package_code_client: 'BNW240318005',
-							partnumber: '26255122',
-							location_code: 'A1-01',
-							count: 15,
-							goods_num_action_count: 100,
-							outhouse_num: 100,
-							time: '240317',
-							sort: 1,
-						},
-						{
-							package_code_client: null,
-							partnumber: null,
-							location_code: null,
-							count: null,
-							goods_num_action_count: null,
-							outhouse_num: null,
-							time: null,
-							sort: null,
-						},
-						{
-							package_code_client: 'BNW240318006',
-							partnumber: '26372445',
-							location_code: 'A1-01',
-							count: 5,
-							goods_num_action_count: 50,
-							outhouse_num: 100,
-							time: '240318',
-							sort: 2,
-						},
-						{
-							package_code_client: 'BNW240318007',
-							partnumber: '26372445',
-							location_code: 'A1-01',
-							count: 5,
-							goods_num_action_count: 50,
-							outhouse_num: 100,
-							time: '240318',
-							sort: 3,
-						},
-					]
+					// 需求物料清单数据
+					WmOutOrderApi.getOutoderMatrials({ shipment_num: getKey }).then((res) => {
+						if (res.code === 200) {
+							this.printData.materialList = res.data
+						}
+					})
+					WmOutOrderApi.generateOutorderplan({ shipment_num: getKey }).then((res) => {
+						if (res.code === 200) {
+							this.printData.planlList = res.data
+							console.log('generateOutorderplan', res.data)
+							// 计划出库批次清单
+							this.loading = false
+						} else {
+							this.$message.error('打印参数异常！' + res.msg + getKey)
+							this.loading = false
+						}
+					})
 				} else {
-					this.$message('打印参数异常！', getKey)
+					this.$message.error('打印参数异常！' + getKey)
 				}
 			})
 		},

src/views/wmsManagement/WmOutOrder.vue

@@ -302,22 +302,26 @@
 			</div>
 		</el-dialog>
 		<PrintView ref="printViewRef" :visible.sync="showPrintDialog" :printKey="printKey"></PrintView>
+		<TheOutboundPlan :visible.sync="TheOutboundPlanDialogVisible" :planKey="planKey"></TheOutboundPlan>
 		<TheChouseMaterial :visible.sync="TheChouseMaterialDialogVisible" @materialChoused="handlerMaterialChoused"></TheChouseMaterial>
 	</div>
 </template>
 <script>
 import { listWmOutOrder, addWmOutOrder, delWmOutOrder, updateWmOutOrder, getWmOutOrder, getCustomList } from '@/api/wmsManagement/wmOutOrder.js'
 import TheChouseMaterial from './components/TheChouseMaterial/TheChouseMaterial.vue'
+import TheOutboundPlan from './components/TheOutboundPlan'
 import PrintView from '@/components/Print/出库单.vue'
 export default {
 	name: 'wmoutorder',
 	components: {
 		TheChouseMaterial,
+		TheOutboundPlan,
 		PrintView,
 	},
 	data() {
 		return {
 			TheChouseMaterialDialogVisible: false,
+			TheOutboundPlanDialogVisible:false,
 			showPrintDialog:false,
 			printKey:'',
 			labelWidth: '100px',
@@ -526,7 +530,6 @@ export default {
 					this.open = true
 					this.title = '编辑出库单数据'
 					this.opertype = 2
-					console.log('getWmOutOrder', res, data)
 					this.form = {
 						...data,
 					}
@@ -595,13 +598,11 @@ export default {
 		handlePrint(row) {
 			this.printKey = row.shipmentNum
 			this.showPrintDialog = true;
-			// this.$refs.printViewRef.handlePrint(row)
-			console.log(row)
-			// this.$message('打印出库单功能待完善!')
 		},
 		// 配置出库计划
-		handlePlan(){
-			this.$message('此功能待完善')
+		handlePlan(row){
+			this.planKey = row.shipmentNum
+			this.TheOutboundPlanDialogVisible = true;
 		},
 		// ====================================================
 		/** 提交按钮 */

src/views/wmsManagement/components/TheOutboundPlan/index.vue

@@ -0,0 +1,115 @@
+<template>
+	<div>
+		<el-dialog v-bind="$attrs" v-on="$listeners" @open="onOpen" @close="onClose" :title="title" width="800px">
+			<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px"> </el-form>
+			<!-- 出库计划列表 -->
+			<div>
+				<!-- 数据区域 -->
+				<el-table :data="dataList" v-loading="loading" ref="table" border highlight-current-row max-height="400px">
+					<el-table-column prop="patchcode" label="批次号" align="center" :show-overflow-tooltip="true" />
+					<el-table-column prop="materialCode" label="物料号" align="center" :show-overflow-tooltip="true" />
+					<el-table-column prop="warehouseCode" label="所属仓库" align="center" :show-overflow-tooltip="true" />
+					<el-table-column prop="packageNum" label="批次箱数" align="center" :show-overflow-tooltip="true" />
+					<el-table-column prop="partnumberNum" label="批次零件数" align="center" :show-overflow-tooltip="true" />
+					<el-table-column prop="requireNum" label="需求零件数" align="center" :show-overflow-tooltip="true" />
+					<el-table-column prop="patchtime" label="批次时间" align="center" :show-overflow-tooltip="true" />
+					<el-table-column prop="outorder" label="出库顺序" align="center">
+						<template slot-scope="scope">
+							<el-input v-model.number="scope.row.outorder" placeholder="请输入出库顺序" />
+						</template>
+					</el-table-column>
+					<el-table-column label="操作" align="center" fixed="right" width="80">
+						<template slot-scope="scope">
+							<el-button
+								size="mini"
+								v-hasPermi="['business:wmoutorder:edit']"
+								type="success"
+								icon="el-icon-edit"
+								title="保存"
+								@click="handleUpdate(scope.row)"
+							></el-button>
+						</template>
+					</el-table-column>
+				</el-table>
+				<!-- <pagination
+					class="mt10"
+					background
+					:total="total"
+					:page.sync="queryParams.pageNum"
+					:limit.sync="queryParams.pageSize"
+					@pagination="getList"
+				/> -->
+			</div>
+			<div slot="footer">
+				<el-button @click="close">取消</el-button>
+				<el-button type="primary" @click="handelConfirm">确定</el-button>
+			</div>
+		</el-dialog>
+	</div>
+</template>
+<script>
+import * as WmOutOrderApi from '@/api/wmsManagement/wmOutOrder.js'
+export default {
+	inheritAttrs: false,
+	components: {},
+	props: ['planKey'],
+	data() {
+		return {
+			loading:false,
+			formData: {},
+			// 查询参数
+			queryParams: {
+				pageNum: 1,
+				pageSize: 10,
+			},
+			// 弹出层标题
+			title: '出库计划',
+			// 数据列表
+			dataList: [],
+			// 总记录数
+			total: 0,
+			rules: {},
+		}
+	},
+	computed: {},
+	watch: {},
+	created() {},
+	mounted() {},
+	methods: {
+		onOpen() {
+			this.getList()
+		},
+		onClose() {
+			this.$refs['elForm'].resetFields()
+		},
+		close() {
+			this.$emit('update:visible', false)
+		},
+		handelConfirm() {
+			this.$refs['elForm'].validate((valid) => {
+				if (!valid) return
+				this.close()
+			})
+		},
+		getList() {
+			this.loading = true
+			setTimeout(() => {
+				this.loading = false
+			}, 30000)
+			WmOutOrderApi.generateOutorderplan({ shipment_num: this.planKey }).then((res) => {
+				if (res.code === 200) {
+					this.dataList = res.data
+					// 计划出库批次清单
+					this.loading = false
+				} else {
+					this.$message.error('获取列表失败！' + res.msg + this.planKey)
+					this.loading = false
+				}
+			})
+		},
+		/** 修改按钮操作 */
+		handleUpdate(row) {},
+	},
+}
+</script>
+<style></style>