ds_mobile_app/mobile/pages/order/confirmOrder.vue

<template>
	<view style="marginTop: 20rpx;" v-if='loadFlag' id="container">
		<!-- 地址 -->
		<view @click="operateAddress" class="address-section">
			<view class="order-content">
				<view class="cen" v-if="orderAddress.addressId!=undefined">
					<view class="top flex_row_start_center">
						<image v-if='orderAddress.isDefault==1' :src="imgUrl+'default_address_tag.png'" />
						<text>{{orderAddress.addressAll}}</text>
					</view>
					<text class="address">{{orderAddress.addressAll}}{{orderAddress.detailAddress}}</text>
					<view class="member_info flex_row_start_center">
						<text class="name">{{orderAddress.memberName}}</text>
						<text class="mobile">{{orderAddress.telMobile}}</text>
					</view>
				</view>
				<view class="empty_address flex_row_center_center" v-if="orderAddress.addressId==undefined">
					<text class="add_icon">+</text>
					<text class="tit">{{$L('新建收货地址')}}</text>
				</view>
				<text class="iconfont iconziyuan11"></text>
			</view>

			<image class="a-bg" :src="imgUrl+'address_split_border.png'"></image>
		</view>

		<view class="goods-section flex_column_start_start" v-if="goodsData.length>0">
			<!-- 商品列表 -->
			<view class="store_list" v-for="(item,key,index) in goodsData" :key='index'>
				<view class="store_name">
					<image class="store_logo" :src="imgUrl+'goods_detail/store_logo.png'"></image>
					<text class="store_name_text">{{item.storeName}}</text>
					<text class="iconfont iconziyuan11"></text>
				</view>
				<view class="product_con" v-for="(product,key,index) in item.productList" :key='index'>
					<view class="g-item flex_row_start_start">
						<view class="image" :style="{backgroundImage: 'url('+product.image+')'}"></view>
						<view class="right flex_column_between_start">
							<view class="flex_column_start_start">
								<text class="title">{{product.goodsName}}</text>
							</view>
							<view class="goods_item_specs">
								<text class="goods_item_spec" v-if="product.specValues">{{product.specValues}}</text>
								<text class="goods_item_buynum">*{{product.buyNum}}</text>
							</view>
							<view class="price-box">
								<text class="unit">¥</text>
								<text class="price_int">{{$getPartNumber(product.price,'int')}}</text>
								<text class="price_decimal">{{$getPartNumber(product.price,'decimal')}}</text>
							</view>
						</view>
					</view>
				</view>

				<view class="yt-list store_info">
					<!-- 满赠商品 -->
					<view class="yt-list-cell-giveaway b-b" v-if="item.sendProductList.length>0">
						<text class="cell-tit clamp">{{$L('赠品信息')}}</text>
						<view class="giveaway_list">
							<view class="giveaway_item" v-for="(giveaway,index) in item.sendProductList">
								<view class="giveaway_item_left">
									<text class="giveaway_item_index">{{$L('赠品')}}{{index+1}}：</text>
									<text class="giveaway_item_name">{{giveaway.goodsName}}</text>
									<text>{{$L('（赠完即止）')}}</text>
								</view>
								<text class="giveaway_item_number">*{{giveaway.num}}</text>
							</view>
						</view>
					</view>
					<!-- 暂无优惠卷 -->
					<!-- 付定金的时候不显示优惠券 -->
					<template
						v-if="!(allData.promotionType==105&&allData.ladderGroupInfo.ladderGroupState==101||allData.promotionType==103&&allData.presellInfo.presellState==101)||allData.promotionType==103&&allData.presellInfo.type==2">
						<view class="yt-list-cell b-b" v-if="item.availableCouponList.length==0">
							<text class="cell-tit clamp ">{{$L('店铺优惠券')}}</text>
							<text class="cell-tip voice">{{$L('暂无可用优惠卷')}}</text>
							<text class="iconfont iconziyuan11"></text>
						</view>
						<view class="yt-list-cell b-b" v-else @click="select_store_red(JSON.stringify(item))">
							<text class="cell-tit clamp ">{{$L('店铺优惠券')}}</text>
							<text
								class="cell-tip">{{item.storeCouponCodeText?('-'+item.storeCouponCodeText):item.storeCouponCodeText}}</text>
							<text class="iconfont iconziyuan11"></text>
						</view>
					</template>
					<template
						v-if="!(allData.promotionType==105&&allData.ladderGroupInfo.ladderGroupState==101||allData.promotionType==103&&allData.presellInfo.presellState==101)||allData.promotionType==103&&allData.presellInfo.type==2">
						<view class="yt-list-cell b-b" v-if="goodsData.length==1">
							<text class="cell-tit clamp">{{$L('商品金额')}}</text>
							<text
								class="cell-tip">￥{{$getPartNumber(item.goodsAmount,'int')}}{{$getPartNumber(item.goodsAmount,'decimal')}}</text>
						</view>
					</template>


					<!-- 付定金的时候不显示运费、优惠信息 -->
					<template
						v-if="!(allData.promotionType==105&&allData.ladderGroupInfo.ladderGroupState==101||allData.promotionType==103&&allData.presellInfo.presellState==101)||allData.promotionType==103&&allData.presellInfo.type==2">
						<view class="yt-list-cell b-b">
							<text class="cell-tit clamp">{{$L('运费')}}</text>
							<text
								class="cell-tip">{{item.expressFee? ('+￥' + $getPartNumber(item.expressFee,'int')+$getPartNumber(item.expressFee,'decimal')):'免运费'}}</text>
						</view>
						<view class="yt-list-cell b-b">
							<text class="cell-tit clamp">{{$L('优惠')}}</text>
							<text
								class="cell-tip">-￥{{$getPartNumber(item.totalDiscount,'int')}}{{$getPartNumber(item.totalDiscount,'decimal')}}</text>
						</view>
					</template>
					<view class="yt-list-cell b-b" v-if="goodsData.length>1">
						<text class="cell-tit clamp">{{$L('小计')}}</text>
						<text
							class="cell-tip">￥{{$getPartNumber((item.totalAmount*1000+item.expressFee*1000)/1000,'int')}}{{$getPartNumber((item.totalAmount*1000+item.expressFee*1000)/1000,'decimal')}}</text>
					</view>
				</view>

				<!-- 付定金的时候不备注 -->
				<template
					v-if="!(allData.promotionType==105&&allData.ladderGroupInfo.ladderGroupState==101||allData.promotionType==103&&allData.presellInfo.presellState==101)||allData.promotionType==103&&allData.presellInfo.type==2">
					<view class="yt-list order_remark">
						<text class="title">{{$L('订单备注')}}</text>
						<!-- #ifndef MP-WEIXIN -->
						<textarea :placeholder="$L('给商家留言,最多100字')" v-model="item.remark" :adjust-position="true"
							placeholder-class="placeholder" class="content uni-input" maxlength='100'
							cursor-spacing="10" @focus="handleFocus" @blur="handleBlur"></textarea>
						<!-- #endif -->

						<!-- #ifdef MP-WEIXIN -->
						<textarea :placeholder="$L('给商家留言,最多100字')" v-model="item.remark" :adjust-position="true"
							placeholder-class="placeholder" class="content uni-input" maxlength='100'
							cursor-spacing="20" @focus="handleFocus" @blur="handleBlur"></textarea>
						<!-- #endif -->
					</view>
				</template>
			</view>

		</view>
		<!-- 阶梯团start -->
		<view class="ladder_list" v-if="allData.promotionType==105">
			<text class="ladder_tip">{{$L('其他优惠可在支付尾款时选择')}}</text>
			<view class="ladder_process">
				<view class="process_level on">
					<view class="level_top">
						<view class="level_left">
							<image :src="imgUrl+'ladder/icon1.png'" mode=""></image>
							<text>{{$L('定金支付')}}</text>
						</view>
						<view class="level_right">
							<text>￥{{$getPartNumber(allData.ladderGroupInfo.advanceDeposit,'int')}}{{$getPartNumber(allData.ladderGroupInfo.advanceDeposit,'decimal')}}</text>
						</view>
					</view>
					<view class="level_gang"></view>
				</view>
				<view :class="{process_level:true,on:allData.ladderGroupInfo.ladderGroupState==102}">
					<view class="level_gang"></view>
					<view class="level_top">
						<view class="level_left">
							<image :src="imgUrl+'ladder/qian.png'" mode=""></image>
							<text>{{$L('尾款结算')}}</text>
						</view>
						<view :class="{level_right:allData.ladderGroupInfo.ladderGroupState==102}">
							<text
								v-if="allData.ladderGroupInfo.ladderGroupState==102">￥{{$getPartNumber(allData.ladderGroupInfo.advanceDeposit,'int')}}{{$getPartNumber(allData.ladderGroupInfo.advanceDeposit,'decimal')}}</text>
							<text v-else>--</text>
						</view>
					</view>

				</view>

			</view>
			<view class="ladder_total">
				<text>{{$L('共')}}{{goodsData[0].productList[0].buyNum}}{{$L('件')}}</text>
				<text>{{$L('小计')}}:</text>
				<text>￥{{$getPartNumber(allData.totalAmount,'int')}}{{$getPartNumber(allData.totalAmount,'decimal')}}</text>
			</view>
		</view>
		<!-- 阶梯团send -->

		<!-- 预售start -->
		<view class="ladder_list" v-if="allData.promotionType==103&&allData.presellInfo.type!=2">
			<text class="ladder_tip">{{$L('其他优惠可在支付尾款时选择')}}</text>
			<view class="ladder_process">
				<view class="process_level on">
					<view class="level_top">
						<view class="level_left">
							<image :src="imgUrl+'ladder/icon1.png'" mode=""></image>
							<text>{{$L('定金支付')}}</text>
						</view>
						<view class="level_right">
							<text>￥{{allData.presellInfo.firstMoney}}</text>
						</view>
					</view>
					<view class="level_gang"></view>
				</view>
				<view :class="{process_level:true,on:allData.presellInfo.presellState==102}">
					<view class="level_gang"></view>
					<view class="level_top">
						<view class="level_left">
							<image :src="imgUrl+'ladder/qian_ac.png'" mode=""
								v-if="allData.presellInfo.presellState==102"></image>
							<image :src="imgUrl+'ladder/qian.png'" mode="" v-else></image>
							<text>{{$L('尾款结算')}}</text>
						</view>
						<view :class="{level_right:allData.presellInfo.presellState==102}">
							<text>￥{{allData.presellInfo.secondMoney}}</text>
						</view>
					</view>
				</view>
				<view class="preDesc_con" style="margin-top: 48rpx;">
					<view class="preSale_desc">
						<text style="color:#FC1C1C">{{allData.presellInfo.remainStartTime}}</text><text
							style="color:#2D2D2D;">开始支付尾款</text>
					</view>
					<view class="preSale_desc">
						预售定金可抵{{allData.presellInfo.firstExpand}}元，支付定金后尾款优惠{{allData.presellInfo.finalDiscount}}元
					</view>
				</view>

			</view>
			<view class="ladder_total">
				<text>{{$L('共')}}{{goodsData[0].productList[0].buyNum}}{{$L('件')}}</text>
				<text>{{$L('小计')}}:</text>
				<text>￥{{$getPartNumber(allData.totalAmount,'int')}}{{$getPartNumber(allData.totalAmount,'decimal')}}</text>
			</view>
		</view>
		<!-- 预售end -->

		<!-- 发票、平台优惠券(阶梯团付定金的时候不显示发票、平台优惠券) -->
		<template
			v-if="!(allData.promotionType==105&&allData.ladderGroupInfo.ladderGroupState==101||(allData.promotionType==103&&allData.presellInfo.presellState==101&&allData.presellInfo.type!=2))">
			<view class="yt-list">
				<view class="yt-list-cell b-b" @click="toInvoice">
					<text class="cell-tit clamp">{{$L('发票')}}</text>
					<text class="cell-tip voice">{{this.invoice_info == ''?'不需要发票':this.invoice_info}}</text>
					<text class="iconfont iconziyuan11"></text>
				</view>
				<!-- 暂无平台优惠卷 -->
				<view class="yt-list-cell b-b" v-if="platformCouponList.length==0">
					<text class="cell-tit clamp">{{$L('平台优惠券')}}</text>
					<text class="cell-tip voice">{{$L('暂无优惠卷')}}</text>
					<text class="iconfont iconziyuan11"></text>
				</view>
				<!-- 平台优惠券 -->
				<view class="yt-list-cell b-b" v-else @click="select_platform_red">
					<text class="cell-tit clamp">{{$L('平台优惠券')}}</text>
					<text
						class="cell-tip">{{platformCouponCodeText?'-'+platformCouponCodeText:platformCouponCodeText}}</text>
					<text class="iconfont iconziyuan11"></text>
				</view>
			</view>
		</template>

		<template v-if="allData.promotionType==105&&allData.ladderGroupInfo.ladderGroupState==101">
			<view class="agreement-part flex_row_start_center">
				<image @click="checkAgrement" class="register_icon" :src="show_check_icon" mode="aspectFill" />
				{{$L('我已阅读并同意')}}
				<text class="agreement" @click="agreement('ladder')">{{$L('《阶梯团定金协议》')}}</text>
			</view>
		</template>

		<template v-if="allData.promotionType==103&&allData.presellInfo.presellState==101&&allData.presellInfo.type!=2">
			<view class="agreement-part flex_row_start_center">
				<image @click="checkAgrement" class="register_icon" :src="show_check_icon" mode="aspectFill" />
				{{$L('我已阅读并同意')}}
				<text class="agreement" @click="agreement('preSale')">{{$L('《预售定金协议》')}}</text>
			</view>
		</template>

		<!-- <view class="empty_h"></view> -->
		<!-- 金额明细 -->
		<view class="empty_h"></view>

		<!-- 底部 -->
		<view class="footer flex_row_end_center" v-if="isBottomShow">
			<view class="price-content flex_column_center_end">
				<view class="should_pay flex_row_end_end">
					<text class="tit">{{$L('待付金额')}}：</text>
					<text class="unit">￥</text>
					<text class="big_price">{{(allData.totalAmount+'').split('.')[0]}}.</text>
					<text
						class="small_price">{{(allData.totalAmount+'').split('.')[1]!=undefined?((allData.totalAmount+'').split('.')[1]):'00'}}</text>
				</view>
				<!-- <view class="promotion_total">
					优惠金额:￥{{$getPartNumber(totalDiscount,'int')}}{{$getPartNumber(totalDiscount,'decimal')}}
				</view> -->

			</view>
			<text class="submit flex_row_center_center"
				@click="testConfirmOrder">{{orderSn?$L('去付尾款'):$L('提交订单')}}</text>
		</view>
		<!-- 使用店铺优惠券(注：阶梯团付定金的时候不可以使用优惠券) -->
		<view id="store_red_wrap" @tap="hide_store_red" v-if="store_show_flag" @touchmove.stop.prevent="moveHandle">
			<view class="store_red">
				<view class="title">{{$L('使用店铺优惠券')}}</view>
				<scroll-view scroll-y class="store_red_list">
					<view v-for="(reditem, index) in currentStore.availableCouponList" :key="index" class="ticket-item">
						<view class="circle_radio a" :for="'red_id_' + index" :data-id="index">
							<view class="red_item_wrap">
								<view class="red_h1" v-if="reditem.couponType==2"><text>{{reditem.value}}</text>
									{{$L('折')}}</view>
								<view class="red_h1" v-else><text>{{reditem.value}}</text>{{$L('元')}} </view>
								<view class="red_h2">
									<view>
										<!-- <block v-if="reditem.redinfo_money == reditem.redinfo_full">
											{{reditem.redinfo_full}}元直减
										</block>
										<block v-else>
											满{{reditem.redinfo_full}}减{{reditem.redinfo_money}}
										</block> -->
										<block>
											{{reditem.content}}
										</block>
									</view>
									<view>
										{{reditem.useTime}}
									</view>
								</view>
								<view class="red_h3">
									<view class="red_h3_top">
										<image :src="imgUrl+'ok_w.png'"></image>
										<text>{{$L('您已领券')}}</text>
									</view>
									<view class="red_h3_bottom" @tap="store_red(reditem.couponCode)">
										{{currentStore.storeCouponCode==reditem.couponCode?'已选择':'点击使用'}}
									</view>
								</view>
							</view>
						</view>
						<view class="line_left"></view>
						<view class="line_right"></view>
						<view class="red_p">
							<text style="margin-left: 40rpx;">{{reditem.description}}</text>
							<image :src="imgUrl+'more.png'"></image>
						</view>
					</view>
				</scroll-view>
			</view>
		</view>



		<view id="store_red_wrap" @tap="hide_platform_red" v-if="store_show_flag_platform">
			<view class="store_red">
				<view class="title">使用平台优惠券</view>
				<scroll-view scroll-y class="store_red_list">
					<view v-for="(reditem, index) in platformCouponList" :key="index" class="ticket-item">
						<view class="circle_radio a" :for="'red_id_' + index" :data-id="index">
							<view class="red_item_wrap">
								<s v-if="reditem.red_type == 2"></s>
								<view class="red_h1">
									<text>{{reditem.value}}</text> 元
								</view>
								<view class="red_h2">
									<view>
										<!-- <block v-if="reditem.redinfo_money == reditem.redinfo_full">
		                                            {{reditem.redinfo_full}}元直减
		                                        </block>
		                                        <block v-else>
		                                            满{{reditem.redinfo_full}}减{{reditem.redinfo_money}}
		                                        </block> -->
										<block>
											{{reditem.content}}
										</block>
									</view>
									<view>
										{{reditem.useTime}}
									</view>
								</view>
								<view class="red_h3">
									<view class="red_h3_top">
										<image :src="imgUrl+'ok_w.png'"></image>
										<text>您已领券</text>
									</view>
									<view class="red_h3_bottom" @tap="platform_red(reditem.couponCode)">
										{{platformCouponCode==reditem.couponCode?'已选择':'点击使用'}}
									</view>
								</view>
							</view>
						</view>
						<view class="line_left"></view>
						<view class="line_right"></view>
						<view class="red_p">
							<text style="margin-left: 40rpx;">{{reditem.description}}</text>
							<image :src="imgUrl+'more.png'"></image>
						</view>
					</view>
				</scroll-view>
			</view>
		</view>


		<!-- 商品全部，部分无货弹窗 start-->
		<view id="store_no_good" v-if="store_show_no_good" @touchmove.stop.prevent="moveHandle">
			<view class="content">
				<view class="content_title">
					<text> {{no_good_info.stateValue}}</text>
					<image @tap="hide_good_dialog" :src="imgUrl+'/order/store_no_good_cancel.png'" mode=""></image>
				</view>
				<view class="good_list">
					<view v-for="(item,index) in no_good_info.productList" :key='index' class="good_item">
						<image :src="item.image" mode=""></image>
						<view class="good_info">
							<view class="good_name">
								{{item.goodsName}}
							</view>
							<view class="good_spec">
								<text>{{item.specValues}}</text>
							</view>
							<text class="num">*{{item.buyNum}}</text>
						</view>
					</view>

				</view>
				<view v-if='no_good_info.state==2' class="part_no_goods">
					<view class="return" @click="returnLastPage">
						{{$L('返回')}}
					</view>
					<view class="remove" @click='clearFailureGoods'>
						{{$L('移除无货商品')}}
					</view>
				</view>
				<view v-else class="part_no_goods_another">
					<view class="return" @click="returnLastPage">
						{{$L('返回')}}
					</view>
				</view>
			</view>
		</view>
		<!-- 商品全部，部分无货弹窗 end-->
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	export default {
		data() {
			return {
				imgUrl: getApp().globalData.imgUrl,
				loadFlag: false,
				preParam: {}, //上一个页面的参数
				orderAddress: {}, //下单所用的地址信息
				goodsData: [], //商品数据
				allData: {}, //确认下单返回的所有数据信息
				maskState: 0, //优惠券面板显示状态
				desc: '', //备注
				payType: 1, //1微信 2支付宝
				isBottomShow: true, //底部是否显示
				windowHeight: '',
				remark: '',
				cartIds: '', //购物车id集合
				ifOnShow: false,
				invoice_info: '', //发票信息
				invoiceId: '', //发票id
				store_show_flag: false,
				currentStore: {},
				platformCouponList: [], //平台优惠券列表
				platformCouponCode: '',
				platformCouponCodeText: '',
				store_show_flag_platform: false,
				totalDiscount: '',
				store_show_no_good: false,
				no_good_info: {},
				timer: '',
				isVatInvoice: true,
				orderSn: '', //订单号，目前阶梯团付尾款的时候会用到
				check_agreement: false,
				show_check_icon: getApp().globalData.imgUrl + 'register_uncheck.png',
				isAloneBuy: false, //拼团是否单独购买
				spellTeamId: 0,
				spreaderMemberId: 0 //专门的推手分享ID设置
			}
		},
		async onLoad(option) {
			//商品数据
			this.getAddressList()
			this.preParam = option;
			this.orderSn = option.orderSn != undefined && option.orderSn ? option.orderSn : '';
			this.isAloneBuy = option.isAloneBuy ? option.isAloneBuy : false
			this.spellTeamId = option.spellTeamId ? option.spellTeamId : 0

			let spreaderTmp = uni.getStorageSync('spreaderId')
			if (spreaderTmp) {
				this.spreaderMemberId = spreaderTmp
			}

		},
		computed: {
			...mapState(['hasLogin', 'userInfo'])
		},
		onHide() {
			this.ifOnShow = true
			//清除定时器
			if (this.timer) {
				clearInterval(this.timer);
				this.timer = 0;
			}
		},
		onUnload() {
			//清除定时器
			if (this.timer) {
				clearInterval(this.timer);
				this.timer = 0;
			}

		},
		onShow() {
			if (this.ifOnShow) {
				const is_need_invoice = uni.getStorageSync('is_need_invoice')
				const invoice_msg = uni.getStorageSync('invoice_info')
				if (!is_need_invoice) {
					this.invoice_info = this.$L('不需要发票');
				}
				if (invoice_msg != '') {
					if (invoice_msg.invoice_title) {
						this.invoice_info = invoice_msg.invoice_title + ' ' + invoice_msg.invoice_content
					} else {
						this.invoice_info = invoice_msg.company_name + ' ' + invoice_msg.invoice_content
					}
					this.invoiceId = invoice_msg.invoiceId
				}
			}
		},
		methods: {
			//阶梯团定金协议点击事件
			checkAgrement() {
				this.check_agreement = !this.check_agreement;
				this.show_check_icon = this.check_agreement ? getApp().globalData.imgUrl + 'register_checked.png' :
				getApp().globalData.imgUrl + 'register_uncheck.png';
			},
			agreement(type) {
				if (type == 'ladder') {
					uni.navigateTo({
						url: '/standard/ladder/agreement/agreement'
					})
				} else if (type == 'preSale') {
					uni.navigateTo({
						url: '/standard/presale/agreement/agreement'
					})
				}

			},
			operateAddress() {
				uni.navigateTo({
					url: `/pages/address/list?source=1&sourceId=${this.orderAddress.addressId!=undefined?this.orderAddress.addressId:''}`
				})
			},
			moveHandle() {},
			// 隐藏商品无货弹窗
			hide_good_dialog() {
				this.store_show_no_good = false
			},
			// 隐藏优惠券弹窗
			hide_store_red(e) {
				this.store_show_flag = false
			},
			// 显示店铺优惠券弹窗
			select_store_red(store) {
				this.store_show_flag = true
				this.currentStore = JSON.parse(store)
			},
			//选择店铺优惠卷
			store_red(couponCode) {
				if (this.currentStore.storeCouponCode == couponCode) {
					this.currentStore.storeCouponCode = ''
				} else {
					this.currentStore.storeCouponCode = couponCode
				}
				this.confirmOrder(2)
			},
			// h隐藏平台优惠券弹窗
			hide_platform_red(e) {
				this.store_show_flag_platform = false
			},
			// 显示平台优惠券弹窗
			select_platform_red() {
				this.store_show_flag_platform = true
			},
			//选择平台优惠卷
			platform_red(platformCouponCode) {
				if (this.platformCouponCode == platformCouponCode) {
					this.platformCouponCode = ''
				} else {
					this.platformCouponCode = platformCouponCode
				}
				this.confirmOrder(2)
			},
			//获取地址列表
			getAddressList() {
				this.$request({
					url: 'v3/member/front/memberAddress/list',
					method: 'GET'
				}).then(res => {
					if (res.state == 200) {
						if (res.data.list.length > 0) {
							var default_address = res.data.list.filter(function(item) {
								return item.isDefault == 1;
							})
							if (default_address.length > 0) {
								this.orderAddress = default_address[0]
							} else {
								this.orderAddress = res.data.list[0]
							}

							if (uni.getStorageSync('addressId')) {
								let addressID = uni.getStorageSync('addressId')
								if (res.data.list.filter(i => i.addressId == addressID)[0]) {
									let tmp = res.data.list.filter(i => i.addressId == addressID)[0]
									this.orderAddress = tmp
								}

							}
						}

						this.confirmOrder(1);
					} else {
						this.confirmOrder(1);
						this.$api.msg(res.msg);
					}
				}).catch((e) => {
					//异常处理
				})
			},
			returnLastPage(state) {
				uni.navigateBack({
					delta: 1
				});
			},
			//用于切换地址，使用优惠券，获取信息，运费等
			confirmOrder(type) {
				const {
					preParam
				} = this;
				let param = {};
				let url = this.orderSn ? 'v3/business/front/orderOperate/balanceConfirm' :
					'v3/business/front/orderOperate/confirm'
				param.url = url;
				param.method = 'POST';
				param.data = {};
				param.header = {
					"Content-Type": "application/json"
				};
				param.data.addressId = this.orderAddress.addressId
				param.data.platformCouponCode = this.platformCouponCode
				param.data.orderSn = this.orderSn ? this.orderSn : '';
				param.data.isAloneBuy = this.isAloneBuy //拼团商品是否单独购买
				if (this.spellTeamId != 0) {
					param.data.spellTeamId = this.spellTeamId
				}
				let storeInfoList = []
				this.goodsData.map(item => {
					let storeitem = {}
					storeitem.invoiceId = this.invoiceId
					storeitem.remark = item.remark
					storeitem.storeCouponCode = item.storeCouponCode
					storeitem.storeId = item.storeId
					storeInfoList.push(storeitem)
				})
				param.data.storeInfoList = storeInfoList
				param.data.source = type
				if (preParam.isCart == 'true') {
					//来自于购物车
					param.data.isCart = true;
					// param.data.orderType = preParam.orderType;
				} else {
					//立即购买
					// param.data.orderType = preParam.orderType;
					// param.data.goodsId = preParam.goodsId;
					param.data.productId = preParam.productId;
					param.data.number = preParam.numbers;
					param.data.isCart = false;
				}
				this.$request(param).then(res => {
					if (res.state == 200) {
						let result = res.data;
						// this.orderAddress = result.defaultAddress || {};
						this.goodsData = result.storeGroupList;
						this.isVatInvoice = result.isVatInvoice
						this.totalDiscount = result.totalDiscount
						//处理平台优惠券
						this.platformCouponList = result.availableCouponList
						let default_plat_coupon = this.platformCouponList.filter(function(coupon) {
							return coupon.checked == true;
						})
						if (default_plat_coupon.length > 0) {
							this.platformCouponCodeText = default_plat_coupon[0].discount
							this.platformCouponCode = default_plat_coupon[0].couponCode
						} else {
							this.platformCouponCodeText = ''
							this.platformCouponCode = ''
						}

						this.allData = result;
						this.loadFlag = true;
						//处理店铺优惠卷
						this.goodsData.map(item => {
							this.$set(item, 'remark', '')
							let default_coupon = item.availableCouponList.filter(function(coupon) {
								return coupon.checked == true;
							})
							if (default_coupon.length > 0) {
								this.$set(item, 'storeCouponCode', default_coupon[0].couponCode)
								this.$set(item, 'storeCouponCodeText', default_coupon[0].discount)
							} else {
								this.$set(item, 'storeCouponCode', '')
							}
						})
					} else {
						this.$api.msg(res.msg);
					}
				}).catch((e) => {
					//异常处理
				})
			},
			//显示优惠券面板
			toggleMask(type) {
				let timer = type === 'show' ? 10 : 300;
				let state = type === 'show' ? 1 : 0;
				this.maskState = 2;
				setTimeout(() => {
					this.maskState = state;
				}, timer)
			},
			numberChange(data) {
				this.number = data.number;
			},
			changePayType(type) {
				this.payType = type;
			},
			clearFailureGoods() {
				let _this = this
				let param = {}
				param.url = 'v3/business/front/cart/emptyInvalid'
				param.method = 'POST'
				_this.$request(param).then(res => {
					if (res.state == 200) {
						this.store_show_no_good = false
						this.confirmOrder(2)
					}
				})
			},
			//确认订单前，检验商品是否可结算
			testConfirmOrder() {
				const {
					preParam
				} = this;
				let param = {};

				param.method = 'POST';
				param.data = {};
				param.header = {
					"Content-Type": "application/json"
				};

				if (this.allData.promotionType == 105 && this.allData.ladderGroupInfo.ladderGroupState == 101) {
					//阶梯团付定金阶段
					if (!this.check_agreement) {
						this.$api.msg('请同意阶梯团定金协议!');
						return false;
					}
				} else if (this.allData.promotionType == 103 && this.allData.presellInfo.presellState == 101 && this
					.allData.presellInfo.type != 2) {
					//阶梯团付定金阶段
					if (!this.check_agreement) {
						this.$api.msg('请同意预售定金协议!');
						return false;
					}
				}

				if (this.orderSn) {
					//阶梯团付尾款时用
					param.url = 'v3/business/front/orderOperate/balanceConfirm';
					preParam.isCart = 'false'; //目的是要让param.data.isCart为false
					param.data.source = 2;
					param.data.orderSn = this.orderSn;
				} else {
					param.url = 'v3/business/front/orderOperate/check';
				}
				if (preParam.isCart == 'true') {
					param.data.isCart = true
				} else {
					param.data.isCart = false
					param.data.productId = JSON.parse(preParam.productId);
					param.data.number = preParam.numbers;
				}
				this.$request(param).then(res => {
					if (res.state == 267) {
						this.no_good_info = res.data
						this.store_show_no_good = true
					} else if (res.state == 200) {
						this.submit()
					} else if (res.state == 255) {
						this.$api.msg(res.msg)
					}
				}).catch((e) => {
					//异常处理
				})
			},

			//提交订单
			submit() {
				// #ifdef H5
				this.order_from = 2
				// #endif

				// #ifdef APP-PLUS
				switch (uni.getSystemInfoSync().platform) {
					case 'android':
						this.order_from = 3
						break;
					case 'ios':
						this.order_from = 4
						break;
					default:
						break;
				}
				// #endif

				// #ifdef MP
				this.order_from = 5
				// #endif
				const {
					preParam
				} = this;
				let param = {};
				param.method = 'POST';
				param.header = {
					"Content-Type": "application/json"
				};
				param.data = {};
				let storeInfoList = []
				this.goodsData.map(item => {
					let storeitem = {}
					storeitem.invoiceId = this.invoiceId
					storeitem.remark = item.remark
					storeitem.storeCouponCode = item.storeCouponCode
					storeitem.storeId = item.storeId
					storeInfoList.push(storeitem)
				})
				param.data.platformCouponCode = this.platformCouponCode
				param.data.addressId = this.orderAddress.addressId
				param.data.storeInfoList = storeInfoList
				param.data.orderFrom = this.order_from
				if (this.orderSn) {
					param.url = 'v3/business/front/orderOperate/balanceSubmit';
					preParam.isCart = 'false';
					param.data.source = 2;
					param.data.orderSn = this.orderSn;
				} else {
					param.url = 'v3/business/front/orderOperate/submit';
					param.data.source = 3;
				}
				if (preParam.isCart == 'true') {
					//来自于购物车
					param.data.isCart = true;
				} else {
					param.data.productId = JSON.parse(preParam.productId);
					param.data.number = preParam.numbers;
					param.data.isCart = false;
					if (this.spellTeamId != 0) {
						param.data.spellTeamId = this.spellTeamId
					}
					param.data.isAloneBuy = this.isAloneBuy

				}
				this.$request(param).then(res => {
					if (res.state == 200) {
						let need_pay = res.data.needPay
						let paySn = res.data.paySn
						this.timer = setInterval(() => {
							this.queryPayState(paySn);
						}, 100);
						// if(need_pay){
						// 	uni.redirectTo({
						// 		url: `/pages/order/pay?paySn=${paySn}&payMethodType=create`
						// 	})
						// }else{
						// 	uni.navigateTo({
						// 		url:'/pages/order/list?state=0'
						// 	})
						// }
					} else {
						this.$api.msg(res.msg);
					}
				}).catch((e) => {
					//异常处理
				})
			},

			stopPrevent() {},
			// 定时查询是否可以支付
			queryPayState(paySn) {
				this.getPayInfo(paySn);
			},
			//获取订单支付数据
			getPayInfo(paySn) {
				let _this = this
				let param = {};
				param.url = 'v3/business/front/orderPay/payInfo';
				param.method = 'get';
				param.data = {
					paySn: paySn,
					payFrom: 1
				};
				this.$request(param)
					.then(res => {
						if (_this.timer) {
							clearInterval(_this.timer);
							_this.timer = 0;
						}
						if (res.state == 200) {
							if (res.data.dealState == 3) {
								uni.redirectTo({
									url: `/pages/order/pay?paySn=${paySn}&payMethodType=create`
								})
								//清除定时器
								
							} else if (res.data.dealState == 2) {
								this.$api.msg("提交订单失败，请稍后重试");
							}
						} else if (res.state == 267) {
							this.$api.msg(res.msg + ",2s后自动跳转订单列表");
							setTimeout(() => {
								uni.navigateTo({
									url: '/pages/order/list?state=0'
								})
							}, 2000);
						} else {
							this.$api.msg(res.msg);
						}
					})
					.catch(() => {
						//异常处理
					});
			},
			//根据收货地址id获取总的运费
			changeAddress(selAddress) {
				this.orderAddress = selAddress;
				this.confirmOrder(2)
				uni.setStorageSync('addressId', this.orderAddress.addressId)
				// const {
				// 	preParam
				// } = this;
				// let param = {};
				// param.url = 'v1/front/order/calcShipFee';
				// param.method = 'POST';
				// param.data = {};
				// param.data.key = this.userInfo.access_token;
				// param.data.addressId = selAddress.memberAddrId;
				// if (preParam.isCart == 'true') {
				// 	//来自于购物车
				// 	param.data.orderFrom = 'cart';
				// 	param.data.cartIds = this.cartIds
				// } else {
				// 	//立即购买
				// 	// param.data.cartId = preParam.cartId
				// 	param.data.goodsId = preParam.goodsId;
				// 	param.data.productId = preParam.productId;
				// 	param.data.number = preParam.numbers;
				// }
				// this.$request(param).then(res => {
				// 	if (res.state == 200) {
				// 		let result = res.data;
				// 		this.allData.transFee = result.transFee;
				// 		this.allData.totalPay = result.totalPay;
				// 		this.allData.goodsAmount = result.goodsAmount;
				// 	} else {
				// 		this.$api.msg(res.msg);
				// 	}
				// }).catch((e) => {
				// 	//异常处理
				// })
			},
			//备注输入框聚焦
			handleFocus() {
				// #ifdef MP-WEIXIN
				this.isBottomShow = false;
				// #endif

			},
			//失去焦点
			handleBlur() {
				this.isBottomShow = true;
			},
			// 跳转我的发票页面
			toInvoice() {
				uni.navigateTo({
					url: '/pages/invoice/myInvoice?isVatInvoice=' + this.isVatInvoice
				})
			},
		}
	}
</script>

<style lang="scss">
	page {
		background: $bg-color-split;
		padding-bottom: 100rpx;
		width: 750rpx;
		margin: 0 auto;
	}

	.preSale_desc {
		margin-top: 18rpx;
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: #949494;
	}

	.address-section {
		background: #fff;
		position: relative;

		.order-content {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 20rpx;

			// height: 249rpx;
			.iconfont {
				color: $main-second-color;
				font-size: 26rpx;
			}

			.cen {
				.top {
					image {
						width: 63rpx;
						height: 30rpx;
						border-radius: 6rpx;
						margin-right: 20rpx;
					}

					text {
						color: #2D2D2D;
						font-size: 26rpx;
					}
				}

				.address {
					margin-top: 16rpx;
					margin-right: 20rpx;
					color: #2D2D2D;
					font-size: 32rpx;
					font-weight: bold;
					line-height: 40rpx;
					text-overflow: -o-ellipsis-lastline;
					overflow: hidden;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-line-clamp: 2;
					line-clamp: 2;
					-webkit-box-orient: vertical;
				}

				.member_info {
					margin-top: 15rpx;
					font-size: 28rpx;

					.name {
						color: #2D2D2D;
					}

					.mobile {
						color: $main-third-color;
						margin-left: 40rpx;
					}
				}
			}

			.empty_address {
				color: $main-font-color;
				font-size: 34rpx;
				flex: 1;

				.add_icon {
					margin-right: 20rpx;
					margin-top: -8rpx;
					font-size: 40rpx;
				}
			}
		}

		.cen {
			display: flex;
			flex-direction: column;
			flex: 1;
			font-size: 28rpx;
		}



		.a-bg {
			position: absolute;
			left: 0;
			bottom: 0;
			display: block;
			width: 100%;
			height: 7rpx;
		}
	}

	.goods-section {
		margin-top: 20rpx;
		background: #fff;
		box-sizing: border-box;

		.store_list {
			width: 100%;
		}

		.product_con {
			border-bottom: 1rpx solid rgba(0, 0, 0, .1);

			.product_giveaway {
				color: #666666;
				background-color: #f8f8f8;
				padding: 6rpx 10rpx;
				font-size: 24rpx;
				width: fit-content;
				margin-bottom: 20rpx;
				margin-left: 20rpx;
				border-radius: 3px;
			}
		}

		.g-item {
			display: flex;
			padding: 20rpx 20rpx 20rpx 0;
			margin-left: 20rpx;
			width: calc(750rpx - 20rpx);

			.image {
				flex-shrink: 0;
				display: block;
				width: 220rpx;
				height: 220rpx;
				border-radius: 15rpx;
				background-size: cover;
				background-position: center center;
				background-repeat: no-repeat;
				background-color: #F8F6F7;
			}

			.right {
				flex: 1;
				padding: 15rpx 0 15rpx 24rpx;
				overflow: hidden;
				height: 220rpx;
			}

			.title {
				font-size: 28rpx;
				color: $main-font-color;
				overflow: hidden;
				text-overflow: ellipsis;
				display: -webkit-box;
				-webkit-line-clamp: 2;
				-webkit-box-orient: vertical;
				word-break: break-word;
				line-height: 40rpx;
			}

			.spec {
				font-size: 24rpx;
				color: #949494;
				overflow: hidden;
				text-overflow: ellipsis;
				display: -webkit-box;
				-webkit-line-clamp: 1;
				-webkit-box-orient: vertical;
				word-break: break-word;
				line-height: 40rpx;
			}

			.goods_item_specs {
				display: flex;
				align-items: center;
				font-size: 24rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #999999;
				line-height: 34rpx;

				.goods_item_spec {
					margin-right: 10rpx;
				}
			}

			.price-box {
				font-size: 32rpx;
				color: $main-color;

				.unit {
					font-size: 24rpx;
					font-weight: bold;
				}

				.price_int {
					font-size: 34rpx;
					margin-left: 4rpx;
					font-weight: bold;
				}

				.price_decimal {
					font-size: 24rpx;
					font-weight: bold;
				}
			}


			.step-box {
				position: relative;
			}
		}
	}

	.ladder_list {
		padding: 20rpx 40rpx;
		background-color: #fff;

		.ladder_tip {
			font-size: 24rpx;
			font-family: PingFang SC;
			font-weight: 400;
			color: #2D2D2D;
		}

		.ladder_process {
			margin-top: 40rpx;

			.on {
				.level_left {
					text {
						color: #FC1D1C !important;
					}
				}

				.level_right {
					color: #FC1D1C !important;
				}

				.level_gang {
					background: #FE7837 !important;
				}

			}

			.process_level {
				.level_top {
					display: flex;
					align-items: center;
					justify-content: space-between;
					margin-bottom: 6rpx;
					margin-top: 6rpx;

					.level_left {
						display: flex;
						align-items: center;

						text {
							line-height: 43rpx;
							margin-left: 32rpx;
							font-size: 28rpx;
							font-family: PingFang SC;
							font-weight: 400;
							color: #2D2D2D;
						}

						image {
							width: 39rpx;
							height: 43rpx;
						}
					}

					.level_right {
						font-size: 28rpx;
						font-family: PingFang SC;
						font-weight: bold;
						color: #2D2D2D;
					}

				}

				.level_gang {
					width: 1px;
					height: 31rpx;
					background: #E1E1E1;
					margin-left: 18rpx;
				}

			}
		}

		.ladder_total {
			display: flex;
			justify-content: flex-end;
			margin-top: 42rpx;
			font-size: 28rpx;
			font-family: PingFang SC;

			text:first-child {
				color: #666666;
				margin-right: 10rpx;
			}

			text:nth-child(2) {
				color: #2D2D2D;
				// font-weight:bold;
			}

			text:nth-child(3) {
				color: #FC1C1C;
			}
		}

	}

	.yt-list {
		margin-top: 20rpx;
		background: #fff;

		&.order_remark {
			padding: 10rpx 20rpx 20rpx;

			.title {
				color: $main-font-color;
				font-size: 28rpx;
				line-height: 32rpx;
			}

			.placeholder {
				color: $main-third-color;
				font-size: 24rpx;
			}

			.content {
				width: inherit;
				height: 103rpx;
				background: rgba(245, 245, 245, 1);
				border-radius: 6rpx;
				padding: 20rpx;
				color: $main-second-color;
				font-size: 26rpx;
				margin-top: 10rpx;
			}
		}
	}

	.store_info {
		margin-top: 0;
	}

	.yt-list-cell-giveaway {
		padding: 20rpx;
		line-height: 60rpx;

		&.b-b:after {
			left: 20rpx;
		}

		position: relative;

		.cell-tit {
			flex: 1;
			font-size: 26rpx;
			color: #333333;
			margin-right: 20rpx;
		}

		.giveaway_list {
			padding: 30rpx 20rpx;
			background: #F5F5F5;
			border-radius: 6px 6px 6px 6px;
			font-size: 24rpx;

			.giveaway_item {
				display: flex;
				align-items: center;
				justify-content: space-between;
			}

			.giveaway_item_left {
				display: flex;
				align-items: center;

				.giveaway_item_index {
					color: #999999;
				}

				.giveaway_item_name {
					color: #333333;
					max-width: 400rpx;
					white-space: nowrap;
					text-overflow: ellipsis;
					overflow: hidden;
					display: inline-block;
				}
			}

			.giveaway_item_number {
				float: right;
			}
		}
	}

	.yt-list-cell {
		display: flex;
		align-items: center;
		padding: 20rpx;
		line-height: 60rpx;
		position: relative;

		.iconfont {
			color: #999999;
			font-size: 26rpx;
			margin-left: 19rpx;
		}

		&.cell-hover {
			background: #fafafa;
		}

		&.b-b:after {
			left: 20rpx;
		}

		.cell-icon {
			height: 32rpx;
			width: 32rpx;
			font-size: 22rpx;
			color: #fff;
			text-align: center;
			line-height: 32rpx;
			background: #f85e52;
			border-radius: 4rpx;
			margin-right: 12rpx;

			&.hb {
				background: #ffaa0e;
			}

			&.lpk {
				background: #3ab54a;
			}

		}

		.voice {
			color: #333333 !important;
			font-weight: 500 !important;
		}

		.cell-more {
			align-self: center;
			font-size: 24rpx;
			color: $font-color-light;
			margin-left: 8rpx;
			margin-right: -10rpx;
		}

		.cell-tit {
			flex: 1;
			font-size: 26rpx;
			color: #333333;
			margin-right: 20rpx;
		}

		.cell-tip {
			font-size: 26rpx;
			color: $main-color;
			font-weight: bold;

			&.disabled {
				color: $font-color-light;
			}

			&.active {
				color: $base-color;
			}

			&.red {
				color: $base-color;
			}
		}

		&.desc-cell {
			.cell-tit {
				max-width: 90rpx;
			}
		}

		.desc {
			flex: 1;
			font-size: $font-base;
			color: $font-color-dark;
		}
	}

	/* 支付列表 */
	.pay-list {
		padding-left: 40rpx;
		margin-top: 16rpx;
		background: #fff;

		.pay-item {
			display: flex;
			align-items: center;
			padding-right: 20rpx;
			line-height: 1;
			height: 110rpx;
			position: relative;
		}

		.icon-weixinzhifu {
			width: 80rpx;
			font-size: 40rpx;
			color: #6BCC03;
		}

		.icon-alipay {
			width: 80rpx;
			font-size: 40rpx;
			color: #06B4FD;
		}

		.icon-xuanzhong2 {
			display: flex;
			align-items: center;
			justify-content: center;
			width: 60rpx;
			height: 60rpx;
			font-size: 40rpx;
			color: $base-color;
		}

		.tit {
			font-size: 32rpx;
			color: $font-color-dark;
			flex: 1;
		}
	}

	.footer {
		position: fixed;
		left: 0;
		right: 0;
		margin: 0 auto;
		bottom: 0;
		z-index: 995;
		width: 750rpx;
		height: 98rpx;
		font-size: 30rpx;
		background-color: #fff;
		z-index: 998;
		color: $main-color;

		.price-content {
			.should_pay {
				.tit {
					color: $main-font-color;
					font-size: 30rpx;
					line-height: 30rpx;
				}

				.unit,
				.small_price {
					font-size: 24rpx;
					font-weight: bold;
					line-height: 26rpx;
				}

				.big_price {
					font-size: 30rpx;
					font-weight: bold;
					line-height: 30rpx;
				}
			}

			.promotion_total {
				color: $main-font-color;
				font-size: 22rpx;
				margin-top: 8rpx;
			}
		}

		.submit {
			width: 200rpx;
			height: 70rpx;
			background: #F30300;
			border-radius: 35rpx;
			color: #fff;
			font-size: 30rpx;
			margin: 0 20rpx;
		}
	}

	/* 优惠券面板 */
	.mask {
		display: flex;
		align-items: flex-end;
		position: fixed;
		left: 0;
		top: var(--window-top);
		bottom: 0;
		width: 100%;
		background: rgba(0, 0, 0, 0);
		z-index: 9995;
		transition: .3s;

		.mask-content {
			width: 100%;
			min-height: 30vh;
			max-height: 70vh;
			background: #f3f3f3;
			transform: translateY(100%);
			transition: .3s;
			overflow-y: scroll;
		}

		&.none {
			display: none;
		}

		&.show {
			background: rgba(0, 0, 0, .4);

			.mask-content {
				transform: translateY(0);
			}
		}
	}

	/* 优惠券列表 */
	.coupon-item {
		display: flex;
		flex-direction: column;
		margin: 20rpx 24rpx;
		background: #fff;

		.con {
			display: flex;
			align-items: center;
			position: relative;
			height: 120rpx;
			padding: 0 30rpx;

			&:after {
				position: absolute;
				left: 0;
				bottom: 0;
				content: '';
				width: 100%;
				height: 0;
				border-bottom: 1px dashed #f3f3f3;
				transform: scaleY(50%);
			}
		}

		.left {
			display: flex;
			flex-direction: column;
			justify-content: center;
			flex: 1;
			overflow: hidden;
			height: 100rpx;
		}

		.title {
			font-size: 32rpx;
			color: $font-color-dark;
			margin-bottom: 10rpx;
		}

		.time {
			font-size: 24rpx;
			color: $font-color-light;
		}

		.right {
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			font-size: 26rpx;
			color: $font-color-base;
			height: 100rpx;
		}

		.price {
			font-size: 44rpx;
			color: $base-color;

			&:before {
				content: '￥';
				font-size: 34rpx;
			}
		}

		.tips {
			font-size: 24rpx;
			color: $font-color-light;
			line-height: 60rpx;
			padding-left: 30rpx;
		}

		.circle {
			position: absolute;
			left: -6rpx;
			bottom: -10rpx;
			z-index: 10;
			width: 20rpx;
			height: 20rpx;
			background: #f3f3f3;
			border-radius: 100px;

			&.r {
				left: auto;
				right: -6rpx;
			}
		}
	}

	.empty_h {
		width: 750rpx;
		height: 20rpx;
	}

	.store_name {
		padding-left: 20rpx;
		padding-bottom: 30rpx;
		margin-top: 30rpx;
		display: flex;
		align-items: center;
		border-bottom: 1rpx solid rgba(0, 0, 0, .1);

		.ladder_group {
			height: 32rpx;
			border-radius: 15rpx;
			line-height: 32rpx;
			padding: 0 10rpx;
			margin-right: 10rpx;
			background: linear-gradient(22deg, #FE901E 0%, #FEAD28 100%);
			font-size: 22rpx;
			color: #ffffff;
		}

		image {
			width: 34rpx;
			height: 32rpx;
		}

		.store_name_text {
			font-size: 32rpx;
			color: #2d2d2d;
			font-weight: bold;
			margin-left: 10rpx;
		}

		.iconfont {
			// width: 13rpx;
			// height: 22rpx;
			font-size: 24rpx;
			margin-left: 10rpx;
		}
	}

	#store_red_wrap,
	#store_no_good {
		position: fixed;
		top: 0;
		left: 0;
		width: 750rpx;
		height: 100vh;
		background-color: rgba(0, 0, 0, 0.6);
		z-index: 999;
		right: 0;
		margin: 0 auto;
	}

	.store_red {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 750rpx;
		height: 50vh;
		background-color: #fff;
		box-sizing: border-box;
	}

	.store_red .title {
		line-height: 110rpx;
		padding: 0 30rpx;
		border-bottom: 1rpx solid #eee;
		font-size: 30rpx;
		color: #666;
	}

	.store_red_list {
		height: 78%;
		box-sizing: border-box;
		padding: 30rpx 30rpx 0;
	}

	.store_red_list .ticket-item {
		position: relative;
		display: block;
		margin-bottom: 30rpx;
		border-radius: 20rpx;
	}

	.ticket-item .line_left,
	.ticket-item .line_right {
		position: absolute;
		top: 150rpx;
		width: 20rpx;
		height: 20rpx;
		border-radius: 50%;
		background-color: #fff;
	}

	.ticket-item .line_left {
		left: -10rpx;
	}

	.ticket-item .line_right {
		right: -10rpx;
	}

	.store_red_list .ticket-item:last-child {
		margin: 0;
	}

	.store_red_list .circle_radio {
		display: flex;
		align-items: center;
		height: 160rpx;
		color: #fff;
		background: -webkit-gradient(linear, 25% 100%, 75% 100%, from(#ff8580), to(#ea5165));
	}

	.circle_radio .red_item_wrap {
		display: flex;
		width: 100%;
		padding: 0 30rpx 0 50rpx;
		align-items: center;
		justify-content: space-between;
	}

	.circle_radio .red_item_wrap .red_h1 {
		font-size: 26rpx;
	}

	.circle_radio .red_item_wrap .red_h1 em {
		font-size: 54rpx;
	}

	.circle_radio .red_item_wrap .red_h2 {
		font-size: 26rpx;
	}

	.circle_radio .red_item_wrap .red_h2 em {
		display: block;
	}

	.circle_radio .red_item_wrap .red_h2 em:nth-child(2) {
		font-size: 20rpx;
		padding-top: 10rpx;
	}

	.circle_radio .red_item_wrap .red_h3 .red_h3_top {
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 22rpx;
	}

	.red_h3 .red_h3_top image {
		width: 20rpx;
		height: 20rpx;
		margin-right: 15rpx;
	}

	.circle_radio .red_item_wrap .red_h3 .red_h3_bottom {
		padding: 10rpx 15rpx;
		font-size: 28rpx;
		color: #ec5667;
		background-color: #f9ccd1;
		margin-top: 18rpx;
		border-radius: 6rpx;
	}

	.ticket-item .red_p {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 80rpx;
		font-size: 26rpx;
		color: #84292b;
		background: -webkit-gradient(linear, 25% 100%, 75% 100%, from(#d6706b), to(#c44654));
		border-top: 3rpx dashed #fff;
	}

	.ticket-item .red_p image {
		width: 26rpx;
		height: 26rpx;
		margin-right: 10rpx;

	}

	#store_no_good {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	#store_no_good .content {
		width: 580rpx;
		height: 773rpx;
		background-color: white;
		border-radius: 15rpx;

		.content_title {
			margin-top: 24rpx;
			margin-bottom: 24rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 30rpx;
			font-size: 32rpx;
			color: #2D2D2D;

			image {
				width: 22rpx;
				height: 22rpx;
			}
		}

		.good_list {
			height: 593rpx;
			overflow-y: scroll;
			width: 100%;

			.good_item {
				display: flex;
				align-items: center;
				padding: 30rpx;
				border-top: 1rpx solid #f2f2f2;

				image {
					width: 70rpx;
					height: 70rpx;
					border-radius: 6rpx;
				}

				.good_info {
					margin-left: 20rpx;
					position: relative;

					.good_name {
						width: 382rpx;
						overflow: hidden;
						white-space: nowrap;
						text-overflow: ellipsis;
						font-size: 26rpx;
					}

					.good_spec {
						margin-top: 20rpx;
						font-size: 22rpx;
						color: #999999;
					}

					.num {
						position: absolute;
						bottom: 0rpx;
						right: 0rpx;
						font-size: 24rpx;
						color: #333333;
					}
				}
			}

		}

		.part_no_goods {
			width: 520rpx;
			height: 60rpx;
			font-size: 30rpx;
			color: white;

			display: flex;
			align-items: center;
			margin: 0 auto;
			border-radius: 30rpx;
			margin-top: 15rpx;

			.return {
				width: 50%;
				height: 60rpx;
				line-height: 60rpx;
				background-color: #FF8809;
				text-align: center;
				border-radius: 30rpx 0 0 30rpx;
			}

			.remove {
				width: 50%;
				height: 60rpx;
				line-height: 60rpx;
				background-color: #F90208;
				text-align: center;
				border-radius: 0 30rpx 30rpx 0;
			}
		}
	}

	.part_no_goods_another {
		width: 520rpx;
		height: 60rpx;
		font-size: 30rpx;
		color: white;
		display: flex;
		align-items: center;
		margin: 0 auto;
		border-radius: 30rpx;
		background-color: #F90208;

		.return {
			width: 100%;
			text-align: center;
		}
	}

	.agreement-part {
		width: 100%;
		font-size: 24rpx;
		color: #999999;
		text-align: center;
		box-sizing: border-box;
		padding: 15rpx 0 15rpx 10rpx;

		.register_icon {
			width: 46rpx;
			height: 46rpx;
		}

		.agreement {
			color: #FC1E1E;
			border-bottom: 1rpx solid #FC1E1E;
		}
	}
</style>