baozhida-logistics-app/pages/order/addWaybill.vue

<template>
	<!-- 添加运单 -->
	<view>
		<u-navbar :title="headline" autoBack placeholder></u-navbar>
		<view class="title_waybill">寄件人:</view>
		<x-form ref="sender" :list="list" :model="senderModel" :rules="rules"></x-form>
		<view class="title_waybill">收件人:</view>
		<x-form ref="recipients" :list="list" :model="recipientsModel" :rules="rules"></x-form>
		<view class="title_waybill">物品信息:</view>
		<x-form ref="goods" :list="goodsList" :model="goodsModel" :rules="goodsRules"
			@incubatorClick="incubatorClick"></x-form>
		<view style="width: 100%;height: 150rpx;"></view>
		<view class="btn_print" @click="printWaybill">
			<u-button type="primary" :text="headline"></u-button>
		</view>
	</view>
</template>

<script>
	import {
		formRules,
		pickupRulesil
	} from "./waybill.js";
	export default {
		name: 'addWaybill',
		data() {
			return {
				senderModel: {
					name: '',
					phone: '',
					address: '',
				},
				recipientsModel: {
					name: '',
					phone: '',
					address: '',
				},
				goodsModel: {
					temperatureInterval: '',
					deliveryCondition: '',
					coolerBoxId: 0,
					coolerBoxIdname: '',
					cargoType: '',
					quantity: '',
					remark: '',
					customerName: '',
				},
				rules: {
					name: {
						required: true,
						message: '请输入姓名',
						trigger: ['blur', 'change']
					},
					phone: [{
						required: true,
						message: '请输入电话',
						trigger: ['blur', 'change']
					}, {
						validator: (rule, value, callback) => {
							return uni.$u.test.mobile(value);
						},
						message: '电话号码不正确',
						trigger: ['change', 'blur'],
					}],
					address: {
						required: true,
						message: '请输入地址',
						trigger: ['blur', 'change']
					},
				},
				goodsRules: {
					temperatureInterval: {
						required: true,
						message: '请选择温度需求',
						trigger: ['blur', 'change']
					},
					deliveryCondition: {
						required: true,
						message: '请选择配送要求',
						trigger: ['blur', 'change']
					},
					cargoType: {
						required: true,
						message: '请选择货物类型',
						trigger: ['blur', 'change']
					},
					coolerBoxId: {
						type: 'number',
						required: true,
						message: '请选择保温箱',
						trigger: ['blur', 'change']
					},
					quantity: {
						required: true,
						message: '请输入数量',
						trigger: ['blur', 'change']
					},
				},
				list: pickupRulesil(),
				goodsList: formRules(),
				userInfo: {},
				headline: '添加运单',
				type: 1,
			}
		},
		onLoad(value) {
			this.headline = value.title
			this.type = Number(value.type)
			if (this.type == 2) {
				var orderList = this.$cache.getCache('orderDetails')
				// console.log(orderList, 77)
				this.senderModel.name = orderList.senderAddressName
				this.senderModel.phone = orderList.senderAddressPhone
				this.senderModel.address = orderList.senderAddressDetails
				this.recipientsModel.name = orderList.consigneeAddressName
				this.recipientsModel.phone = orderList.consigneeAddressPhone
				this.recipientsModel.address = orderList.consigneeAddressDetails
				this.goodsModel.temperatureInterval = orderList.temperatureInterval
				this.goodsModel.deliveryCondition = orderList.deliveryCondition
				this.goodsModel.cargoType = orderList.cargoType
				this.goodsModel.quantity = orderList.quantity
				this.goodsModel.remark = orderList.remark
				this.goodsModel.customerName = orderList.customerName
				this.goodsModel.id = orderList.id
				this.goodsModel.coolerBoxId = orderList.coolerBox.id
				this.goodsModel.coolerBoxIdname = orderList.coolerBox.name
			}
		},
		mounted() {
			var userInfo = this.$cache.getCache('userInfo')
			this.userInfo = userInfo
		},
		methods: {
			// 添加运单
			async printWaybill() {
				let flag = await this.$refs['sender'].validateForm();
				let flag1 = await this.$refs['recipients'].validateForm();
				let flag2 = await this.$refs['goods'].validateForm();
				if (flag && flag1 && flag2) {
					let params = {
						senderAddressName: this.senderModel.name,
						senderAddressPhone: this.senderModel.phone,
						senderAddressDetails: this.senderModel.address,
						consigneeAddressName: this.recipientsModel.name,
						consigneeAddressPhone: this.recipientsModel.phone,
						consigneeAddressDetails: this.recipientsModel.address,
						...this.goodsModel,
					}
					delete params.coolerBoxIdname
					params.quantity = Number(params.quantity)
					uni.showLoading();
					if (this.type == 1) {
						// 添加订单
						if (this.userInfo.userType == 'sys') {
							this.$api.post('/api/waybill/applet', params).then(res => {
								if (res.code == 200) {
									uni.redirectTo({
										url: '/pages/order/index'
									});
								} else {
									uni.$u.toast('添加失败')
								}
								uni.hideLoading();
							}).catch(() => {
								uni.hideLoading();
							})
						} else {
							delete params.customerName
							this.$api.post('/api/waybill/customer', params).then(res => {
								if (res.code == 200) {
									uni.redirectTo({
										url: '/pages/order/index'
									});
								} else {
									uni.$u.toast('添加失败')
								}
								uni.hideLoading();
							}).catch(() => {
								uni.hideLoading();
							})
						}
					} else {
						// 修改订单
						if (this.userInfo.userType != 'sys') {
							delete params.customerName
						}
						this.$api.put('/api/waybill', params).then(res => {
							if (res.code == 200) {
								// uni.$u.toast(res.msg)
								uni.redirectTo({
									url: '/pages/order/index'
								});
							} else {
								uni.$u.toast('修改失败')
							}
							uni.hideLoading();
						}).catch(() => {
							uni.hideLoading();
						})
					}
				} else {
					uni.$u.toast('请先完善表单')
				}
			},
			// 保温箱
			incubatorClick(value) {
				this.goodsModel.coolerBoxId = value.id
				this.goodsModel.coolerBoxIdname = value.name
				this.$forceUpdate()
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #fff !important;
	}

	.title_waybill {
		position: relative;
		margin: 20rpx;
		border-bottom: 1rpx;
		padding-bottom: 20rpx;
	}

	.title_waybill:before {
		content: " ";
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 1px;
		border-top: 1px solid #e7e6e4;
		-webkit-transform-origin: 0 0;
		transform-origin: 0 0;
		-webkit-transform: scaleY(0.5);
		transform: scaleY(0.5);
	}
</style>