|  | @@ -1,15 +1,15 @@
 | 
	
		
			
				|  |  |  <template>
 | 
	
		
			
				|  |  |  	<uni-popup ref="selectPopup" :safe-area="false" type="bottom">
 | 
	
		
			
				|  |  | -		<view class="header-text">开场前{{listData.earlyRefundTime||'--'}}分钟随时退</view>
 | 
	
		
			
				|  |  | +		<view class="header-text">开场前{{ listData.earlyRefundTime || '--' }}分钟随时退</view>
 | 
	
		
			
				|  |  |  		<view class="select-popup">
 | 
	
		
			
				|  |  |  			<view class="pop-title">选择场次</view>
 | 
	
		
			
				|  |  |  			<view class="pop-date-list">
 | 
	
		
			
				|  |  |  				<scroll-view scroll-x="true" class="scroll-view_H">
 | 
	
		
			
				|  |  | -					<view class="scroll-view-item" v-for="(item,index) in listData.stadiumConcertsVOList" :key="index"
 | 
	
		
			
				|  |  | -						@click="sel_tab(item,index)">
 | 
	
		
			
				|  |  | -						<view class="today-time">{{item.weekDayAndDate}}</view>
 | 
	
		
			
				|  |  | -						<view class="num">{{item.noDayConcertsReservationNum||'0'}}场可订</view>
 | 
	
		
			
				|  |  | -						<view class="line" v-if="deteObj==index"></view>
 | 
	
		
			
				|  |  | +					<view class="scroll-view-item" v-for="(item, index) in listData.stadiumConcertsVOList" :key="index"
 | 
	
		
			
				|  |  | +						@click="sel_tab(item, index)">
 | 
	
		
			
				|  |  | +						<view class="today-time">{{ item.weekDayAndDate }}</view>
 | 
	
		
			
				|  |  | +						<view class="num">{{ item.noDayConcertsReservationNum || '0' }}场可订</view>
 | 
	
		
			
				|  |  | +						<view class="line" v-if="deteObj == index"></view>
 | 
	
		
			
				|  |  |  					</view>
 | 
	
		
			
				|  |  |  				</scroll-view>
 | 
	
		
			
				|  |  |  			</view>
 | 
	
	
		
			
				|  | @@ -17,35 +17,38 @@
 | 
	
		
			
				|  |  |  				<view class="time-list">
 | 
	
		
			
				|  |  |  					<view class="time-title">时间段</view>
 | 
	
		
			
				|  |  |  					<block
 | 
	
		
			
				|  |  | -						v-for="(concert,index) in listData.stadiumConcertsVOList[0].concertsVOList[0].concertsDetailsVOList"
 | 
	
		
			
				|  |  | +						v-for="(concert, index) in listData.stadiumConcertsVOList[0].concertsVOList[0].concertsDetailsVOList"
 | 
	
		
			
				|  |  |  						:key="index">
 | 
	
		
			
				|  |  | -						<view class="item-time">{{concert.startTime}}-{{concert.endTime}}</view>
 | 
	
		
			
				|  |  | +						<view class="item-time">{{ concert.startTime }}-{{ concert.endTime }}</view>
 | 
	
		
			
				|  |  |  					</block>
 | 
	
		
			
				|  |  |  				</view>
 | 
	
		
			
				|  |  |  				<view class="table-list">
 | 
	
		
			
				|  |  |  					<scroll-view scroll-x="true" class="table-scroll">
 | 
	
		
			
				|  |  | -						<view class="father-list" v-for="(conc,index) in itemList" :key="index"
 | 
	
		
			
				|  |  | +						<view class="father-list" v-for="(conc, index) in itemList" :key="index"
 | 
	
		
			
				|  |  |  							style="vertical-align: top;">
 | 
	
		
			
				|  |  | -							<view class="father-title">{{conc.sitePlaceName}}</view>
 | 
	
		
			
				|  |  | -							<view class="children-list" v-for="(concert,index) in conc.concertsDetailsVOList"
 | 
	
		
			
				|  |  | +							<view class="father-title">{{ conc.sitePlaceName }}</view>
 | 
	
		
			
				|  |  | +							<view class="children-list" v-for="(concert, index) in conc.concertsDetailsVOList"
 | 
	
		
			
				|  |  |  								:key="index">
 | 
	
		
			
				|  |  |  								<view class="item-card" :class="{ selected: isSelected(concert) }"
 | 
	
		
			
				|  |  | -									@click="selectItem(conc, concert)">
 | 
	
		
			
				|  |  | -									¥{{concert.price}}
 | 
	
		
			
				|  |  | +									@click="selectItem(conc, concert)" v-if="concert.concertStatus==0">
 | 
	
		
			
				|  |  | +									¥{{ concert.price }}
 | 
	
		
			
				|  |  | +								</view>
 | 
	
		
			
				|  |  | +								<view class="item-card" style="color: #AAA;" v-if="concert.concertStatus==1">
 | 
	
		
			
				|  |  | +									已选
 | 
	
		
			
				|  |  |  								</view>
 | 
	
		
			
				|  |  |  							</view>
 | 
	
		
			
				|  |  |  						</view>
 | 
	
		
			
				|  |  |  					</scroll-view>
 | 
	
		
			
				|  |  |  				</view>
 | 
	
		
			
				|  |  |  			</view>
 | 
	
		
			
				|  |  | -			<view class="select-list" v-if="selArr.length>0">
 | 
	
		
			
				|  |  | +			<view class="select-list" v-if="selArr.length > 0">
 | 
	
		
			
				|  |  |  				<view class="select-title">已选场次</view>
 | 
	
		
			
				|  |  |  				<scroll-view scroll-x="true" class="select-scroll">
 | 
	
		
			
				|  |  | -					<view class="item-list" v-for="(item,index) in selArr" :key="index">
 | 
	
		
			
				|  |  | +					<view class="item-list" v-for="(item, index) in selArr" :key="index">
 | 
	
		
			
				|  |  |  						<view class="list-box">
 | 
	
		
			
				|  |  |  							<view class="list-text">
 | 
	
		
			
				|  |  | -								<view class="">{{item.time}}</view>
 | 
	
		
			
				|  |  | -								<view class="">{{item.name}}</view>
 | 
	
		
			
				|  |  | +								<view class="">{{ item.time }}</view>
 | 
	
		
			
				|  |  | +								<view class="">{{ item.name }}</view>
 | 
	
		
			
				|  |  |  							</view>
 | 
	
		
			
				|  |  |  							<view @click="deleteSelarr(item)"> <zzx-icon name="cancel" size="12"></zzx-icon></view>
 | 
	
		
			
				|  |  |  						</view>
 | 
	
	
		
			
				|  | @@ -56,7 +59,7 @@
 | 
	
		
			
				|  |  |  			<view class="footer-submit">
 | 
	
		
			
				|  |  |  				<view class="f-price">
 | 
	
		
			
				|  |  |  					<view class="">总价</view>
 | 
	
		
			
				|  |  | -					<view class="">¥{{priceTotal.toFixed(2)}}</view>
 | 
	
		
			
				|  |  | +					<view class="">¥{{ priceTotal.toFixed(2) }}</view>
 | 
	
		
			
				|  |  |  				</view>
 | 
	
		
			
				|  |  |  				<view class="f-btn" @click="submit_order">
 | 
	
		
			
				|  |  |  					<button>提交订单</button>
 | 
	
	
		
			
				|  | @@ -66,42 +69,46 @@
 | 
	
		
			
				|  |  |  	</uni-popup>
 | 
	
		
			
				|  |  |  	<view v-if="isopenDetail">
 | 
	
		
			
				|  |  |  		<uni-popup ref="orderPopup" :safe-area="false" type="bottom">
 | 
	
		
			
				|  |  | -			<view class="header-text">开场前{{previewgymOrderDetail.earlyRefundTime||'--'}}分钟随时退</view>
 | 
	
		
			
				|  |  | +			<view class="header-text">开场前{{ previewgymOrderDetail.earlyRefundTime || '--' }}分钟随时退</view>
 | 
	
		
			
				|  |  |  			<view class="order-popup">
 | 
	
		
			
				|  |  |  				<view class="p-header-card">
 | 
	
		
			
				|  |  |  					<view class="p-school-info">
 | 
	
		
			
				|  |  |  						<zzx-icon name="pay-icon1" size="16"></zzx-icon>
 | 
	
		
			
				|  |  | -						<view class="name">{{previewgymOrderDetail.storeName}}</view>
 | 
	
		
			
				|  |  | +						<view class="name">{{ previewgymOrderDetail.storeName }}</view>
 | 
	
		
			
				|  |  |  					</view>
 | 
	
		
			
				|  |  |  					<view class="p-title">羽毛球场地预定</view>
 | 
	
		
			
				|  |  |  					<view class="p-preset">
 | 
	
		
			
				|  |  | -						<view class="preset-info" v-for="item in previewgymOrderDetail.timePeriod" :key="item.id">{{item.name}}</view>
 | 
	
		
			
				|  |  | +						<view class="preset-info" v-for="item in previewgymOrderDetail.timePeriod" :key="item.id">
 | 
	
		
			
				|  |  | +							{{ item.name }}</view>
 | 
	
		
			
				|  |  |  					</view>
 | 
	
		
			
				|  |  |  				</view>
 | 
	
		
			
				|  |  |  				<view class="p-price-card">
 | 
	
		
			
				|  |  |  					<view class="p-price">
 | 
	
		
			
				|  |  | -						<view class="text">商品总价(共{{previewgymOrderDetail.timePeriod.length}}场)</view>
 | 
	
		
			
				|  |  | -						<view class="price"><text class="mini-text">¥</text>{{previewgymOrderDetail.subtotal}}</view>
 | 
	
		
			
				|  |  | +						<view class="text">商品总价(共{{ previewgymOrderDetail.timePeriod.length }}场)</view>
 | 
	
		
			
				|  |  | +						<view class="price"><text class="mini-text">¥</text>{{ previewgymOrderDetail.subtotal }}</view>
 | 
	
		
			
				|  |  |  					</view>
 | 
	
		
			
				|  |  |  					<view class="p-subtotal">
 | 
	
		
			
				|  |  |  						<text>小计</text>
 | 
	
		
			
				|  |  | -						<view class="total-price"><text class="mini-text">¥</text>{{previewgymOrderDetail.totalPrice}}</view>
 | 
	
		
			
				|  |  | +						<view class="total-price"><text class="mini-text">¥</text>{{ previewgymOrderDetail.totalPrice }}
 | 
	
		
			
				|  |  | +						</view>
 | 
	
		
			
				|  |  |  					</view>
 | 
	
		
			
				|  |  |  				</view>
 | 
	
		
			
				|  |  |  				<view class="p-phone-card">
 | 
	
		
			
				|  |  |  					<view class="p-phone">
 | 
	
		
			
				|  |  |  						<view class="text">手机号码</view>
 | 
	
		
			
				|  |  | -						<view class="phone">{{phoneHide(previewgymOrderDetail.mobile)}}</view>
 | 
	
		
			
				|  |  | +						<view class="phone" v-if="previewgymOrderDetail.mobile">{{ previewgymOrderDetail.mobile ?
 | 
	
		
			
				|  |  | +							phoneHide(previewgymOrderDetail.mobile) : '' }}</view>
 | 
	
		
			
				|  |  |  					</view>
 | 
	
		
			
				|  |  |  					<view class="tips">请通话畅通,商家需要联系您确认到店时间</view>
 | 
	
		
			
				|  |  |  				</view>
 | 
	
		
			
				|  |  |  				<view class="p-rules-card">
 | 
	
		
			
				|  |  |  					<view class="p-title">退改规则</view>
 | 
	
		
			
				|  |  | -					<view class="p-text">每场开场前<text>{{previewgymOrderDetail.earlyRefundTime}}分钟</text>可随时退改,之后不可退款。如您有疑问,可联系场馆。</view>
 | 
	
		
			
				|  |  | +					<view class="p-text">
 | 
	
		
			
				|  |  | +						每场开场前<text>{{ previewgymOrderDetail.earlyRefundTime }}分钟</text>可随时退改,之后不可退款。如您有疑问,可联系场馆。</view>
 | 
	
		
			
				|  |  |  				</view>
 | 
	
		
			
				|  |  |  				<view class="p-rules-card">
 | 
	
		
			
				|  |  |  					<view class="p-title">温馨提示</view>
 | 
	
		
			
				|  |  | -					<view class="p-text">{{previewgymOrderDetail.reminder}}</view>
 | 
	
		
			
				|  |  | +					<view class="p-text">{{ previewgymOrderDetail.reminder }}</view>
 | 
	
		
			
				|  |  |  				</view>
 | 
	
		
			
				|  |  |  				<view class="p-remark">
 | 
	
		
			
				|  |  |  					<view class="title">备注</view>
 | 
	
	
		
			
				|  | @@ -109,8 +116,9 @@
 | 
	
		
			
				|  |  |  				</view>
 | 
	
		
			
				|  |  |  				<view style="height: 200rpx;"></view>
 | 
	
		
			
				|  |  |  				<view class="footer-pay">
 | 
	
		
			
				|  |  | -					<button hover-class="hover-style">
 | 
	
		
			
				|  |  | -						<view class="btn-price"><text class="mini-text">¥</text>{{previewgymOrderDetail.totalPrice}}</view>
 | 
	
		
			
				|  |  | +					<button hover-class="hover-style" @click="submitOrder">
 | 
	
		
			
				|  |  | +						<view class="btn-price"><text class="mini-text">¥</text>{{ previewgymOrderDetail.totalPrice }}
 | 
	
		
			
				|  |  | +						</view>
 | 
	
		
			
				|  |  |  						<view class="btn-text">立即支付</view>
 | 
	
		
			
				|  |  |  					</button>
 | 
	
		
			
				|  |  |  				</view>
 | 
	
	
		
			
				|  | @@ -120,509 +128,524 @@
 | 
	
		
			
				|  |  |  </template>
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  <script lang="ts" setup>
 | 
	
		
			
				|  |  | -	import { ref,onMounted, computed } from 'vue';
 | 
	
		
			
				|  |  | -	import { http } from '@/utils/http'
 | 
	
		
			
				|  |  | -	import { TipsUtils,phoneHide } from '@/utils/util';
 | 
	
		
			
				|  |  | -	interface Props {
 | 
	
		
			
				|  |  | -		listData ?: any;
 | 
	
		
			
				|  |  | -		itemList ?: any;
 | 
	
		
			
				|  |  | -		deteObj?:any
 | 
	
		
			
				|  |  | -	}
 | 
	
		
			
				|  |  | -	const props = withDefaults(defineProps<Props>(), {
 | 
	
		
			
				|  |  | -		listData: [],
 | 
	
		
			
				|  |  | -		itemList: [],
 | 
	
		
			
				|  |  | -		deteObj:null
 | 
	
		
			
				|  |  | -	});
 | 
	
		
			
				|  |  | -	const selectPopup = ref();
 | 
	
		
			
				|  |  | -	const orderPopup = ref()
 | 
	
		
			
				|  |  | -	const sel_index = ref(0);
 | 
	
		
			
				|  |  | -	const time_list = ref([])
 | 
	
		
			
				|  |  | -	onMounted(()=>{
 | 
	
		
			
				|  |  | -		
 | 
	
		
			
				|  |  | -	})
 | 
	
		
			
				|  |  | -	const open = () => {
 | 
	
		
			
				|  |  | -		selectPopup.value.open()
 | 
	
		
			
				|  |  | -	}
 | 
	
		
			
				|  |  | -	defineExpose({
 | 
	
		
			
				|  |  | -		open
 | 
	
		
			
				|  |  | -	})
 | 
	
		
			
				|  |  | -	const emit = defineEmits(['change']);
 | 
	
		
			
				|  |  | -	const sel_tab = (e, i) => {
 | 
	
		
			
				|  |  | -		emit('change', e, i);
 | 
	
		
			
				|  |  | +import { ref, onMounted, computed, nextTick } from 'vue';
 | 
	
		
			
				|  |  | +import { http } from '@/utils/http'
 | 
	
		
			
				|  |  | +import { TipsUtils, phoneHide, RouterUtils } from '@/utils/util';
 | 
	
		
			
				|  |  | +interface Props {
 | 
	
		
			
				|  |  | +	listData?: any;
 | 
	
		
			
				|  |  | +	itemList?: any;
 | 
	
		
			
				|  |  | +	deteObj?: any
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +const props = withDefaults(defineProps<Props>(), {
 | 
	
		
			
				|  |  | +	listData: [],
 | 
	
		
			
				|  |  | +	itemList: [],
 | 
	
		
			
				|  |  | +	deteObj: null
 | 
	
		
			
				|  |  | +});
 | 
	
		
			
				|  |  | +const selectPopup = ref();
 | 
	
		
			
				|  |  | +const orderPopup = ref()
 | 
	
		
			
				|  |  | +const sel_index = ref(0);
 | 
	
		
			
				|  |  | +const time_list = ref([])
 | 
	
		
			
				|  |  | +onMounted(() => {
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +})
 | 
	
		
			
				|  |  | +const open = () => {
 | 
	
		
			
				|  |  | +	selectPopup.value.open()
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +defineExpose({
 | 
	
		
			
				|  |  | +	open
 | 
	
		
			
				|  |  | +})
 | 
	
		
			
				|  |  | +const emit = defineEmits(['change']);
 | 
	
		
			
				|  |  | +const sel_tab = (e, i) => {
 | 
	
		
			
				|  |  | +	emit('change', e, i);
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +const selArr = ref([])
 | 
	
		
			
				|  |  | +const selectItem = (item1, item2) => {
 | 
	
		
			
				|  |  | +	const existingIndex = selArr.value.findIndex(item => item.id === item2.id);
 | 
	
		
			
				|  |  | +	if (existingIndex !== -1) {
 | 
	
		
			
				|  |  | +		selArr.value.splice(existingIndex, 1);
 | 
	
		
			
				|  |  | +	} else {
 | 
	
		
			
				|  |  | +		selArr.value.push({
 | 
	
		
			
				|  |  | +			name: item1.sitePlaceName,
 | 
	
		
			
				|  |  | +			time: item2.startTime + '-' + item2.endTime,
 | 
	
		
			
				|  |  | +			price: item2.price,
 | 
	
		
			
				|  |  | +			id: item2.id
 | 
	
		
			
				|  |  | +		});
 | 
	
		
			
				|  |  |  	}
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -	const selArr = ref([])
 | 
	
		
			
				|  |  | -	const selectItem = (item1, item2) => {
 | 
	
		
			
				|  |  | -		const existingIndex = selArr.value.findIndex(item => item.id === item2.id);
 | 
	
		
			
				|  |  | -		if (existingIndex !== -1) {
 | 
	
		
			
				|  |  | -			selArr.value.splice(existingIndex, 1);
 | 
	
		
			
				|  |  | -		} else {
 | 
	
		
			
				|  |  | -			selArr.value.push({
 | 
	
		
			
				|  |  | -				name: item1.sitePlaceName,
 | 
	
		
			
				|  |  | -				time: item2.startTime + '-' + item2.endTime,
 | 
	
		
			
				|  |  | -				price: item2.price,
 | 
	
		
			
				|  |  | -				id: item2.id
 | 
	
		
			
				|  |  | -			});
 | 
	
		
			
				|  |  | -		}
 | 
	
		
			
				|  |  | -	}
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -	const isSelected = (concert) => {
 | 
	
		
			
				|  |  | -		return selArr.value.some(item => item.id === concert.id);
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +const isSelected = (concert) => {
 | 
	
		
			
				|  |  | +	return selArr.value.some(item => item.id === concert.id);
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +const priceTotal = computed(() => {
 | 
	
		
			
				|  |  | +	return selArr.value.reduce((total, item) => {
 | 
	
		
			
				|  |  | +		return total + item.price
 | 
	
		
			
				|  |  | +	}, 0)
 | 
	
		
			
				|  |  | +})
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +const deleteSelarr = (item) => {
 | 
	
		
			
				|  |  | +	const index = selArr.value.findIndex(selItem => selItem.id === item.id);
 | 
	
		
			
				|  |  | +	if (index !== -1) {
 | 
	
		
			
				|  |  | +		selArr.value.splice(index, 1);
 | 
	
		
			
				|  |  |  	}
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -	const priceTotal = computed(() => {
 | 
	
		
			
				|  |  | -		return selArr.value.reduce((total, item) => {
 | 
	
		
			
				|  |  | -			return total + item.price
 | 
	
		
			
				|  |  | -		}, 0)
 | 
	
		
			
				|  |  | -	})
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -	const deleteSelarr = (item) => {
 | 
	
		
			
				|  |  | -		const index = selArr.value.findIndex(selItem => selItem.id === item.id);
 | 
	
		
			
				|  |  | -		if (index !== -1) {
 | 
	
		
			
				|  |  | -			selArr.value.splice(index, 1);
 | 
	
		
			
				|  |  | -		}
 | 
	
		
			
				|  |  | +const submit_order = () => {
 | 
	
		
			
				|  |  | +	if (selArr.value.length < 1) {
 | 
	
		
			
				|  |  | +		return TipsUtils.tips_toast('请选择场次')
 | 
	
		
			
				|  |  |  	}
 | 
	
		
			
				|  |  | -	
 | 
	
		
			
				|  |  | -	const submit_order = () => {
 | 
	
		
			
				|  |  | -		if(selArr.value.length<1){
 | 
	
		
			
				|  |  | -			return TipsUtils.tips_toast('请选择场次')
 | 
	
		
			
				|  |  | -		}
 | 
	
		
			
				|  |  | -		get_previewOrderPlaceGymnasiumChartered()
 | 
	
		
			
				|  |  | -	}
 | 
	
		
			
				|  |  | -	
 | 
	
		
			
				|  |  | -	const previewgymOrderDetail=ref()
 | 
	
		
			
				|  |  | -	const isopenDetail = ref(false)
 | 
	
		
			
				|  |  | -	const get_previewOrderPlaceGymnasiumChartered=()=>{
 | 
	
		
			
				|  |  | -		const result = selArr.value.map(item => item.id).join(',')
 | 
	
		
			
				|  |  | -		http.get('/order/previewOrderPlaceGymnasiumChartered',{data:{rulesId:result},loading:true}).then((res)=>{
 | 
	
		
			
				|  |  | -			previewgymOrderDetail.value=res.result
 | 
	
		
			
				|  |  | -			isopenDetail.value=true
 | 
	
		
			
				|  |  | -			setTimeout(()=>{
 | 
	
		
			
				|  |  | -				selectPopup.value.close()
 | 
	
		
			
				|  |  | -				orderPopup.value.open()
 | 
	
		
			
				|  |  | -			},500)
 | 
	
		
			
				|  |  | +	get_previewOrderPlaceGymnasiumChartered()
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +const previewgymOrderDetail = ref()
 | 
	
		
			
				|  |  | +const isopenDetail = ref(false)
 | 
	
		
			
				|  |  | +const get_previewOrderPlaceGymnasiumChartered = () => {
 | 
	
		
			
				|  |  | +	const result = selArr.value.map(item => item.id).join(',')
 | 
	
		
			
				|  |  | +	http.get('/order/previewOrderPlaceGymnasiumChartered', { data: { rulesId: result }, loading: true }).then((res) => {
 | 
	
		
			
				|  |  | +		previewgymOrderDetail.value = res.result
 | 
	
		
			
				|  |  | +		isopenDetail.value = true
 | 
	
		
			
				|  |  | +		orderFormData.value.productIds = res.result.timePeriod.map(item => item.id).join(',')
 | 
	
		
			
				|  |  | +		orderFormData.value.amount = res.result.timePeriod.length
 | 
	
		
			
				|  |  | +		nextTick(() => {
 | 
	
		
			
				|  |  | +			selectPopup.value.close()
 | 
	
		
			
				|  |  | +			orderPopup.value && orderPopup.value.open()
 | 
	
		
			
				|  |  |  		})
 | 
	
		
			
				|  |  | -	}
 | 
	
		
			
				|  |  | +	})
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +// 提交订单
 | 
	
		
			
				|  |  | +const orderFormData = ref({
 | 
	
		
			
				|  |  | +	type: 0,
 | 
	
		
			
				|  |  | +	orderType: 1,
 | 
	
		
			
				|  |  | +	productIds: null,
 | 
	
		
			
				|  |  | +	amount: null,
 | 
	
		
			
				|  |  | +})
 | 
	
		
			
				|  |  | +const submitOrder = () => {
 | 
	
		
			
				|  |  | +	http.post('/order/createOrder', orderFormData.value, { loading: true }).then((res) => {
 | 
	
		
			
				|  |  | +		RouterUtils.to_page(`/pages/index/toBeUsed/index?orderId=${res.result.orderId}&orderType=0`)
 | 
	
		
			
				|  |  | +	})
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  |  </script>
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  |  <style lang="less" scoped>
 | 
	
		
			
				|  |  | -	.header-text {
 | 
	
		
			
				|  |  | -		margin: auto;
 | 
	
		
			
				|  |  | -		background: linear-gradient(90deg, #C8FF0C 0%, rgba(100, 128, 6, 0) 100%);
 | 
	
		
			
				|  |  | -		border-radius: 60rpx;
 | 
	
		
			
				|  |  | -		width: 286rpx;
 | 
	
		
			
				|  |  | -		height: 54rpx;
 | 
	
		
			
				|  |  | -		text-align: center;
 | 
	
		
			
				|  |  | -		line-height: 54rpx;
 | 
	
		
			
				|  |  | -		font-size: 24rpx;
 | 
	
		
			
				|  |  | -		color: #FFFFFF;
 | 
	
		
			
				|  |  | -		margin-bottom: 20rpx;
 | 
	
		
			
				|  |  | +.header-text {
 | 
	
		
			
				|  |  | +	margin: auto;
 | 
	
		
			
				|  |  | +	background: linear-gradient(90deg, #C8FF0C 0%, rgba(100, 128, 6, 0) 100%);
 | 
	
		
			
				|  |  | +	border-radius: 60rpx;
 | 
	
		
			
				|  |  | +	width: 286rpx;
 | 
	
		
			
				|  |  | +	height: 54rpx;
 | 
	
		
			
				|  |  | +	text-align: center;
 | 
	
		
			
				|  |  | +	line-height: 54rpx;
 | 
	
		
			
				|  |  | +	font-size: 24rpx;
 | 
	
		
			
				|  |  | +	color: #FFFFFF;
 | 
	
		
			
				|  |  | +	margin-bottom: 20rpx;
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +.select-popup {
 | 
	
		
			
				|  |  | +	background: #F6F6F6;
 | 
	
		
			
				|  |  | +	border-radius: 32rpx 32rpx 0rpx 0rpx;
 | 
	
		
			
				|  |  | +	max-height: 1200rpx;
 | 
	
		
			
				|  |  | +	overflow: auto;
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +	.pop-title {
 | 
	
		
			
				|  |  | +		font-weight: bold;
 | 
	
		
			
				|  |  | +		font-size: 28rpx;
 | 
	
		
			
				|  |  | +		color: #222222;
 | 
	
		
			
				|  |  | +		padding: 20rpx;
 | 
	
		
			
				|  |  |  	}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -	.select-popup {
 | 
	
		
			
				|  |  | -		background: #F6F6F6;
 | 
	
		
			
				|  |  | -		border-radius: 32rpx 32rpx 0rpx 0rpx;
 | 
	
		
			
				|  |  | -		max-height: 1200rpx;
 | 
	
		
			
				|  |  | -		overflow: auto;
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -		.pop-title {
 | 
	
		
			
				|  |  | -			font-weight: bold;
 | 
	
		
			
				|  |  | -			font-size: 28rpx;
 | 
	
		
			
				|  |  | -			color: #222222;
 | 
	
		
			
				|  |  | -			padding: 20rpx;
 | 
	
		
			
				|  |  | -		}
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -		.pop-date-list {
 | 
	
		
			
				|  |  | -			border-bottom: 1rpx solid #F0F0F0;
 | 
	
		
			
				|  |  | -			background: #FFFFFF;
 | 
	
		
			
				|  |  | -			padding: 20rpx;
 | 
	
		
			
				|  |  | -			border-radius: 24rpx;
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -			.scroll-view_H {
 | 
	
		
			
				|  |  | -				white-space: nowrap;
 | 
	
		
			
				|  |  | -				width: 100%;
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -				.scroll-view-item {
 | 
	
		
			
				|  |  | -					display: inline-block;
 | 
	
		
			
				|  |  | -					text-align: center;
 | 
	
		
			
				|  |  | -					margin-right: 30rpx;
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -					.today-time {
 | 
	
		
			
				|  |  | -						font-weight: bold;
 | 
	
		
			
				|  |  | -						font-size: 28rpx;
 | 
	
		
			
				|  |  | -						color: #222222;
 | 
	
		
			
				|  |  | -					}
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -					.num {
 | 
	
		
			
				|  |  | -						margin-top: 8rpx;
 | 
	
		
			
				|  |  | -						font-size: 24rpx;
 | 
	
		
			
				|  |  | -						color: #AAAAAA;
 | 
	
		
			
				|  |  | -					}
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -					.line {
 | 
	
		
			
				|  |  | -						margin: auto;
 | 
	
		
			
				|  |  | -						width: 50rpx;
 | 
	
		
			
				|  |  | -						height: 8rpx;
 | 
	
		
			
				|  |  | -						background: #C8FF0C;
 | 
	
		
			
				|  |  | -						transition: width 2s ease;
 | 
	
		
			
				|  |  | -					}
 | 
	
		
			
				|  |  | -				}
 | 
	
		
			
				|  |  | -			}
 | 
	
		
			
				|  |  | -		}
 | 
	
		
			
				|  |  | +	.pop-date-list {
 | 
	
		
			
				|  |  | +		border-bottom: 1rpx solid #F0F0F0;
 | 
	
		
			
				|  |  | +		background: #FFFFFF;
 | 
	
		
			
				|  |  | +		padding: 20rpx;
 | 
	
		
			
				|  |  | +		border-radius: 24rpx;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -		.gym-list {
 | 
	
		
			
				|  |  | -			display: flex;
 | 
	
		
			
				|  |  | -			background: #FFFFFF;
 | 
	
		
			
				|  |  | -			padding: 20rpx;
 | 
	
		
			
				|  |  | +		.scroll-view_H {
 | 
	
		
			
				|  |  | +			white-space: nowrap;
 | 
	
		
			
				|  |  | +			width: 100%;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -			.time-list {
 | 
	
		
			
				|  |  | -				width: 180rpx;
 | 
	
		
			
				|  |  | +			.scroll-view-item {
 | 
	
		
			
				|  |  | +				display: inline-block;
 | 
	
		
			
				|  |  | +				text-align: center;
 | 
	
		
			
				|  |  | +				margin-right: 30rpx;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -				.time-title {
 | 
	
		
			
				|  |  | -					height: 60rpx;
 | 
	
		
			
				|  |  | -					line-height: 60rpx;
 | 
	
		
			
				|  |  | -					text-align: center;
 | 
	
		
			
				|  |  | +				.today-time {
 | 
	
		
			
				|  |  |  					font-weight: bold;
 | 
	
		
			
				|  |  | -					font-size: 24rpx;
 | 
	
		
			
				|  |  | +					font-size: 28rpx;
 | 
	
		
			
				|  |  |  					color: #222222;
 | 
	
		
			
				|  |  |  				}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -				.item-time {
 | 
	
		
			
				|  |  | -					margin-bottom: 20rpx;
 | 
	
		
			
				|  |  | -					height: 54rpx;
 | 
	
		
			
				|  |  | +				.num {
 | 
	
		
			
				|  |  | +					margin-top: 8rpx;
 | 
	
		
			
				|  |  |  					font-size: 24rpx;
 | 
	
		
			
				|  |  | -					color: #222222;
 | 
	
		
			
				|  |  | -					line-height: 54rpx;
 | 
	
		
			
				|  |  | +					color: #AAAAAA;
 | 
	
		
			
				|  |  |  				}
 | 
	
		
			
				|  |  | -			}
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -			.table-list {
 | 
	
		
			
				|  |  | -				width: 610rpx;
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -				.table-scroll {
 | 
	
		
			
				|  |  | -					white-space: nowrap;
 | 
	
		
			
				|  |  | -					width: 100%;
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -					.father-list {
 | 
	
		
			
				|  |  | -						display: inline-block;
 | 
	
		
			
				|  |  | -						margin-right: 20rpx;
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -						.father-title {
 | 
	
		
			
				|  |  | -							height: 60rpx;
 | 
	
		
			
				|  |  | -							line-height: 60rpx;
 | 
	
		
			
				|  |  | -							text-align: center;
 | 
	
		
			
				|  |  | -							font-weight: bold;
 | 
	
		
			
				|  |  | -							font-size: 24rpx;
 | 
	
		
			
				|  |  | -							color: #222222;
 | 
	
		
			
				|  |  | -						}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -						.children-list {
 | 
	
		
			
				|  |  | -							margin-bottom: 20rpx;
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -							.item-card {
 | 
	
		
			
				|  |  | -								width: 124rpx;
 | 
	
		
			
				|  |  | -								height: 54rpx;
 | 
	
		
			
				|  |  | -								background: #F6F6F6;
 | 
	
		
			
				|  |  | -								border-radius: 8rpx;
 | 
	
		
			
				|  |  | -								font-weight: bold;
 | 
	
		
			
				|  |  | -								font-size: 24rpx;
 | 
	
		
			
				|  |  | -								color: #222222;
 | 
	
		
			
				|  |  | -								text-align: center;
 | 
	
		
			
				|  |  | -								line-height: 54rpx;
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -								&.selected {
 | 
	
		
			
				|  |  | -									background: #C8FF0C !important;
 | 
	
		
			
				|  |  | -								}
 | 
	
		
			
				|  |  | -							}
 | 
	
		
			
				|  |  | -						}
 | 
	
		
			
				|  |  | -					}
 | 
	
		
			
				|  |  | +				.line {
 | 
	
		
			
				|  |  | +					margin: auto;
 | 
	
		
			
				|  |  | +					width: 50rpx;
 | 
	
		
			
				|  |  | +					height: 8rpx;
 | 
	
		
			
				|  |  | +					background: #C8FF0C;
 | 
	
		
			
				|  |  | +					transition: width 2s ease;
 | 
	
		
			
				|  |  |  				}
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  |  			}
 | 
	
		
			
				|  |  |  		}
 | 
	
		
			
				|  |  | +	}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -		.select-list {
 | 
	
		
			
				|  |  | -			padding: 20rpx;
 | 
	
		
			
				|  |  | +	.gym-list {
 | 
	
		
			
				|  |  | +		display: flex;
 | 
	
		
			
				|  |  | +		background: #FFFFFF;
 | 
	
		
			
				|  |  | +		padding: 20rpx;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -			.select-title {
 | 
	
		
			
				|  |  | +		.time-list {
 | 
	
		
			
				|  |  | +			width:180rpx;
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +			.time-title {
 | 
	
		
			
				|  |  | +				height: 60rpx;
 | 
	
		
			
				|  |  | +				line-height: 60rpx;
 | 
	
		
			
				|  |  | +				text-align: center;
 | 
	
		
			
				|  |  |  				font-weight: bold;
 | 
	
		
			
				|  |  | -				font-size: 28rpx;
 | 
	
		
			
				|  |  | +				font-size: 24rpx;
 | 
	
		
			
				|  |  | +				color: #222222;
 | 
	
		
			
				|  |  | +			}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +			.item-time {
 | 
	
		
			
				|  |  | +				margin-bottom: 20rpx;
 | 
	
		
			
				|  |  | +				height: 54rpx;
 | 
	
		
			
				|  |  | +				font-size: 24rpx;
 | 
	
		
			
				|  |  |  				color: #222222;
 | 
	
		
			
				|  |  | +				line-height: 54rpx;
 | 
	
		
			
				|  |  |  			}
 | 
	
		
			
				|  |  | +		}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +		.table-list {
 | 
	
		
			
				|  |  | +			width: 560rpx;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -			.select-scroll {
 | 
	
		
			
				|  |  | +			.table-scroll {
 | 
	
		
			
				|  |  |  				white-space: nowrap;
 | 
	
		
			
				|  |  |  				width: 100%;
 | 
	
		
			
				|  |  | -				margin-top: 20rpx;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -				.item-list {
 | 
	
		
			
				|  |  | +				.father-list {
 | 
	
		
			
				|  |  |  					display: inline-block;
 | 
	
		
			
				|  |  | -					padding: 20rpx;
 | 
	
		
			
				|  |  | -					width: 180rpx;
 | 
	
		
			
				|  |  | -					height: 60rpx;
 | 
	
		
			
				|  |  | -					background: #FFFFFF;
 | 
	
		
			
				|  |  | -					border-radius: 16rpx;
 | 
	
		
			
				|  |  |  					margin-right: 20rpx;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -					.list-box {
 | 
	
		
			
				|  |  | -						display: flex;
 | 
	
		
			
				|  |  | -						align-items: center;
 | 
	
		
			
				|  |  | -						justify-content: space-between;
 | 
	
		
			
				|  |  | +					.father-title {
 | 
	
		
			
				|  |  | +						height: 60rpx;
 | 
	
		
			
				|  |  | +						line-height: 60rpx;
 | 
	
		
			
				|  |  | +						text-align: center;
 | 
	
		
			
				|  |  | +						font-weight: bold;
 | 
	
		
			
				|  |  | +						font-size: 24rpx;
 | 
	
		
			
				|  |  | +						color: #222222;
 | 
	
		
			
				|  |  | +					}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +					.children-list {
 | 
	
		
			
				|  |  | +						margin-bottom: 20rpx;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -						.list-text {
 | 
	
		
			
				|  |  | +						.item-card {
 | 
	
		
			
				|  |  | +							width: 124rpx;
 | 
	
		
			
				|  |  | +							height: 54rpx;
 | 
	
		
			
				|  |  | +							background: #F6F6F6;
 | 
	
		
			
				|  |  | +							border-radius: 8rpx;
 | 
	
		
			
				|  |  |  							font-weight: bold;
 | 
	
		
			
				|  |  |  							font-size: 24rpx;
 | 
	
		
			
				|  |  |  							color: #222222;
 | 
	
		
			
				|  |  | +							text-align: center;
 | 
	
		
			
				|  |  | +							line-height: 54rpx;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -							&>view:last-child {
 | 
	
		
			
				|  |  | -								margin-top: 8rpx;
 | 
	
		
			
				|  |  | +							&.selected {
 | 
	
		
			
				|  |  | +								background: #C8FF0C !important;
 | 
	
		
			
				|  |  |  							}
 | 
	
		
			
				|  |  |  						}
 | 
	
		
			
				|  |  |  					}
 | 
	
		
			
				|  |  |  				}
 | 
	
		
			
				|  |  |  			}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  |  		}
 | 
	
		
			
				|  |  | +	}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -		.footer-submit {
 | 
	
		
			
				|  |  | -			position: fixed;
 | 
	
		
			
				|  |  | -			display: flex;
 | 
	
		
			
				|  |  | -			align-items: center;
 | 
	
		
			
				|  |  | -			justify-content: space-between;
 | 
	
		
			
				|  |  | -			width: 710rpx;
 | 
	
		
			
				|  |  | -			height: 166rpx;
 | 
	
		
			
				|  |  | -			background: #FFFFFF;
 | 
	
		
			
				|  |  | -			box-shadow: 0rpx -6rpx 12rpx 2rpx rgba(0, 0, 0, 0.09);
 | 
	
		
			
				|  |  | -			border-radius: 32rpx 32rpx 0rpx 0rpx;
 | 
	
		
			
				|  |  | -			bottom: 0;
 | 
	
		
			
				|  |  | -			padding: 0 20rpx;
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -			.f-price {
 | 
	
		
			
				|  |  | -				display: flex;
 | 
	
		
			
				|  |  | -				align-items: center;
 | 
	
		
			
				|  |  | -				gap: 16rpx;
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -				&>view:first-child {
 | 
	
		
			
				|  |  | -					font-weight: bold;
 | 
	
		
			
				|  |  | -					font-size: 28rpx;
 | 
	
		
			
				|  |  | -					color: #222222;
 | 
	
		
			
				|  |  | -				}
 | 
	
		
			
				|  |  | +	.select-list {
 | 
	
		
			
				|  |  | +		padding: 20rpx;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -				&>view:last-child {
 | 
	
		
			
				|  |  | -					font-weight: 800;
 | 
	
		
			
				|  |  | -					font-size: 48rpx;
 | 
	
		
			
				|  |  | -					color: #FB5B5B;
 | 
	
		
			
				|  |  | -				}
 | 
	
		
			
				|  |  | -			}
 | 
	
		
			
				|  |  | +		.select-title {
 | 
	
		
			
				|  |  | +			font-weight: bold;
 | 
	
		
			
				|  |  | +			font-size: 28rpx;
 | 
	
		
			
				|  |  | +			color: #222222;
 | 
	
		
			
				|  |  | +		}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -			.f-btn {
 | 
	
		
			
				|  |  | -				&>button {
 | 
	
		
			
				|  |  | -					width: 226rpx;
 | 
	
		
			
				|  |  | -					height: 100rpx;
 | 
	
		
			
				|  |  | -					background: #C8FF0C;
 | 
	
		
			
				|  |  | -					border-radius: 60rpx;
 | 
	
		
			
				|  |  | -					line-height: 100rpx;
 | 
	
		
			
				|  |  | -					text-align: center;
 | 
	
		
			
				|  |  | -					font-weight: bold;
 | 
	
		
			
				|  |  | -					font-size: 32rpx;
 | 
	
		
			
				|  |  | -					color: #222222;
 | 
	
		
			
				|  |  | -				}
 | 
	
		
			
				|  |  | +		.select-scroll {
 | 
	
		
			
				|  |  | +			white-space: nowrap;
 | 
	
		
			
				|  |  | +			width: 100%;
 | 
	
		
			
				|  |  | +			margin-top: 20rpx;
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +			.item-list {
 | 
	
		
			
				|  |  | +				display: inline-block;
 | 
	
		
			
				|  |  | +				padding: 20rpx;
 | 
	
		
			
				|  |  | +				width: 180rpx;
 | 
	
		
			
				|  |  | +				height: 60rpx;
 | 
	
		
			
				|  |  | +				background: #FFFFFF;
 | 
	
		
			
				|  |  | +				border-radius: 16rpx;
 | 
	
		
			
				|  |  | +				margin-right: 20rpx;
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +				.list-box {
 | 
	
		
			
				|  |  | +					display: flex;
 | 
	
		
			
				|  |  | +					align-items: center;
 | 
	
		
			
				|  |  | +					justify-content: space-between;
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +					.list-text {
 | 
	
		
			
				|  |  | +						font-weight: bold;
 | 
	
		
			
				|  |  | +						font-size: 24rpx;
 | 
	
		
			
				|  |  | +						color: #222222;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -				&>button::after {
 | 
	
		
			
				|  |  | -					border: none;
 | 
	
		
			
				|  |  | +						&>view:last-child {
 | 
	
		
			
				|  |  | +							margin-top: 8rpx;
 | 
	
		
			
				|  |  | +						}
 | 
	
		
			
				|  |  | +					}
 | 
	
		
			
				|  |  |  				}
 | 
	
		
			
				|  |  |  			}
 | 
	
		
			
				|  |  |  		}
 | 
	
		
			
				|  |  |  	}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -	.order-popup {
 | 
	
		
			
				|  |  | -		background: #F6F6F6;
 | 
	
		
			
				|  |  | +	.footer-submit {
 | 
	
		
			
				|  |  | +		position: fixed;
 | 
	
		
			
				|  |  | +		display: flex;
 | 
	
		
			
				|  |  | +		align-items: center;
 | 
	
		
			
				|  |  | +		justify-content: space-between;
 | 
	
		
			
				|  |  | +		width: 710rpx;
 | 
	
		
			
				|  |  | +		height: 166rpx;
 | 
	
		
			
				|  |  | +		background: #FFFFFF;
 | 
	
		
			
				|  |  | +		box-shadow: 0rpx -6rpx 12rpx 2rpx rgba(0, 0, 0, 0.09);
 | 
	
		
			
				|  |  |  		border-radius: 32rpx 32rpx 0rpx 0rpx;
 | 
	
		
			
				|  |  | -		max-height: 1200rpx;
 | 
	
		
			
				|  |  | -		overflow: auto;
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -		.p-header-card {
 | 
	
		
			
				|  |  | -			background: #fff;
 | 
	
		
			
				|  |  | -			padding: 20rpx;
 | 
	
		
			
				|  |  | -			margin-top: 20rpx;
 | 
	
		
			
				|  |  | +		bottom: 0;
 | 
	
		
			
				|  |  | +		padding: 0 20rpx;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -			.p-school-info {
 | 
	
		
			
				|  |  | -				display: flex;
 | 
	
		
			
				|  |  | -				align-items: center;
 | 
	
		
			
				|  |  | -				gap: 10rpx;
 | 
	
		
			
				|  |  | -				font-size: 24rpx;
 | 
	
		
			
				|  |  | -				color: #AAAAAA;
 | 
	
		
			
				|  |  | -			}
 | 
	
		
			
				|  |  | +		.f-price {
 | 
	
		
			
				|  |  | +			display: flex;
 | 
	
		
			
				|  |  | +			align-items: center;
 | 
	
		
			
				|  |  | +			gap: 16rpx;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -			.p-title {
 | 
	
		
			
				|  |  | -				margin-top: 20rpx;
 | 
	
		
			
				|  |  | +			&>view:first-child {
 | 
	
		
			
				|  |  |  				font-weight: bold;
 | 
	
		
			
				|  |  |  				font-size: 28rpx;
 | 
	
		
			
				|  |  |  				color: #222222;
 | 
	
		
			
				|  |  |  			}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -			.p-preset {
 | 
	
		
			
				|  |  | -				font-size: 24rpx;
 | 
	
		
			
				|  |  | -				color: #AAAAAA;
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -				.preset-info {
 | 
	
		
			
				|  |  | -					margin-top: 20rpx;
 | 
	
		
			
				|  |  | -				}
 | 
	
		
			
				|  |  | +			&>view:last-child {
 | 
	
		
			
				|  |  | +				font-weight: 800;
 | 
	
		
			
				|  |  | +				font-size: 48rpx;
 | 
	
		
			
				|  |  | +				color: #FB5B5B;
 | 
	
		
			
				|  |  |  			}
 | 
	
		
			
				|  |  |  		}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -		.p-price-card {
 | 
	
		
			
				|  |  | -			background: #fff;
 | 
	
		
			
				|  |  | -			padding: 20rpx;
 | 
	
		
			
				|  |  | -			margin-top: 20rpx;
 | 
	
		
			
				|  |  | +		.f-btn {
 | 
	
		
			
				|  |  | +			&>button {
 | 
	
		
			
				|  |  | +				width: 226rpx;
 | 
	
		
			
				|  |  | +				height: 100rpx;
 | 
	
		
			
				|  |  | +				background: #C8FF0C;
 | 
	
		
			
				|  |  | +				border-radius: 60rpx;
 | 
	
		
			
				|  |  | +				line-height: 100rpx;
 | 
	
		
			
				|  |  | +				text-align: center;
 | 
	
		
			
				|  |  | +				font-weight: bold;
 | 
	
		
			
				|  |  | +				font-size: 32rpx;
 | 
	
		
			
				|  |  | +				color: #222222;
 | 
	
		
			
				|  |  | +			}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -			.p-price {
 | 
	
		
			
				|  |  | -				display: flex;
 | 
	
		
			
				|  |  | -				align-items: center;
 | 
	
		
			
				|  |  | -				justify-content: space-between;
 | 
	
		
			
				|  |  | -				height: 114rpx;
 | 
	
		
			
				|  |  | -				border-bottom: 1rpx solid #F0F0F0;
 | 
	
		
			
				|  |  | +			&>button::after {
 | 
	
		
			
				|  |  | +				border: none;
 | 
	
		
			
				|  |  | +			}
 | 
	
		
			
				|  |  | +		}
 | 
	
		
			
				|  |  | +	}
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -				.text {
 | 
	
		
			
				|  |  | -					font-weight: bold;
 | 
	
		
			
				|  |  | -					font-size: 28rpx;
 | 
	
		
			
				|  |  | -					color: #222222;
 | 
	
		
			
				|  |  | -				}
 | 
	
		
			
				|  |  | +.order-popup {
 | 
	
		
			
				|  |  | +	background: #F6F6F6;
 | 
	
		
			
				|  |  | +	border-radius: 32rpx 32rpx 0rpx 0rpx;
 | 
	
		
			
				|  |  | +	max-height: 1200rpx;
 | 
	
		
			
				|  |  | +	overflow: auto;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -				.price {
 | 
	
		
			
				|  |  | -					font-weight: 800;
 | 
	
		
			
				|  |  | -					font-size: 48rpx;
 | 
	
		
			
				|  |  | -					color: #222222;
 | 
	
		
			
				|  |  | -				}
 | 
	
		
			
				|  |  | -			}
 | 
	
		
			
				|  |  | +	.p-header-card {
 | 
	
		
			
				|  |  | +		background: #fff;
 | 
	
		
			
				|  |  | +		padding: 20rpx;
 | 
	
		
			
				|  |  | +		margin-top: 20rpx;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -			.p-subtotal {
 | 
	
		
			
				|  |  | -				display: flex;
 | 
	
		
			
				|  |  | -				align-items: center;
 | 
	
		
			
				|  |  | -				justify-content: flex-end;
 | 
	
		
			
				|  |  | -				gap: 16rpx;
 | 
	
		
			
				|  |  | -				margin-top: 20rpx;
 | 
	
		
			
				|  |  | +		.p-school-info {
 | 
	
		
			
				|  |  | +			display: flex;
 | 
	
		
			
				|  |  | +			align-items: center;
 | 
	
		
			
				|  |  | +			gap: 10rpx;
 | 
	
		
			
				|  |  | +			font-size: 24rpx;
 | 
	
		
			
				|  |  | +			color: #AAAAAA;
 | 
	
		
			
				|  |  | +		}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -				&>text:nth-child(1) {
 | 
	
		
			
				|  |  | -					font-weight: bold;
 | 
	
		
			
				|  |  | -					font-size: 28rpx;
 | 
	
		
			
				|  |  | -					color: #222222;
 | 
	
		
			
				|  |  | -				}
 | 
	
		
			
				|  |  | +		.p-title {
 | 
	
		
			
				|  |  | +			margin-top: 20rpx;
 | 
	
		
			
				|  |  | +			font-weight: bold;
 | 
	
		
			
				|  |  | +			font-size: 28rpx;
 | 
	
		
			
				|  |  | +			color: #222222;
 | 
	
		
			
				|  |  | +		}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -				.total-price {
 | 
	
		
			
				|  |  | -					font-weight: 800;
 | 
	
		
			
				|  |  | -					font-size: 48rpx;
 | 
	
		
			
				|  |  | -					color: #FB5B5B;
 | 
	
		
			
				|  |  | -				}
 | 
	
		
			
				|  |  | +		.p-preset {
 | 
	
		
			
				|  |  | +			font-size: 24rpx;
 | 
	
		
			
				|  |  | +			color: #AAAAAA;
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +			.preset-info {
 | 
	
		
			
				|  |  | +				margin-top: 20rpx;
 | 
	
		
			
				|  |  |  			}
 | 
	
		
			
				|  |  |  		}
 | 
	
		
			
				|  |  | +	}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -		.p-phone-card {
 | 
	
		
			
				|  |  | -			background: #fff;
 | 
	
		
			
				|  |  | -			padding: 20rpx;
 | 
	
		
			
				|  |  | -			margin-top: 20rpx;
 | 
	
		
			
				|  |  | +	.p-price-card {
 | 
	
		
			
				|  |  | +		background: #fff;
 | 
	
		
			
				|  |  | +		padding: 20rpx;
 | 
	
		
			
				|  |  | +		margin-top: 20rpx;
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +		.p-price {
 | 
	
		
			
				|  |  | +			display: flex;
 | 
	
		
			
				|  |  | +			align-items: center;
 | 
	
		
			
				|  |  | +			justify-content: space-between;
 | 
	
		
			
				|  |  | +			height: 114rpx;
 | 
	
		
			
				|  |  | +			border-bottom: 1rpx solid #F0F0F0;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -			.p-phone {
 | 
	
		
			
				|  |  | -				display: flex;
 | 
	
		
			
				|  |  | -				align-items: center;
 | 
	
		
			
				|  |  | -				justify-content: space-between;
 | 
	
		
			
				|  |  | +			.text {
 | 
	
		
			
				|  |  |  				font-weight: bold;
 | 
	
		
			
				|  |  |  				font-size: 28rpx;
 | 
	
		
			
				|  |  |  				color: #222222;
 | 
	
		
			
				|  |  |  			}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -			.tips {
 | 
	
		
			
				|  |  | -				margin-top: 20rpx;
 | 
	
		
			
				|  |  | -				font-size: 24rpx;
 | 
	
		
			
				|  |  | -				color: #AAAAAA;
 | 
	
		
			
				|  |  | +			.price {
 | 
	
		
			
				|  |  | +				font-weight: 800;
 | 
	
		
			
				|  |  | +				font-size: 48rpx;
 | 
	
		
			
				|  |  | +				color: #222222;
 | 
	
		
			
				|  |  |  			}
 | 
	
		
			
				|  |  |  		}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -		.p-rules-card {
 | 
	
		
			
				|  |  | -			background: #fff;
 | 
	
		
			
				|  |  | -			padding: 20rpx;
 | 
	
		
			
				|  |  | +		.p-subtotal {
 | 
	
		
			
				|  |  | +			display: flex;
 | 
	
		
			
				|  |  | +			align-items: center;
 | 
	
		
			
				|  |  | +			justify-content: flex-end;
 | 
	
		
			
				|  |  | +			gap: 16rpx;
 | 
	
		
			
				|  |  |  			margin-top: 20rpx;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -			.p-title {
 | 
	
		
			
				|  |  | +			&>text:nth-child(1) {
 | 
	
		
			
				|  |  |  				font-weight: bold;
 | 
	
		
			
				|  |  |  				font-size: 28rpx;
 | 
	
		
			
				|  |  |  				color: #222222;
 | 
	
		
			
				|  |  |  			}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -			.p-text {
 | 
	
		
			
				|  |  | -				margin-top: 20rpx;
 | 
	
		
			
				|  |  | -				font-size: 24rpx;
 | 
	
		
			
				|  |  | -				color: #AAAAAA;
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -				&>text {
 | 
	
		
			
				|  |  | -					color: #222222;
 | 
	
		
			
				|  |  | -				}
 | 
	
		
			
				|  |  | +			.total-price {
 | 
	
		
			
				|  |  | +				font-weight: 800;
 | 
	
		
			
				|  |  | +				font-size: 48rpx;
 | 
	
		
			
				|  |  | +				color: #FB5B5B;
 | 
	
		
			
				|  |  |  			}
 | 
	
		
			
				|  |  |  		}
 | 
	
		
			
				|  |  | +	}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +	.p-phone-card {
 | 
	
		
			
				|  |  | +		background: #fff;
 | 
	
		
			
				|  |  | +		padding: 20rpx;
 | 
	
		
			
				|  |  | +		margin-top: 20rpx;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -		.p-remark {
 | 
	
		
			
				|  |  | +		.p-phone {
 | 
	
		
			
				|  |  |  			display: flex;
 | 
	
		
			
				|  |  |  			align-items: center;
 | 
	
		
			
				|  |  | -			gap: 10rpx;
 | 
	
		
			
				|  |  | -			background: #fff;
 | 
	
		
			
				|  |  | -			padding: 20rpx;
 | 
	
		
			
				|  |  | +			justify-content: space-between;
 | 
	
		
			
				|  |  | +			font-weight: bold;
 | 
	
		
			
				|  |  | +			font-size: 28rpx;
 | 
	
		
			
				|  |  | +			color: #222222;
 | 
	
		
			
				|  |  | +		}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -			.title {
 | 
	
		
			
				|  |  | -				width: 60rpx;
 | 
	
		
			
				|  |  | -				font-size: 24rpx;
 | 
	
		
			
				|  |  | +		.tips {
 | 
	
		
			
				|  |  | +			margin-top: 20rpx;
 | 
	
		
			
				|  |  | +			font-size: 24rpx;
 | 
	
		
			
				|  |  | +			color: #AAAAAA;
 | 
	
		
			
				|  |  | +		}
 | 
	
		
			
				|  |  | +	}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +	.p-rules-card {
 | 
	
		
			
				|  |  | +		background: #fff;
 | 
	
		
			
				|  |  | +		padding: 20rpx;
 | 
	
		
			
				|  |  | +		margin-top: 20rpx;
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +		.p-title {
 | 
	
		
			
				|  |  | +			font-weight: bold;
 | 
	
		
			
				|  |  | +			font-size: 28rpx;
 | 
	
		
			
				|  |  | +			color: #222222;
 | 
	
		
			
				|  |  | +		}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +		.p-text {
 | 
	
		
			
				|  |  | +			margin-top: 20rpx;
 | 
	
		
			
				|  |  | +			font-size: 24rpx;
 | 
	
		
			
				|  |  | +			color: #AAAAAA;
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +			&>text {
 | 
	
		
			
				|  |  |  				color: #222222;
 | 
	
		
			
				|  |  |  			}
 | 
	
		
			
				|  |  | +		}
 | 
	
		
			
				|  |  | +	}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -			&>input {
 | 
	
		
			
				|  |  | -				width: 690rpx;
 | 
	
		
			
				|  |  | -				font-size: 24rpx;
 | 
	
		
			
				|  |  | -				color: #757575;
 | 
	
		
			
				|  |  | -			}
 | 
	
		
			
				|  |  | +	.p-remark {
 | 
	
		
			
				|  |  | +		display: flex;
 | 
	
		
			
				|  |  | +		align-items: center;
 | 
	
		
			
				|  |  | +		gap: 10rpx;
 | 
	
		
			
				|  |  | +		background: #fff;
 | 
	
		
			
				|  |  | +		padding: 20rpx;
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +		.title {
 | 
	
		
			
				|  |  | +			width: 60rpx;
 | 
	
		
			
				|  |  | +			font-size: 24rpx;
 | 
	
		
			
				|  |  | +			color: #222222;
 | 
	
		
			
				|  |  |  		}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -		.footer-pay {
 | 
	
		
			
				|  |  | -			position: fixed;
 | 
	
		
			
				|  |  | +		&>input {
 | 
	
		
			
				|  |  | +			width: 690rpx;
 | 
	
		
			
				|  |  | +			font-size: 24rpx;
 | 
	
		
			
				|  |  | +			color: #757575;
 | 
	
		
			
				|  |  | +		}
 | 
	
		
			
				|  |  | +	}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +	.footer-pay {
 | 
	
		
			
				|  |  | +		position: fixed;
 | 
	
		
			
				|  |  | +		display: flex;
 | 
	
		
			
				|  |  | +		align-items: center;
 | 
	
		
			
				|  |  | +		justify-content: space-between;
 | 
	
		
			
				|  |  | +		width: 710rpx;
 | 
	
		
			
				|  |  | +		height: 166rpx;
 | 
	
		
			
				|  |  | +		background: #FFFFFF;
 | 
	
		
			
				|  |  | +		box-shadow: 0rpx -6rpx 12rpx 2rpx rgba(0, 0, 0, 0.09);
 | 
	
		
			
				|  |  | +		border-radius: 32rpx 32rpx 0rpx 0rpx;
 | 
	
		
			
				|  |  | +		bottom: 0;
 | 
	
		
			
				|  |  | +		padding: 0 20rpx;
 | 
	
		
			
				|  |  | +		z-index: 9999;
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +		&>button {
 | 
	
		
			
				|  |  | +			width: 686rpx;
 | 
	
		
			
				|  |  | +			height: 100rpx;
 | 
	
		
			
				|  |  | +			background: #C8FF0C;
 | 
	
		
			
				|  |  | +			border-radius: 60rpx;
 | 
	
		
			
				|  |  |  			display: flex;
 | 
	
		
			
				|  |  |  			align-items: center;
 | 
	
		
			
				|  |  | -			justify-content: space-between;
 | 
	
		
			
				|  |  | -			width: 710rpx;
 | 
	
		
			
				|  |  | -			height: 166rpx;
 | 
	
		
			
				|  |  | -			background: #FFFFFF;
 | 
	
		
			
				|  |  | -			box-shadow: 0rpx -6rpx 12rpx 2rpx rgba(0, 0, 0, 0.09);
 | 
	
		
			
				|  |  | -			border-radius: 32rpx 32rpx 0rpx 0rpx;
 | 
	
		
			
				|  |  | -			bottom: 0;
 | 
	
		
			
				|  |  | -			padding: 0 20rpx;
 | 
	
		
			
				|  |  | -			z-index: 9999;
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -			&>button {
 | 
	
		
			
				|  |  | -				width: 686rpx;
 | 
	
		
			
				|  |  | -				height: 100rpx;
 | 
	
		
			
				|  |  | -				background: #C8FF0C;
 | 
	
		
			
				|  |  | -				border-radius: 60rpx;
 | 
	
		
			
				|  |  | -				display: flex;
 | 
	
		
			
				|  |  | -				align-items: center;
 | 
	
		
			
				|  |  | -				justify-content: center;
 | 
	
		
			
				|  |  | -				gap: 10rpx;
 | 
	
		
			
				|  |  | -
 | 
	
		
			
				|  |  | -				&>button::after {
 | 
	
		
			
				|  |  | -					border: none;
 | 
	
		
			
				|  |  | -				}
 | 
	
		
			
				|  |  | +			justify-content: center;
 | 
	
		
			
				|  |  | +			gap: 10rpx;
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -				.btn-price {
 | 
	
		
			
				|  |  | -					font-weight: 800;
 | 
	
		
			
				|  |  | -					font-size: 48rpx;
 | 
	
		
			
				|  |  | -					color: #222222;
 | 
	
		
			
				|  |  | -				}
 | 
	
		
			
				|  |  | +			&>button::after {
 | 
	
		
			
				|  |  | +				border: none;
 | 
	
		
			
				|  |  | +			}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -				.btn-text {
 | 
	
		
			
				|  |  | -					font-weight: bold;
 | 
	
		
			
				|  |  | -					font-size: 32rpx;
 | 
	
		
			
				|  |  | -					color: #222222;
 | 
	
		
			
				|  |  | -				}
 | 
	
		
			
				|  |  | +			.btn-price {
 | 
	
		
			
				|  |  | +				font-weight: 800;
 | 
	
		
			
				|  |  | +				font-size: 48rpx;
 | 
	
		
			
				|  |  | +				color: #222222;
 | 
	
		
			
				|  |  |  			}
 | 
	
		
			
				|  |  |  
 | 
	
		
			
				|  |  | -			.hover-style {
 | 
	
		
			
				|  |  | -				color: #999999;
 | 
	
		
			
				|  |  | +			.btn-text {
 | 
	
		
			
				|  |  | +				font-weight: bold;
 | 
	
		
			
				|  |  | +				font-size: 32rpx;
 | 
	
		
			
				|  |  | +				color: #222222;
 | 
	
		
			
				|  |  |  			}
 | 
	
		
			
				|  |  |  		}
 | 
	
		
			
				|  |  | +
 | 
	
		
			
				|  |  | +		.hover-style {
 | 
	
		
			
				|  |  | +			color: #999999;
 | 
	
		
			
				|  |  | +		}
 | 
	
		
			
				|  |  |  	}
 | 
	
		
			
				|  |  | +}
 | 
	
		
			
				|  |  |  </style>
 |