index.vue
3.36 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
<!--
* @Date: 2024-01-16 10:06:47
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2026-01-21 17:14:47
* @FilePath: /xyxBooking-weapp/src/pages/bookingCode/index.vue
* @Description: 预约码页面
-->
<template>
<view class="booking-code-page">
<view style="padding: 32rpx">
<qrCode ref="qr_code_ref"></qrCode>
<view class="warning">
<view style="display: flex; align-items: center; justify-content: center"
><IconFont name="tips" /><text style="margin-left: 10rpx">温馨提示</text></view
>
<view style="margin-top: 16rpx">一人一码，扫码或识别身份证成功后进入</view>
<view style="height: 256rpx"></view>
</view>
</view>
<indexNav
:icons="nav_icons"
active="code"
position="fixed"
center_variant="normal"
@select="on_nav_select"
/>
</view>
</template>
<script setup>
import { ref } from 'vue'
import Taro, { useDidShow, useDidHide } from '@tarojs/taro'
import qrCode from '@/components/qrCode'
import { IconFont } from '@nutui/icons-vue-taro'
import indexNav from '@/components/indexNav.vue'
import icon_3 from '@/assets/images/首页01@2x.png'
import icon_4 from '@/assets/images/二维码icon.png'
import icon_5 from '@/assets/images/我的01@2x.png'
import { useGo } from '@/hooks/useGo'
import { has_offline_booking_cache } from '@/composables/useOfflineBookingCache'
import { is_usable_network } from '@/utils/network'
import { get_weak_network_modal_no_cache_options } from '@/utils/uiText'
import { showConfirm } from '@/utils/toast'
const qr_code_ref = ref(null)
useDidShow(() => {
qr_code_ref.value?.start_polling?.()
Taro.getNetworkType({
success: async res => {
const isConnected = is_usable_network(res.networkType)
if (isConnected) {
return
}
if (has_offline_booking_cache()) {
Taro.redirectTo({ url: '/pages/offlineBookingList/index' })
return
}
try {
await showConfirm(
get_weak_network_modal_no_cache_options().content,
get_weak_network_modal_no_cache_options().title
)
} catch (e) {
console.error('show weak network modal failed:', e)
}
Taro.redirectTo({ url: '/pages/index/index' })
},
fail: async () => {
if (has_offline_booking_cache()) {
Taro.redirectTo({ url: '/pages/offlineBookingList/index' })
return
}
try {
await showConfirm(
get_weak_network_modal_no_cache_options().content,
get_weak_network_modal_no_cache_options().title
)
} catch (e) {
console.error('show weak network modal failed:', e)
}
Taro.redirectTo({ url: '/pages/index/index' })
}
})
})
useDidHide(() => {
qr_code_ref.value?.stop_polling?.()
})
const toMy = () => {
// 跳转到我的
Taro.redirectTo({
url: '/pages/me/index'
})
}
const toHome = () => {
// 跳转到首页
Taro.redirectTo({
url: '/pages/index/index'
})
}
const nav_icons = { home: icon_3, code: icon_4, me: icon_5 }
const on_nav_select = key => {
if (key === 'home') {
return toHome()
}
if (key === 'me') {
return toMy()
}
}
</script>
<style lang="less">
.booking-code-page {
position: relative;
min-height: 100vh;
background-color: #f6f6f6;
.warning {
text-align: center;
color: #a67939;
margin-top: 32rpx;
}
}
</style>