百富门答题小程序
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.
 
 
 

187 lines
3.5 KiB

<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="title" v-else-if="key == 'reservationSuccessful'">
{{ form.name }}先生/小姐
<br />
我们已成功安排了您的上门威士忌品鉴服务
<br />
我们的专员将在{{ form.yearValue }}{{ form.monthDay }} {{ form.dayTime }} 到达
<br />
{{ item.province }}
{{ item.city }}
{{ item.area }}
{{ item.address }}
</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 : {
rep : true,
icon : 'img_3',
title : '预约成功',
},
},
key : '',
id : '',
form : {
name : '',
},
date : 0,
}
},
onLoad({key, id}) {
this.key = key
if(id){
this.id = 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'
})
},
}
}
</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>