anmo-master/package/pages/zysc/member/order.vue

<template>
	<view>
		<view
			style="width: 690upx;height: 130upx;background: #FFFFFF;margin: 30upx; padding: 10upx;border-radius: 20upx;"
			@tap='goEditAddress' v-if="isExpress === 1">
			<view style="display: flex;margin: 10upx 0 0 20upx;">
				<image src="../../../../static/images/icon_address.png"
					style="width: 70upx; height: 70upx;margin-top: 10upx;"></image>
				<view style="margin-left: 20upx;width: 80%;" v-if="checkAddress">
					<view style="display: flex;align-items: center;">
						<view style="font-size: 32upx;color: #333333;">{{consignee}}</view>
						<view style="font-size: 28upx;color: #999999;margin-left: 10upx;">{{mobile}}</view>
					</view>
					<view v-if="consignee"
						style="margin-top: 10upx;font-size: 30upx;color: #333333;width: 90%; white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">
						{{provinces}}{{detail}}
					</view>
				</view>
				<view v-if="checkAddress == false"
					style="margin-left: 20upx;width: 80%;margin-top: 25upx;color: #000000;">
					暂无地址信息，请添加地址信息</view>
				<image src="../../../../static/images/icon_right.png"
					style="width: 17upx;height: 28upx;margin-top: 35upx;"></image>
			</view>
		</view>

		<view
			style="width: 690upx;height: max-content;background: #FFFFFF;margin: 30upx; padding: 10upx;border-radius: 20upx;">
			<view style="display: flex;padding: 20upx;">
				<image :src="attrValuecoverImg" style="width: 200upx; height: 200upx;"></image>
				<view style="width: 65%;margin-left: 20upx;">
					<view
						style="font-size: 28upx;color: #333333;height: 78upx;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;">
						{{title}}
					</view>
					<view style="display: flex;width: 100%;" v-if="checkString != ''">
						<view style="font-size: 24upx;color: #333333;margin-top: 25upx;">商品规格:</view>
						<view style="font-size: 24upx;color: #333333;margin-top: 25upx;margin-left: 15upx;">
							{{checkString}}
						</view>
					</view>
					<view style="display: flex;">
						<view
							:style="checkString != '' ? 'display: flex;width: 70%;margin-top: 10upx;' : 'display: flex;width: 70%;margin-top: 30upx;'">
							<view style="font-size: 30upx;color: #333333;margin-top: 25upx;">¥ {{money}}</view>
							<view style="font-size: 20upx;color: #666666;margin-top: 30upx;margin-left: 15upx;">
								x{{number}}</view>
						</view>
						<view v-if="isExpress === 1 && className === '' && checkString == '' "
							style="width:200upx;height: 60upx;display: flex;margin-top: 30upx;border-radius: 5upx;border:1px solid #E6E6E6;">
							<view
								style="border-right:1px solid #E6E6E6;width: 70upx;color: #999999;text-align: center;margin-top: 15upx;"
								@click="jian">-</view>
							<view
								style="width: 80upx;text-align: center;font-size: 24upx;color: #333333;margin-top: 15upx;">
								{{number}}
							</view>
							<view
								style="border-left:1px solid #E6E6E6;width: 70upx;color: #999999;text-align: center;margin-top: 15upx"
								@click="jia">+</view>
						</view>
					</view>
				</view>
			</view>
			<view style="display: flex;padding: 20upx;">
				<view style="font-size: 30upx;color: #333333;width: 25%;">配送方式</view>
				<view style="font-size: 30upx;color: #000000;margin-left: 10upx;width: 40%;">
					<picker mode="selector" :range="WayList" @change="WaySel">
						<view v-if="sendName === '请选择配送方式'" style="color: #000000;">{{sendName}}</view>
						<view v-else>{{sendName}}</view>
					</picker>
				</view>
			</view>
			<view style="display: flex;padding: 20upx;" v-if="sendName === '快递'">
				<view style="font-size: 30upx;color: #333333;width: 25%;">快递</view>
				<view style="font-size: 30upx;color: #000000;margin-left: 10upx;width: 40%;">
					{{postagePrice == 0 ? '包邮' : postagePrice + '元'}}
				</view>
			</view>
			<!-- 领劵end -->
			<view style="display: flex;padding: 30upx 20upx;">
				<view style="font-size: 30upx;color: #333333;width: 25%;">订单备注</view>
				<input type="text" style="width: 70%;font-size: 30upx;color: #999999;margin-left: 10upx;"
					v-model="descrition" placeholder="选填" />
			</view>
		</view>
		<view style="display: flex;background-color: #FFFFFF;width: 100%;height: 100upx;position: fixed;bottom: 0upx;">
			<view style="display: flex;font-size: 28upx;color: #333333;padding: 25upx 0 10upx 20upx;width: 50%;">
				<view v-if="className != 'jifen'" style="font-size: 28upx;color: #333333;padding: 5upx 0 10upx 10upx;">
					总金额：</view>
				<view v-if="className != 'jifen'" style="font-size: 40upx;color: #05C25C;padding: 0upx 0 10upx 10upx;">
					¥{{price + postagePrice}}</view>
				<view v-if="className === 'jifen'" style="font-size: 40upx;color: #05C25C;padding: 0upx 0 10upx 10upx;">
					{{price}}
					<text style="font-size: 28rpx;">积分</text>
				</view>
			</view>
			<button
				style="background-color: #05C25C;width: 300upx;height: 70upx;font-size: 28upx;color: #FFFFFF;text-align: center;margin-top: 15upx;border-radius: 50upx;"
				@tap='goPay'>提交订单</button>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				sendName: '请选择配送方式',
				sendWay: 0,
				WayList: [],
				descrition: '',
				number: 1,
				money: 0,
				consignee: '',
				provinces: '',
				commissionPrice: 0,
				id: 0,
				price: 0,
				couponUserId: '',
				postagePrice: 0,
				postagePrices: 0,
				title: '',
				attrValuecoverImg: '',
				isExpress: 1,
				checkString: '',
				detail: '',
				skuId: 0,
				lessMoney: 0,
				maxNumber: 0,
				groupPinkId: '',
				mobile: '',
				jianMoney: 0,
				list: {},
				addressId: '',
				className: '',
				userByinvitationId: '',
				checkAddress: false
			}
		},
		onShow() {
			this.addressId = this.$queue.getData('EditAddress');
			if (this.addressId) {
				this.getAddressList(this.addressId);
			} else {
				this.addressMy()
			}
		},
		onLoad(d) {
			let peisongSel = this.$queue.getData('peisongSel');
			if (peisongSel) {
				this.WayList = peisongSel.split(',');
			}
			if (d.id) {
				if (d.maxNumber) {
					this.maxNumber = parseFloat(d.maxNumber);
				}
				this.className = d.className ? d.className : '';
				this.id = d.id;
				this.groupPinkId = d.groupPinkId;
				if (d.userByinvitationId) {
					this.userByinvitationId = d.userByinvitationId;
				}
				if (d.checkString) {
					this.money = d.numberMoney;
					this.checkString = d.checkString;
					this.number = d.number;
					this.price = parseFloat(d.money);
					this.skuId = d.skuId;
					this.attrValuecoverImg = d.attrValuecoverImg;
				} else {
					this.number = 1;
					this.price = parseFloat(d.money);
					this.money = d.numberMoney;
				}
				this.jianMoney = this.price;
				this.getCommondityList(d.id);
			}
		},
		methods: {
			WaySel(e) {
				console.log(e);
				// this.sendId = this.WayListTwo[e.detail.value].id;
				this.sendName = this.WayList[e.detail.value];
				if (this.sendName === '快递') {
					this.sendWay = 1;
					this.postagePrice = this.postagePrices;
				} else if (this.sendName === '自取') {
					this.sendWay = 2;
					this.postagePrice = 0;
				}
			},
			// 根据地址id查询地址
			getAddressList(addressId) {
				if (addressId) {
					this.$Request.getT('/app/address/selectAddressByAddressId?addressId=' + this.addressId).then(res => {
						console.log(res)
						if (res.code == 0 && res.data) {
							this.checkAddress = true;
							this.detail = res.data.city + '' + res.data.district + '' + res.data.detailsAddress;
							this.consignee = res.data.name;
							this.mobile = res.data.phone;
							this.provinces = res.data.province;
							// this.name = res.data.name;
							// this.mobile = res.data.phone;
							// this.cityaddress = res.data.province + res.data.city + res.data.district;
							// this.detailaddress = res.data.detailsAddress;
							// this.isDefault = res.data.isDefault;
							// this.userId = res.data.userId;
							// this.latitude = res.data.latitude;
							// this.longitude = res.data.longitude;
							// this.province = res.data.province
							// this.city = res.data.city
							// this.district = res.data.district
						} else {
							this.checkAddress = false;
						}
						// uni.hideLoading();
					});
				} else {
					uni.navigateTo({
						url: '../../../my/address/address?id=' + 1
					})
				}
			},
			// 获取默认地址
			addressMy() {
				this.$Request.getT('/app/address/selectAddressById').then(res => {
					console.log(res)
					if (res.code == 0 && res.data) {
						this.checkAddress = true;

						this.detail = res.data.city + '' + res.data.district + '' + res.data.detailsAddress;
						this.consignee = res.data.name;
						this.mobile = res.data.phone;
						this.provinces = res.data.province;

						// this.name = res.data.name;
						// this.mobile = res.data.phone;
						// this.cityaddress = res.data.province + res.data.city + res.data.district;
						// this.detailaddress = res.data.detailsAddress;
						// this.isDefault = res.data.isDefault;
						// this.userId = res.data.userId;
						// this.latitude = res.data.latitude;
						// this.longitude = res.data.longitude;
						// this.province = res.data.province
						// this.city = res.data.city
						// this.district = res.data.district
						// this.addressId = res.data.addressId
					} else {
						this.checkAddress = false;
					}
				});
			},
			numFilter(value) {
				// 截取当前数据到小数点后三位
				let tempVal = parseFloat(value).toFixed(2)
				let realVal = tempVal.substring(0, tempVal.length - 1)
				return realVal
			},
			getCommondityList(id) {
				uni.showLoading({
					title: '加载中...'
				});
				this.$Request.getT('/goods/find?id=' + id).then(res => {
					if (res.status === 0) {
						this.list = res.data;
						let relation_id = this.$queue.getData('relation_id');
						this.attrValuecoverImg = res.data.coverImg;
						if (this.checkString == '') {
							this.price = parseFloat(this.list.sku[0].skuPrice);
							this.money = parseFloat(this.list.sku[0].skuPrice);
							this.maxNumber = this.list.sku[0].stock ? this.list.sku[0].stock : 1;
						}
						this.isExpress = res.data.isExpress;
						this.title = this.list.title;
						if (this.list.postagePrice) {
							this.postagePrice = 0;
							this.postagePrices = parseFloat(this.list.postagePrice);
						} else {
							this.postagePrice = 0;
							this.postagePrices = 0;
						}
						this.commissionPrice = parseFloat(this.list.commissionPrice);
					}
					uni.hideLoading();
				});
			},
			// getAddressList() {
			// 	let userId = this.$queue.getData('userId');
			// 	this.$Request.getT('/app/address/findDefaultByUserId?userId=' + userId).then(res => {
			// 		if (res.status === 0) {
			// 			if (res.data) {
			// 				this.checkAddress = true;
			// 				this.detail = res.data.detail;
			// 				this.consignee = res.data.consignee;
			// 				this.mobile = res.data.mobile;
			// 				this.provinces = res.data.provinces;
			// 			} else {
			// 				this.checkAddress = false;
			// 			}
			// 		} else {
			// 			this.checkAddress = false;
			// 		}
			// 	});
			// },
			goPay() {
				if (this.sendWay == 0) {
					this.$queue.showToast('请选择配送方式!')
					return;
				}
				if (!this.checkAddress && this.sendName != '自取') {
					this.$queue.showToast('请设置收货地址信息');
					return;
				}
				let userId = this.$queue.getData('userId');
				if (this.skuId === 0) {
					this.skuId = this.list.sku[0].id;
				}
				var orderType = '1'; //1普通订单 2拼团 3秒杀
				var type = '';
				var status = '';
				var secKillId = '';
				var groupId = '';
				var goodsId = '';
				var isExpress = '';
				var commissionPrice = '';
				status = '1';
				type = this.list.type.id;
				goodsId = this.list.id;
				isExpress = this.list.isExpress;
				commissionPrice = this.commissionPrice;
				let data = {
					userId: userId,
					status: status,
					sendWay: this.sendWay,
					consignee: this.consignee,
					mobile: this.mobile,
					provinces: this.provinces,
					detail: this.detail,
					type: type,
					secKillId: secKillId,
					groupPinkId: this.groupPinkId,
					orderType: orderType,
					title: this.list.title,
					groupId: groupId,
					couponMoney: this.lessMoney, //这个是优惠券金额，替换了descrition的值描述
					userCouponsId: this.couponUserId,
					goodsId: goodsId,
					img: this.attrValuecoverImg,
					isExpress: isExpress,
					descrition: this.descrition,
					skuId: this.skuId,
					price: this.money,
					number: this.number,
					postagePrice: this.postagePrice,
					payMoney: this.price + this.postagePrice,
					relationId: this.userByinvitationId,
					detailJson: this.checkString,
					commissionPrice: commissionPrice
				}
				this.$Request.postJson('/app/orders/save', data).then(res => {
					if (res.status === 0) {
						uni.redirectTo({
							url: '../my/payment?money=' + this.price + '&title=' + this.list.title +
								'&img=' + this.list.img + '&id=' +
								res.data.id + '&orderType=' + orderType
						});
					}
				});
			},
			goEditAddress() {
				uni.navigateTo({
					url: '/my/address/address?id=1'
				});
			},
			jian() {
				if (this.number != 1) {
					let number = this.number - 1
					this.number = number
					// this.price = parseFloat(this.price - this.money).toFixed(1);
					this.price = parseFloat(this.numFilter(parseFloat(this.price) - parseFloat(this.money)));
				}
			},
			jia() {
				let number = this.number + 1
				if (this.maxNumber >= number) {
					this.number = number
					this.price = parseFloat(this.numFilter(parseFloat(this.price) + parseFloat(this.money)));
					// this.price = parseFloat(this.price) + parseFloat(this.money);
				} else {
					this.$queue.showToast('没库存啦，只能买这么多了！');
				}
			}
		}
	}
</script>

<style>
	page {
		background: #F2F2F2;
	}

	.topic_cont_text {
		padding: 30upx;
		colof: #999;
		background: #E1FFFF;
		max-height: 130upx;
		overflow: hidden;
		word-break: break-all;
		/* break-all(允许在单词内换行。) */
		text-overflow: ellipsis;
		/* 超出部分省略号 */
		display: -webkit-box;
		/** 对象作为伸缩盒子模型显示 **/
		-webkit-box-orient: vertical;
		/** 设置或检索伸缩盒对象的子元素的排列方式 **/
		-webkit-line-clamp: 2;
		/** 显示的行数 **/
	}
</style>