163 lines
3.3 KiB
Vue
163 lines
3.3 KiB
Vue
<template>
|
|
<view>
|
|
<u-popup v-model="show" mode="center" @close="close">
|
|
<view class="bg">
|
|
<view class="title">恭喜您获得</view>
|
|
<view class="goods">
|
|
<template v-if="result&&result.type==3">
|
|
<view class="u-flex u-col-center u-row-center">
|
|
<image style="height: 100px;" :src="result.img" mode="heightFix"></image>
|
|
</view>
|
|
<view class="u-flex u-row-center u-m-t-30">
|
|
<view class="type">{{result.name}}</view>
|
|
</view>
|
|
</template>
|
|
<template v-if="result&&result.type==2">
|
|
<view class="u-flex color-money u-col-center u-row-center">
|
|
<view class="money">{{result.number}}</view>
|
|
<view class="font-bold " style="margin-top: 20rpx;font-size: 36rpx;">元</view>
|
|
</view>
|
|
<view class="u-flex u-m-t-24 u-row-center">
|
|
<view class="type">现金红包</view>
|
|
</view>
|
|
</template>
|
|
|
|
</view>
|
|
|
|
<view class="u-flex close u-row-center">
|
|
<u-icon name="close-circle" :size="54" @click="close" color="#fff"></u-icon>
|
|
</view>
|
|
</view>
|
|
|
|
</u-popup>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
show: false,
|
|
result: ''
|
|
}
|
|
},
|
|
methods: {
|
|
open(data) {
|
|
console.log(data);
|
|
this.result = data
|
|
this.show = true
|
|
},
|
|
close() {
|
|
console.log('抽奖弹窗关闭');
|
|
this.show = false
|
|
if(!this.result){
|
|
return
|
|
}
|
|
const {
|
|
orderId,
|
|
id
|
|
} = this.result
|
|
this.$Request.postJson('/app/discSpinning/receive', this.result).then(res => {
|
|
this.result = ''
|
|
console.log(res)
|
|
if (res.code == 0) {
|
|
console.log('抽奖领取成功');
|
|
const key=res.data==0?'isBindAliPay':undefined
|
|
this.$emit('close',key)
|
|
if(key&&key=='isBindAliPay'){
|
|
uni.navigateTo({
|
|
url:'/me/yaoqing/zhifubao-tixain'
|
|
})
|
|
}
|
|
} else {
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
::v-deep .u-mode-center-box {
|
|
background-color: transparent;
|
|
}
|
|
|
|
.color-money {
|
|
color: #E42F00;
|
|
}
|
|
|
|
.money {
|
|
font-weight: 700;
|
|
font-size: 96rpx;
|
|
letter-spacing: 2px;
|
|
}
|
|
|
|
.bg {
|
|
width: 628rpx;
|
|
height: 770rpx;
|
|
margin-right: 10rpx;
|
|
background-color: transparent;
|
|
background-repeat: no-repeat;
|
|
background-position: center center;
|
|
background-size: cover;
|
|
background-image: url("~static/images/zhuanpan/gift.png");
|
|
position: relative;
|
|
|
|
@media (-webkit-min-device-pixel-ratio: 2),
|
|
(min-device-pixel-ratio: 2) {
|
|
background-image: url("~static/images/zhuanpan/gift@2x.png");
|
|
}
|
|
|
|
.title {
|
|
position: absolute;
|
|
top: 218rpx;
|
|
text-align: center;
|
|
left: 0;
|
|
right: 0;
|
|
font-weight: 700;
|
|
font-size: 60rpx;
|
|
color: #AF6920;
|
|
letter-spacing: 4rpx;
|
|
}
|
|
|
|
.goods {
|
|
position: absolute;
|
|
top: 336rpx;
|
|
text-align: center;
|
|
left: 0;
|
|
right: 0;
|
|
text-align: center;
|
|
}
|
|
|
|
.type {
|
|
padding: 6rpx 28rpx;
|
|
border-radius: 100rpx;
|
|
background: #E25B41;
|
|
font-size: 28rpx;
|
|
color: #fff;
|
|
font-weight: bold;
|
|
}
|
|
.close{
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
}
|
|
.btn-box {
|
|
position: absolute;
|
|
top: 574rpx;
|
|
left: 0;
|
|
right: 0;
|
|
|
|
.btn {
|
|
padding: 10rpx 60rpx 10rpx 64rpx;
|
|
text-align: center;
|
|
font-weight: bold;
|
|
font-size: 44rpx;
|
|
color: #AF6920;
|
|
letter-spacing: 2px;
|
|
}
|
|
}
|
|
|
|
}
|
|
</style> |