luban-mall/pagesA/cart/settlement.vue

<template>
	<view class="pad-b150">
		<status-nav :ifReturn="true" navBarTitle="订单提交" :marginBottom="0"></status-nav>
		<view class="settlement-content">
			<view class="settlement-title">联系方式</view>
			<view class="settlement-tips">请输入您的联系方式，我们将尽快与您联系并确认订单信息！</view>
			<view class="settlement-list">
				<view class="settlement-item">
					<view class="name">联系人</view>
					<view class="txt flex">
						<text>称呼</text>
						<input type="text" v-model="name" @tap="chooseEv(0)" :class="current==0 ? 'focusc' : ''" placeholder="请输入您的称呼" placeholder-style="color:#999999">
					</view>
				</view>
				<view class="settlement-item">
					<view class="name">联系方式</view>
					<view class="txt flex">
						<text>电话</text>
						<input type="text" v-model="phone" @tap="chooseEv(1)" :class="current==1 ? 'focusc' : ''" placeholder="请输入手机号码" placeholder-style="color:#999999">
					</view>
				</view>
				<view class="settlement-item">
					<view class="name">联系地址</view>
					<view class="txt flex">
						<text>地址</text>
						<input type="text" v-model="address" @tap="chooseEv(2)" :class="current==2 ? 'focusc' : ''" placeholder="请输入地址" placeholder-style="color:#999999">
					</view>
				</view>
				<view class="settlement-item">
					<view class="name">送货时间</view>
					<view class="txt flex">
						<text>日期</text>
						<picker mode="date" :start="startDate" :end="endDate" @change="chooseTime(3,$event)">
							<input type="text" v-model="toTime" disabled @tap="chooseEv(0)" :class="current==0 ? 'focusc' : ''" placeholder="请选择送货日期" placeholder-style="color:#999999">
						</picker>
					</view>
				</view>
			</view>
		</view>
		<view class="settlement-btn flex">
			<view class="btn" @tap="submit">提交订单</view>
		</view>
	</view>
</template>

<script>
	import statusNav from '@/components/status-navs/status-nav';
	import {getCartNum,userInfoEv} from '@/jsFile/public-api.js';
	import {mapState} from 'vuex'//引入mapState
	function getDate(type) {
		const date = new Date();
		let year = date.getFullYear();
		let month = date.getMonth() + 1;
		let day = date.getDate();
		if (type === 'start') {
			year = year;
		} else if (type === 'end') {
			year = year + 10;
		}
		month = month > 9 ? month : '0' + month;
		day = day > 9 ? day : '0' + day;
		return `${year}-${month}-${day}`;
	}
	export default {
		components:{
			statusNav
		},
		data() {
			return {
				current:6,
				address:'',// 地址
				name:'',// 称呼
				phone:'',// 电话
				flag:true,
				// 日期
				toTime: getDate({
					format: true
				}),
				startDate: getDate('start'),
				endDate: getDate('end'),
				cacheBusinessId:-1, //商户id
			}
		},
		onLoad(op) {
			if(op.business_id){
				this.cacheBusinessId = op.business_id;
			}
		},
		onShow() {
			if(this.cacheBusinessId !== -1){
				this.$requst.post('/api/index/change-business',{business_id:this.cacheBusinessId}).then(res=>{
					if(res.code == 0){
						this.getUserInfo()
					}
				})
			}else{
				this.getUserInfo()
			}
		},
		methods: {
			// 获取默认信息
			getUserInfo(){
				this.$requst.get('/api/user/info').then(res=>{
					if(res.code==0) {
						uni.setStorageSync('business_id',res.data.business_id);
						this.address = res.data.order_address; //地址
						this.name = res.data.order_contact; //联系人
						this.phone = res.data.order_phone; //电话
					}
				})
			},
			// 提交
			submit(){
				if(this.checkEmpty() && this.flag){
					this.flag = false;
					let params = {
						sku_list: uni.getStorageSync('buyList'),
						order_phone: this.phone,
						order_contact: this.name,
						order_address: this.address,
						order_date: this.toTime,
					}
					this.$requst.post('/api/order/create',params).then(res=>{
						if(res.code==0) {
							uni.navigateTo({
								url:`/pagesA/cart/finish?id=${res.data.id}&coding=${res.data.coding}`
							})
						}else{
							console.log(res.msg,'提示信息')
							this.$toolAll.tools.showToast(res.msg);
							this.flag = true;
						}
					})
				}
			},
			checkEmpty(){
				let result = false;
				if(!this.name) {
					this.$toolAll.tools.showToast('请填写联系人');
				} else if(this.$toolAll.tools.isPhone(this.phone)) {
					this.$toolAll.tools.showToast('请正确填写联系电话');
				} else if(!this.address) {
					this.$toolAll.tools.showToast('请填写收货地址');
				} else if(!this.toTime) {
					this.$toolAll.tools.showToast('请选择送货时间');
				} else {
					result = true;
				}
				return result;
			},
			chooseEv(index) {
				this.current = index;
			},
			chooseTime(index,e) {
				this.toTime = e.detail.value;
			}
		}
	}
</script>

<style>
	
</style>