You can not select more than 25 topics
			Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
		
		
		
		
		
			
		
			
				
					
					
						
							1249 lines
						
					
					
						
							29 KiB
						
					
					
				
			
		
		
		
			
			
			
				
					
				
				
					
				
			
		
		
	
	
							1249 lines
						
					
					
						
							29 KiB
						
					
					
				| <template> | |
| 	<view class="bg"> | |
| 		<view class="order-goods-container" v-for="(item,i) in orderList" :key="i"> | |
| 			<view class="top-box1" > | |
| 				<view class="top-left"> | |
| 					<view class="title text-overflow">{{ item.pInfo.title }}</view> | |
| 					<view> | |
| 						<view style="padding: 20rpx 0 10rpx;" v-if="item.allSeldDate.length > 0"> | |
| 						{{item.showDate.date}} {{ShowDateDay(new Date(item.showDate.date).getDay())}}</view> | |
| 						<view v-if="item.showDate.startTime">{{ item.showDate.startTime }}-{{ item.showDate.endTime }} 入园</view> | |
| 					</view> | |
| 				</view> | |
| 				<view class="top-edit" @click="changeSku(item)">修改 <uni-icons style="height: 20rpx;" color="#6A8A27" type="right" size="12"></uni-icons></view> | |
| 			</view> | |
| 			<view class="tickets-box"> | |
| 				<view class="w-full num-box"> | |
| 					<view class="flex-between num-left"> | |
| 						<view class="left-title text-overflow">{{item.sInfo.sku_name}}</view> | |
| 						<view class="left-price">{{item.sInfo.price / 100}}</view> | |
| 						<view class="num-right"> | |
| 							<view :class="['btn-num',item.sInfo.buyNum<=1?'disabled':'']"   @click="delNumber(item.sInfo)" >-</view> | |
| 							<view class="num-span">{{ item.sInfo.buyNum }}</view> | |
| 							<view class="btn-num"  @click="addNumber(item.sInfo)" >+</view> | |
| 						</view> | |
| 					</view> | |
| 					<view style="padding: 30rpx 0 20rpx;" class="num-subtitle text-overflow" @click="showpopRule(true, item.sInfo)"> | |
| 						<view class="flex" v-if="item.sInfo.display_tags"> | |
| 							{{item.sInfo.display_tags.split(',').join(" | ")}} | |
| 							<text style="padding:0 4rpx">|</text> | |
| 						</view> | |
| 						<view > 预订须知 ></view> | |
| 					</view> | |
| 				</view> | |
| 				 | |
| 			</view> | |
| 		</view> | |
| 		 | |
| 		<view class="people-box" > | |
| 			<view class="people-box-title">出行人信息</view> | |
| 			<view style="padding: 42rpx 0 10rpx;"> | |
| 				<view class="people-box-sku"> | |
| 					<view class="w-full flex flex-items-center"  style="padding-bottom: 33rpx;font-size: 29rpx;"> | |
| 						<view style="width: 170rpx;" class="flex-shrink-0">联系手机</view> | |
| 						<view class="flex flex-between flex-1 w-1rpx" > | |
| 							<input class="input" type="text" placeholder="请输入手机号" v-model="phone" /> | |
| 							<uni-icons v-if="phone&&phone.length>0" | |
| 								type="closeempty" size="14" @click="clearTel()"></uni-icons> | |
| 						</view> | |
| 					</view> | |
| 				</view> | |
| 			</view> | |
| 		</view> | |
| 		 | |
| 		<!-- 优惠券 --> | |
| 		<view @click="goOrderCoupon" class="tickets-container flex-between top-line" v-if="!isShoppingCart"> | |
| 			<view class="order-title">优惠券</view> | |
| 			<view class="coupon-btn" v-if="coupon==''"> | |
| 				<view class="select">选择优惠券</view> | |
| 				<uni-icons style="height: 42rpx;" color="#999999" type="right" size="18"></uni-icons> | |
| 			</view> | |
| 			<div class="coupon-price" v-else> | |
| 				<span v-if="coupon.activity.fold == 0">-¥{{coupon.activity.money/100}}</span> | |
| 				<span v-else>-{{coupon.activity.fold*10}}%</span> | |
| 				<span style="margin:0 31rpx 0 8rpx;color: #6C7A94;">></span> | |
| 			</div> | |
| 		 </view> | |
| 		 | |
| 		<view class="btn-list"> | |
| 			<view class="price-box"> | |
| 				<view class="text">合计:</view> | |
| 				<view class="price">{{ total() }}</view> | |
| 			</view> | |
| 			<view class="btn" @click="order()">去支付</view> | |
| 		</view> | |
| 		 | |
| 		 | |
| 		<!-- 预订须知的弹窗 --> | |
| 		<uni-popup ref="popupRule" type="bottom" :safe-area="false"> | |
| 			<view class="popup-content-date flex-column flex" > | |
| 				<view class="popup-content-title flex"> | |
| 					<view class="flex-1 w-1rpx text-overflow"> | |
| 						{{skuInfo.sku_name}} | |
| 					</view> | |
| 					<img src="https://static.ticket.sz-trip.com/taizhou/images/cha.png" @click="showpopRule(null)" | |
| 						style="width: 20rpx;height: 20rpx;" class="flex-shrink-0"> | |
| 				</view>	 | |
| 				<view class="content flex-1 h-1rpx no-scrollbar" v-if="skuInfo && skuInfo.sku_model"> | |
| 					<view class="detail-content" v-html="formateRichText(skuInfo.sku_model.bookinfo)"></view> | |
| 				</view> | |
| 			</view> | |
| 		</uni-popup> | |
| 	 | |
| 		<!-- 预定弹窗 --> | |
| 		<uni-popup ref="popup" type="bottom" :safe-area="false"> | |
| 			<view class="popup-content-date calendar-edit" v-if="singleOrder.sInfo && singleOrder.sInfo.id"> | |
| 				<view class="popup-content-title flex"> | |
| 					<view class="flex-1 w-1rpx text-overflow"> | |
| 						{{singleOrder.sInfo.sku_name}} | |
| 					</view> | |
| 					<img src="https://static.ticket.sz-trip.com/taizhou/images/cha.png" @click="closePopup" | |
| 						style="width: 31rpx;height: 31rpx;" class="flex-shrink-0"> | |
| 				</view>				 | |
| 				<view class="order-popup-detail"> | |
| 					<view style="position: relative;"> | |
| 						<view class="sku-title">使用日期</view> | |
| 						<view class="date-content"> | |
| 							<view :class="['item', item.stock>0?'':'disabled',singleOrder.seldDateIndex===index?'active':'']"  | |
| 							v-for="(item,index) in singleOrder.allSeldDate" :key="index" | |
| 							@click="clickTab(item,index)"> | |
| 								<view>{{ShowDateDay(new Date(item.date).getDay())}}</view> | |
| 								<view>{{item.date.slice(-5)}}</view> | |
| 								<view class="price" v-if="item.stock > 0">¥{{item.price/100}}</view> | |
| 								<view v-else>不可定</view> | |
| 							</view> | |
| 						</view> | |
| 						<view class="dateMore" @click="openCalendar"> | |
| 							<view style="width: 55rpx;">更多日期</view> | |
| 							<view style="padding-left: 9rpx;">></view> | |
| 						</view> | |
| 					</view> | |
| 					 | |
| 					<view v-if="singleOrder.timesArr.length > 0 && singleOrder.sInfo.sku_model.is_time_stock"> | |
| 						<view class="sku-title">选择场次</view> | |
| 						<view class="time-box"> | |
| 							<view v-for="(item,index) in singleOrder.timesArr" :key="index"  | |
| 							:class="['time-item',{'time-disable': item.stock_number < 1, 'time-active': item.stock_number > 0 && index == singleOrder.seldTimeIndex}]"  | |
| 							@click="changeTime(item,index)"> | |
| 								{{ item.start_time }}-{{ item.end_time }} | |
| 								{{item.stock_number < 10 ? (item.stock_number === -1 ? '不可定' : item.stock_number === 0 ? '无票' : '(余票' + item.stock_number + ')') : '有票'}} | |
| 							</view> | |
| 						</view> | |
| 					</view> | |
| 				</view> | |
| 				<view class="sku-bottom"> | |
| 					<view class="flex" style="align-items: baseline;"> | |
| 						合计:<view class="bottom-price">{{singleOrder.allSeldDate[singleOrder.seldDateIndex].price / 100 || 0}}</view> | |
| 					</view> | |
| 					<view class="bottom-btn" @click="addBuyCard"> | |
| 							确定 | |
| 					</view> | |
| 				</view> | |
| 			</view> | |
| 		</uni-popup> | |
| 		 | |
| 		<uni-calendar ref="calendar" class="uni-calendar--hook" :clear-date="true"  | |
| 			:date="allSeldDate[seldDateIndex].date" :insert="false"  :startDate="calendarParam.startDate" | |
| 			:endDate="calendarParam.endDate"  @confirm="confirmCalendar" :selected="calendarParam.selected"/> | |
|  | |
| 		 | |
| 	</view> | |
| </template> | |
|  | |
| <script> | |
|  | |
| 	export default { | |
| 		components: {}, | |
| 		data() { | |
| 			return { | |
| 				// 下单产品 | |
| 				orderList: [], | |
| 				phone: '', | |
| 				 | |
| 				minSeldDate: new Date().Format('yyyy-MM-dd'), | |
| 				maxSeldDate: new Date((new Date().getTime()+60*24*60*60*1000)).Format('yyyy-MM-dd'), | |
| 				calendarParam: { | |
| 					stratDate:'',endDate: '', selected: [] | |
| 				}, | |
| 				coupon:'', | |
| 				 | |
| 				singleOrderForChange: {}, // 浅拷贝 | |
| 				singleOrder: {}, // 深拷贝修改的数据 | |
| 				 | |
| 				skuInfo: {}, // 预定须知当前点击的sku | |
| 				isShoppingCart: false, | |
| 			} | |
| 		}, | |
| 		onLoad(options) { | |
| 			if (options.isShoppingCart) { | |
| 				this.isShoppingCart = options.isShoppingCart | |
| 			} | |
| 			// this.getList(); | |
| 			this.$store.commit("choseCoupon", ""); | |
| 			this.initPageData() | |
| 			this.getUserInfo() | |
| 		}, | |
| 		 | |
| 		onShow() { | |
| 			if (!this.isShoppingCart) { | |
| 				this.coupon = this.$store.state.user.coupon | |
| 			} | |
| 		}, | |
|  | |
| 		methods: { | |
| 			goOrderCoupon () { | |
| 				let allPrice = 0 | |
| 				let skuIds= [] | |
| 				this.orderList.forEach(v=>{ | |
| 					allPrice+= v.sInfo.price*v.sInfo.buyNum | |
| 					if (v.sInfo.buyNum>0) { | |
| 						skuIds.push(v.sInfo.id) | |
| 					} | |
| 				}) | |
| 				uni.navigateTo({ | |
| 					url: `/subPackages/order/orderCoupon?allprice=${allPrice}&sku_ids=${skuIds.join(',')}` | |
| 				}) | |
| 			}, | |
| 			 | |
| 			// 获取最大优惠券 | |
| 			async getMaxCouponData () { | |
| 				let allPrice = 0 | |
| 				let skuIds= [] | |
| 				this.orderList.forEach(v=>{ | |
| 					allPrice+= v.sInfo.price*v.sInfo.buyNum | |
| 					if (v.sInfo.buyNum>0) { | |
| 						skuIds.push(v.sInfo.id) | |
| 					} | |
| 				}) | |
| 				let param = {sku_ids: skuIds.join(','), money: allPrice} | |
| 				let res = await this.getMaxCoupon(param) | |
| 				if (res.id) { | |
| 					this.coupon = res | |
| 				} | |
| 			}, | |
| 			 | |
| 			initPageData () { | |
| 				let data = this.$store.state.user.ticketOrderList; | |
| 				try{ | |
| 					data.forEach(v=>{ | |
| 						v.allSeldDate = v.allSeldDate || []; | |
| 						v.seldDateIndex = v.seldDateIndex>=0?v.seldDateIndex:-1 | |
| 						v.timesArr = v.timesArr || [] | |
| 						v.seldTimeIndex = v.seldTimeIndex>=0?v.seldTimeIndex:-1 | |
| 						v.showDate = { | |
| 							date: ((v.allSeldDate[v.seldDateIndex])||{}).date, | |
| 							startTime: (v.timesArr[v.seldTimeIndex]||{}).start_time, | |
| 							endTime: (v.timesArr[v.seldTimeIndex]||{}).end_time | |
| 						} | |
| 					}) | |
| 					this.orderList = data | |
| 					console.log(this.orderList) | |
| 					 | |
| 				} catch(e){ | |
| 					console.log(e) | |
| 				} | |
| 				if (!this.isShoppingCart) { | |
| 					this.getMaxCouponData() | |
| 				} | |
| 			}, | |
|  | |
| 			clearTel () {this.phone = ''}, | |
| 			 | |
| 			// 减少数量 | |
| 			delNumber(skuItem) { | |
| 				if (skuItem.buyNum <= 1) { | |
| 					return | |
| 				} | |
| 				skuItem.buyNum -= 1 | |
| 				this.$store.commit("choseCoupon",""); | |
| 				this.coupon = '' | |
|  | |
| 			}, | |
| 			// 增加数量 | |
| 			addNumber(skuItem) { | |
| 				skuItem.buyNum += 1 | |
| 				this.$store.commit("choseCoupon",""); | |
| 				this.coupon = '' | |
| 			 | |
| 			}, | |
| 			// 计算总价 | |
| 			total() { | |
| 				let price = 0 | |
| 				let allPrice = 0 | |
| 				this.orderList.forEach(v=>{ | |
| 					allPrice+= v.sInfo.price*v.sInfo.buyNum | |
| 				}) | |
| 				this.allprice = allPrice | |
| 				if (this.coupon) { | |
| 					if (this.coupon.activity.fold == 0) { | |
| 						if (this.coupon.activity.money>allPrice) { | |
| 							price =0 | |
| 						}else{ | |
| 							price = allPrice  - (this.coupon.activity.money) | |
| 						} | |
| 						 | |
| 					} else{ | |
| 						price = allPrice - allPrice * (this.coupon.activity.fold*10/100) | |
| 					} | |
| 				} else { | |
| 					price = allPrice | |
| 				} | |
| 				return price < 0 ? 0 : (price/100).toFixed(2) | |
| 			}, | |
| 			 | |
| 	 | |
| 			 | |
| 			// 预定须知 | |
| 			showpopRule(flag, item) { | |
| 				if (item) { | |
| 					this.skuInfo = item | |
| 				}  | |
| 				if (flag) { | |
| 					this.$refs.popupRule.open('bottom'); | |
| 				} else { | |
| 					this.$refs.popupRule.close(); | |
| 				} | |
| 			}, | |
| 			 | |
| 			/*---------------------------价格日历-----------------------------------*/ | |
| 			// 选择列表规格 | |
| 			changeSku(item) { | |
| 				this.singleOrderForChange = item | |
| 				this.singleOrder = JSON.parse(JSON.stringify(item))  | |
| 				// 重新获取分时 | |
| 				this.getPriceCal() | |
| 			}, | |
| 			// 获取价格日历列表 | |
| 			getPriceCal() { | |
| 				this.Post({ | |
| 					start_date: this.minSeldDate, | |
| 					end_date: this.maxSeldDate, | |
| 					sku_id: this.singleOrder.sInfo.id | |
| 				}, '/api/product/product_date_price').then(res => { | |
| 					this.singleOrder.allSeldDate = res.data || [] | |
| 					if (this.singleOrder.seldDateIndex<0) { | |
| 						this.singleOrder.seldDateIndex = this.singleOrder.allSeldDate.findIndex(item => item.stock > 0) | |
| 					} | |
| 					if (this.singleOrder.seldDateIndex<0) { | |
| 						uni.showToast({ | |
| 							title: '暂无库存', | |
| 							icon: 'none', | |
| 						}) | |
| 						return | |
| 					} | |
| 					this.getTimeStock(this.singleOrder.allSeldDate[this.singleOrder.seldDateIndex].date) | |
| 					this.openPop() | |
| 				}) | |
| 			}, | |
| 			// 获取规格分时库存 | |
| 			getTimeStock(date) { | |
| 				if (!this.singleOrder.sInfo.sku_model.is_time_stock || this.singleOrder.seldDateIndex<0) { | |
| 					return | |
| 				} | |
| 				this.Post({ | |
| 					sku_id: this.singleOrder.sInfo.id, | |
| 					date: date, | |
| 				}, '/api/product/product_timestock_price').then(res => { | |
| 					this.singleOrder.timesArr = res.data || [] | |
| 					if (this.singleOrder.seldTimeIndex<0) { | |
| 						this.singleOrder.seldTimeIndex = this.singleOrder.timesArr.findIndex(item => item.stock_number > 0) | |
| 					} | |
| 				}) | |
| 			}, | |
| 			 | |
| 			openCalendar () { | |
| 				this.calendarParam = { | |
| 					startDate: (this.singleOrder.allSeldDate.find(v=>v.stock>0) || {}).date, | |
| 					endDate: (this.singleOrder.allSeldDate[this.singleOrder.allSeldDate.findLastIndex(v=>v.stock>0)]||{}).date, | |
| 					selected: this.singleOrder.allSeldDate.filter(v=>v.stock>0).map(v=>{ | |
| 						return { | |
| 							date: v.date, | |
| 							info: '¥'+v.price/100, | |
| 							notNeedDot:true, | |
| 						} | |
| 					}) | |
| 				} | |
| 				this.$refs.calendar.open(); | |
| 			}, | |
|  | |
| 			// 选择日期 | |
| 			clickTab(item, index) { | |
| 				if (item.stock>0) { | |
| 					this.singleOrder.seldDateIndex = index | |
| 					this.getTimeStock(item.date) | |
| 				} | |
| 				 | |
| 			}, | |
| 			// 选择时段 | |
| 			changeTime(item, index) { | |
| 				if(item.stock_number > 0) { | |
| 					this.singleOrder.seldTimeIndex = index | |
| 				} | |
| 			}, | |
| 			confirmCalendar (val) { | |
| 				let index = this.singleOrder.allSeldDate.findIndex(v=>v.date == val.fulldate) | |
| 				if (index>=0) { | |
| 					this.clickTab(this.singleOrder.allSeldDate[index],index) | |
| 				} | |
| 			}, | |
| 			closePopup() { | |
| 				this.$refs.popup.close() | |
| 			}, | |
| 			openPop(){ | |
| 				this.$refs.popup.open() | |
| 			}, | |
| 			addBuyCard () { | |
| 				// 如果是分时,未选择分时 | |
| 				if(this.singleOrder.sInfo.is_time_stock && this.singleOrder.seldTimeIndex < 0) { | |
| 					uni.showToast({title:'请选择分时',icon:'none'}) | |
| 					return; | |
| 				} | |
| 				this.singleOrder.showDate = { | |
| 					date: ((this.singleOrder.allSeldDate[this.singleOrder.seldDateIndex])||{}).date, | |
| 					startTime: (this.singleOrder.timesArr[this.singleOrder.seldTimeIndex]||{}).start_time, | |
| 					endTime: (this.singleOrder.timesArr[this.singleOrder.seldTimeIndex]||{}).end_time | |
| 				} | |
| 				// 修改原本的数据 | |
| 				this.singleOrderForChange.allSeldDate = this.singleOrder.allSeldDate | |
| 				this.singleOrderForChange.timesArr = this.singleOrder.timesArr | |
| 				this.singleOrderForChange.seldDateIndex = this.singleOrder.seldDateIndex | |
| 				this.singleOrderForChange.seldTimeIndex = this.singleOrder.seldTimeIndex | |
| 				this.singleOrderForChange.showDate = this.singleOrder.showDate | |
| 				this.closePopup() | |
|  | |
| 			}, | |
| 			/*---------------------------价格日历-----------------------------------*/ | |
| 			order() { | |
| 				let goods = [] | |
| 				console.log(this.orderList) | |
| 				if (this.orderList.some(v=>!v.showDate.date)) { | |
| 					uni.showToast({title: '请选择价格日历',icon:'none'}) | |
| 					return | |
| 				} | |
| 				if (this.orderList.some(v=>v.sInfo.is_time_stock && v.seldTimeIndex < 0)) { | |
| 					uni.showToast({title:'请选择分时',icon:'none'}) | |
| 					return; | |
| 				} | |
| 				 | |
| 				// 设置参数 | |
| 				this.orderList.forEach(item=>{ | |
| 					item.phone = this.phone | |
| 					 | |
| 					let sku = item.sInfo | |
| 					let use_date = item.allSeldDate[item.seldDateIndex].date | |
| 					let start_time =(item.timesArr[item.seldTimeIndex]||{}).start_time | |
| 					let end_time = (item.timesArr[item.seldTimeIndex]||{}).end_time | |
| 					let param = { | |
| 						type: item.pInfo.type, | |
| 						product_id: item.pInfo.id, | |
| 						sku_id: sku.id, | |
| 						product_num: sku.buyNum, | |
| 						use_date: use_date, | |
| 						start_time: start_time||'', | |
| 						end_time: end_time||'', | |
| 						phone: this.phone, | |
| 						remark: item.remark, | |
| 					} | |
| 					goods.push(param) | |
| 				}) | |
| 				 | |
| 				// 如果是购物车下单 | |
| 				if (this.isShoppingCart) { | |
| 					this.$store.commit("changeTicketOrderList", this.orderList); | |
| 					// uni.setStorageSync("ticketOrderList", this.orderList) | |
| 					this.goCartNextPage(4) | |
| 					return | |
| 				} | |
| 				 | |
| 			 | |
| 				let data = { | |
| 					product_list: goods, | |
| 					coupon_id: this.coupon ? this.coupon.id : null, | |
| 				} | |
| 				console.log('data数据',data); | |
| 				this.Post({ | |
| 					method: 'POST', | |
| 					data: JSON.stringify(data) | |
| 				}, '/api/order/create').then(res => { | |
| 					if (res.code == 1) { | |
| 						console.log(res.data.order_id); | |
| 						let order_id = res.data.order_id | |
| 						this.$store.commit("choseCoupon", ""); | |
| 						// #ifdef MP-WEIXIN | |
| 						this.Post({ | |
| 							order_id: order_id, | |
| 							pay_platform: "MINI", | |
| 							pay_method: 'WEIXIN', | |
| 						}, '/api/order/pay').then(res => { | |
| 							if (res.data) { | |
| 								uni.requestPayment({ | |
| 									nonceStr: res.data.nonceStr, | |
| 									package: res.data.package, | |
| 									paySign: res.data.paySign, | |
| 									signType: res.data.signType, | |
| 									timeStamp: res.data.timeStamp, | |
| 									complete: () => { | |
| 										this.gotoPath('/subPackages/order/trades') | |
| 									} | |
| 								}) | |
| 							} | |
| 						}) | |
| 						// #endif | |
| 					 | |
| 						// #ifdef H5 | |
| 						uni.navigateTo({ | |
| 							url: "/subPackages/order/orderPay?orderId=" +order_id | |
| 						}) | |
| 						// #endif | |
| 					} | |
| 				}) | |
| 			}, | |
| 			 | |
| 			// 获取默认手机号 | |
| 			getUserInfo () { | |
| 				this.Post({},'/api/uservice/user/getMyInfo').then(res=>{ | |
| 					if (res.code==1 && res.data &&res.data.mobile) { | |
| 						this.phone = res.data.mobile | |
| 					} | |
| 				}) | |
| 			}, | |
| 		} | |
| 	} | |
| </script> | |
|  | |
| <style scoped lang="scss"> | |
| 	*{ | |
| 		box-sizing: border-box; | |
| 	} | |
| 	.bg{ | |
| 		min-height: 100vh; | |
| 		padding: 20rpx; | |
| 		padding-bottom: 200rpx; | |
| 		background-color: rgb(247, 247, 247); | |
| 	} | |
| 	 | |
| 	.top-box1 { | |
| 	    width: 100%; | |
| 	    background: #FFFFFF; | |
| 	    border-radius: 13rpx; | |
| 	    padding: 32rpx 20rpx; | |
| 	    display: flex; | |
| 	    justify-content: space-between; | |
| 	    align-items: center; | |
| 	    font-weight: 500; | |
| 	    font-size: 25rpx; | |
| 	    color: #999999; | |
| 	 | |
| 	    .top-left { | |
| 	        display: flex; | |
| 	        flex-direction: column; | |
| 	        justify-content: space-between; | |
| 	        flex: 1; | |
| 			width: 1rpx; | |
| 			.title{ | |
| 				font-weight: bold; | |
| 				font-size: 36rpx; | |
| 				color: #000000; | |
| 			} | |
| 	    } | |
| 		.top-edit{ | |
| 			font-family: PingFang SC; | |
| 			font-weight: bold; | |
| 			font-size: 27rpx; | |
| 			color: #6A8A27; | |
| 		} | |
| 	} | |
| 
 | |
| .tickets-box{ | |
| 	background: #FFFFFF; | |
| 	border-radius: 13rpx; | |
| 	width: 100%; | |
| 	margin: 20rpx 0; | |
| 	 | |
| 	.num-box { | |
| 	    display: flex; | |
| 	    justify-content: space-between; | |
| 		flex-direction: column; | |
| 		padding: 40rpx 20rpx; | |
| 	 | |
| 	    .num-left { | |
| 	        width: 100%; | |
| 	        box-sizing: border-box; | |
| 	        display: flex; | |
| 	        justify-content: space-between; | |
| 	        .left-title { | |
| 				font-family: PingFang SC; | |
| 				font-weight: bold; | |
| 				font-size: 31rpx; | |
| 				color: #000000; | |
| 				width: 450rpx; | |
| 	        } | |
| 	        .left-price { | |
| 	            font-weight: bold; | |
| 	            font-size: 36rpx; | |
| 	            color: #D62828; | |
| 				padding-right: 27rpx; | |
| 	        } | |
| 	        .left-price::before { | |
| 	            font-size: 24rpx; | |
| 	            content: '¥'; | |
| 	        } | |
| 	 | |
| 	 | |
| 	    } | |
| 		.num-subtitle { | |
| 			display: flex; | |
| 			align-items: center; | |
| 			width: 100%; | |
| 			font-family: PingFang SC; | |
| 			font-weight: 500; | |
| 			font-size: 23rpx; | |
| 			color: #6A8A27; | |
| 		} | |
| 	    .num-right { | |
| 			display: flex; | |
| 			align-items: center; | |
| 			font-weight: bold; | |
| 			font-size: 29rpx; | |
| 			color: #000000; | |
| 			text-align: center; | |
| 	        .num-span { | |
| 	            width: 67rpx; | |
| 	            line-height: 63rpx; | |
| 	        } | |
| 	 | |
| 	        .btn-num { | |
| 	            width: 46rpx; | |
| 	            height: 46rpx; | |
| 	            line-height: 40rpx; | |
| 	            background: #6A8A27; | |
| 	            border-radius: 50%; | |
| 	            font-weight: 500; | |
| 	            font-size: 45rpx; | |
| 	            font-size: 34rpx; | |
| 	            color: #FFFFFF; | |
| 	        } | |
| 			.btn-num.disabled{ | |
| 				color: #999999; | |
| 				background: white; | |
| 				border: 1px solid #999; | |
| 			} | |
| 	    } | |
| 	} | |
| 	 | |
| 	 | |
| 	.buyMore{ | |
| 		height: 118rpx; | |
| 		font-family: PingFang SC; | |
| 		font-weight: bold; | |
| 		font-size: 31rpx; | |
| 		color: #000000; | |
| 		display: flex; | |
| 		align-items: center; | |
| 		justify-content: space-between; | |
| 		padding:0 20rpx; | |
| 		 | |
| 		.buyMore-btn{ | |
| 			height: 47rpx; | |
| 			width: 148rpx; | |
| 			text-align: center; | |
| 			border-radius: 23rpx; | |
| 			border: 1px solid #515150; | |
| 			font-family: PingFang SC; | |
| 			font-weight: bold; | |
| 			font-size: 25rpx; | |
| 			color: #515150; | |
| 			line-height: 45rpx; | |
| 		} | |
| 	} | |
| } | |
| 
 | |
| .people-box{ | |
| 	width: 100%; | |
| 	background: #FFFFFF; | |
| 	border-radius: 13rpx; | |
| 	.people-box-title{ | |
| 		font-family: PingFangSC; | |
| 		font-weight: 600; | |
| 		font-size: 31rpx; | |
| 		color: #000000; | |
| 		padding: 42rpx 18rpx; | |
| 		border-bottom: 1px solid #CCCCCC; | |
| 	} | |
| 	 | |
| 	.person-scroll{ | |
| 		display: flex; | |
| 		flex-wrap: nowrap; | |
| 		position: relative; | |
| 		padding-bottom: 50rpx; | |
| 		overflow-y: auto; | |
| 		.person-item-container{ | |
| 			width: 167rpx; | |
| 			height: 73rpx; | |
| 			background: #F1F1F1; | |
| 			border-radius: 11rpx; | |
| 			font-family: PingFangSC; | |
| 			font-weight: 400; | |
| 			font-size: 27rpx; | |
| 			color: #000000; | |
| 			padding: 2rpx; | |
| 			margin-right: 14rpx; | |
| 			position: relative; | |
| 			&.active{ | |
| 				background: #515150 | |
| 			} | |
| 			.disabled{ | |
| 				font-weight: 400; | |
| 				font-size: 23rpx; | |
| 				color: #999999; | |
| 			} | |
| 			.selected{ | |
| 				width: 28rpx; | |
| 				height: 28rpx; | |
| 				background: #515150; | |
| 				border-radius: 10rpx 0rpx 10rpx 0rpx; | |
| 				position: absolute; | |
| 				bottom: 0; | |
| 				right: 0; | |
| 				display: flex; | |
| 				justify-content: center; | |
| 				line-height: 28rpx; | |
| 			} | |
| 		} | |
| 		.person-item{ | |
| 			width: 163rpx; | |
| 			height: 69rpx; | |
| 			border-radius: 11rpx; | |
| 			background: #F1F1F1; | |
| 			display: flex; | |
| 			flex-direction: column; | |
| 			align-items: center; | |
| 			justify-content: center; | |
| 		} | |
| 		 | |
| 		 | |
| 	} | |
| 	 | |
| 	.people-box-sku{ | |
| 		width: 100%; | |
| 		background: #FFFFFF; | |
| 		border-radius: 18rpx; | |
| 		padding: 0rpx 20rpx; | |
| 		 | |
| 		.sku-title{ | |
| 			font-weight: 400; | |
| 			font-size: 29rpx; | |
| 			color: #060001; | |
| 			padding-bottom: 25rpx; | |
| 		} | |
| 		 | |
| 		.person-info{ | |
| 			display: flex; | |
| 			align-items: center; | |
| 			justify-content: space-between; | |
| 			font-weight: 400; | |
| 			font-size: 27rpx; | |
| 			color: #000000; | |
| 			margin-bottom: 33rpx; | |
| 			.person-info-detail{ | |
| 				font-weight: 400; | |
| 				font-size: 24rpx; | |
| 				color: #666666; | |
| 				width: 400rpx; | |
| 			} | |
| 		} | |
| 		 | |
| 		.person-need{ | |
| 			width: 100%; | |
| 			height: 80rpx; | |
| 			background: #F2F2F2; | |
| 			border-radius: 13rpx; | |
| 			display: flex; | |
| 			align-items: center; | |
| 			justify-content: space-between; | |
| 			font-family: PingFang SC; | |
| 			font-weight: 500; | |
| 			font-size: 27rpx; | |
| 			color: #515150; | |
| 			padding: 0 20rpx; | |
| 		} | |
| 		.person-item-more{ | |
| 			width: 110rpx; | |
| 			height: 73rpx; | |
| 			background: #F2F2F2; | |
| 			border-radius: 11rpx; | |
| 			text-align: center; | |
| 			font-family: PingFang SC; | |
| 			font-weight: 500; | |
| 			font-size: 29rpx; | |
| 			color: #515150; | |
| 			line-height: 73rpx; | |
| 			position: absolute; | |
| 			right: 0; | |
| 			top: 0; | |
| 		} | |
| 		 | |
| 	} | |
| } | |
| 
 | |
| .people-popup { | |
| 	padding: 26rpx; | |
| 	min-height: 800rpx; | |
| 
 | |
| 	.top-box { | |
| 		height: 80rpx; | |
| 
 | |
| 		.top { | |
| 			position: fixed; | |
| 			left: 0; | |
| 			right: 0; | |
| 			color: #000; | |
| 			height: 80rpx; | |
| 			font-size: 0; | |
| 			overflow: hidden; | |
| 			padding: 0 26rpx; | |
| 
 | |
| 			text { | |
| 				text-align: left; | |
| 				font-size: 35rpx; | |
| 				font-weight: 400; | |
| 				color: #000000; | |
| 			} | |
| 
 | |
| 			.confirm { | |
| 				font-weight: 400; | |
| 				color: #000000; | |
| 			} | |
| 		} | |
| 	} | |
| 
 | |
| 	.popup-list { | |
| 		height: 666rpx; | |
| 		overflow: scroll; | |
| 
 | |
| 		.popup-item { | |
| 			border-radius: 12rpx; | |
| 			padding: 2rpx; | |
| 			margin-top: 24rpx; | |
| 			font-size: 24rpx; | |
| 			color: #333333; | |
| 			font-weight: 400; | |
| 			background-color: #ffffff; | |
| 
 | |
| 			.item-top { | |
| 				border-radius: 12rpx; | |
| 				padding: 30rpx 40rpx; | |
| 				background-color: #ffffff; | |
| 				 | |
| 				img { | |
| 					color: #666666; | |
| 					width: 40rpx; | |
| 					height: 40rpx; | |
| 				} | |
| 
 | |
| 				.name { | |
| 					overflow: hidden; | |
| 					font-family: PingFang SC; | |
| 					font-weight: 400; | |
| 					font-size: 32rpx; | |
| 
 | |
| 					text { | |
| 						color: #666; | |
| 						font-size: 25rpx; | |
| 					} | |
| 
 | |
| 					.tag { | |
| 						padding: 0 8rpx; | |
| 						height: 32rpx; | |
| 						border-radius: 7rpx; | |
| 						line-height: 30rpx; | |
| 						text-align: center; | |
| 						font-size: 23rpx; | |
| 						font-family: PingFang SC; | |
| 						font-weight: 500; | |
| 						color: #ffffff; | |
| 						background: #515150; | |
| 						margin-left: 10rpx; | |
| 					} | |
| 				} | |
| 
 | |
| 				.com-flex-start { | |
| 					margin: 0 0 30rpx; | |
| 				} | |
| 
 | |
| 				.subtitle { | |
| 					font-weight: 400; | |
| 					flex: 1; | |
| 					text-align: left; | |
| 					margin-top: 33rpx; | |
| 					color: #666666; | |
| 					font-size: 25rpx; | |
| 
 | |
| 					.mobile { | |
| 						margin-bottom: 36rpx; | |
| 					} | |
| 				} | |
| 
 | |
| 				.status { | |
| 					width: 40rpx; | |
| 					height: 40rpx; | |
| 					line-height: 40rpx; | |
| 					border-radius: 50%; | |
| 					text-align: center; | |
| 					box-sizing: border-box; | |
| 
 | |
| 					img { | |
| 						width: 27rpx; | |
| 						height: 21rpx; | |
| 					} | |
| 				} | |
| 				.statuss { | |
| 					background: linear-gradient(90deg, #fa2b66, #ff9834); | |
| 					border: none; | |
| 				} | |
| 				.noSelect { | |
| 					border: 1rpx solid #999999; | |
| 				} | |
| 			} | |
| 
 | |
| 			.item-site { | |
| 				color: #666666; | |
| 				display: flex; | |
| 				align-items: center; | |
| 				padding: 36rpx 0; | |
| 
 | |
| 				view { | |
| 					width: 23rpx; | |
| 					height: 23rpx; | |
| 					margin-right: 10rpx; | |
| 					border: 1rpx solid #999999; | |
| 					border-radius: 50%; | |
| 
 | |
| 					view { | |
| 						width: 8rpx; | |
| 						height: 8rpx; | |
| 						background: #000000; | |
| 						border-radius: 50%; | |
| 						margin: auto; | |
| 					} | |
| 				} | |
| 			} | |
| 		} | |
| 		 | |
| 		.popup-item.active{ | |
| 			background: #515150 | |
| 		} | |
| 		.popup-item.disabled{ | |
| 			.item-top { | |
| 				background-color: #CCC; | |
| 			} | |
| 		} | |
| 	} | |
| 
 | |
| 	.button { | |
| 
 | |
| 		text-align: center; | |
| 		width: 100%; | |
| 		height: 80rpx; | |
| 		line-height: 80rpx; | |
| 		background-color: #ffffff; | |
| 		border-radius: 40rpx; | |
| 		font-family: PingFang SC; | |
| 		font-weight: 400; | |
| 		font-size: 33rpx; | |
| 		color: #000000; | |
| 
 | |
| 	} | |
| 	 | |
| 	.add-edit-content{ | |
| 		background: #FFFFFF; | |
| 		border-radius: 13rpx; | |
| 		min-height: 800rpx; | |
| 	} | |
| } | |
| 
 | |
| 	.tickets-container { | |
| 		width: 100%; | |
| 		background: #fff; | |
| 		height: 120rpx; | |
| 		margin-top: 22rpx; | |
| 		.order-title { | |
| 			margin: 31rpx 0 31rpx 30rpx; | |
| 			font-size: 31rpx; | |
| 			font-family: PingFang SC; | |
| 			font-weight: bold; | |
| 			color: #000000; | |
| 		} | |
| 
 | |
| 		.coupon-price { | |
| 			color:#DD0000; | |
| 			font-size: 30rpx; | |
| 			font-weight: bold; | |
| 		} | |
| 	} | |
| 
 | |
| .btn-list { | |
| 	width: 100%; | |
| 	height: 166rpx; | |
| 	background: #ffffff; | |
| 	box-shadow: 0rpx -3rpx 9rpx 1rpx rgba(227, 229, 232, 0.5); | |
| 	display: flex; | |
| 	position: fixed; | |
| 	bottom: 0; | |
| 	left: 0; | |
| 	right:0; | |
| 	padding: 20rpx 50rpx; | |
| 	align-items: center; | |
| 	justify-content: space-between; | |
| 	z-index: 99; | |
| 	.btn { | |
| 		width: 250rpx; | |
| 		height: 80rpx; | |
| 		background: #6A8A27; | |
| 		border-radius: 11rpx; | |
| 		text-align: center; | |
| 		line-height: 80rpx; | |
| 
 | |
| 		font-size: 32rpx; | |
| 		font-family: PingFang SC; | |
| 		font-weight: bold; | |
| 		color: #FFFFFF; | |
| 	} | |
| 	.price-box { | |
| 		display: flex; | |
| 		align-items: baseline; | |
| 		.text { | |
| 			font-size: 28rpx; | |
| 			font-family: PingFangSC-Regular, PingFang SC; | |
| 			font-weight: 400; | |
| 			color: #393b3e; | |
| 		} | |
| 		.price { | |
| 			margin-left: 15rpx; | |
| 			font-size: 48rpx; | |
| 			font-weight: bold; | |
| 			color: #D62828; | |
| 			&:before { | |
| 				content: '¥'; | |
| 				display: inline-block; | |
| 				color: #D62828; | |
| 				font-size: 24rpx; | |
| 			} | |
| 		} | |
| 	} | |
| } | |
| 
 | |
| 	.popup-content-date { | |
| 		background-color: white; | |
| 		padding: 0rpx 28rpx 166rpx; | |
| 		height: 70vh; | |
| 		border-radius: 20rpx 20rpx 0 0 ; | |
| 		.popup-content-title{ | |
| 			font-family: PingFang SC; | |
| 			font-weight: bold; | |
| 			font-size: 37rpx; | |
| 			color: #000000; | |
| 			padding: 39rpx 0; | |
| 			display: flex; | |
| 			align-items: center; | |
| 			border-bottom: 1px solid #CCCCCC; | |
| 		} | |
| 		// 预定须知 | |
| 		.content{ | |
| 			padding-top: 48rpx; | |
| 			overflow-y: auto; | |
| 		} | |
| 		 | |
| 		.order-popup-detail{ | |
| 			.sku-title{ | |
| 				padding: 48rpx 0 26rpx; | |
| 				font-family: PingFangSC; | |
| 				font-weight: 500; | |
| 				font-size: 31rpx; | |
| 				color: #000000; | |
| 			} | |
| 		} | |
| 		 | |
| 		.dateMore{ | |
| 				width: 120rpx; | |
| 				height: 133rpx; | |
| 				background: white; | |
| 				border-radius: 10rpx; | |
| 				background: #FFFFFF; | |
| 				font-family: PingFang SC; | |
| 				font-weight: 500; | |
| 				font-size: 27rpx; | |
| 				color: #6A8A27; | |
| 				display: flex; | |
| 				flex-direction: row; | |
| 				align-items: center; | |
| 				justify-content: center; | |
| 				flex-shrink: 0; | |
| 				padding: 6rpx 0; | |
| 				position: absolute; | |
| 				bottom: 0; | |
| 				right: 0; | |
| 			} | |
| 			 | |
| 			.date-content{ | |
| 				width: 100%; | |
| 				display: flex; | |
| 				overflow-y: auto; | |
| 				position: relative; | |
| 				padding-right: 140rpx; | |
| 				 | |
| 				.item{ | |
| 					width: 120rpx; | |
| 					height: 133rpx; | |
| 					border-radius: 10rpx; | |
| 					margin-right: 24rpx; | |
| 					font-family: PingFang SC; | |
| 					font-weight: 500; | |
| 					font-size: 27rpx; | |
| 					color: #000; | |
| 					display: flex; | |
| 					flex-direction: column; | |
| 					align-items: center; | |
| 					justify-content: space-around; | |
| 					flex-shrink: 0; | |
| 					padding: 6rpx 0; | |
| 					background: #F5F5F5; | |
| 				} | |
| 				.item.active{ | |
| 					background: #6A8A27; | |
| 					color: white; | |
| 					.price{color: white;} | |
| 				} | |
| 				.item.disabled{ | |
| 					background: #F5F5F5; | |
| 					color: #999999; | |
| 				} | |
| 				 | |
| 				.price{ | |
| 					color: #EE3E3B; | |
| 				} | |
| 				 | |
| 			} | |
| 			.date-content::-webkit-scrollbar{ | |
| 				display: none; | |
| 			} | |
| 		} | |
| 	 | |
| 	.calendar-edit{ | |
| 		.time-box { | |
| 			display: flex; | |
| 			justify-content: space-between; | |
| 			flex-wrap: wrap; | |
| 			max-height: 340rpx; | |
| 			overflow-y: auto; | |
| 
 | |
| 			.time-item { | |
| 				width: 48%; | |
| 				height: 60rpx; | |
| 				border-radius: 10rpx; | |
| 				text-align: center; | |
| 				font-size: 34rpx; | |
| 				margin-bottom: 23rpx; | |
| 				font-family: PingFangSC; | |
| 				font-weight: 400; | |
| 				font-size: 25rpx; | |
| 				line-height: 58rpx; | |
| 				color: #000; | |
| 				background: #F5F5F5; | |
| 			} | |
| 			.time-active { | |
| 				background: #6A8A27; | |
| 				color: white; | |
| 			} | |
| 			.time-disable { | |
| 				background: #F5F5F5; | |
| 				color: #999999; | |
| 			} | |
| 		} | |
| 
 | |
| 		.sku-bottom { | |
| 			width: 100%; | |
| 			height: 166rpx; | |
| 			background: #FFFFFF; | |
| 			box-shadow: 0rpx -3rpx 8rpx 0rpx rgba(71,71,71,0.1); | |
| 			display: flex; | |
| 			justify-content: space-between; | |
| 			align-items: center; | |
| 			box-sizing: border-box; | |
| 			padding: 50rpx 50rpx 85rpx; | |
| 			font-family: PingFang SC; | |
| 			font-weight: 500; | |
| 			font-size: 28rpx; | |
| 			color: #393B3E; | |
| 			position: absolute; | |
| 			bottom: 0; | |
| 			left: 0; | |
| 			right: 0; | |
| 		 | |
| 			.bottom-price { | |
| 				font-size: 48rpx; | |
| 				font-weight: bold; | |
| 				color: #D62828; | |
| 			} | |
| 			.bottom-price::before { | |
| 				font-size: 24rpx; | |
| 				content: '¥'; | |
| 			} | |
| 		 | |
| 			.bottom-btn { | |
| 				width: 250rpx; | |
| 				height: 80rpx; | |
| 				background: #6A8A27; | |
| 				border-radius: 11rpx; | |
| 				font-size: 32rpx; | |
| 				text-align: center; | |
| 				font-weight: bold; | |
| 				color: #FFFFFF; | |
| 				line-height: 80rpx; | |
| 			} | |
| 		} | |
| 	} | |
| 	 | |
| 	.coupon-btn { | |
| 		color: #999999;; | |
| 		display: flex; | |
| 		align-items: center; | |
| 		.select { | |
| 			display: block; | |
| 			width: 153rpx; | |
| 			height: 40rpx; | |
| 			background: #6A8A27; | |
| 			border-radius: 9rpx; | |
| 			font-weight: 500; | |
| 			font-size: 24rpx; | |
| 			color: #FFFFFF; | |
| 			text-align: center; | |
| 			line-height: 40rpx; | |
| 			font-family: PingFang SC; | |
| 			margin-right: 20rpx; | |
| 	 | |
| 		} | |
| 	} | |
| 	 | |
| 	::v-deep .uni-calendar-item--extra{ | |
| 		color: #EE3E3B !important; | |
| 	} | |
| 	::v-deep .uni-calendar-item--isDay{ | |
| 		background: #6A8A27 !important; | |
| 		border-radius: 50%; | |
| 		 | |
| 		.uni-calendar-item--extra{ | |
| 			color: white !important; | |
| 		} | |
| 	} | |
| 	 | |
| 	::v-deep .uni-calendar-item--checked{ | |
| 		background: #6A8A27 !important; | |
| 		border-radius: 50%; | |
| 		 | |
| 		.uni-calendar-item--extra{ | |
| 			color: white !important; | |
| 		} | |
| 	} | |
| 	 | |
| </style>
 | |
| 
 |