commodity-manage-app/pages/commodity/addOrder.vue

<template>
	<view class="page-css">
		<u-form
			labelPosition="left"
			labelWidth="130"
			:model="orderForm"
			:rules="rules"
			ref="orderForm"
		>	
			<view class="" @click="clickCalendar">
				<u-form-item label="交货日期:" prop="deliveryDate" borderBottom ref="item1" :required="true" @click="showCalendar = true">
					<view class="" @click="clickCalendar" style="display: flex;width: 100%;">
						<u-input v-model="orderForm.deliveryDate"  placeholder="请选择交货日期"
						 style="pointer-events: none;width: 90%;" :border="false" @click="showCalendar = true"></u-input>
					</view>
					<u-calendar v-model="showCalendar" mode="date" @change="changeCalendar" max-date='2255-12-31'></u-calendar>
				</u-form-item>
			</view>
			
			<u-form-item label="运输地址:" prop="transportationAddress" borderBottom ref="item1" :required="true">
				<u-input v-model="orderForm.transportationAddress" :border="true" placeholder="请输入运输地址"
				    type="textarea" :height="120" />
			</u-form-item>
			<u-form-item label="商品信息:" prop="" borderBottom ref="item1" :required="true">
				<view class="product_info">
					<view  v-if="selectedArr.length != 0">
						<view class="product_info_item" v-for="item in selectedArr" :key="item.id">
							<view class="">{{item.name}}</view>
							<view class="">{{item.addNum}}</view>
							
						</view>
					</view>
					<view class="" >
						<u-button  style="width: 100%;height: 70rpx;margin-top: 30rpx; " type="primary" @click="handleAdd">{{selectedArr.length == 0 ? '增加' : '修改'}}</u-button>
					</view>
				</view>
			</u-form-item>
		</u-form>
		<u-button class="item-bottom" type="primary" @click="formSubmit()">
		  提交
		</u-button>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				orderForm:{
					deliveryDate:'',
					transportationAddress:''
				},
				rules:{
					deliveryDate: [{
						type: "string",
						required: true,
						message: "请选择交货日期",
						trigger: ["blur", "change"],
					}],
					transportationAddress: [{
						type: "string",
						required: true,
						message: "请输入运输地址",
						trigger: ["blur", "change"],
					}],
				},
				showCalendar:false,
				selectedArr:[],
				userInfo:{}
			}
		},
		onReady() {
		  this.$refs.orderForm.setRules(this.rules);
		},
		onBackPress(){
			uni.switchTab({
				url:'/pages/home/index'
			})
			return true; // 阻止默认返回行为
		},
		onLoad(option) {
			console.log('option--------------------',option)
			if(JSON.stringify(option) != '{}'){
				this.selectedArr = option.selectArr ? JSON.parse(option.selectArr) :[],
				this.orderForm = {
					deliveryDate:option.date ? option.date : '',
					transportationAddress:option.address ? option.address : ''
				}
			}
			console.log('selectedArr---------------',this.selectedArr)
		},
		mounted() {
			this.userInfo = uni.getStorageSync("userinfo")
		},
		methods:{
			clickCalendar(){
				console.log('ces111111111111111111111')
				this.showCalendar = true
			},
			changeCalendar(value){
				console.log('value------------------',value)
				this.orderForm.deliveryDate = value.result
			},
			handleAdd(){
				if(this.selectedArr.length != 0){
					console.log('form---------------------------',this.orderForm)
					uni.navigateTo({
						url:'/pages/commodity/commodity?selectArr=' + JSON.stringify(this.selectedArr) + '&date='+ this.orderForm.deliveryDate + '&address=' + this.orderForm.transportationAddress 
					})
				}else{
					uni.navigateTo({
						url:'/pages/commodity/commodity?date=' + this.orderForm.deliveryDate + '&address=' + this.orderForm.transportationAddress
					})
				}
				
			},
			formSubmit(){
				this.$nextTick(() => {
					this.$refs.orderForm.validate(valid => {
						console.log('valid-----------------',valid)
						if(valid){
							console.log('orderForm--------------',this.orderForm)
							console.log('sele================',this.selectedArr)
							if(this.selectedArr.length == 0){
								uni.showToast({ title: "请选择商品", icon: "none" });
							}
							let list = []
							this.selectedArr.map(item =>{
								list.push({
									"commodityId": item.id,  //--物料ID
									"commodityCode": item.code,         // --物料编号
									"commodityName": item.name,            //--物料名称
									"commodityCount": item.addNum,                 // --物料数量
									"unit": item.specifications    
								})
							})
							let query = {
								deliveryDate:this.orderForm.deliveryDate,
								transportationAddress:this.orderForm.transportationAddress,
								detailList:list,
								createUser:this.userInfo.user_id
							}
							console.log('query-----------------------',query)
							this.$u.api.addOrder(query).then(res => {
								console.log('res----------------',res)
								if(res.code == 200){
									// uni.navigateBack()
									uni.switchTab({
										url:'/pages/home/index'
									})
								}
							})
						}
						
					})
				})
				
			},
		}
	}
</script>

<style lang="scss" scoped>
	.page-css{
		
		.product_info{
			width: 100%;
			.product_info_item{
				width: 100%;
				display: flex;
				padding: 5rpx 20rpx;
				background: #fff;
				justify-content: space-between;
				align-items: center;
				border-radius: 10rpx;
				margin-bottom: 10rpx;
			}
		}
		
		.item-bottom{
			margin-top: 50rpx;
		}
	}
</style>