<template>
	<view>
		<!-- 公共组件-每个页面必须引入1 -->
		<public-module></public-module>
		<z-nav-bar title="商品结算"></z-nav-bar>
		<view v-if="adressMoRen.username==undefined" class="addShouhuo" @click="toAddress()">
			<u-icon name="plus" size="20" style="display: inline-block;margin-right: 10rpx;"></u-icon>
			请添加收货地址
		</view>
		<view class="adDefault" @click="dizhiShow = true" v-if="adressMoRen.username!=undefined">
			<view class="defalTop">
				<text class="userName">
					{{adressMoRen.username}}
				</text>
				<text class="userTel">
					{{adressMoRen.userphone}}
				</text>
				<text class="userMoren" v-if="adressMoRen.isdefault==1">
					默认
				</text>
			</view>
			<view class="defalBottom">
				<text class="userAddress">
					{{adressMoRen.areaidpathtext}} {{adressMoRen.useraddress}}
				</text>
			</view>

			<u-icon name="map" color="#aaa" size="25" class="defalLeft"></u-icon>
			<u-icon name="arrow-right" color="#aaa" size="22" class="defalRight"></u-icon>
		</view>

		<view class="cartItem" v-for="(item,index) in cartList" :key="index">
			<view class="cartContent">
				<image :src="item.image" mode=""></image>
				<view class="itemCenter">
					<view class="cartTitle">
						<text>{{item.productName}}</text>
					</view>
					<view class="itemPrice">
						<text v-if="item.activityPrice && item.activityPrice > 0">￥{{item.activityPrice*item.productAmount}}</text>
						<text v-else>￥{{item.price*item.productAmount}}</text>
						<u-number-box v-model="item.productAmount" @change="valChange($event, item)" :input-width="50"
							:input-height="20" :min="1" :max="item.productStock" integer ></u-number-box>
					</view>
				</view>
			</view>
		</view>

		<view class="youhui_quan">
			<view class="yq_alljia">
				商品总价
				<text>￥{{totalPrice}}</text>
			</view>
			<view class="yq_youhui" @click="youhuiShow = true">
				<u-icon name="red-packet-fill" color="#e74141" size="18" class="yqLeft"></u-icon>
				优惠券
				<u-icon name="arrow-right" color="#aaa" size="18" class="yqRight"></u-icon>
				<text class="dagnqian"
					v-if="youhuiList.length>0&&youhuiContent.id==undefined">当前可选{{this.youhuiList.length}}张</text>
				<text class="dagnqian" v-if="youhuiList.length==0&&youhuiContent.id==undefined"
					style="background-color: #999;">暂无优惠券</text>
				<text class="dagnqian" v-if="youhuiContent.id!=undefined">
					- ￥{{youhuiContent.coupons.couponAmount}}</text>
			</view>
			<view class="yq_yunfei">
				<u-icon name="car-fill" color="#e0880c" size="18" class="yqLeft"></u-icon>
				运费
				<text>￥{{farePrice}}</text>
			</view>
		</view>
		<!-- 安卓支付列表 -->
		<view class="zhif_fangsh" v-if="isAndorid">
			<view class="zhif_radio">
				<u-radio-group v-model="payType">
					<view style="width: 100%;">
						<view v-for="(item, index) in paylist"  class="zhif_xuanx">
							<image :src="item.img"></image>
							{{item.title}}
							<span v-if="item.id == 4" style="color: #bbb; margin-left: 10px;">{{userMes.peanutCoin}}疯币可用</span>
							<span @click.stop="buPoint" style="color: #bf0c0c; margin-left: 10px;" v-if="item.id == 4" class="chongBtn">去充值</span>
							<u-radio :key="index" activeColor="#fe6e09" :name='item.id'
								style="float: right;margin-top: 5rpx;" ></u-radio>
						</view>
					</view>
				</u-radio-group>
			</view>
		</view>
		<!-- ios支付列表 -->
		<view class="zhif_fangsh" v-else>
			<view class="zhif_radio">
				<u-radio-group v-model="payType">
					<view style="width: 100%;">
						<view v-for="(item, index) in paylistIos"  class="zhif_xuanx">
							<image :src="item.img"></image>
							{{item.title}}
							<span v-if="item.id == 4" style="color: #bbb; margin-left: 10px;">{{userMes.peanutCoin}}疯币可用</span>
							<span @click.stop="buPoint" style="color: #bf0c0c; margin-left: 10px;" v-if="item.id == 4" class="chongBtn">去充值</span>
							<u-radio :key="index" activeColor="#fe6e09" :name='item.id'
								style="float: right;margin-top: 5rpx;" ></u-radio>
						</view>
					</view>
				</u-radio-group>
			</view>
		</view>
		
		<view class="footer" >
			<view class="commodityPrice" v-if="payType != 4">
				<span style="color: #666;margin-right: 10rpx; font-size: 15px;">实付款: </span>
				<span>￥</span>{{realPrice}}
			</view>
			<view class="commodityPrice" v-if="payType == 4">
				<span style="color: #666;margin-right: 10rpx; font-size: 15px;">实付款: </span>
				{{realPrice}}<span>疯币</span>
			</view>
			<view class="operate" @click="goBuyJie" v-if="payType != 4">
				<view class="goBuy">
					立即支付
				</view>
			</view>
			<view class="operate" @click="goPoinBuy" v-if="payType == 4">
				<view class="goBuy">
					立即支付
				</view>
			</view>
		</view>		
		<!-- 地址弹出 -->
		<u-popup :show="dizhiShow" :round="10" @close="dizhiShow=false">
			<view class="tanchu">
				<view class="dp_title">请选择地址</view>
				<view class="dp_add" @click="toAddress()">
					<u-icon name="plus" color="#fff" size="12"></u-icon>
					添加地址
				</view>
				<view style="max-height: 1000rpx;overflow-y: scroll;">
					<view :class="adressMoRIndex == index ? 'addressItem addItem_style' : 'addressItem'"
						v-for="(item,index) in addressList" :key="index" @click="choseDizhi(index)">						
						<view class="addrContent">
							<view class="addrContentTop">
								<view class="userName">
									{{item.username}}
								</view>
								<view class="userTel">
									{{item.userphone}}
								</view>
								<view class="userMoren" v-if="item.isdefault==1">
									默认
								</view>
								<u-icon name="checkmark-circle-fill" class="chooseCheck" size="20" color="#fd6004"
									v-if="adressMoRIndex == index"></u-icon>
							</view>
							<view class="addrContentBottom">
								<view class="userAddress">
									{{item.areaidpathtext}} {{item.useraddress}}
								</view>
							</view>
						</view>
					</view>

				</view>
			</view>
		</u-popup>


		<!-- 优惠券弹出 -->
		<u-popup :show="youhuiShow" :round="10" @close="youhuiShow=false">
			<view class="tanchu">
				<view class="dp_title">请选择优惠券</view>
				<view style="max-height: 1000rpx;overflow-y: scroll;">
					<view :class="youhuiIndex === index ? 'youhuiItem youItem_style' : 'youhuiItem'"
						v-for="(item,index) in youhuiList" :key="index" @click="choseYouhui(index)">
						<view style="width: 25%;color:#fd6004;text-align: center;">
							<text>￥</text>
							<b style="font-size: 45rpx;">{{item.coupons.couponAmount}}</b>
							<text
								style="display: block;color: #666;font-size: 25rpx;margin-top: 10rpx;">满{{item.coupons.useLevel}}元可用</text>
						</view>
						<view style="width: 68%;padding-left: 5%;">
							<text>{{item.coupons.couponName}}</text>
							<text
								style="display: block;font-size: 20rpx;color: #999;margin-top: 10rpx;">到期时间：{{item.coupons.expirationDate}}</text>
						</view>
						<view style="width: 7%;">
							<text
								style="border: 1px solid #d9d9d9;width: 35rpx;height:35rpx;display:inline-block;border-radius: 30rpx;"
								v-if="youhuiIndex !== index"></text>
							<u-icon name="checkmark-circle-fill" color="#fd6004" size="20" v-if="youhuiIndex === index">
							</u-icon>
						</view>
						<br clear="both">
					</view>
				</view>
				<view style="font-size: 20rpx;color: #aaa;margin-top: 30rpx;">* 每笔订单只能使用一张优惠价</view>
			</view>
		</u-popup>

<music-play :playData="playData"></music-play>
	</view>
</template>

<script>
	import musicPlay from '@/components/music.vue'
	import $http from '@/config/requestConfig.js';
	import {
		setPay,
		setPayAssign,setWXPay
	} from '@/config/utils';
	import {
		mapState
	} from 'vuex';
	export default {
		data() {
			return {
				isAndorid:true,  // 操作系统
				playData:{},
				typeId: 0,
				shangIDNum: 0,
				cartIDNum: [],
				cartList: [],
				userMes:{}, // 用户信息
				amount:null,   // 商品总价
				addressList: [],
				adressMoRen: {},
				adressMoRenPath:"",
				adressMoRIndex: 0,
				youhuiList: [],
				addressId:null,
				youhuiContent: {},
				youhuiIndex: '',
				dizhiShow: false,
				youhuiShow: false,
				totalPrice: 0,
				isSend:'0',
				farePrice: 0,
				realPrice: 0,
				bookid:null,
				payType: 1,
				nowClick: true,
				paylist: [{
						title: '支付宝',
						id: 2,
						img: '../../static/icon/pay_1.png'
					},					
					{
						title: '微信',
						id: 1,
						img: '../../static/icon/pay_2.png'
					},
					{
							title: '疯币购买',
							id: 4,
							img: '../../static/icon/oder_chong.png'
						},
					// {
					// 	title: 'ios内购',
					// 	id: 3,
					// 	img: '../../static/icon/pay_2.png'
					// }
				],
				paylistIos: [{
						title: '支付宝',
						id: 2,
						img: '../../static/icon/pay_1.png'
					},					
					// {
					// 	title: '微信',
					// 	id: 1,
					// 	img: '../../static/icon/pay_2.png'
					// },
					{
							title: '疯币购买',
							id: 4,
							img: '../../static/icon/oder_chong.png'
						},
					// {
					// 	title: 'ios内购',
					// 	id: 3,
					// 	img: '../../static/icon/pay_2.png'
					// }
				],
			}
		},
		onLoad(e) {
			
			// if (e.type == 1) {
			// 	this.typeId = 1
			// 	this.cartIDNum = JSON.parse(e.list);
			// } 
			// if (e.type == 2) {
				this.typeId = 0
			
				this.bookid = e.list
			// }
		//	this.getYunFei()
			
		},
		onShow() {
			console.log('进来了这个页面')
			this.getProid()
			// return false
			// if (this.typeId == 1) {
			// 	this.getCartList()
				
			// } else if (this.typeId == 0) {
			// 	this.getShangList(this.shangIDNum);				
			// }			
			// this.getData()
			// this.getOS()
		},
		computed: {
			...mapState(['userInfo']),
		},
		components:{
			musicPlay	
		},
		methods: {
			// 根据bookid查询商品id
			getProid(){
				this.$http
					.post('book/shopproduct/bookinfo/' + this.bookid)
					.then(res => {
						if (res.code == 0) {
						    this.shangIDNum = res.shopProduct.productId
						//	console.log(res,'详情res')
						this.getShangList(this.shangIDNum);	
						this.getData()
						this.getOS()
						}
						
					});
			},
			// 获得操作系统
			getOS(){
				let oprateOs = ''
				oprateOs = uni.getSystemInfoSync().platform
				// console.log(oprateOs)
				if(oprateOs == 'android'){
					this.isAndorid = true
				}else{
					this.isAndorid = false
				}
			},
			// 充值疯币
			buPoint() {
				uni.navigateTo({
					url: '../peanut/reCharge'
				});
			},
			getData() {
				let that = this
				// 获取个人信息
			// 用户详情
			if (this.userInfo.id != undefined) {
				this.$http
					.post('book/user/info/' + this.userInfo.id)
					.then(res => {
						this.userMes = res.user
						// consol.log(this.userMes.peanutCoin,'呼呼')
						if (this.userMes.vip != 0) {
							this.typeFen = 2
						}
					});
			}
			},
			// 获取地址列表
			getUserAddress() {
				this.$http
					.post(`book/useraddress/getUserAddress?userId=${this.userInfo.id}`)
					.then(res => {
						if (res.code == 0) {
							if (res.list.length != 0) {
								this.addressList = res.list
								// console.log(this.addressList,'地址列表')
								this.adressMoRen = this.addressList[this.adressMoRIndex]
								// console.log(this.adressMoRen, '默认')
								if(this.adressMoRen != {}){
									// console.log('运费之前')
									this.getYunFei()
								}else{
									this.getUserAddress()
								}
							}
						}
					})
			},
			goPoinBuy(){
				if(this.realPrice > this.userMes.peanutCoin){
					uni.showToast({
						title:'疯币不足，请充值',
						icon: 'none',
						duration: 2000
					})
					return 
				}else{
					this.goBuyJie()
				}
			},
			// 获取优惠券列表
			getCourpe() {
				let proId = ''
				for (let i = 0; i < this.cartList.length; i++) {
					if (i == this.cartList.length - 1) {
						proId = proId + this.cartList[i].productId
					} else {
						proId = proId + this.cartList[i].productId + ','
					}
				}
				let allprice = 0;
				this.cartList.forEach((item, index) => {
					let price = 0;
					price = item.productAmount * item.price;
					allprice += price
				})
				this.amount = allprice  // 商品总价
				this.allPrice()
				// '&products=' + proId +    //商品id
				this.$http
					.post('book/couponhistory/appGetUserCoupon?userId=' + this.userInfo.id + '&amount=' + this.amount + '&type=0')
					.then(res => {
						this.youhuiList = res.userCoupons
					});
			},

			// 获取商品详情
			getShangList(e) {
				this.cartList = []
				this.$http
					.post('book/shopproduct/info/' + e)
					.then(res => {
						let prodCont = {}
						prodCont.productId = res.shopProduct.productId
						prodCont.image = res.shopProduct.productImages
						prodCont.productName = res.shopProduct.productName
						prodCont.productAmount = 1
						if(res.shopProduct.activityPrice && res.shopProduct.activityPrice > 0){
							prodCont.price = res.shopProduct.activityPrice
						}else{
							prodCont.price = res.shopProduct.price
						}
						prodCont.weight = res.shopProduct.weight
						this.cartList.push(prodCont)						
						this.getCourpe()
						this.getUserAddress()
						//this.getYunFei()
						// this.getYunFei()
					})
			},

			// 获取购物车列表
			getCartList() {
				this.cartList = []
				this.$http
					.post(`book/ordercart/getCartList?userId=${this.userInfo.id}`)
					.then(res => {
						for (let i = 0; i < this.cartIDNum.length; i++) {
							this.cartList.push(res.cartList[this.cartIDNum[i]])
						}
						// console.log(this.cartList, '购物车列表')
						this.getCourpe()
						this.getUserAddress()
						
					})
			},
			// 获取运费
			getYunFei(){					
				let key = []
				let dataToString = ''
				// console.log(this.adressMoRen, '默认地址')				
				this.cartList.forEach((item, index) => {					
					key.push({productsid: item.productId, productAmount:item.productAmount})
					dataToString = dataToString.concat(item.productId+"="+item.productAmount+"&")
				})	
				console.log(this.adressMoRen.areaidpath,dataToString,'this.adressMoRen.areaidpath')
				$http.request({
					url: "book/buyorder/getTransPrice/" + this.adressMoRen.areaidpath + "?" + dataToString,
					method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档		
					data:{
						loadAnimate:'none', // 请求加载动画
					} ,
					header: { //默认 无 说明：请求头
						'Content-Type': 'application/json'
					},
				}).then(res => {
					if (res.code == 0) {
						this.farePrice = res.price
					}else{
						this.farePrice = 0
					}
					this.allPrice()
				})
			},	

			// 总价
			allPrice() {
				let allprice = 0;
				this.cartList.forEach((item, index) => {
					let price = 0;
					if(item.activityPrice && item.activityPrice > 0){
						price = item.productAmount * item.activityPrice;
					}else{
						price = item.productAmount * item.price;
					}
					allprice += price
				})				
				this.totalPrice = allprice
				if (this.youhuiContent.id != undefined) {
					this.realPrice = this.totalPrice - this.youhuiContent.coupons.couponAmount
				} else {
					this.realPrice = this.totalPrice
				}
				this.realPrice = this.realPrice + this.farePrice
			},
			// 超出阈值时
			overlimit(){
				uni.showToast({
					title:'超出商品数量',
					icon: 'error',
					duration: 1000
				})
			},
			// 修改数量
			valChange(e, item) {
				let productItem = {}
				productItem = item
				productItem.productAmount = e.value
				this.updateCart(productItem)
				this.$nextTick(()=>{
					this.getYunFei()
					this.getCourpe()
				})
				
			},

	// 更新购物车
	updateCart(shagnpin){				
		// 已在购物车中添加
		$http.request({
			url: "book/ordercart/update",
			method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档
			data: shagnpin,
			header: { //默认 无 说明：请求头
				'Content-Type': 'application/json'
			}
		}).then(res => {
			if (res.code == 0) {
				// uni.showToast({
				// 	title: '加入购物车成功',
				// 	duration: 1000,
				// });
			}
		})
	},
			// 更改地址
			choseDizhi(e) {				
				this.adressMoRIndex = e
				this.adressMoRen = this.addressList[this.adressMoRIndex]
				console.log(this.adressMoRen)
				this.dizhiShow = false
				this.getYunFei()
			},

			// 添加地址
			toAddress() {
				uni.navigateTo({
					url: '/pages/user/addAddress?type=0&index=0'
				})
			},

			// 选择优惠券
			choseYouhui(e) {
				this.youhuiIndex = e
				this.youhuiContent = this.youhuiList[this.youhuiIndex]
				this.allPrice()
				this.youhuiShow = false
			},
			// 提交结算
			goBuyJie() {	
				if(this.addressList.length == 0) {
					this.dizhiShow = true          // 如果没有地址信息
				}
				if (!this.nowClick) {
					return
				}
				this.nowClick = false
				setTimeout(() => {
					this.nowClick = true
				}, 5000)
				let youPre = {
					id: '',
					coupons: {
						amount: 0,
						name: ''
					}
				};
				if (this.youhuiContent.id != undefined) {
					youPre = this.youhuiContent
				}
				let xiaBiao = [];
				for (let i = 0; i < this.cartList.length; i++) {
					xiaBiao.push({
						productId: this.cartList[i].productId,
						quantity: this.cartList[i].productAmount
					})
				}
				let data = {
					buyType: this.typeId, //0- 商品页直接下单  1- 购物车结算
					userId: this.userInfo.id, //下单人ID
					shippingUser: this.adressMoRen.username, //收货人姓名
					userPhone: this.adressMoRen.userphone, //收货人手机号
					province: this.adressMoRen.areaidpathtext.split(' ')[0], //省
					city: this.adressMoRen.areaidpathtext.split(' ')[1], //市
					district: this.adressMoRen.areaidpathtext.split(' ')[2], //区
					address: this.adressMoRen.useraddress, //地址
					paymentMethod: this.payType, //支付方式   2支付宝，1微信，3ios内购    4，疯币购买
					orderMoney: this.totalPrice, //订单金额
					realMoney: this.realPrice, //实收金额
					shippingMoney: this.farePrice, //运费
					couponId: youPre.id, //优惠券Id
					isSend: this.isSend,
					couponName: youPre.coupons.name, //优惠券名称
					districtMoney: youPre.coupons.amount, //优惠金额
					orderStatus: 0, //订单状态
					products: xiaBiao, //订单列表
					orderType: "order", //订单类型
					addressId:this.adressMoRen.addressid    // 地址ID
				}				
				$http.request({
					// url: "book/buyorder/save",
					url: "book/buyorder/buysave",
					method: "POST", // POST、GET、PUT、DELETE，具体说明查看官方文档
					data,
					header: { //默认 无 说明：请求头
						'Content-Type': 'application/json'
					},
				}).then(res => {
					if (res.code == 0) {
						if (res.orderSn == null) {
							uni.showToast({
								title: "失败,请重新下单",
								icon: "none",
								image: '../../static/icon/ic_close.png'
							});
						} else {
						 if(this.payType == 2){
							 // 常规支付
							uni.showToast({
								title: "正在支付",
								icon: "loading"								
							});
							setPay({
								typePay: 'alipay',
								subject: 'order',
								totalAmount: res.money,
								type: 2,
								relevanceoid: res.orderSn,
								customerId: this.userInfo.id,
							}, res => {
								if (res.success) {
									uni.showToast({
										title: "支付成功"
									});
									setTimeout(() => {
										uni.switchTab({
											url: './orderList'
										});
										// uni.navigateTo({
										// 	url: './orderList'
										// });
									}, 1000)
								} else {
									uni.showToast({
										title: "支付失败",
										icon: "none",
										image: '../../static/icon/ic_close.png'
									});
									// setTimeout(() => {
										
									// 	uni.navigateTo({
									// 		url: './orderList'
									// 	});
									// }, 1000)
								}
							})
							}else if(this.payType == 1){
								// 微信支付
								let data1 = {
									orderSn:res.orderSn,
									buyOrderId: null,	
									totalAmount: res.money							
								}
								setWXPay(data1,res => {
									if (res.success) {
										uni.showToast({
											title: "支付成功"
										});
										setTimeout(() => {
											uni.switchTab({
												url: './orderList'
											});
										}, 1000)
									} else {	
										console.log(res)
										if(res.data.errMsg.indexOf('User canceled') != -1){
											uni.showToast({
												title: "用户取消支付",
												icon: "none",
												image: '../../static/icon/ic_close.png'
											});
										}else{
										uni.showToast({
											title: "支付失败",
											icon: "none",
											image: '../../static/icon/ic_close.png'
										});
										}
									}
								})
							}else if(this.payType == 4){
								// 疯币支付
								uni.showToast({
									title: "购买成功",
									icon: "success"								
								});
								setTimeout(() => {
									uni.switchTab({
										url: './orderList'
									});
								}, 1000)
							}
						}


					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.addShouhuo {
		padding: 30rpx 50rpx 30rpx 100rpx;
		background-color: #fff;
		border-top: 1px solid #eee;
		border-bottom: 2px dashed #b2e9d7;
		margin: 0 0 20rpx 0;
		font-size: 35rpx;

	}

	.adDefault {
		padding: 30rpx 50rpx 30rpx 100rpx;
		background-color: #fff;
		border-top: 1px solid #eee;
		border-bottom: 2px dashed #b2e9d7;
		margin: 0 0 20rpx 0;
		position: relative;

		.defalTop {
			.userName {
				font-size: 35rpx;
				font-weight: bold;
				margin-right: 30rpx;
			}

			.userTel {
				font-size: 25rpx;
				color: #888;
			}


			.userMoren {
				border: 1px solid #fd6004;
				color: #fd6004;
				padding: 3rpx 10rpx;
				font-size: 22rpx;
				border-radius: 10rpx;
				margin: 0 0 0 20rpx;
			}

		}

		.defalBottom {
			.userAddress {
				font-size: 32rpx;
				line-height: 40rpx;
			}
		}

		.defalLeft {
			position: absolute;
			left: 30rpx;
			top: 55rpx;
		}

		.defalRight {
			position: absolute;
			right: 10rpx;
			top: 60rpx;
		}
	}

	.cartItem {
		padding: 10rpx 20rpx 10rpx 30rpx;
		border-bottom: 1px solid #eee;
		display: flex;
		align-items: center;
		background-color: #fff;


		.cartContent {
			flex: 1;
			display: flex;

			image {
				width: 150rpx;
				height: 180rpx;
				border-radius: 10rpx;
				padding: 10rpx;
				margin-right: 15rpx;
			}

			.itemCenter {
				flex: 1;
				flex-direction: column;
				justify-content: space-around;
			}

			.cartTitle {
				font-size: 30rpx;
				margin: 35rpx 0 20rpx 0;
			}

			.itemPrice {
				font-size: 28rpx;
				display: flex;
				justify-content: space-between;
			}
		}
	}

	.youhui_quan {
		margin: 20rpx 0 0 0;
		padding: 30rpx 40rpx 0 40rpx;
		background-color: #fff;
		border-bottom: 1px solid #eee;


		.yq_alljia {
			text {
				float: right;
				color: #bf0c0c;
			}
		}

		.yq_youhui {
			.yqLeft {
				display: inline-block;
				margin-right: 10rpx;
			}

			.yqRight {
				float: right;
			}

			.dagnqian {
				float: right;
				font-size: 22rpx;
				background-color: #dd1919;
				color: #fff;
				border-radius: 20rpx;
				padding: 5rpx 10rpx;
			}
		}

		.yq_yunfei {
			.yqLeft {
				display: inline-block;
				margin-right: 10rpx;
			}

			text {
				float: right;
			}
		}
	}

	.youhui_quan>view {
		font-size: 32rpx;
		padding-bottom: 20rpx;
		margin-bottom: 20rpx;
		border-bottom: 1px solid #ededed;
	}


	.zhif_fangsh {
		margin: 20rpx 0 120rpx 0;
		padding: 30rpx 40rpx 0 40rpx;
		background-color: #fff;
		border-bottom: 1px solid #eee;
		padding-bottom:90rpx;
		.zhif_radio {

			.zhif_xuanx {
				font-size: 32rpx;
				padding-bottom: 20rpx;
				margin-bottom: 20rpx;
				border-bottom: 1px solid #ededed;

				image {
					width: 40rpx;
					height: 40rpx;
					display: inline-block;
					margin-right: 20rpx;
					vertical-align: bottom;
				}
			}

		}



	}

	.footer {
		width: 100%;
		height: 100rpx;
		background-color: #fff;
		border-top: 1px solid #eee;
		display: flex;
		justify-content: space-between;
		align-items: center;
		position: fixed;
		bottom: 0%;

		.commodityPrice {
			font-size: 40rpx;
			color: #bf0c0c;
			font-weight: 700;
			margin-left: 40rpx;

			span {
				font-size: 15px;
			}
		}

		.operate {
			display: flex;

			.goBuy {
				font-size: 32rpx;
				color: #fff;
				padding: 32rpx 60rpx;
				letter-spacing: 0.8px;
				background-color: #a53008;
			}
		}
	}


	.tanchu {
		padding: 40rpx 30rpx 40rpx 30rpx;
		position: relative;


		.dp_title {
			font-size: 32rpx;
			margin-bottom: 50rpx;
			color: #555;
			text-align: center;
			font-weight: bold;
		}

		.dp_add {
			position: absolute;
			top: 40rpx;
			right: 30rpx;
			font-size: 22rpx;
			background-color: #fd6004;
			color: #fff;
			border-radius: 10rpx;
			padding: 5rpx 10rpx;

			.u-icon {
				display: inline-block;
				margin-right: 5rpx;
			}
		}

		.addressItem {
			border: 2px dashed #d9d9d9;
			border-radius: 10rpx;
			width: 100%;
			display: flex;
			padding: 20rpx 10rpx;
			margin: 25rpx 0 0 0;
			align-items: center;
			background-color: #fff;

			.addrContent {
				margin-left: 40rpx;
				flex: 1;

				.addrContentTop {
					display: flex;
					align-items: flex-end;
					margin: 0 0 15rpx 0;
					position: relative;

					.userName {
						font-size: 35rpx;
						font-weight: bold;
						margin-right: 30rpx;
					}

					.userTel {
						font-size: 25rpx;
						color: #888;
					}

					.userMoren {
						border: 1px solid #fd6004;
						color: #fd6004;
						padding: 3rpx 10rpx;
						font-size: 22rpx;
						border-radius: 10rpx;
						margin: 0 0 0 20rpx;
					}


					.chooseCheck {
						position: absolute;
						top: 3rpx;
						right: 6rpx;
					}
				}

				.addrContentBottom {
					font-size: 32rpx;
				}
			}
		}


		.addressItem.addItem_style {
			border-color: #fd6004;
		}

		.youhuiItem {
			border: 1px solid #d9d9d9;
			border-radius: 10rpx;
			width: 100%;
			display: flex;
			padding: 20rpx 10rpx;
			margin: 25rpx 0 0 0;
			align-items: center;
			background-color: #fff;
			font-size: 30rpx;
		}

		.youhuiItem>view {
			float: left;
		}

		.youhuiItem.youItem_style {
			border-color: #fd6004;
		}
	}
	.chongBtn {
		background-color: #54a966;
		color: #fff !important;
		margin-left: 20rpx;
		border-radius: 10rpx;
		padding: 2rpx 10rpx;
		font-size: 20rpx;
		display: inline-block; 
	}
</style>
