index.vue
2.72 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
<template>
<view class="result-page">
<view class="result-content">
<icon type="success" size="64" color="#A67939"/>
<view class="msg">{{ msg }}</view>
<view class="info" v-if="resultContent">扫码内容: {{ resultContent }}</view>
<nut-button color="#A67939" class="back-btn" @tap="continueScan">继续核销</nut-button>
<!-- <nut-button type="default" class="home-btn" @tap="goHome">返回首页</nut-button> -->
</view>
</view>
</template>
<script setup>
import { ref } from 'vue'
import { useRouter } from '@tarojs/taro'
import { useGo } from '@/hooks/useGo'
import { verifyTicketAPI } from '@/api/index'
import Taro, { useDidShow } from '@tarojs/taro'
const router = useRouter()
const go = useGo()
const resultContent = ref('')
const msg = ref('核销成功')
useDidShow(async () => {
resultContent.value = router.params.result || ''
if (resultContent.value) {
Taro.showLoading({ title: '核销中...' })
const res = await verifyTicketAPI({ code: resultContent.value })
Taro.hideLoading()
if (res.code === 1) {
msg.value = res.msg || '核销成功'
} else {
msg.value = res.msg || '核销失败'
Taro.showToast({ title: msg.value, icon: 'none' })
}
}
})
const continueScan = () => {
Taro.scanCode({
success: (res) => {
// Reload current page with new result
// Taro doesn't support easy reload with params change in same page easily without redirect
// So we redirect to self
Taro.redirectTo({
url: `/pages/verificationResult/index?result=${res.result}`
})
},
fail: () => {
// Cancelled
}
})
}
// const goHome = () => {
// Taro.reLaunch({ url: '/pages/index/index' })
// }
</script>
<style lang="less">
.result-page {
padding: 64rpx 32rpx;
text-align: center;
min-height: 100vh;
background-color: #fff;
.result-content {
display: flex;
flex-direction: column;
align-items: center;
}
.msg {
font-size: 40rpx;
margin-top: 32rpx;
font-weight: bold;
color: #333;
}
.info {
margin-top: 20rpx;
color: #999;
font-size: 28rpx;
word-break: break-all;
padding: 0 32rpx;
}
.back-btn {
margin-top: 80rpx;
background-color: #A67939;
color: #fff;
width: 80%;
border-radius: 44rpx;
}
.home-btn {
margin-top: 32rpx;
background-color: #fff;
color: #666;
width: 80%;
border-radius: 44rpx;
border: 1rpx solid #b0b0b0;
}
}
</style>