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

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>