|
|
|
|
@ -2,7 +2,9 @@ |
|
|
|
|
<view> |
|
|
|
|
<view class="backcorf06 height100p"></view> |
|
|
|
|
<view class="backcorfff backgrd width90 couhead"> |
|
|
|
|
<image class="couimg flleft" mode="widthFix" :src="imageUrl+couponDesInfo.couponInfo.couponImg"></image> |
|
|
|
|
<image class="couimg flleft" mode="widthFix" |
|
|
|
|
v-if="couponDesInfo.couponInfo.couponImg && couponDesInfo.couponInfo.couponImg !=undefined" |
|
|
|
|
:src="imageUrl+couponDesInfo.couponInfo.couponImg"></image> |
|
|
|
|
<view class="couhedcout"> |
|
|
|
|
<view class="height40 width100"> |
|
|
|
|
<view class="couStu flright fotct mart10" v-if="couponDesInfo.highUserCoupon.status == 2">已使用</view> |
|
|
|
|
@ -13,19 +15,62 @@ |
|
|
|
|
<view class="fontwig6 font13 fcor999 mart5" v-if="oneTime">领取时间:{{oneTime | formatDate('-')}}</view> |
|
|
|
|
<view class="fontwig6 font13 fcor999 mart5" v-if="twoTime">使用有效期:{{twoTime | formatDate('-')}}</view> |
|
|
|
|
<view class="fontwig6 font13 fcor999 mart5" v-if="threeTime">消费时间:{{threeTime | formatDate('-')}}</view> |
|
|
|
|
<view class="fontwig6 font13 fcor999 mart5" v-if="couponDesInfo.couponCodeInfo.storeName"> |
|
|
|
|
<view class="fontwig6 font13 fcor999 mart5" v-if="couponDesInfo.couponCodeInfo"> |
|
|
|
|
加油站点:{{couponDesInfo.couponCodeInfo.storeName}}</view> |
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
<view class="width90 backcorfff mart80 qrcs"> |
|
|
|
|
<view class="width100 fotct" v-if="couponDesInfo.couponInfo.couponSource == 4"> |
|
|
|
|
<view class="relybtn font13 fcorfff fotct mart15" v-if="couponDesInfo.couponInfo.couponSource == 5" |
|
|
|
|
@click="getVerifyQRCode(couponDesInfo.highUserCoupon.id)">刷新二维码</view> |
|
|
|
|
<view class="width90 mart10 marb10 fotct" v-if="couponDesInfo.couponInfo.couponSource == 5"> |
|
|
|
|
<image class="coupon-qr" :src="imageqrUrl+qrimageurl"></image> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
<!-- #ifdef MP --> |
|
|
|
|
<button class="coupne-btn font14 width80" v-if="couponDesInfo.couponInfo.couponSource == 5" |
|
|
|
|
@click="jumpzyhk">前往"中油好客e站小程序"</button> |
|
|
|
|
<!-- #endif --> |
|
|
|
|
<!-- #ifdef H5 --> |
|
|
|
|
<wx-open-launch-weapp style="width: 270px;" v-if="couponDesInfo.couponInfo.couponSource == 5" |
|
|
|
|
id="launch-btn" username="gh_5fb54244cdbb"> |
|
|
|
|
<script type="text/wxtag-template"> |
|
|
|
|
<style> |
|
|
|
|
.btn { |
|
|
|
|
padding: 12px; |
|
|
|
|
} |
|
|
|
|
.download { |
|
|
|
|
color: #ffffff; |
|
|
|
|
background: #0083f5; |
|
|
|
|
width:100%; |
|
|
|
|
height:100%; |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
justify-content: center; |
|
|
|
|
font-size: 16px; |
|
|
|
|
font-family: PingFangSC-Medium, PingFang SC; |
|
|
|
|
font-weight: 500; |
|
|
|
|
} |
|
|
|
|
</style> |
|
|
|
|
<button class="download btn" style="height:50px;width:100%;border:none;">前往"中油好客e站小程序"</button> |
|
|
|
|
</script> |
|
|
|
|
</wx-open-launch-weapp> |
|
|
|
|
<!-- #endif --> |
|
|
|
|
|
|
|
|
|
<view class="width100 mart10 fotct" v-if="couponDesInfo.couponInfo.couponSource == 4"> |
|
|
|
|
<view class="font28 fontlet mart5 marb10" style="color: #1593c3;">视频教程</view> |
|
|
|
|
<yy-video-player :auto-play="false" :url="imagewxUrl+imgadres3" :poster="poster" :show-back-btn="true"> |
|
|
|
|
</yy-video-player> |
|
|
|
|
<image :src="imagewxUrl+imgadres2" mode="widthFix" class="mart10"></image> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
<!-- <view class="width100 mart10 fotct" v-if="couponDesInfo.couponInfo.couponSource == 5"> |
|
|
|
|
<view class="font28 fontlet mart5 marb10" style="color: #1593c3;">视频教程</view> |
|
|
|
|
<yy-video-player :auto-play="false" :url="imagewxUrl+imgadres6" :poster="poster" :show-back-btn="true"> |
|
|
|
|
</yy-video-player> |
|
|
|
|
<image :src="imagewxUrl+imgadres5" mode="widthFix" class="mart10"></image> |
|
|
|
|
</view> --> |
|
|
|
|
<view class="mart20 fotct fcorred font15 marb20 height20" |
|
|
|
|
v-if="couponDesInfo.couponInfo.reserveStatus && couponDesInfo.highUserCoupon.status != 0"> |
|
|
|
|
预约订单已成功 门店会在24小时内联系您</view> |
|
|
|
|
@ -33,17 +78,20 @@ |
|
|
|
|
v-if="!couponDesInfo.couponInfo.reserveStatus && couponDesInfo.highUserCoupon.status != 0 && couponDesInfo.couponInfo.couponSource == 3"> |
|
|
|
|
请出示核销码(商户扫客户)</view> |
|
|
|
|
<view class="mart20 fotct fcorred font15 marb20 height20" |
|
|
|
|
v-if="!couponDesInfo.couponInfo.reserveStatus && couponDesInfo.highUserCoupon.status != 0 && couponDesInfo.couponInfo.couponSource != 3"> |
|
|
|
|
v-if="!couponDesInfo.couponInfo.reserveStatus && couponDesInfo.highUserCoupon.status != 0 && couponDesInfo.couponInfo.couponSource != 3 && couponDesInfo.couponInfo.couponSource != 5"> |
|
|
|
|
请告知加油员用码商支付</view> |
|
|
|
|
<view class="width90 mart20 fotct" v-if="!couponDesInfo.couponInfo.reserveStatus"> |
|
|
|
|
<view class="width90 mart20 fotct" v-if="couponDesInfo.couponInfo.reserveStatus"> |
|
|
|
|
<image class="coupon-qr" :src="imageUrl+'couponCode/'+couponDesInfo.highUserCoupon.qrCodeImg"></image> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
<view class="fotct fcor333 font15 marb10 mart10" |
|
|
|
|
v-if="couponDesInfo.couponInfo.couponSource != 4 && couponDesInfo.couponCodeInfo.codeKey"> |
|
|
|
|
v-if="couponDesInfo.couponInfo.couponSource != 4 && couponDesInfo.couponInfo.couponSource != 5"> |
|
|
|
|
{{couponDesInfo.couponCodeInfo.codeKey}} |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
<view class="width90 mart10 googscs backcorfff" v-if="couponDesInfo.couponInfo.couponSource != 4"> |
|
|
|
|
<view class="width90 mart10 googscs backcorfff" |
|
|
|
|
v-if="couponDesInfo.couponInfo.couponSource != 4 && couponDesInfo.couponInfo.couponSource != 5"> |
|
|
|
|
<view class="width90 height45l font18 fcor666 aliitem" v-if="storeList"> |
|
|
|
|
<view class="width50 alijusstart"> |
|
|
|
|
<image mode="widthFix" style="width: 50rpx; max-height: 50rpx;margin-right: 10px;" |
|
|
|
|
@ -69,6 +117,7 @@ |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="height60"></view> |
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
@ -76,8 +125,12 @@ |
|
|
|
|
import { |
|
|
|
|
getUserCouponDetail, |
|
|
|
|
getStoreListByCoupon, |
|
|
|
|
againReceiveCoupon |
|
|
|
|
} from "../../../Utils/Api.js" |
|
|
|
|
getVerifyQRCode, |
|
|
|
|
verifyWx |
|
|
|
|
} from "../../../Utils/Api.js"; |
|
|
|
|
// #ifdef H5 |
|
|
|
|
var wx = require('jweixin-module'); |
|
|
|
|
// #endif |
|
|
|
|
import xiaoVideoElement from '../../../components/yy-video-player/yy-video-player.nvue' |
|
|
|
|
let app = getApp() |
|
|
|
|
export default { |
|
|
|
|
@ -89,10 +142,13 @@ |
|
|
|
|
couDesId: '', |
|
|
|
|
imageUrl: app.globalData.imgUrl, |
|
|
|
|
imagewxUrl: app.globalData.imageWxImg, |
|
|
|
|
imageqrUrl: app.globalData.imageqrImg, |
|
|
|
|
imgadres1: 'dhl.png', |
|
|
|
|
imgadres2: 'video.jpg', |
|
|
|
|
imgadres3: 'playVideo.mp4', |
|
|
|
|
imgadres: 'noorder.png', |
|
|
|
|
imgadres5: 'petrovideo.jpg', //重庆中石油 |
|
|
|
|
imgadres6: 'petroplayVideo.mp4', //重庆中石油 |
|
|
|
|
couponDesInfo: [], |
|
|
|
|
storeList: [], |
|
|
|
|
oneTime: '', |
|
|
|
|
@ -101,13 +157,46 @@ |
|
|
|
|
menddesId: '', |
|
|
|
|
pageNum: 1, |
|
|
|
|
pageSize: 1, |
|
|
|
|
isNoMoreData: false |
|
|
|
|
isNoMoreData: false, |
|
|
|
|
qrimageurl: '', //中石油二维码 |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
onLoad(option) { |
|
|
|
|
this.couDesId = option.id; |
|
|
|
|
this.menddesId = option.mendId; |
|
|
|
|
this.getUserCouponDetail(); |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
created() { |
|
|
|
|
// #ifdef H5 |
|
|
|
|
uni.showLoading({ |
|
|
|
|
title: '加载中' |
|
|
|
|
}) |
|
|
|
|
let url = window.location.href.split('#')[0]; |
|
|
|
|
let datas = { |
|
|
|
|
url: url |
|
|
|
|
} |
|
|
|
|
verifyWx(datas).then(res => { |
|
|
|
|
uni.hideLoading(); |
|
|
|
|
if (res.return_code == '000000') { |
|
|
|
|
wx.config({ |
|
|
|
|
debug: false, // 开启调试模式,返回值会在客户端alert出来。 |
|
|
|
|
appId: res.return_data.appId, // 必填，公众号的唯一标识 |
|
|
|
|
timestamp: res.return_data.timestamp, // 必填，生成签名的时间戳 |
|
|
|
|
nonceStr: res.return_data.nonceStr, // 必填，生成签名的随机串 |
|
|
|
|
signature: res.return_data.signature, // 必填，签名 |
|
|
|
|
jsApiList: ['onMenuShareTimeline'], // 必填，需要使用的JS接口列表 |
|
|
|
|
openTagList: ['wx-open-launch-weapp'] // 可选，需要使用的开放标签列表 |
|
|
|
|
}); |
|
|
|
|
wx.ready(function(res) {}); |
|
|
|
|
wx.error(function(err) {}); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
}); |
|
|
|
|
// #endif |
|
|
|
|
}, |
|
|
|
|
onUnload() { |
|
|
|
|
clearInterval(this.Timer); |
|
|
|
|
}, |
|
|
|
|
filters: { |
|
|
|
|
//过滤器 用于格式化时间 |
|
|
|
|
@ -127,8 +216,7 @@ |
|
|
|
|
return `${year}${spe}${month}${spe}${day} ${h}:${mm}:${s}`; |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
onReachBottom() { |
|
|
|
|
}, |
|
|
|
|
onReachBottom() {}, |
|
|
|
|
methods: { |
|
|
|
|
//我的卡券详情 |
|
|
|
|
getUserCouponDetail() { |
|
|
|
|
@ -142,7 +230,11 @@ |
|
|
|
|
if (res.return_code == '000000') { |
|
|
|
|
this.couponDesInfo = res.return_data; |
|
|
|
|
uni.hideLoading(); |
|
|
|
|
if (res.return_data.couponInfo.couponSource == 4) { |
|
|
|
|
if (res.return_data.couponInfo.couponSource == 5) { |
|
|
|
|
this.getVerifyQRCode(res.return_data.highUserCoupon.id); |
|
|
|
|
} |
|
|
|
|
if (res.return_data.couponInfo.couponSource == 4 || res.return_data.couponInfo |
|
|
|
|
.couponSource == 5) { |
|
|
|
|
this.oneTime = res.return_data.highUserCoupon.createTime; |
|
|
|
|
this.twoTime = res.return_data.highUserCoupon.useEndTime; |
|
|
|
|
this.threeTime = res.return_data.highUserCoupon.consumeTime; |
|
|
|
|
@ -157,6 +249,19 @@ |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
//生成二维码 |
|
|
|
|
getVerifyQRCode(item) { |
|
|
|
|
let params = { |
|
|
|
|
userCouponId: item |
|
|
|
|
} |
|
|
|
|
getVerifyQRCode(params).then(res => { |
|
|
|
|
if (res.return_code == '000000') { |
|
|
|
|
this.qrimageurl = res.return_data; |
|
|
|
|
clearInterval(this.Timer); |
|
|
|
|
this.setTimer(); |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
//导航 |
|
|
|
|
seeloaction(e) { |
|
|
|
|
uni.openLocation({ |
|
|
|
|
@ -206,35 +311,46 @@ |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
//领取 |
|
|
|
|
againReceiveCoupon() { |
|
|
|
|
uni.showLoading({ |
|
|
|
|
title: '领取中...' |
|
|
|
|
}) |
|
|
|
|
let params = { |
|
|
|
|
couponId: this.couponDesInfo.couponInfo.id |
|
|
|
|
//跳转中油好客 |
|
|
|
|
jumpzyhk() { |
|
|
|
|
// #ifdef MP |
|
|
|
|
uni.navigateToMiniProgram({ |
|
|
|
|
appId: 'wx7cd1712834749dcb', |
|
|
|
|
extraData: { |
|
|
|
|
'data1': 'release' |
|
|
|
|
}, |
|
|
|
|
success(res) { |
|
|
|
|
// 打开成功 |
|
|
|
|
} |
|
|
|
|
againReceiveCoupon(params).then(res => { |
|
|
|
|
if (res.return_code == '000000') { |
|
|
|
|
uni.hideLoading(); |
|
|
|
|
uni.showToast({ |
|
|
|
|
icon: 'none', |
|
|
|
|
title: '领取成功', |
|
|
|
|
duration: 2000 |
|
|
|
|
}) |
|
|
|
|
this.couponDesInfo = res.return_data; |
|
|
|
|
this.oneTime = res.return_data.highUserCoupon.createTime; |
|
|
|
|
this.twoTime = res.return_data.highUserCoupon.useEndTime; |
|
|
|
|
this.threeTime = res.return_data.highUserCoupon.consumeTime; |
|
|
|
|
} else { |
|
|
|
|
uni.hideLoading(); |
|
|
|
|
uni.showToast({ |
|
|
|
|
icon: 'none', |
|
|
|
|
title: res.return_msg, |
|
|
|
|
duration: 2000 |
|
|
|
|
}) |
|
|
|
|
// #endif |
|
|
|
|
|
|
|
|
|
// #ifdef H5 |
|
|
|
|
// location.href = 'weixin://dl/business/?t=khJZppojuyo'; |
|
|
|
|
// #endif |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
Timer() {}, |
|
|
|
|
//倒计时一分钟 |
|
|
|
|
setTimer() { |
|
|
|
|
let that = this; |
|
|
|
|
let holdTime = 60; |
|
|
|
|
that.Timer = setInterval(() => { |
|
|
|
|
if (holdTime <= 0) { |
|
|
|
|
uni.showModal({ |
|
|
|
|
title: '提示', |
|
|
|
|
content: '当前二维码已失效,请刷新后展示', |
|
|
|
|
success: function(res) { |
|
|
|
|
if (res.confirm) { |
|
|
|
|
that.getVerifyQRCode(that.couponDesInfo.highUserCoupon.id); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
clearInterval(that.Timer); |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
holdTime--; |
|
|
|
|
}, 1000) |
|
|
|
|
}, |
|
|
|
|
scan() { |
|
|
|
|
uni.scanCode({ |
|
|
|
|
@ -253,6 +369,16 @@ |
|
|
|
|
background-color: #f5f5f5; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.relybtn { |
|
|
|
|
background-color: #0083f5; |
|
|
|
|
width: 110px; |
|
|
|
|
margin-left: auto; |
|
|
|
|
margin-right: auto; |
|
|
|
|
height: 30px; |
|
|
|
|
border-radius: 5px; |
|
|
|
|
line-height: 30px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.couhead { |
|
|
|
|
position: absolute; |
|
|
|
|
top: 20px; |
|
|
|
|
@ -273,6 +399,7 @@ |
|
|
|
|
.couStu { |
|
|
|
|
background-color: #dceefe; |
|
|
|
|
color: #0076dd; |
|
|
|
|
font-size: 12px; |
|
|
|
|
height: 60rpx; |
|
|
|
|
line-height: 60rpx; |
|
|
|
|
width: 60px; |
|
|
|
|
@ -284,6 +411,7 @@ |
|
|
|
|
border-top-style: dotted; |
|
|
|
|
border-top-color: #f6f6f6; |
|
|
|
|
padding-bottom: 20px; |
|
|
|
|
text-align: center; |
|
|
|
|
border-radius: 0px 0px 5px 5px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
@ -351,18 +479,18 @@ |
|
|
|
|
border-radius: 10px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.coupne-btn { |
|
|
|
|
position: fixed; |
|
|
|
|
bottom: 0px; |
|
|
|
|
background-color: red; |
|
|
|
|
color: #FFFFFF; |
|
|
|
|
border-radius: 0px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.czlq { |
|
|
|
|
position: absolute; |
|
|
|
|
bottom: 0; |
|
|
|
|
background-color: red; |
|
|
|
|
color: #FFFFFF; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.coupne-btn { |
|
|
|
|
background-color: #0083f5; |
|
|
|
|
color: #FFFFFF; |
|
|
|
|
height: 45px; |
|
|
|
|
line-height: 45px; |
|
|
|
|
border-radius: 0px; |
|
|
|
|
} |
|
|
|
|
</style> |
|
|
|
|
|
