|
|
- <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>
|