| <template> | |
| 	<view class="page"> | |
| 			 | |
| 		<image :src="configList.img_13" | |
| 		class="page-bg" | |
| 		mode="aspectFill"></image> | |
| 		 | |
| 		<image :src="configList.img_7" | |
| 		class="logo" | |
| 		mode="widthFix"></image> | |
| 		 | |
| 		<view class="service"> | |
| 			 | |
| 			<image :src="configList[mapKey[key].icon]" | |
| 			class="img_2" | |
| 			mode="widthFix"></image> | |
| 			 | |
| 			 | |
| 			<view class="title"> | |
| 				{{ mapKey[key].title }} | |
| 			</view> | |
| 			 | |
| 			<!-- // this.date = new Date(`${res.result.yearValue}-${res.result.monthDay} ${res.result.dayTime}:00`).getTime() --> | |
| 			 | |
| 			 | |
| 			<view class="stext" v-if="mapKey[key].stext"> | |
| 				<uv-parse :content="mapKey[key].stext"></uv-parse> | |
| 			</view> | |
| 			 | |
| 			 | |
| 			<view class="stext" v-else-if="key == 'reservationSuccessful'"> | |
| 				{{ form.name }}先生/小姐 | |
| 				<br /> | |
| 				我们已成功安排了您的上门威士忌品鉴服务 | |
| 				<br /> | |
| 				我们的专员将在{{ form.yearValue }}年{{ form.monthDay }}日 {{ form.dayTime }} 到达 | |
| 				<br /> | |
| 				{{ form.province || '' }} | |
| 				{{ form.city || '' }} | |
| 				{{ form.area || '' }} | |
| 				{{ form.address || '' }} | |
| 				 | |
| 				<view class="" | |
| 				style="margin: 0 auto;margin-top: 40rpx;width: 500rpx;"> | |
| 					为您带来精致的品鉴体验期待与您共享这段美妙的威士忌之旅 | |
| 				</view> | |
| 			</view> | |
| 			 | |
| 			 | |
| 			<view class="stext" v-else-if="key == 'reservationError'"> | |
| 				{{ form.remarks || '' }} 您可以点击下方按钮重新预约上门品鉴时间。 | |
| 			</view> | |
| 		</view> | |
| 		 | |
| 		<view class="btn-list"> | |
| 			<view class="next-btn-2" | |
| 			v-if="mapKey[key].next" | |
| 			@click="next(mapKey[key])"> | |
| 				重新预约 | |
| 			</view> | |
| 			 | |
| 			<view class="next-btn" | |
| 			v-if="mapKey[key].rep" | |
| 			@click="rep(mapKey[key])"> | |
| 				返回 | |
| 			</view> | |
| 		</view> | |
| 		 | |
| 		<view class="second-color">{{ configList.bg_title }}</view> | |
| 		 | |
| 	</view> | |
| </template> | |
|  | |
| <script> | |
| 	export default { | |
| 		data() { | |
| 			return { | |
| 				mapKey : { | |
| 					success_text : { | |
| 						rep : '/pages/index/end', | |
| 						icon : 'img_3', | |
| 						title : '提交成功', | |
| 						stext : ` | |
| 						后台正在为您匹配合适的品鉴资源, <br> | |
| 						我们会在匹配结束后 <br> | |
| 						发送微信推送及电话联系您确认! | |
| 						`, | |
| 					}, | |
| 					reservationSuccessful : { | |
| 						icon : 'img_3', | |
| 						title : '预约成功', | |
| 					}, | |
| 					reservationError : { | |
| 						next : true, | |
| 						icon : 'img_10', | |
| 						title : '预约失败!', | |
| 					}, | |
| 				}, | |
| 				key : '', | |
| 				id : '', | |
| 				form : { | |
| 					name : '', | |
| 				}, | |
| 				date : 0, | |
| 			} | |
| 		}, | |
| 		onLoad({key, id}) { | |
| 			this.key = key | |
| 			this.id = id | |
| 		}, | |
| 		onShow() { | |
| 			if(this.id){ | |
| 				this.getDetail() | |
| 			} | |
| 		}, | |
| 		methods: { | |
| 			rep(map){ | |
| 				uni.reLaunch({ | |
| 					url: map.rep | |
| 				}) | |
| 			}, | |
| 			getDetail(){ | |
| 				this.$api('queryReservationDetail',{ | |
| 					id : this.id | |
| 				}, res => { | |
| 					if(res.code == 200){ | |
| 						// this.date = new Date(`${res.result.yearValue}-${res.result.monthDay} ${res.result.dayTime}:00`).getTime() | |
| 						this.form = res.result | |
| 					} | |
| 				}) | |
| 			}, | |
| 			next(map){ | |
| 				uni.navigateTo({ | |
| 					url: '/pages_order/info/appoint' | |
| 					// url: '/pages/index/preAppoint'//'/pages/index/preAppoint' | |
| 				}) | |
| 			}, | |
| 		} | |
| 	} | |
| </script> | |
|  | |
| <style scoped lang="scss"> | |
| .page{ | |
| 	.logo{ | |
| 		width: 600rpx; | |
| 		margin: 150rpx 75rpx; | |
| 	} | |
| 	.service{ | |
| 		display: flex; | |
| 		flex-direction: column; | |
| 		align-items: center; | |
| 		.img_2{ | |
| 			margin: 0 auto; | |
| 			width: 100rpx; | |
| 		} | |
| 		.title{ | |
| 			font-weight: 900; | |
| 			margin: 30rpx 0; | |
| 		} | |
| 		.stext{ | |
| 			width: 600rpx; | |
| 			margin-bottom: 150rpx; | |
| 			line-height: 50rpx; | |
| 			font-size: 26rpx; | |
| 			color: #777; | |
| 			text-align: center; | |
| 		} | |
| 	} | |
| 	.btn-list{ | |
| 		display: flex; | |
| 		flex-direction: column; | |
| 		gap: 40rpx; | |
| 		width: 100%; | |
| 		justify-content: center; | |
| 		align-items: center; | |
| 	} | |
| 	.next-btn{ | |
| 		width: 400rpx; | |
| 		display: flex; | |
| 		align-items: center; | |
| 		justify-content: center; | |
| 		color: white; | |
| 		padding: 22rpx 90rpx; | |
| 		background-color: $uni-color; | |
| 		border-radius: 40rpx; | |
| 	} | |
| 	.next-btn-2{ | |
| 		width: 400rpx; | |
| 		display: flex; | |
| 		align-items: center; | |
| 		justify-content: center; | |
| 		color: white; | |
| 		padding: 22rpx 90rpx; | |
| 		background-color: $uni-color-primary; | |
| 		border-radius: 40rpx; | |
| 	} | |
| 	.second-color{ | |
| 		width: 100%; | |
| 		text-align: center; | |
| 		margin-top: 40rpx; | |
| 	} | |
| } | |
| </style>
 |