groupon-wx/pages/groupbuying_details/order_details/index.vue

<template>
	<view :style="colorStyle">

		<view class="all-products-body" v-for="(item, index) in grouponOrderData.goodsInfos" :key="index">
			<view class="all-products-item">
				<image
					:src="item.goodsCover"
					mode="scaleToFill" />

				<view class="all-products-item-content">
					<view class="all-products-item-content-t">
						{{item.goodsName}}
					</view>
					<view class="all-products-item-content-b">
						<view style="display:flex;">
							<text class="red"> ¥{{item.discountPrice}}</text>
						</view>

						<view>
							<u-number-box :min="1" v-model="grouponOrderData.goodsInfos[index].num" @change="valChange"></u-number-box>
						</view>
					</view>
				</view>
			</view>
		</view>


		<view class='order-submission'>
			<view>

				<view class="nav acea-row">
					<view class="item font-num" :class="shippingType == 0 ? 'on' : 'on2'" @tap="addressType(0)"
						v-if='store_self_mention && is_shipping'></view>
					<view class="item font-num" :class="shippingType == 1 ? 'on' : 'on2'" @tap="addressType(1)"
						v-if='store_self_mention && is_shipping'></view>
				</view>
				<view class='address-info' @tap='onAddress'>
					<block>
						<view class="a-t">
							<view class="t1">
								自提门店
							</view>
							<view class="t2">
								更换自提网点
								<image src="http://www.gzzzyd.com/groupon/order_details/切换_面24@2x.png" mode="scaleToFill" />
							</view>
						</view>
						<view class="a-m">
							<view class="am1">
								<view class="am1-1">
									{{grouponOrderData.selfTake.name}}
								</view>
								<view class="am1-2">
									距您{{grouponOrderData.selfTake.distanceDesc}}
									<image src="http://www.gzzzyd.com/groupon/order_details/距离@2x.png" mode="scaleToFill" />
								</view>
							</view>
							<view class="am2">
								{{grouponOrderData.selfTake.address}}
							</view>
							<view class="am3">
								营业时间 {{grouponOrderData.selfTake.busStartTime}}-{{grouponOrderData.selfTake.busEndTime}}
							</view>
						</view>
						<view class="a-b">
							<view class="a-b1">
								对接团长:
								<text class="red">
									{{grouponOrderData.username}}
								</text>
							</view>
							<view class="a-b2">
								<image src="http://www.gzzzyd.com/groupon/order_details/微信@2x.png" mode="scaleToFill" />
								<image src="http://www.gzzzyd.com/groupon/order_details/电话键盘_填充@2x.png" mode="scaleToFill" />
							</view>
						</view>
					</block>

				</view>
				<view class="payment-details">
					<blok>
						<view class="p-t">
							付款明细
						</view>
						<view class="p-b-item">
							<view class="item-lable">商品金额</view>
							<view class="item-value">￥48</view>
						</view>
						<view class="p-b-item">
							<view class="item-lable">积分抵扣</view>
							<view class="item-value">￥0</view>
						</view>
						<view class="p-b-item">
							<view class="item-lable">总计金额</view>
							<view class="item-value">￥48</view>
						</view>
					</blok>
				</view>

				<productConSwiperGroupbuying class="skeleton-rect" ></productConSwiperGroupbuying>
			</view>
			<orderGoods :cartInfo="cartInfo" :is_confirm='true' :shipping_type="shippingType"></orderGoods>

			<view class='moneyList'>

				<view class='item acea-row row-between-wrapper' v-if="priceGroup.storePostage > 0">
					<view>{{ $t(`配送运费`) }}：</view>
					<view class='money'>
						{{ $t(`￥`) }}{{ (parseFloat(priceGroup.storePostage) + parseFloat(priceGroup.storePostageDiscount)).toFixed(2)
						}}
					</view>
				</view>
				<view class='item acea-row row-between-wrapper'
					v-if="priceGroup.vipPrice > 0 && userInfo.vip && !pinkId && !BargainId && !combinationId && !seckillId && !discountId">
					<view>{{ $t(`会员商品优惠`) }}：</view>
					<view class='money'>-{{ $t(`￥`) }}{{ parseFloat(priceGroup.vipPrice).toFixed(2) }}</view>
				</view>
				<view class='item acea-row row-between-wrapper' v-if="priceGroup.storePostageDiscount > 0">
					<view>{{ $t(`会员运费优惠`) }}：</view>
					<view class='money'>-{{ $t(`￥`) }}{{ parseFloat(priceGroup.storePostageDiscount).toFixed(2) }}</view>
				</view>
				<view class='item acea-row row-between-wrapper' v-if="coupon_price > 0">
					<view>{{ $t(`优惠券抵扣`) }}：</view>
					<view class='money'>-{{ $t(`￥`) }}{{ parseFloat(coupon_price).toFixed(2) }}</view>
				</view>
				<view class='item acea-row row-between-wrapper' v-if="integral_price > 0">
					<view>{{ $t(`积分抵扣`) }}：</view>
					<view class='money'>-{{ $t(`￥`) }}{{ parseFloat(integral_price).toFixed(2) }}</view>
				</view>
			</view>
			<view style='height:120rpx;'></view>
			<view class='footer acea-row row-between-wrapper'>
				<view>{{ $t(`合计`) }}:
					<text class='font-color'>{{ $t(`￥`) }}{{ parseFloat(totalPrice).toFixed(2) || 0 }}</text>
				</view>
				<view class='settlement' style='z-index:100' @tap.stop="goPay" v-if="totalPrice > 0">立即支付
				</view>
				<view class='settlement bg-color-hui' style='z-index:100' v-else>立即支付</view>
			</view>
		</view>
		<view class="alipaysubmit" v-html="formContent"></view>
<!-- 		<couponListWindow :coupon='coupon' @ChangCouponsClone="ChangCouponsClone" :openType='openType' :cartId='cartId'
			@ChangCoupons="ChangCoupons"></couponListWindow> -->
<!-- 		<addressWindow ref="addressWindow" @changeTextareaStatus="changeTextareaStatus" :news='news' :address='address'
			:pagesUrl="pagesUrl" @OnChangeAddress="OnChangeAddress" @changeClose="changeClose"></addressWindow>
		 --><!-- #ifdef MP -->
		<!-- <authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize> -->
		<!-- #endif -->
		<!-- <home v-show="!invShow"></home> -->
		<invoice-picker :inv-show="invShow" :inv-list="invList" :inv-checked="invChecked" :is-special="special_invoice"
			:url-query="urlQuery" @inv-close="invClose" @inv-change="invChange" @inv-cancel="invCancel">
		</invoice-picker>
		<payment :payMode="cartArr" :pay_close="pay_close" :isCall="false" :totalPrice="parseFloat(totalPrice).toFixed(2)"
			@changePayType="changePayType" @onChangeFun="onChangeFun" :order_id="orderKey"></payment>
		<canvas canvas-id="canvas" v-if="canvasStatus"
			:style="{ width: canvasWidth + 'px', height: canvasHeight + 'px', position: 'absolute', left: '-100000px', top: '-100000px' }"></canvas>

	</view>
</template>
<script>
import {
	getGoodsDetail, postOrderSubmit, postBeforeCheck, getUserAddressByIdAndFreight
} from "@/api/home.js";
import {
	orderConfirm,
	getCouponsOrderPrice,
	orderCreate,
	postOrderComputed,
	checkShipping,
	getGroupOrderData
} from '@/api/order.js';
import {
	getAddressDefault,
	getAddressDetail,
	invoiceList,
	invoiceOrder
} from '@/api/user.js';
import {
	openPaySubscribe
} from '@/utils/SubscribeMessage.js';
import {
	storeListApi
} from '@/api/store.js';
import {
	CACHE_LONGITUDE,
	CACHE_LATITUDE
} from '@/config/cache.js';
import couponListWindow from '@/components/couponListWindow';
import addressWindow from '@/components/addressWindow';
import orderGoods from '@/pages/goods/orderGoods/index_mall';
import home from '@/components/home';
import {
	toLogin
} from '@/libs/login.js';
import {
	mapGetters
} from "vuex";
// #ifdef MP
import authorize from '@/components/Authorize';
// #endif
import payment from '@/components/payment';
import colors from "@/mixins/color";
import productConSwiperGroupbuying from "@/components/productConSwiperGroupbuying";
export default {
	components: {
		payment,
		couponListWindow,
		productConSwiperGroupbuying,
		addressWindow,
		orderGoods,
		home,
		// #ifdef MP
		authorize
		// #endif
	},
	mixins: [colors],
	data () {
		const currentDate = this.getDate({
			format: true
		})
		return {
			confirm: '', //自定义留言
			date: this.$t(`请选择`),
			time: this.$t(`请选择`),

			canvasWidth: "",
			canvasHeight: "",
			canvasStatus: false,
			newImg: [],


			textareaStatus: true,
			//支付方式
			cartArr: [{
				"name": this.$t(`微信支付`),
				"icon": "icon-weixin2",
				value: 'weixin',
				title: this.$t(`使用微信快捷支付`),
				payStatus: 1,
			},
			],
			virtual_type: 0,
			formContent: '',
			payType: 'weixin', //支付方式
			openType: 1, //优惠券打开方式 1=使用
			active: 0, //支付方式切换
			coupon: {
				coupon: false,
				list: [],
				statusTile: this.$t(`立即使用`)
			}, //优惠券组件
			address: {
				address: false
			}, //地址组件
			addressInfo: {}, //地址信息
			pinkId: 0, //拼团id
			addressId: 0, //地址id
			couponId: 0, //优惠券id
			cartId: '', //购物车id
			BargainId: 0,
			combinationId: 0,
			seckillId: 0,
			discountId: 0,
			userInfo: {}, //用户信息
			mark: '', //备注信息
			couponTitle: this.$t(`请选择`), //优惠券
			coupon_price: 0, //优惠券抵扣金额
			useIntegral: false, //是否使用积分
			integral_price: 0, //积分抵扣金额
			integral: 0,
			usable_integral: 0,
			ChangePrice: 0, //使用积分抵扣变动后的金额
			formIds: [], //收集formid
			status: 0,
			is_address: false,
			toPay: false, //修复进入支付时页面隐藏从新刷新页面
			shippingType: 0,
			system_store: {},
			storePostage: 0,
			advanceId: 0,
			contacts: '',
			contactsTel: '',
			mydata: {},
			storeList: [],
			store_self_mention: 0,
			cartInfo: [],
			priceGroup: {},
			animated: false,
			totalPrice: 1,
			integralRatio: "0",
			pagesUrl: "",
			orderKey: "",
			// usableCoupon: {},
			offlinePostage: "",
			isAuto: false, //没有授权的不会自动授权
			isShowAuth: false, //是否隐藏授权
			from: '',
			news: 1,
			num: 0,
			// invTitle: '不开发票',
			invTitle: this.$t(`不开发票`),
			special_invoice: false,
			invoice_func: false,
			header_type: '',
			invShow: false,
			invList: [],
			invChecked: '',
			urlQuery: '',
			pay_close: false,
			noCoupon: 0,
			valid_count: 0,
			discount_id: 0,
			is_shipping: true,
			inputTrip: false,
			focus: true,
			goodsSpecId: 0,
			freight: 0,
			zoneType: 0,
			goods: [],
			organizerUserId: '',
			selfTakeId: '',
			grouponOrderData: {}
		};
	},
	computed: mapGetters(['isLogin']),
	// watch: {
	// 	startDate() {
	// 		return this.getDate('start');
	// 	},
	// 	endDate() {
	// 		return this.getDate('end');
	// 	}
	// },
	onLoad (options) {
		const goods = JSON.parse(decodeURIComponent(options.goods));
		this.goods = goods;
		this.organizerUserId = options.organizerUserId;
		this.selfTakeId = options.selfTakeId;
		this.from = 'routine'
		// if (!options.productId) return this.$util.Tips({
			// title: this.$t(`请选择要购买的商品`)
		// }, {
		// 	tab: 3,
		// 	url: 1
		// });

		if (this.isLogin && this.toPay == false) {
			this.getOrderData();
			// this.checkShipping();
			// this.getaddressInfo();
			// this.getConfirm();
			// this.$nextTick(function() {
			// 	this.$refs.addressWindow.getAddressList();
			// })
		} else {
			toLogin();
		}
	},
	/**
	 * 生命周期函数--监听页面显示
	 */
	onShow: function () {
		let _this = this
		uni.$on("handClick", res => {
			if (res) {
				_this.system_store = res.address
			}
			// 清除监听
			uni.$off('handClick');
		})
	},
	methods: {
		getOrderData() {
			let longitude = uni.getStorageSync("user_longitude"); //经度
			let latitude = uni.getStorageSync("user_latitude"); //纬度
			getGroupOrderData({
				goods: this.goods,
				organizerUserId: this.organizerUserId,
				selfTakeId: this.selfTakeId,
				longitude: longitude,
				latitude: latitude
			}).then(res => {
				this.grouponOrderData = res.data;
			}).catch(err => {
				uni.showToast({
					title: err,
					icon: 'none'
				});
			});
		},
		checkShipping () {
			let that = this;
			this.getConfirm();
			// this.getaddressInfo();
		},
		// 不开发票
		invCancel () {
			this.invChecked = '';
			this.invTitle = this.$t(`不开发票`)
			this.invShow = false;
		},
		// 选择发票
		invChange (id) {
			this.invChecked = id;
			this.invShow = false;
			const result = this.invList.find(item => item.id === id);
			let name = '';
			name += result.header_type === 1 ? this.$t(`个人`) : this.$t(`企业`);
			name += result.type === 1 ? this.$t(`普通`) : this.$t(`专用`);
			name += this.$t(`发票`);
			this.invTitle = name;
		},
		// 关闭发票
		invClose () {
			this.invShow = false;
			this.getInvoiceList()
		},
		getInvoiceList () {
			uni.showLoading({
				title: this.$t(`正在加载中`)
			})
			invoiceList().then(res => {
				uni.hideLoading();
				this.invList = res.data.map(item => {
					item.id = item.id.toString();
					return item;
				});
				const result = this.invList.find(item => item.id == this.invChecked);
				if (result) {
					let name = '';
					name += result.header_type === 1 ? this.$t(`个人`) : this.$t(`企业`);
					name += result.type === 1 ? this.$t(`普通`) : this.$t(`专用`);
					name += this.$t(`发票`);
					this.invTitle = name;
				}
			}).catch(err => {
				uni.showToast({
					title: err,
					icon: 'none'
				});
			});
		},
		/**
		 * 开发票
		 */
		goInvoice: function () {
			this.getInvoiceList()
			this.invShow = true;
			this.urlQuery =
				`new=${this.news}&cartId=${this.cartId}&pinkId=${this.pinkId}&couponId=${this.couponId}&addressId=${this.addressId}&specialInvoice=${this.special_invoice}&couponTitle=${this.couponTitle}`;
		},
		/**
		 * 授权回调事件
		 * 
		 */
		onLoadFun: function () {
			// this.getaddressInfo();
			this.getConfirm();
			//调用子页面方法授权后执行获取地址列表
			// this.$scope.selectComponent('#address-window').getAddressList();
		},
		/**
		 * 事件回调
		 *
		 */
		onChangeFun: function (e) {
			let opt = e;
			let action = opt.action || null;
			let value = opt.value != undefined ? opt.value : null;
			action && this[action] && this[action](value);
		},
		payClose: function () {
			this.pay_close = false;
		},
		goPay () {
			let that = this
			uni.showLoading({
				title: that.$t(`下单中`)
			});
			that.orderCreate()
		},
		orderCreate () {
			let that = this
			postOrderSubmit({
				distributeMode: 1,
				orderType: 1,
				orderSource: 1,
				grouponId: '1664886578504519681',
				selfTakeId: '1664586279807877110',
				goodsInfos: [{
					goodsId: '1657937702030471169',
					num: 1
				},{
					goodsId: '1630247403610845188',
					num: 1
				}]
			}).then(res => {
				that.orderKey = res.data.orderNo,
					uni.showLoading({
						title: that.$t(`下单成功`)
					});
				setTimeout(res => {
					uni.hideLoading();
					that.pay_close = true;
				}, 500)
			}).catch(err => {
				uni.hideLoading();
				return that.$util.Tips({
					title: err
				});
			});

		},
		pay_complete (type) {
			let that = this
			this.payType = type;
			// let url = '/pages/goods/order_pay_status/index?order_id=' + this.orderKey + '&msg=' + "支付成功" +
			// 			'&type=3' + '&totalPrice=' + this.totalPrice
			uni.showToast({
				title: that.$t(`支付成功`)
			})
			that.pay_close = false
			setTimeout(res => {
				uni.navigateBack({
					delta: 1
				})
			}, 1000)
			// this.SubOrder();
		},
		payCheck (type) {
			this.payType = type;
			// console.log(this.payType);
			// let url = '/pages/goods/order_pay_status/index?order_id=' + this.orderKey + '&msg=' + "支付成功" +
			// 			'&type=3' + '&totalPrice=' + this.totalPrice
			// uni.showToast({
			// 	title: that.$t(`支付成功`)
			// })
			// setTimeout(res => {
			// 	uni.redirectTo({
			// 		url: url
			// 	})
			// }, 1000)
			// this.SubOrder();
		},
		/**
		 * 获取门店列表数据
		 */
		getList: function () {
			let longitude = uni.getStorageSync("user_longitude"); //经度
			let latitude = uni.getStorageSync("user_latitude"); //纬度
			let data = {
				latitude: latitude, //纬度
				longitude: longitude, //经度
				page: 1,
				limit: 10
			}
			storeListApi(data).then(res => {
				let list = res.data.list.list || [];
				this.$set(this, 'storeList', list);
				this.$set(this, 'system_store', list[0]);
			}).catch(err => { })
		},
		// 关闭地址弹窗；
		changeClose: function () {
			this.$set(this.address, 'address', false);
		},
		/*
		 * 跳转门店列表
		 */
		showStoreList: function () {

			let _this = this
			if (this.storeList.length > 0) {
				uni.navigateTo({
					url: '/pages/goods/goods_details_store/index'
				})
			}
		},
		changePayType (type) {
			this.payType = type
			// this.computedPrice()
		},
		computedPrice: function () {
			let that = this
			// postBeforeCheck({
			// 	goodsSpecId: this.goodsSpecId,
			// 	num: this.num,
			// 	userAddressId: this.addressId
			// }).then(function (res) {
			// 	//验证是否可下单
			// 	if (res.code == 200) {
			// 		that.freight = res.data.freight - 0
			// 		that.totalPrice = res.data.freight - 0
			// 		that.cartInfo.forEach(e => {
			// 			that.totalPrice += e.salePrice - 0
			// 		})
			// 	} else {
			// 		this.totalPrice = 0
			// 		that.$util.Tips({
			// 			title: that.$t(`所选商品属性不支持下单`),
			// 			success: () => {
			// 				// that.getCartCount(true);
			// 			},
			// 		});
			// 	}
			// })
		},
		addressType (e) {
			let index = e;
			let that = this;
			if (this.shippingType == parseInt(index)) return
			this.shippingType = parseInt(index);
			if (index == 1) {
				// #ifdef H5
				if (that.$wechat.isWeixin()) {
					that.$wechat.location().then(res => {
						uni.setStorageSync('user_latitude', res.latitude);
						uni.setStorageSync('user_longitude', res.longitude);
						this.getList()
					}).catch(err => {
						this.getList()
					})
				} else {
					// #endif	
					uni.getLocation({
						type: 'wgs84',
						success: (res) => {
							uni.setStorageSync('user_latitude', res.latitude);
							uni.setStorageSync('user_longitude', res.longitude);
							this.getList()
						},
						complete: () => {
							this.getList()
						}
					});
					// #ifdef H5	
				}
				// #endif
			};
			this.$nextTick(e => {
				this.getConfirm();
				this.computedPrice();
			})
		},
		bindPickerChange: function (e) {
			let value = e.detail.value;
			this.shippingType = value;
			this.computedPrice();
		},
		ChangCouponsClone: function () {
			this.$set(this.coupon, 'coupon', false);
		},
		changeTextareaStatus: function () {
			for (let i = 0, len = this.coupon.list.length; i < len; i++) {
				this.coupon.list[i].use_title = '';
				this.coupon.list[i].is_use = 0;
			}
			this.textareaStatus = true;
			this.status = 0;
			this.$set(this.coupon, 'list', this.coupon.list);
		},
		/**
		 * 处理点击优惠券后的事件
		 * 
		 */
		ChangCoupons: function (e) {
			// this.usableCoupon = e
			// this.coupon.coupon = false
			let index = e,
				list = this.coupon.list,
				couponTitle = this.$t(`请选择`),
				couponId = 0;
			for (let i = 0, len = list.length; i < len; i++) {
				if (i != index) {
					list[i].use_title = '';
					list[i].is_use = 0;
				}
			}
			if (list[index].is_use) {
				//不使用优惠券
				list[index].use_title = '';
				list[index].is_use = 0;
			} else {
				//使用优惠券
				list[index].use_title = this.$t(`不使用`);
				list[index].is_use = 1;
				couponTitle = list[index].coupon_title;
				couponId = list[index].id;
			}
			this.couponTitle = couponTitle;
			this.couponId = couponId;
			this.$set(this.coupon, 'coupon', false);
			this.$set(this.coupon, 'list', list);
			this.computedPrice();
		},
		/**
		 * 使用积分抵扣
		 */
		ChangeIntegral: function () {
			this.useIntegral = !this.useIntegral;
			this.computedPrice();
		},
		/**
		 * 选择地址后改变事件
		 * @param object e
		 */
		OnChangeAddress: function (e) {
			this.textareaStatus = true;
			this.addressId = e;
			this.address.address = false;
			this.getConfirm()
			// this.getaddressInfo();
			this.computedPrice();
		},
		bindHideKeyboard: function (e) {
			this.mark = e.detail.value;
		},
		/**
		 * 获取当前订单详细信息
		 * 
		 */
		getConfirm: function () {
			let that = this;
			// uni.showLoading({
			// 	title: that.$t(`正在加载中`),
			// 	mask: true
			// });
			// getGoodsDetail({ id: that.cartId })
			// 	.then((res) => {
			// 		that.cartInfo = []
			// 		let porject = res.data
			// 		that.zoneType = porject.zoneType
			// 		//找出选择的规格
			// 		porject.goodsSpecList.forEach(element => {
			// 			if (that.goodsSpecId == element.id) {
			// 				porject.unit = element.spceName
			// 			}
			// 		});
			// 		porject.totalSales = that.num
			// 		// 计算总价
			// 		that.totalPrice = (that.num - 0) * (porject.salePrice - 0) + that.freight - 0
			// 		that.cartInfo.push(porject)
			// 		uni.hideLoading()
			// 	})
			// 	.catch((err) => {
			// 		uni.hideLoading()
			// 		return this.$util.Tips({
			// 			title: err
			// 		});
			// 	});
		},
		/*
		 * 提取砍价和拼团id
		 */
		getBargainId: function () {
			let that = this;
			let cartINfo = that.cartInfo;
			let BargainId = 0;
			let combinationId = 0;
			let discountId = 0;
			let advanceId = 0;
			cartINfo.forEach(function (value, index, cartINfo) {
				BargainId = cartINfo[index].bargain_id,
					combinationId = cartINfo[index].combination_id,
					discountId = cartINfo[index].discount_id,
					advanceId = cartINfo[index].advance_id
			})
			that.$set(that, 'BargainId', parseInt(BargainId));
			that.$set(that, 'combinationId', parseInt(combinationId));
			that.$set(that, 'discountId', parseInt(discountId));
			that.$set(that, 'advanceId', parseInt(advanceId));
			if (that.cartArr.length == 3 && (BargainId || combinationId || that.seckillId || discountId)) {
				that.cartArr[2].payStatus = 0;
				that.$set(that, 'cartArr', that.cartArr);
			}
		},
		/**
		 * 获取当前金额可用优惠券
		 * 
		 */
		getCouponList: function () {
			let that = this;
			let data = {
				cartId: this.cartId,
				'new': this.news
			}
			getCouponsOrderPrice(this.totalPrice, data).then(res => {
				that.$set(that.coupon, 'list', res.data);
				that.openType = 1;
			});
		},
		/*
		 * 获取默认收货地址或者获取某条地址信息
		 */
		getaddressInfo: function () {
			let that = this;
			// if (that.addressId) {
			// 	getUserAddressByIdAndFreight({ id: that.addressId }).then(res => {
			// 		res.data.is_default = parseInt(res.data.is_default);
			// 		that.addressInfo = res.data || {};
			// 		that.addressId = res.data.id || 0;
			// 		that.address.addressId = res.data.id || 0;
			// 	})
			// } else {
			// 	getAddressDefault().then(res => {
			// 		res.data.is_default = parseInt(res.data.is_default);
			// 		that.addressInfo = res.data || {};
			// 		that.addressId = res.data.id || 0;
			// 		that.address.addressId = res.data.id || 0;
			// 	})
			// }
		},
		payItem: function (e) {
			let that = this;
			let active = e;
			that.active = active;
			that.animated = true;
			that.payType = that.cartArr[active].value;
			that.computedPrice();
			setTimeout(function () {
				that.car();
			}, 500);
		},
		couponTap: function () {
			this.coupon.coupon = true;
			this.coupon.list.forEach((item, index) => {
				if (item.id == this.couponId) {
					item.is_use = 1
				} else {
					item.is_use = 0
				}
			})
			this.$set(this.coupon, 'list', this.coupon.list);
		},
		car: function () {
			let that = this;
			that.animated = false;
		},
		onAddress: function () {
			let that = this;
			that.textareaStatus = false;
			that.address.address = true;
			that.pagesUrl = '/pages/users/user_address_list/index?news=' + this.news + '&cartId=' + this.cartId +
				'&pinkId=' +
				this.pinkId +
				'&couponId=' +
				this.couponId;
		},
		payment (data) {
			let that = this;
			// postOrderSubmit({
			// 	distributeMode: 1,
			// 	goodsList: [{
			// 		goodsId: that.cartId,
			// 		goodsNum: that.num,
			// 		goodsSpecIds: that.goodsSpecId
			// 	}],
			// 	payType: 1,
			// 	remark: that.remark,
			// 	settleType: 1,
			// 	userAddressId: that.addressInfo.id,
			// 	wlPrice: that.freight
			// }).then(res => {
			// 	let status = "",
			// 		orderId = res.data.orderNo,
			// 		jsConfig = {},
			// 		goPages = '/pages/goods/order_pay_status/index?order_id=' + orderId + '&msg=' + "支付成功" +
			// 			'&type=3' + '&totalPrice=' + this.totalPrice
			// 			that.toPay = true;
			// 			uni.requestPayment({
			// 				provider: 'wxpay',
			// 				orderInfo: jsConfig,
			// 				success: (e) => {
			// 					let url = goPages;
			// 					uni.showToast({
			// 						title: that.$t(`支付成功`)
			// 					})
			// 					setTimeout(res => {
			// 						uni.redirectTo({
			// 							url: url
			// 						})
			// 					}, 2000)
			// 				},
			// 				fail: (e) => {
			// 					let url = '/pages/goods/order_pay_status/index?order_id=' +
			// 						orderId +
			// 						'&msg=' + that.$t(`支付失败`);
			// 					uni.showModal({
			// 						content: that.$t(`支付失败`),
			// 						showCancel: false,
			// 						success: function (res) {
			// 							if (res.confirm) {
			// 								uni.redirectTo({
			// 									url: url
			// 								})
			// 							} else if (res.cancel) { }
			// 						}
			// 					})
			// 				},
			// 				complete: () => {
			// 					uni.hideLoading();
			// 				},
			// 			});
			// 	switch (status) {
			// 		case 'ORDER_EXIST':
			// 		case 'EXTEND_ORDER':
			// 		case 'PAY_ERROR':
			// 			uni.hideLoading();
			// 			return that.$util.Tips({
			// 				title: res.msg
			// 			}, {
			// 				tab: 5,
			// 				url: goPages
			// 			});
			// 			break;
			// 		case 'SUCCESS':
			// 			uni.hideLoading();
			// 			if ((that.BargainId || that.combinationId || that.pinkId || that.seckillId || that
			// 				.discountId) && data.payType != 'friend')
			// 				return that.$util.Tips({
			// 					title: res.msg,
			// 					icon: 'success'
			// 				}, {
			// 					tab: 4,
			// 					url: goPages
			// 				});
			// 			return that.$util.Tips({
			// 				title: res.msg,
			// 				icon: 'success'
			// 			}, {
			// 				tab: 4,
			// 				url: data.payType == 'friend' ? friendPay : goPages
			// 			});
			// 			break;
			// 		case 'WECHAT_PAY':
			// 			that.toPay = true;
			// 			// #ifdef MP
			// 			/* that.toPay = true; */
			// 			let mp_pay_name = ''
			// 			if (uni.requestOrderPayment) {
			// 				mp_pay_name = 'requestOrderPayment'
			// 			} else {
			// 				mp_pay_name = 'requestPayment'
			// 			}
			// 			uni[mp_pay_name]({
			// 				timeStamp: jsConfig.timestamp,
			// 				nonceStr: jsConfig.nonceStr,
			// 				package: jsConfig.package,
			// 				signType: jsConfig.signType,
			// 				paySign: jsConfig.paySign,
			// 				success: function (res) {
			// 					uni.hideLoading();
			// 					if (that.BargainId || that.combinationId || that.pinkId || that
			// 						.seckillId || that.discountId)
			// 						return that.$util.Tips({
			// 							title: that.$t(`支付成功`),
			// 							icon: 'success'
			// 						}, {
			// 							tab: 4,
			// 							url: goPages
			// 						});
			// 					return that.$util.Tips({
			// 						title: that.$t(`支付成功`),
			// 						icon: 'success'
			// 					}, {
			// 						tab: 5,
			// 						url: goPages
			// 					});
			// 				},
			// 				fail: function (e) {
			// 					uni.hideLoading();
			// 					return that.$util.Tips({
			// 						title: that.$t(`取消支付`)
			// 					}, {
			// 						tab: 5,
			// 						url: goPages + '&status=2'
			// 					});
			// 				},
			// 				complete: function (e) {
			// 					uni.hideLoading();
			// 					//关闭当前页面跳转至订单状态
			// 					if (res.errMsg == 'requestPayment:cancel' || e.errMsg ==
			// 						'requestOrderPayment:cancel') return that.$util
			// 							.Tips({
			// 								title: that.$t(`取消支付`)
			// 							}, {
			// 								tab: 5,
			// 								url: goPages + '&status=2'
			// 							});
			// 				},
			// 			})
			// 			// #endif
			// 			// #ifdef H5
			// 			this.$wechat.pay(res.data.result.jsConfig).then(res => {
			// 				return that.$util.Tips({
			// 					title: that.$t(`支付成功`),
			// 					icon: 'success'
			// 				}, {
			// 					tab: 5,
			// 					url: goPages
			// 				});
			// 			}).catch(res => {
			// 				if (!this.$wechat.isWeixin()) {
			// 					uni.redirectTo({
			// 						url: goPages + '&msg=' + that.$t(`支付失败`) + '&status=2'
			// 						// '&msg=支付失败&status=2'
			// 					})
			// 				}
			// 				if (res.errMsg == 'chooseWXPay:cancel') return that.$util.Tips({
			// 					title: that.$t(`取消支付`)
			// 				}, {
			// 					tab: 5,
			// 					url: goPages + '&status=2'
			// 				});
			// 			})
			// 			// #endif
			// 			// #ifdef APP-PLUS
			// 			uni.requestPayment({
			// 				provider: 'wxpay',
			// 				orderInfo: jsConfig,
			// 				success: (e) => {
			// 					let url = goPages;
			// 					uni.showToast({
			// 						title: that.$t(`支付成功`)
			// 					})
			// 					setTimeout(res => {
			// 						uni.redirectTo({
			// 							url: url
			// 						})
			// 					}, 2000)
			// 				},
			// 				fail: (e) => {
			// 					let url = '/pages/goods/order_pay_status/index?order_id=' +
			// 						orderId +
			// 						'&msg=' + that.$t(`支付失败`);
			// 					uni.showModal({
			// 						content: that.$t(`支付失败`),
			// 						showCancel: false,
			// 						success: function (res) {
			// 							if (res.confirm) {
			// 								uni.redirectTo({
			// 									url: url
			// 								})
			// 							} else if (res.cancel) { }
			// 						}
			// 					})
			// 				},
			// 				complete: () => {
			// 					uni.hideLoading();
			// 				},
			// 			});
			// 			// #endif
			// 			break;
			// 		case 'PAY_DEFICIENCY':
			// 			uni.hideLoading();
			// 			//余额不足
			// 			return that.$util.Tips({
			// 				title: res.msg
			// 			}, {
			// 				tab: 5,
			// 				url: goPages + '&status=1'
			// 			});
			// 			break;
			// 		case "WECHAT_H5_PAY":
			// 			uni.hideLoading();
			// 			that.$util.Tips({
			// 				title: that.$t(`订单创建成功`)
			// 			}, {
			// 				tab: 4,
			// 				url: goPages + '&status=0'
			// 			});
			// 			setTimeout(() => {
			// 				location.href = res.data.result.jsConfig.mweb_url;
			// 			}, 2000);
			// 			break;

			// 		case 'ALIPAY_PAY':
			// 			//#ifdef H5
			// 			if (this.from === 'weixin') {
			// 				uni.redirectTo({
			// 					url: `/pages/users/alipay_invoke/index?id=${orderId}&pay_key=${res.data.result.pay_key}`
			// 				});
			// 			} else {
			// 				uni.hideLoading();
			// 				that.formContent = res.data.result.jsConfig;
			// 				that.$nextTick(() => {
			// 					document.getElementById('alipaysubmit').submit();
			// 				})
			// 			}
			// 			//#endif
			// 			// #ifdef MP
			// 			uni.navigateTo({
			// 				url: `/pages/users/alipay_invoke/index?id=${orderId}&link=${jsConfig.qrCode}`
			// 			});
			// 			// #endif
			// 			// #ifdef APP-PLUS
			// 			uni.requestPayment({
			// 				provider: 'alipay',
			// 				orderInfo: jsConfig,
			// 				success: (e) => {
			// 					uni.showToast({
			// 						title: that.$t(`支付成功`)
			// 					})
			// 					let url = '/pages/goods/order_pay_status/index?order_id=' +
			// 						orderId +
			// 						'&msg=' + that.$t(`支付成功`);
			// 					setTimeout(res => {
			// 						uni.redirectTo({
			// 							url: url
			// 						})
			// 					}, 2000)

			// 				},
			// 				fail: (e) => {
			// 					let url = '/pages/goods/order_pay_status/index?order_id=' +
			// 						orderId +
			// 						'&msg=' + that.$t(`支付失败`);
			// 					uni.showModal({
			// 						content: that.$t(`支付失败`),
			// 						showCancel: false,
			// 						success: function (res) {
			// 							if (res.confirm) {
			// 								uni.redirectTo({
			// 									url: url
			// 								})
			// 							} else if (res.cancel) { }
			// 						}
			// 					})
			// 				},
			// 				complete: () => {
			// 					uni.hideLoading();
			// 				},
			// 			});
			// 			// #endif
			// 			break;
			// 	}
			// }).catch(err => {
			// 	uni.hideLoading();
			// 	return that.$util.Tips({
			// 		title: err
			// 	});
			// });
		},
		clickTextArea () {
			this.$refs.textarea.focus()
		},
		SubOrder (e) {
			let that = this,
				data = {};

			if (!that.payType) return that.$util.Tips({
				title: that.$t(`请选择支付方式`)
			});
			if (!that.addressId && !that.shippingType && !that.virtual_type) return that.$util.Tips({
				title: that.$t(`请选择收货地址`)
			});
			if (that.shippingType == 1) {
				if (that.contacts == "" || that.contactsTel == "") {
					return that.$util.Tips({
						title: that.$t(`请填写联系人或联系人电话`)
					});
				}
				if (!/^1(3|4|5|7|8|9|6)\d{9}$/.test(that.contactsTel)) {
					return that.$util.Tips({
						title: that.$t(`请输入正确的手机号码`)
					});
				}
				if (!that.contacts) {
					return that.$util.Tips({
						title: that.$t(`请输入姓名`)
					});
				}
				if (that.storeList.length == 0) return that.$util.Tips({
					title: that.$t(`暂无门店,请选择其他方式`)
				});
			}
			for (var i = 0; i < that.confirm.length; i++) {
				let data = that.confirm[i]
				if (data.status) {
					if (data.label === 'text' || data.label === 'data' || data.label === 'time' || data.label ===
						'id') {
						if (!data.value.trim()) {
							return uni.showToast({
								title: that.$t(`请输入`) + `${data.title}`,
								icon: 'none'
							});
						}
					}
					if (data.label === 'number') {
						if (data.value <= 0) {
							return uni.showToast({
								title: that.$t(`请输入`) + `${data.title}`,
								icon: 'none'
							});
						}
					}
					if (data.label === 'email') {
						if (!/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/.test(data.value)) {
							return uni.showToast({
								title: that.$t(`请输入正确的`) + `${data.title}`,
								icon: 'none'
							});
						}
					}
					if (data.label === 'phone') {
						if (!/^1(3|4|5|7|8|9|6)\d{9}$/i.test(data.value)) {
							return uni.showToast({
								title: that.$t(`请输入正确的`) + `${data.title}`,
								icon: 'none'
							});
						}
					}
					if (data.label === 'img') {
						if (!data.value.length) {
							return uni.showToast({
								title: that.$t(`请上传`) + `${data.title}`,
								icon: 'none'
							});
						}
					}
				}
			}
			data = {
				custom_form: that.confirm,
				real_name: that.contacts,
				phone: that.contactsTel,
				addressId: that.addressId,
				formId: '',
				couponId: that.couponId,
				payType: that.payType,
				useIntegral: that.useIntegral,
				bargainId: that.BargainId,
				combinationId: that.combinationId,
				discountId: that.discountId,
				pinkId: that.pinkId,
				advanceId: that.advanceId,
				seckill_id: that.seckillId,
				mark: that.mark,
				store_id: that.system_store ? that.system_store.id : 0,
				'from': that.from,
				shipping_type: that.$util.$h.Add(that.shippingType, 1),
				'new': that.news,
				'invoice_id': that.invChecked,
				// #ifdef H5
				quitUrl: location.protocol + '//' + location.hostname +
					'/pages/goods/order_pay_status/index?' +
					'&type=3' + '&totalPrice=' + this.totalPrice
					// #endif
					// #ifdef APP-PLUS
					quitUrl: '/pages/goods/order_details/index?order_id=' + this.order_id
				// #endif
			};
			if (data.payType == 'yue' && parseFloat(that.userInfo.now_money) < parseFloat(that.totalPrice))
				return that.$util.Tips({
					title: that.$t(`余额不足`)
				});
			uni.showLoading({
				title: that.$t(`订单支付中`)
			});
			// #ifdef MP
			openPaySubscribe().then(() => {
				that.payment(data);
			});
			// #endif
			// #ifndef MP
			that.payment(data);
			// #endif
		},
		bindDateChange: function (e, index) {
			this.confirm[index].value = e.target.value
		},
		bindTimeChange: function (e, index) {
			this.confirm[index].value = e.target.value
		},
		getDate (type) {
			const date = new Date();
			let year = date.getFullYear();
			let month = date.getMonth() + 1;
			let day = date.getDate();

			if (type === 'start') {
				year = year - 60;
			} else if (type === 'end') {
				year = year + 2;
			}
			month = month > 9 ? month : '0' + month;
			day = day > 9 ? day : '0' + day;
			return `${year}-${month}-${day}`;
		},
		uploadpic: function (index, item) {
			let that = this;
			this.canvasStatus = true
			that.$util.uploadImageChange('upload/image', function (res) {
				item.value.push(res.data.url);
			}, (res) => {
				this.canvasStatus = false
			}, (res) => {
				this.canvasWidth = res.w
				this.canvasHeight = res.h
			});
		},
		DelPic: function (index, indexs) {
			let that = this,
				pic = this.confirm[index].value;
			that.confirm[index].value.splice(indexs, 1);
			// that.$set(that, 'pics', that.pics);
		},
		inputTripClick () {
			this.inputTrip = true
			// this.$refs.trip.foucs()
		},
	}
}
</script>

<style lang="scss" scoped>
/deep/uni-checkbox[disabled] .uni-checkbox-input {
	background-color: #eee;
}

.alipaysubmit {
	display: none;
}

.order-submission .line {
	width: 100%;
	height: 3rpx;
}

.order-submission .line image {
	width: 100%;
	height: 100%;
	display: block;
}

.order-submission .address {
	padding: 28rpx 30rpx;
	background-color: #fff;
	box-sizing: border-box;
}

.order-submission .address .addressCon {
	width: 610rpx;
	font-size: 26rpx;
	color: #666;
}

.order-submission .address .addressCon .name {
	font-size: 30rpx;
	color: #282828;
	font-weight: bold;
	margin-bottom: 10rpx;
}

.order-submission .address .addressCon .name .phone {
	margin-left: 50rpx;
}

.order-submission .address .addressCon .default {
	margin-right: 12rpx;
}

.order-submission .address .addressCon .setaddress {
	color: #333;
	font-size: 28rpx;
}

.order-submission .address .iconfont {
	font-size: 35rpx;
	color: #707070;
}

.order-submission .allAddress {
	width: 100%;
	background: linear-gradient(to bottom, var(--view-theme) 0%, #f5f5f5 100%);
	padding-top: 100rpx;
	margin-bottom: 12rpx;
}

.order-submission .allAddress .nav {
	width: 710rpx;
	margin: 0 auto;
}

.order-submission .allAddress .nav .item {
	width: 355rpx;
}

.order-submission .allAddress .nav .item.on {
	position: relative;
	width: 250rpx;
}

.order-submission .allAddress .nav .item.on::before {
	position: absolute;
	bottom: 0;
	content: "快递配送";
	font-size: 28rpx;
	display: block;
	height: 0;
	width: 336rpx;
	border-width: 0 20rpx 80rpx 0;
	border-style: none solid solid;
	border-color: transparent transparent #fff;
	z-index: 2;
	border-radius: 7rpx 30rpx 0 0;
	text-align: center;
	line-height: 80rpx;
}

.order-submission .allAddress .nav .item:nth-of-type(2).on::before {
	content: "到店自提";
	border-width: 0 0 80rpx 20rpx;
	border-radius: 30rpx 7rpx 0 0;
}

.order-submission .allAddress .nav .item.on2 {
	position: relative;
}

.order-submission .allAddress .nav .item.on2::before {
	position: absolute;
	bottom: 0;
	content: "到店自提";
	font-size: 28rpx;
	display: block;
	height: 0;
	width: 400rpx;
	border-width: 0 0 60rpx 60rpx;
	border-style: none solid solid;
	border-color: transparent transparent rgba(255, 255, 255, 0.6);
	border-radius: 40rpx 6rpx 0 0;
	text-align: center;
	line-height: 60rpx;
}

.order-submission .allAddress .nav .item:nth-of-type(1).on2::before {
	content: "快递配送";
	border-width: 0 60rpx 60rpx 0;
	border-radius: 6rpx 40rpx 0 0;
}

.order-submission .allAddress .address {
	width: 710rpx;
	height: 150rpx;
	margin: 0 auto;
}

.order-submission .allAddress .line {
	width: 710rpx;
	margin: 0 auto;
}

.order-submission .wrapper .item .discount .placeholder {
	color: #ccc;
}

.placeholder-textarea {
	position: relative;

	.placeholder {
		position: absolute;
		color: #ccc;
		top: 26rpx;
		left: 30rpx;
	}
}

.order-submission .wrapper {
	background-color: #fff;
	margin-top: 13rpx;
}

.order-submission .wrapper .item {
	padding: 27rpx 30rpx;
	font-size: 30rpx;
	color: #282828;
	border-bottom: 1px solid #f0f0f0;

	.mark {
		background-color: #f9f9f9;
		width: 345px;
		height: 70px;
		border-radius: 1px;
		margin-top: 15px;
		padding: 12px 14px;
		color: #ccc;
		font-size: 28rpx;
		box-sizing: border-box;
	}

	.mark-msg {
		color: #333;
		font-size: 32rpx;
	}
}

.order-submission .wrapper .item .discount {
	font-size: 30rpx;
	color: #999;
}

.order-submission .wrapper .item .discount input {
	text-align: end;
}

.order-submission .wrapper .item .discount .iconfont {
	color: #515151;
	font-size: 30rpx;
	margin-left: 15rpx;
}

.order-submission .wrapper .item .discount .num {
	font-size: 32rpx;
	margin-right: 20rpx;
}

.order-submission .wrapper .item .shipping {
	font-size: 30rpx;
	color: #999;
	position: relative;
	padding-right: 58rpx;
}

.order-submission .wrapper .item .shipping .iconfont {
	font-size: 35rpx;
	color: #707070;
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	margin-left: 30rpx;
}

.order-submission .wrapper .item textarea {
	background-color: #f9f9f9;
	width: 690rpx;
	height: 140rpx;
	border-radius: 3rpx;
	margin-top: 30rpx;
	padding: 25rpx 28rpx;
	box-sizing: border-box;
}

.order-submission .wrapper .item .placeholder {
	color: #ccc;
	font-size: 28rpx;
}

.order-submission .wrapper .item .list {
	margin-top: 35rpx;
}

.order-submission .wrapper .item .list .payItem {
	border: 1px solid #eee;
	border-radius: 6rpx;
	height: 86rpx;
	width: 100%;
	box-sizing: border-box;
	margin-top: 20rpx;
	font-size: 28rpx;
	color: #282828;
}

.order-submission .wrapper .item .list .payItem.on {
	border-color: #fc5445;
	color: #e93323;
}

.order-submission .wrapper .item .list .payItem .name {
	width: 50%;
	text-align: center;
	border-right: 1px solid #eee;
	padding-left: 80rpx;
}

.order-submission .wrapper .item .list .payItem .name .iconfont {
	width: 44rpx;
	height: 44rpx;
	border-radius: 50%;
	text-align: center;
	line-height: 44rpx;
	background-color: #fe960f;
	color: #fff;
	font-size: 30rpx;
	margin-right: 15rpx;
}

.order-submission .wrapper .item .list .payItem .name .iconfont.icon-weixin2 {
	background-color: #41b035;
}

.order-submission .wrapper .item .list .payItem .name .iconfont.icon-zhifubao {
	background-color: #1677FF;
}

.order-submission .wrapper .item .list .payItem .tip {
	width: 49%;
	text-align: center;
	font-size: 26rpx;
	color: #aaa;
}

.order-submission .moneyList {
	margin-top: 12rpx;
	background-color: #fff;
	padding: 30rpx;
}

.order-submission .moneyList .item {
	font-size: 28rpx;
	color: #282828;
}

.order-submission .moneyList .item~.item {
	margin-top: 20rpx;
}

.order-submission .moneyList .item .money {
	color: #868686;
}

.order-submission .footer {
	width: 100%;
	height: 100rpx;
	background-color: #fff;
	padding: 0 30rpx;
	font-size: 28rpx;
	color: #333;
	box-sizing: border-box;
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 9;
}

.order-submission .footer .settlement {
	font-size: 30rpx;
	color: #fff;
	width: 240rpx;
	height: 70rpx;
	background-color: var(--view-theme);
	border-radius: 50rpx;
	text-align: center;
	line-height: 70rpx;
}

.footer .transparent {
	opacity: 0
}

.confirm {
	text-align: right;
	font-size: 22rpx;
}

.confirmImg {
	width: 100%;

	.img {
		width: 136rpx;
		height: 136rpx;
	}

	.pictrue {
		width: 136rpx;
		height: 136rpx;
		box-sizing: border-box;
		margin: 18rpx;
		margin-bottom: 35rpx;
		position: relative;
		font-size: 22rpx;
		color: #bbb;

		.del {
			position: absolute;
			top: 0;
			right: 0;
		}
	}

	.bor {
		border: 1rpx solid #ddd;
	}

}

.fontC {
	color: grey;
}

.all-products-body {
	margin-top: 30rpx;

	.all-products-item {
		display: flex;
		margin-bottom: 20rpx;
		background: #fff;

		image {
			width: 128rpx;
			height: 128rpx;
			margin-right: 20rpx;
			border: 2rpx solid #FFFFFF;
		}

		.all-products-item-content {
			flex-grow: 1;
			display: flex;
			flex-direction: column;


			.all-products-item-content-t {
				flex: 1;
				font-size: 24rpx;
				font-weight: 400;
				color: #333333;
				line-height: 40rpx;
			}

			.all-products-item-content-b {
				flex: 1;
				font-size: 28rpx;
				font-weight: 500;
				line-height: 80rpx;
				display: flex;
				justify-content: space-between;

				.red {
					display: block;
					font-size: 28rpx;
					font-weight: 500;
					color: #B22338 !important;
					margin-right: 10rpx;
				}

				.line-thr {
					display: block;
					font-size: 28rpx;
					font-weight: 400;
					color: #999999;
					text-decoration: line-through;
				}
			}
		}
	}
}


.address-info {
	padding: 30rpx 0;
	background: white;

	.a-t {
		padding: 0 30rpx;
		display: flex;
		justify-content: space-between;
		height: 44rpx;
		margin-bottom: 20rpx;

		.t1 {
			height: 44rpx;
			font-size: 32rpx;
			font-weight: 500;
			color: #111111;
			line-height: 44rpx;
		}

		.t2 {
			height: 34rpx;
			font-size: 24rpx;
			font-weight: 400;
			color: #B42A3E;
			line-height: 34rpx;

			image {
				margin-left: 30rpx;
				height: 34rpx;
				width: 34rpx;
				vertical-align: middle;
			}
		}
	}

	.a-m {
		padding: 0 30rpx;

		.am1 {
			display: flex;
			justify-content: space-between;
			margin-bottom: 20rpx;

			.am1-1 {
				height: 40rpx;
				font-size: 28rpx;
				font-weight: 400;
				color: #111111;
				line-height: 40rpx;

			}

			.am1-2 {
				height: 36rpx;
				font-size: 20rpx;
				font-weight: 400;
				color: #666666;
				line-height: 36rpx;

				image {
					margin-left: 30rpx;
					vertical-align: middle;
					height: 34rpx;
					width: 34rpx;
				}
			}
		}

		.am2 {
			margin-bottom: 20rpx;
			height: 34rpx;
			font-size: 24rpx;
			font-weight: 400;
			color: #999999;
			line-height: 34rpx;
		}

		.am3 {
			width: 248rpx;
			height: 44rpx;
			background: #FFF7F8;
			border-radius: 8rpx;
			margin: 20rpx 30rpx;
			margin-top: 0rpx;
			font-size: 20rpx;
			font-weight: 400;
			color: #999999;
			line-height: 44rpx;
		}

	}

	.a-b {
		padding: 0 30rpx;
		width: 100%;
		background: #FFF7F8;
		height: 60rpx;
		line-height: 60rpx;
		margin: 20rpx 30rpx;
		display: flex;
		justify-content: space-between;

		.a-b1 {
			font-size: 20rpx;
			font-weight: 400;
			color: #666666;

			.red {
				font-size: 20rpx;
				font-weight: 500;
				color: #B22338;
			}
		}

		.a-b2 {
			image {
				vertical-align: middle;
				margin-right: 30rpx;
				margin-left: 30rpx;
				height: 34rpx;
				width: 34rpx;
			}
		}
	}

}

.payment-details {
	margin-top: 20rpx;
	margin-bottom: 20rpx;
	padding: 30rpx;
	background: white;

	.p-t {
		font-size: 32rpx;
		height: 80rpx;
		font-weight: 500;
		color: #111111;
		line-height: 80rpx;
	}

	.p-b-item {
		height: 60rpx;
		line-height: 60rpx;
		display: flex;
		justify-content: space-between;

		.item-lable {
			font-size: 28rpx;
			font-weight: 400;
			color: #666666;
		}

		.item-value {
			font-size: 28rpx;
			font-weight: 400;
			color: #B22338;
		}
	}


}
</style>