empty.vue 2.92 KB
<template>
	<view>
		<view class="content-top">
			<view class="content-item u-f u-f-aic plr-10">
				<view class="title require u-f1">
					容器号
				</view>
				<view class="inp u-f3">
					<input v-model="form.containerCode" placeholder="请输入" />
				</view>
			</view>
			<view class="content-item u-f u-f-aic plr-10">
				<view class="title u-f1">
					库位号
				</view>
				<view class="inp u-f3">
					<input v-model="form.destinationLocation" placeholder="请输入" />
				</view>
			</view>
		</view>
		<view class="footer u-f u-f-aic">
			<button class="btn" :loading="loading" type="warn" @tap="save" :disabled="disabled">保存</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				loading: false,
				disabled: false,
				form: {
					containerCode: '',
					destinationLocation: '',
				},
				timer: null
			}
		},
		onLoad() {
			if (this.timer) {
				clearTimeout(this.timer);
				this.timer = null;
			}
		},
		methods: {
			// 保存按钮操作
			save() {
				if (this.loading) {
					return false;
				}
				if (!this.form.containerCode.trim()) {
					uni.showModal({
						title: '提示',
						content: '请输入容器号!',
						showCancel: false
					});
					return
				}
				this.loading = true;
				this.disabled = true;
				this.$http.task.createEmptyIn(this.form).then(res => {
					console.log(res);
					if (res.data.code == 200) {
						this.loading = false;
						this.disabled = false;
						this.$wx.showToast({
							title: '保存成功!',
							duration: 1500
						});
						this.timer = setTimeout(() => {
							uni.redirectTo({
								url: 'empty?empty'
							});
						},400);
					} else {
						uni.showModal({
							title: '提示',
							content: res.data.msg
						});
						this.loading = false;
						this.disabled = false;
					}

				}).catch(err => {
					this.loading = false;
					this.disabled = false;
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content-top {
		background-color: $uni-bg-color;

		.content-item {
			height: 90rpx;
			line-height: 90rpx;
			border-bottom: 2rpx solid $uni-border-color;

			.title {
				font-size: $uni-font-size-lg;
			}

			.inp {
				text-align: right;
				font-size: $uni-font-size-lg;

				/deep/ uni-radio .uni-radio-input {
					margin-right: 0;
				}

				.picker {
					justify-content: flex-end;
				}
			}

			.require {
				position: relative;

				// padding-left: 10rpx;
				&::after {
					position: absolute;
					content: '*';
					color: red;
					font-size: 48rpx;
					top: 6rpx;
					left: -20rpx;
				}
			}
		}
	}

	.footer {
		position: fixed;
		bottom: 0;
		width: 100%;
		height: 140rpx;
		background-color: #fff;
		border-top: 2rpx solid #E1F3D8;

		.btn {
			width: 100%;
			height: 80rpx;
			line-height: 80rpx;
			color: #fff;
			text-align: center;
			font-size: $uni-font-size-lg;
			border-radius: 50rpx;
			margin: 0 30rpx;
			background-color: $uni-color-primary;

		}
	}
</style>