147 lines
2.8 KiB
Vue
147 lines
2.8 KiB
Vue
<template>
|
|
<view class="page">
|
|
<view class="content">
|
|
<view v-if="loading" class="text">
|
|
正在为您领取权益，请稍候…
|
|
</view>
|
|
<view v-else>
|
|
<view class="result-icon success" v-if="success">
|
|
领取成功
|
|
</view>
|
|
<view class="result-icon fail" v-else>
|
|
领取失败
|
|
</view>
|
|
<view class="text msg">
|
|
{{ message }}
|
|
</view>
|
|
<button class="back-btn" type="primary" @click="goBack">
|
|
返回会员中心
|
|
</button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
loading: true, // 是否加载中 / 正在领取
|
|
success: false, // 是否领取成功
|
|
message: '' // 提示文案
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
this.handleParams(options || {})
|
|
},
|
|
methods: {
|
|
// 解析二维码/链接参数，获取编码
|
|
handleParams(options) {
|
|
let code = ''
|
|
|
|
// 直接带 code 参数
|
|
if (options.code) {
|
|
code = options.code
|
|
} else if (options.q) {
|
|
// 微信扫码普通二维码时通常是 q 参数，需要先 decode
|
|
const q = decodeURIComponent(options.q)
|
|
// 兼容两种情况：
|
|
// 1. q 为完整链接，形如 xxx?c=XXX
|
|
// 2. q 就是编码本身
|
|
const match = q.match(/c=([^&]+)/)
|
|
code = match ? match[1] : q
|
|
}
|
|
|
|
if (!code) {
|
|
this.loading = false
|
|
this.success = false
|
|
this.message = '未获取到兑换编码，请确认二维码是否正确'
|
|
return
|
|
}
|
|
|
|
this.useGiftCode(code)
|
|
},
|
|
|
|
// 调用领取接口
|
|
useGiftCode(code) {
|
|
this.loading = true
|
|
this.$u
|
|
.post(`/app/vipUser/useGiftCode?code=${encodeURIComponent(code)}`)
|
|
.then(res => {
|
|
this.loading = false
|
|
if (res.code === 200) {
|
|
this.success = true
|
|
this.message = res.msg || '领取成功，已发放至您的会员账户'
|
|
} else {
|
|
this.success = false
|
|
this.message = res.msg || '领取失败，请稍后再试'
|
|
}
|
|
})
|
|
.catch(() => {
|
|
this.loading = false
|
|
this.success = false
|
|
this.message = '网络异常，请稍后重试'
|
|
})
|
|
},
|
|
|
|
// 返回会员中心
|
|
goBack() {
|
|
uni.navigateTo({
|
|
url: '/page_fenbao/huiyuan/myhuiyuan?tyep=99'
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.page {
|
|
min-height: 100vh;
|
|
background: #f7f8fa;
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
|
|
.content {
|
|
width: 640rpx;
|
|
padding: 60rpx 40rpx 80rpx;
|
|
border-radius: 24rpx;
|
|
text-align: center;
|
|
margin-top: 300rpx;
|
|
}
|
|
|
|
.result-icon {
|
|
font-size: 40rpx;
|
|
font-weight: 600;
|
|
margin-bottom: 24rpx;
|
|
}
|
|
|
|
.result-icon.success {
|
|
color: #19be6b;
|
|
}
|
|
|
|
.result-icon.fail {
|
|
color: #fa3534;
|
|
}
|
|
|
|
.text {
|
|
font-size: 28rpx;
|
|
color: #606266;
|
|
line-height: 1.6;
|
|
}
|
|
|
|
.msg {
|
|
margin-bottom: 40rpx;
|
|
}
|
|
|
|
.back-btn {
|
|
width: 100%;
|
|
height: 88rpx;
|
|
line-height: 88rpx;
|
|
border-radius: 44rpx;
|
|
background: #2979ff;
|
|
color: #ffffff;
|
|
font-size: 30rpx;
|
|
margin-top: 200rpx;
|
|
}
|
|
</style> |