pda_uniapp/pages/work/wms/palletOut.vue

<template>
	<view class="container">
		<cu-custom bgColor="bg-gradual-pink" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">空托盘下架</block>
		</cu-custom>
		<view class="example">
			<uni-forms ref="form" :model="formData" labelWidth="80px">
				<uni-forms-item label="仓库编号" name="houseCode">
					<uni-easyinput v-model="formData.houseCode" placeholder="请输入仓库编号" />
				</uni-forms-item>
				<uni-forms-item label="出库站台" name="outStation">
					<uni-easyinput v-model="formData.outStation" placeholder="请输入出库站台" />
				</uni-forms-item>
				<uni-forms-item label="下架数量" name="skuQty">
					<uni-easyinput v-model="formData.skuQty" placeholder="请输入下架数量" />
				</uni-forms-item>
				<uni-forms-item label="托盘类型" name="skuType">
					<picker @change="PickerChange" :value="index" :range="picker">
						<uni-easyinput v-model="formData.skuType" placeholder="请输入托盘类型" />
						<view class="picker">
						</view>
					</picker>
				</uni-forms-item>
			</uni-forms>
			<button type="primary" @click="formSubmit">提交</button>
		</view>
	</view>
</template>
<script>
	import {
		emptyPalletOut,
	} from "@/api/wms/palletOut.js"
	import {
		formatDate
	} from 'tough-cookie';
	export default {
		data() {
			return {
				formData: {
					houseCode: "",
					outStation: "",
					skuQty: 1,
					skuType: ""
				},
				rules: {
					houseCode: {
						rules: [{
							required: true,
							errorMessage: '仓库编号不能为空'
						}]
					},
					outStation: {
						rules: [{
							required: true,
							errorMessage: '出库站台不能为空'
						}]
					},
					skuQty: {
						rules: [{
							required: true,
							errorMessage: '下架数量不能为空'
						}]
					},
					skuType: {
						rules: [{
							required: true,
							errorMessage: '下架类型不能为空'
						}]
					},
				},
				message: '操作提示信息！',
				index: -1,
				picker: ['KTP001', 'KTP002'],
			}
		},
		onReady() {
			this.$refs.form.setRules(this.rules)
		},
		methods: {
			PickerChange(e) {
				console.log("PickerChange", e)
				console.log("PickerChange", e.detail.value)
				this.index = e.detail.value
				var picked = this.picker[e.detail.value]
				this.formData.skuType = picked;
				console.log("picked", picked)
			},
			//表单提交
			formSubmit: function(ref) {
				//拿到 formaData
				console.log("formSubmit")

				this.$refs.form.validate().then(res => {
					console.log("数据校验通过", res)

					console.log("this.formData", this.formData)
					emptyPalletOut(this.formData).then(response => {
						console.log("response", response)
						this.$modal.msgSuccess("下架成功请等待")
					})
				})
			},

			hideMsgModal(e) {
				//关闭信息模态框
				this.msgModalName = null;
			},
			textareaAInput(e) {
				this.textareaAValue = e.detail.value
			},
			textareaBInput(e) {
				this.textareaBValue = e.detail.value
			}
		}
	}
</script>

<style lang="scss">
	.cu-form-group .title {
		min-width: calc(4em + 15px);
	}

	page {
		background-color: #ffffff;
	}

	.example {
		padding: 15px;
		background-color: #fff;
	}

	.segmented-control {
		margin-bottom: 15px;
	}

	.button-group {
		margin-top: 15px;
		display: flex;
		justify-content: space-around;
	}

	.form-item {
		display: flex;
		align-items: center;
		flex: 1;
	}

	.button {
		display: flex;
		align-items: center;
		height: 35px;
		line-height: 35px;
		margin-left: 10px;
	}
</style>