hookehuyr

fix(核销结果): 修复核销结果页面显示问题并优化代码

重构核销结果页面,将result_content重命名为verify_result_text以更准确表达用途
添加对核销结果数据的格式化显示支持
优化按钮字体大小和代码结构
更新页面标题为'义工核销'
添加TODO注释说明登录功能需要联调
/*
* @Date: 2026-01-07 17:41:38
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2026-01-14 10:16:08
* @FilePath: /xyxBooking-weapp/src/pages/verificationResult/index.config.js
* @Description: 核销结果配置
*/
export default {
navigationBarTitleText: '核销'
navigationBarTitleText: '义工核销'
}
......
<!--
* @Date: 2026-01-08 13:01:20
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2026-01-14 10:07:56
* @LastEditTime: 2026-01-14 10:14:28
* @FilePath: /xyxBooking-weapp/src/pages/verificationResult/index.vue
* @Description: 核销结果页面
-->
......@@ -19,15 +19,24 @@
</view>
</view>
<view v-if="result_content" class="mt-4 rounded-2xl bg-white p-5 shadow-sm">
<view v-if="verify_result_text" class="mt-4 rounded-2xl bg-white p-5 shadow-sm">
<view class="text-xs text-gray-500">核销结果</view>
<view class="mt-2 break-all text-sm font-medium text-gray-900">{{ result_content }}</view>
<view class="mt-2 break-all whitespace-pre-wrap text-sm font-medium text-gray-900">{{ verify_result_text }}</view>
</view>
<view v-else class="mt-4 rounded-2xl bg-white p-5 shadow-sm">
<view class="text-xs text-gray-500">核销结果</view>
<view class="mt-2 text-sm text-gray-400">暂无核销结果,点击下方核销按钮开始扫码</view>
</view>
<!-- <view v-if="verify_code" class="mt-4 rounded-2xl bg-white p-5 shadow-sm">
<view class="text-xs text-gray-500">预约码</view>
<view class="mt-2 break-all text-sm font-medium text-gray-900">{{ verify_code }}</view>
</view>
<view v-else class="mt-4 rounded-2xl bg-white p-5 shadow-sm">
<view class="text-xs text-gray-500">预约码</view>
<view class="mt-2 text-sm text-gray-400">暂无预约码</view>
</view> -->
<view class="verify-footer">
<nut-button
block
......@@ -51,7 +60,8 @@ import { verifyTicketAPI } from '@/api/index'
import Taro, { useDidShow } from '@tarojs/taro'
const router = useRouter()
const result_content = ref('')
const verify_code = ref('')
const verify_result = ref(null)
const verify_status = ref('idle')
const msg = ref('请点击下方按钮进行核销')
......@@ -74,26 +84,44 @@ const status_icon_color = computed(() => {
if (verify_status.value === 'fail') return '#E24A4A'
return '#A67939'
})
/******************* END **********************/
const verify_result_text = computed(() => {
const data = verify_result.value
if (data === null || data === undefined) return ''
if (typeof data === 'string') return data
if (typeof data === 'number' || typeof data === 'boolean') return String(data)
try {
return JSON.stringify(data, null, 2)
} catch (e) {
return ''
}
})
const verify_ticket = async (code) => {
if (!code) return
if (verify_status.value === 'verifying') return
result_content.value = code
verify_code.value = code
verify_result.value = null
verify_status.value = 'verifying'
msg.value = '核销中...'
Taro.showLoading({ title: '核销中...' })
try {
const res = await verifyTicketAPI({ code })
if (res?.code) {
if (res?.code === 1) {
verify_status.value = 'success'
msg.value = res?.msg || '核销成功'
if (res?.data !== undefined && res?.data !== null && res?.data !== '') {
verify_result.value = res.data
}
return
}
verify_status.value = 'fail'
msg.value = res?.msg || '核销失败'
if (res?.data !== undefined && res?.data !== null && res?.data !== '') {
verify_result.value = res.data
}
Taro.showToast({ title: msg.value, icon: 'none' })
} catch (e) {
verify_status.value = 'fail'
......@@ -105,12 +133,10 @@ const verify_ticket = async (code) => {
}
useDidShow(async () => {
/**
* 现在主要用于:外部渠道如果手动带参进入则自动核销;正常业务流程(从义工登录进入)是不会带参的,会走缺省态 + 点击“核销”扫码。
*/
const code = router?.params?.result || ''
if (!code) {
result_content.value = ''
verify_code.value = ''
verify_result.value = null
verify_status.value = 'idle'
msg.value = '请点击下方按钮进行核销'
return
......@@ -147,7 +173,7 @@ const start_scan_and_verify = () => {
}
.verify-btn {
font-size: 36rpx;
font-size: 32rpx;
height: 104rpx;
line-height: 104rpx;
border-radius: 16rpx;
......
<!--
* @Date: 2026-01-08 13:01:56
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2026-01-14 09:59:46
* @LastEditTime: 2026-01-14 10:18:59
* @FilePath: /xyxBooking-weapp/src/pages/volunteerLogin/index.vue
* @Description: 义工登录页面
-->
......@@ -74,6 +74,7 @@ useDidShow(() => {
check_permission_and_redirect()
})
// TODO: 功能需要联调, 登录功能都是模拟, 实际登录需要后端接口支持
const handleLogin = async () => {
if (!username.value || !password.value) {
Taro.showToast({ title: '请输入账号密码', icon: 'none' })
......