115 lines
3.8 KiB
Vue
115 lines
3.8 KiB
Vue
<template>
|
|
<view class="redeem pos">
|
|
<view v-if="ismask" class="mask flex_center flex_items"
|
|
style="width: 100%;height: 100vh;position: fixed;z-index: 1;background: rgba(0,0,0,.6);">
|
|
<view class="flex_column flex_items bgwhite"
|
|
style="padding:50rpx;border-radius: 16rpx;width: calc(100% - 200rpx);">
|
|
<image class="" :src="imgUrl+'dcg.png'" style="width: 120rpx;height: 120rpx;" mode=""></image>
|
|
<text class="f40 mt50" style="color: #333;">领取成功</text>
|
|
<text class="f28 mt30" style="color: #808080;">恭喜，奖品已经成功兑换，请到平台查看。</text>
|
|
<view class="flex_items flex_center mt50">
|
|
<view @click="gomy" class="f32 f-center"
|
|
style="width: 280rpx;height: 80rpx;line-height: 80rpx;background: linear-gradient(270deg, #FF9843 0%, #F43139 100%);border-radius: 54rpx;color: #fff;">
|
|
确认
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="flex_items flex_center" style="width: 100%;">
|
|
<view class="bgwhite pb30 plr20 pt20 mt35" style="width: calc(100% - 100rpx);border-radius: 20rpx;">
|
|
<view class="flex_between flex_items pb20 bbe9s">
|
|
<view class="flex_start flex_items">
|
|
<image :src="info.prize_data.main_image"
|
|
style="width: 104rpx;height: 104rpx;border-radius: 12rpx;" mode=""></image>
|
|
<view class="flex_column f30 ml30" style="color:#333">
|
|
<text class="bold">{{info.prize}}</text>
|
|
<view class="f24 mt15" style="color: #666;">{{info.goodsExchangeRecord.receive_expire_time}}
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="flex_start flex_items mr20" style="color: #EB5E42;">
|
|
<view class="f24">￥</view>
|
|
<text class="f48 bolder one">{{info.prize_data.price}}</text>
|
|
</view>
|
|
</view>
|
|
<view class="pt20 f22" style="color: #666;">{{info.prize_data.price}}元积分兑换券，积分已经充值到用户</view>
|
|
</view>
|
|
</view>
|
|
<view class="flex_items flex_center" style="width: 100%;">
|
|
<view class="bgwhite pb30 plr20 pt20 mt35 flex_column"
|
|
style="width: calc(100% - 100rpx);border-radius: 20rpx;">
|
|
<text class="f30 mt30 bold" style="color: #333;">待充账号</text>
|
|
<u--input class="mt30" fontSize="14" placeholder="请输入手机号" border="surround" v-model="form.phone">
|
|
</u--input>
|
|
<text class="f26 mt40" style="color:#4D4D4D;">温馨提示</text>
|
|
<view class="mt20 f24" style="color:#4D4D4D;">
|
|
<view>1.此商品兑换后不支持七天无理由退换货，请谨慎兑换。</view>
|
|
<view class="mt20">2.刷信誉、兼职等理由均为诈骗术，请勿相信任何诱导行为。</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="flex_items flex_center abs" style="width: 100%;bottom:60rpx;left: 0;">
|
|
<view @click="dui" class="f-center f32"
|
|
style="width: 638rpx;height: 108rpx;line-height: 108rpx;background: linear-gradient(270deg, #FF9843 0%, #F43139 100%);border-radius: 54rpx;color: #fff;">
|
|
立即兑换
|
|
</view>
|
|
</view>
|
|
<Ywatermark :info="'蓝色兄弟'"></Ywatermark>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
form: {
|
|
phone: uni.getStorageSync('phone')
|
|
},
|
|
info: {},
|
|
ismask: false
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
this.info = JSON.parse(options.item)
|
|
},
|
|
methods: {
|
|
dui() {
|
|
uni.showLoading({
|
|
title: '兑换中...',
|
|
})
|
|
let that = this
|
|
that.api.getdui({
|
|
joinId: this.info.id,
|
|
phone: this.form.phone
|
|
}).then((res) => {
|
|
console.log(res)
|
|
if (res.data.code == 200) {
|
|
that.ismask = true
|
|
} else {
|
|
uni.hideLoading()
|
|
uni.showToast({
|
|
title: res.data.message,
|
|
icon: 'none'
|
|
})
|
|
}
|
|
})
|
|
},
|
|
gomy(){
|
|
uni.switchTab({
|
|
url:"/pages/my/index"
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
page {
|
|
background: #f5f5f5 !important;
|
|
}
|
|
|
|
.redeem {
|
|
height: 100vh;
|
|
}
|
|
</style>
|