diff --git a/common/http.api.js b/common/http.api.js index 66d84e1..fd4fe31 100644 --- a/common/http.api.js +++ b/common/http.api.js @@ -26,6 +26,7 @@ const AppointUrl = 'zhy-api/cardBag/appoint' const VoucherCreateUrl = 'open-api/hhService/voucher/create' const VoucherPrepayUrl = 'open-api/hhService/voucher/prepay' const VoucherLatestUrl = 'open-api/hhService/voucher/latest' +const VoucherCheckCodeUrl = 'open-api/hhService/voucher/checkCode' // 此处第二个参数vm,就是我们在页面使用的this const install = (Vue, vm) => { @@ -60,6 +61,7 @@ const install = (Vue, vm) => { const voucherCreate = (params = {}) => vm.$u.post(VoucherCreateUrl, params) const voucherPrepay = (params = {}) => vm.$u.post(VoucherPrepayUrl, params) const voucherLatest = (params = {}) => vm.$u.post(VoucherLatestUrl, params) + const voucherCheckCode = (params = {}) => vm.$u.post(VoucherCheckCodeUrl, params) vm.$u.api = { checkerLogin, @@ -79,7 +81,8 @@ const install = (Vue, vm) => { getWinnerList, voucherCreate, voucherPrepay, - voucherLatest + voucherLatest, + voucherCheckCode } } diff --git a/pages/petrol/voucherDetail.vue b/pages/petrol/voucherDetail.vue index e039711..4c43da9 100644 --- a/pages/petrol/voucherDetail.vue +++ b/pages/petrol/voucherDetail.vue @@ -19,11 +19,11 @@ 有效 - - - + + + - 到店出示此二维码,收银员以“中石油汽油券”通道扫码核销 + 核销码每 60 秒自动刷新,请到店后出示给收银员扫码 @@ -93,8 +93,10 @@ export default { phone: '', voucher: {}, status: null, // null=加载中;含义对齐后端 statusCode + qrText: '', // xuchao: 实时核销码(60 秒滚动,来自 /voucher/checkCode) pollTimer: null, pollLeft: 3, + checkTimer: null, voucherName: VOUCHER_NAME, voucherRule: VOUCHER_RULE, useRules: VOUCHER_USE_RULES, @@ -107,7 +109,7 @@ export default { return f ? (f / 100).toFixed(2) : '' }, isQrImage() { - return typeof this.voucher.voucherCode === 'string' && /^https?:\/\//i.test(this.voucher.voucherCode) + return typeof this.qrText === 'string' && /^https?:\/\//i.test(this.qrText) } }, onLoad(options) { @@ -121,6 +123,7 @@ export default { }, onUnload() { this.stopPoll() + this.stopCheckTimer() }, methods: { refresh(first) { @@ -143,7 +146,11 @@ export default { } else { this.stopPoll() } - if (this.status === 2) this.$nextTick(() => this.renderQr()) + if (this.status === 2) { + this.loadCheckCode() + } else { + this.stopCheckTimer() + } }).catch(() => { if (first) uni.showToast({ title: '网络异常,请稍后重试', icon: 'none' }) }) @@ -159,18 +166,37 @@ export default { stopPoll() { if (this.pollTimer) { clearInterval(this.pollTimer); this.pollTimer = null } }, - // xuchao: 码字符串→二维码渲染;qrcode.min.js 为本地静态资源(static/js/),动态注入一次 + // xuchao: 取实时核销码并渲染;CNPC 侧 60 秒滚动,前端每 55 秒预取刷新 + loadCheckCode() { + const orderNo = this.voucher.orderNo || this.orderNo + if (!orderNo) return + this.$u.api.voucherCheckCode({ orderNo, phone: this.phone }).then(res => { + if (!bizOk(res)) { uni.showToast({ title: bizMsg(res) || '获取核销码失败', icon: 'none' }); return } + const d = bizData(res) + this.qrText = d.checkCode || '' + this.$nextTick(() => this.renderQr()) + this.startCheckTimer() + }).catch(() => {}) + }, + startCheckTimer() { + this.stopCheckTimer() + this.checkTimer = setInterval(() => this.loadCheckCode(), 55000) + }, + stopCheckTimer() { + if (this.checkTimer) { clearInterval(this.checkTimer); this.checkTimer = null } + }, + // xuchao: 核销码字符串→二维码渲染;qrcode.min.js 为本地静态资源(static/js/),动态注入一次 renderQr() { if (this.isQrImage) return + if (!this.qrText) return const draw = () => { if (typeof document === 'undefined' || typeof window.QRCode === 'undefined') return const el = document.getElementById('petrol-qr') - if (!el || el.hasChildNodes()) { - if (el && this.voucher.voucherCode) { el.innerHTML = ''; } else { return } - } + if (!el) return + el.innerHTML = '' // eslint-disable-next-line no-new new window.QRCode(el, { - text: this.voucher.voucherCode, + text: this.qrText, width: 200, height: 200, colorDark: '#1a1818', colorLight: '#ffffff', correctLevel: window.QRCode.CorrectLevel.H })