commit
f5c0df688c
@ -1,305 +1,254 @@ |
||||
<template> |
||||
<view style="padding-bottom: 50px;background-color: #C5121B;"> |
||||
<image class="wp100 img" mode="widthFix" src="https://oss-bq.ahduima.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%9B%BE%E7%89%87/%E5%8A%A9%E5%8A%9B%E4%B8%BB%E5%9B%BE.jpg"></image> |
||||
<image class="wp100 img" mode="widthFix" |
||||
src="https://oss-bq.ahduima.com/%E5%B0%8F%E7%A8%8B%E5%BA%8F/%E5%9B%BE%E7%89%87/%E5%8A%A9%E5%8A%9B%E4%B8%BB%E5%9B%BE.jpg"> |
||||
</image> |
||||
<view class="relative tip">邀请好友帮助你进行助力即可有机会领取奖品</view> |
||||
<view class="relative help_div"> |
||||
<!-- --> |
||||
<view v-if="type == 1" class="relative help_card"> |
||||
<view class="relative help_tip"> |
||||
还差{{diffNum}}位好友助力即可领取奖品: |
||||
</view> |
||||
<view v-if="winnerInfo.awards != undefined" class="relative help_tip" style="font-size: 40rpx;"> |
||||
{{winnerInfo.awards}} |
||||
</view> |
||||
<view class="help_list"> |
||||
<view v-for="item in helpUserList" class="help_item"> |
||||
<u-avatar class="help_item_avatar" :src="item.avatarUrl"></u-avatar> |
||||
|
||||
<!-- <view class="help_item_2_yao"> |
||||
<image :src="item.avatarUrl"></image> |
||||
</view> --> |
||||
</view> |
||||
<view v-for="item in diffNum" class="help_item_2"> |
||||
<view class="help_item_2_yao">邀</view> |
||||
</view> |
||||
</view> |
||||
<view class="help_btn" > |
||||
<button open-type="share" class="help_btn_font"> 邀请好友助力</button> |
||||
</view> |
||||
</view> |
||||
|
||||
<view v-if="type == 2" class="relative help_card"> |
||||
<view class="relative help_list" style="top: 200rpx;"> |
||||
<view v-if="winnerInfo.activityName != undefined" class="help_tip" style="font-size: 40rpx; margin: 25rpx 0rpx;"> |
||||
{{winnerInfo.activityName}} |
||||
</view> |
||||
<view v-if="winnerInfo.schoolName != undefined" class="help_tip"> |
||||
举办单位:{{winnerInfo.schoolName}} |
||||
</view> |
||||
<view v-if="winnerInfo.awards != undefined" class="help_tip" style="font-size: 45rpx;margin: 25rpx 0rpx;"> |
||||
奖品:{{winnerInfo.awards}} |
||||
</view> |
||||
</view> |
||||
|
||||
<view class="help_btn" > |
||||
<button class="help_btn_font" open-type="chooseAvatar" @chooseavatar="handleHelp" :disabled="disBtn">帮好友助力</button> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<!-- --> |
||||
<view v-if="type == 1" class="relative help_card"> |
||||
<view class="relative help_tip"> |
||||
还差{{diffNum}}位好友助力即可领取奖品: |
||||
</view> |
||||
<view v-if="winnerInfo.awards != undefined" class="relative help_tip" style="font-size: 40rpx;"> |
||||
{{winnerInfo.awards}} |
||||
</view> |
||||
<view class="p20"> |
||||
<u-grid :border="false" col="3"> |
||||
<u-grid-item v-for="(item, index) in helpUserList" :key="index"> |
||||
<u-avatar v-if="item.id" class="p10tb border" size="120rpx" :src="item.avatarUrl"></u-avatar> |
||||
<view v-else class="p10tb"> |
||||
<view class="avatar-text"> |
||||
<u-avatar bg-color="#fff" color="#ccc" size="120rpx" text="邀"></u-avatar> |
||||
</view> |
||||
</view> |
||||
</u-grid-item> |
||||
</u-grid> |
||||
</view> |
||||
<view class="help_btn"> |
||||
<button open-type="share" class="help_btn_font"> 邀请好友助力</button> |
||||
</view> |
||||
</view> |
||||
|
||||
<view v-if="type == 2" class="relative help_card"> |
||||
<view class="relative help_list" style="top: 200rpx;"> |
||||
<view v-if="winnerInfo?.activityName" class="help_tip" |
||||
style="font-size: 40rpx; margin: 25rpx 0rpx;"> |
||||
{{winnerInfo?.activityName}} |
||||
</view> |
||||
<view v-if="winnerInfo.schoolName != undefined" class="help_tip"> |
||||
举办单位:{{winnerInfo.schoolName}} |
||||
</view> |
||||
<view v-if="winnerInfo.awards != undefined" class="help_tip" style="font-size: 45rpx;margin: 25rpx 0rpx;"> |
||||
奖品:{{winnerInfo.awards}} |
||||
</view> |
||||
</view> |
||||
|
||||
<view class="help_btn"> |
||||
<button class="help_btn_font" open-type="chooseAvatar" @chooseavatar="handleHelp" |
||||
:disabled="disBtn">帮好友助力</button> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
import useUserStore from '@/jtools/store/user' |
||||
import { queryActivityDetail,queryHelpInfo, saveHelpInfo, queryWinnerInfo } from '@/jtools/api/activity' |
||||
import { |
||||
queryActivityDetail, |
||||
queryHelpInfo, |
||||
saveHelpInfo, |
||||
queryWinnerInfo |
||||
} from '@/jtools/api/activity' |
||||
export default { |
||||
data() { |
||||
return { |
||||
winnerId: undefined, |
||||
btnText: '点我刮奖', |
||||
showBtn: true, |
||||
helpUserList: [], |
||||
drawNum: 0, |
||||
diffNum: 3, |
||||
phone: undefined, |
||||
type: 2, |
||||
winnerInfo: undefined, |
||||
disBtn: false |
||||
winnerId: undefined, |
||||
helpUserList: [], |
||||
drawNum: 0, |
||||
phone: undefined, |
||||
type: 2, |
||||
winnerInfo: undefined, |
||||
disBtn: false |
||||
} |
||||
}, |
||||
onLoad(op) { |
||||
|
||||
this.winnerId = op.id |
||||
this.winnerId = op.id |
||||
// this.type = op.type ? Number(op.type) : 1 |
||||
this.phone = useUserStore().userInfo?.phone || undefined |
||||
console.log(this.phone) |
||||
this.getWinnerInfo() |
||||
this.getHelpInfo() |
||||
this.disBtn = false |
||||
|
||||
this.phone = useUserStore().userInfo?.phone || undefined |
||||
console.log(this.phone) |
||||
this.getWinnerInfo() |
||||
this.getHelpInfo() |
||||
this.disBtn = false |
||||
|
||||
}, |
||||
onShareAppMessage(res) { |
||||
if (res.from === 'button') { // 来自页面内分享按钮 |
||||
console.log(res.target) |
||||
} |
||||
return { |
||||
title: '我正在参与领奖活动柜,请帮我助力', |
||||
path: '/pages/me/help?id=' + this.winnerId + '&type=2' |
||||
} |
||||
}, |
||||
onShareAppMessage(res) { |
||||
if (res.from === 'button') {// 来自页面内分享按钮 |
||||
console.log(res.target) |
||||
} |
||||
return { |
||||
title: '我正在参与领奖活动柜,请帮我助力', |
||||
path: '/pages/me/help?id='+this.winnerId + '&type=2' |
||||
} |
||||
}, |
||||
|
||||
|
||||
methods: { |
||||
//查询中奖信息 |
||||
getWinnerInfo(){ |
||||
// uni.request({ |
||||
// url: 'http://192.168.1.6:8089/applet/activity/winner/info?winnerId='+this.winnerId |
||||
// }).then(resp => { |
||||
// if(resp.data.code == 200) { |
||||
// console.log(resp) |
||||
// this.winnerInfo = resp.data.data; |
||||
// if(this.phone && this.winnerInfo.phone == this.phone){ |
||||
// this.type == 1 |
||||
// } |
||||
// } |
||||
// }) |
||||
queryWinnerInfo({winnerId : this.winnerId}).then(resp => { |
||||
if(resp.code == 200){ |
||||
console.log(resp) |
||||
this.winnerInfo = resp.data; |
||||
if(this.phone && this.winnerInfo.phone == this.phone){ |
||||
this.type = 1 |
||||
} else { |
||||
this.type = 2 |
||||
} |
||||
} |
||||
}) |
||||
|
||||
}, |
||||
//查询助力信息 |
||||
getHelpInfo(){ |
||||
// uni.request({ |
||||
// url: 'http://192.168.1.6:8089/applet/activity/help/info?winnerId='+this.winnerId |
||||
// }).then(resp => { |
||||
// if(resp.data.code == 200) { |
||||
// console.log(resp) |
||||
// this.drawNum = resp.data.data.helpNum; |
||||
// this.helpUserList = resp.data.data.helpUsers |
||||
// this.diffNum = (this.drawNum - this.helpUserList.length) < 0 ? 0 : (this.drawNum - this.helpUserList.length); |
||||
// console.log(this.drawNum) |
||||
// console.log(this.diffNum) |
||||
// } |
||||
// }) |
||||
queryHelpInfo({winnerId : this.winnerId}).then(resp => { |
||||
if(resp.code == 200){ |
||||
console.log(resp) |
||||
this.drawNum = resp.data.helpNum; |
||||
this.helpUserList = resp.data.helpUsers.map(item => ({ |
||||
...item, |
||||
avatarUrl: 'https://jwl.ahduima.com' + item.avatarUrl |
||||
})); |
||||
this.diffNum = (this.drawNum - this.helpUserList.length) < 0 ? 0 : (this.drawNum - this.helpUserList.length); |
||||
} |
||||
}) |
||||
}, |
||||
//点击助力 |
||||
handleHelp(e){ |
||||
this.disBtn = false |
||||
console.log(e) |
||||
uni.login({ |
||||
provider: 'weixin', //使用微信登录 |
||||
success: (loginRes) => { |
||||
console.log(loginRes); |
||||
uni.uploadFile({ |
||||
url: 'https://jwl.ahduima.com/activity/applet/activity/help/save', |
||||
// url: 'http://192.168.1.6:8089/applet/activity/help/save', |
||||
filePath: e.detail.avatarUrl, |
||||
name: 'file', |
||||
formData: { |
||||
'code': loginRes.code, |
||||
'winnerId': this.winnerId, |
||||
}, |
||||
success: (uploadFileRes) => { |
||||
console.log(uploadFileRes.data); |
||||
let resp = JSON.parse(uploadFileRes.data); |
||||
console.log(resp); |
||||
|
||||
if(resp.code == 200){ |
||||
uni.showToast({ |
||||
icon: 'none', |
||||
title: `助力成功` |
||||
}) |
||||
this.disBtn = true |
||||
} else { |
||||
uni.showToast({ |
||||
icon: 'error', |
||||
title: resp.msg |
||||
}) |
||||
this.disBtn = true |
||||
} |
||||
} |
||||
}); |
||||
|
||||
} |
||||
}); |
||||
}, |
||||
|
||||
//查询中奖信息 |
||||
getWinnerInfo() { |
||||
queryWinnerInfo({ |
||||
winnerId: this.winnerId |
||||
}).then(resp => { |
||||
if (resp.code == 200) { |
||||
console.log(resp) |
||||
this.winnerInfo = resp.data; |
||||
if (this.phone && this.winnerInfo.phone == this.phone) { |
||||
this.type = 1 |
||||
} else { |
||||
this.type = 2 |
||||
} |
||||
} |
||||
}) |
||||
|
||||
}, |
||||
//查询助力信息 |
||||
getHelpInfo() { |
||||
queryHelpInfo({ |
||||
winnerId: this.winnerId |
||||
}).then(resp => { |
||||
if (resp.code == 200) { |
||||
this.drawNum = resp.data.helpNum; |
||||
const list = resp.data.helpUsers.map(item => ({ |
||||
...item, |
||||
avatarUrl: 'https://jwl.ahduima.com' + item.avatarUrl |
||||
})); |
||||
this.diffNum = (this.drawNum - list.length) < 0 ? 0 : (this.drawNum - list.length); |
||||
const arr = new Array(this.diffNum).fill({}) |
||||
this.helpUserList = [...list,...arr] |
||||
} |
||||
}) |
||||
}, |
||||
//点击助力 |
||||
handleHelp(e) { |
||||
this.disBtn = false |
||||
uni.login({ |
||||
provider: 'weixin', //使用微信登录 |
||||
success: (loginRes) => { |
||||
console.log(loginRes); |
||||
uni.uploadFile({ |
||||
url: 'https://jwl.ahduima.com/activity/applet/activity/help/save', |
||||
// url: 'http://192.168.1.6:8089/applet/activity/help/save', |
||||
filePath: e.detail.avatarUrl, |
||||
name: 'file', |
||||
formData: { |
||||
'code': loginRes.code, |
||||
'winnerId': this.winnerId, |
||||
}, |
||||
success: (uploadFileRes) => { |
||||
console.log(uploadFileRes.data); |
||||
let resp = JSON.parse(uploadFileRes.data); |
||||
console.log(resp); |
||||
|
||||
if (resp.code == 200) { |
||||
uni.showToast({ |
||||
icon: 'none', |
||||
title: `助力成功` |
||||
}) |
||||
this.disBtn = true |
||||
} else { |
||||
uni.showToast({ |
||||
icon: 'error', |
||||
title: resp.msg |
||||
}) |
||||
this.disBtn = true |
||||
} |
||||
} |
||||
}); |
||||
|
||||
} |
||||
}); |
||||
}, |
||||
|
||||
}, |
||||
} |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.img{ |
||||
top: -130rpx !important; |
||||
} |
||||
.img { |
||||
top: -130rpx !important; |
||||
} |
||||
|
||||
.tip { |
||||
height: 75px; |
||||
font-family: PingFang SC; |
||||
font-weight: 400; |
||||
color: #FEFEFE; |
||||
line-height: 48px; |
||||
top: -520rpx; |
||||
text-align: center; |
||||
font-size: 35rpx; |
||||
top: -520rpx; |
||||
text-align: center; |
||||
font-size: 35rpx; |
||||
} |
||||
.help_div{ |
||||
width: 710rpx; |
||||
height: 996rpx; |
||||
top: -560rpx; |
||||
margin-left: 20rpx; |
||||
margin-right: 20rpx; |
||||
background: linear-gradient(0deg, #F33D2F 100%, rgba(197,18,27,0.01) 0%); |
||||
border-radius: 40rpx; |
||||
|
||||
|
||||
.help_card{ |
||||
width: 630rpx; |
||||
height: 886rpx; |
||||
margin: 0rpx 39rpx; |
||||
top: 55rpx; |
||||
background: #FFFFFF; |
||||
border-radius: 24rpx; |
||||
|
||||
.help_tip{ |
||||
text-align: center; |
||||
font-size: 32rpx; |
||||
font-family: PingFang SC; |
||||
font-weight: 400; |
||||
color: #010101; |
||||
line-height: 55rpx; |
||||
top: 15rpx; |
||||
} |
||||
|
||||
.help_list{ |
||||
margin: 68rpx 25rpx 25rpx 20rpx; |
||||
height: 580rpx; |
||||
|
||||
.help_item{ |
||||
display: inline-block; |
||||
padding: 35rpx; |
||||
width: 194rpx; |
||||
height: 194rpx; |
||||
|
||||
border-radius: 50%; |
||||
|
||||
.help_item_avatar{ |
||||
margin: auto; |
||||
width: 56rpx; |
||||
height: 56rpx; |
||||
color: #CCCCCC; |
||||
background: #C42E13; |
||||
border: 4px solid #C42E13; |
||||
|
||||
image{ |
||||
height: 45px; |
||||
width: 45px; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.help_item_2{ |
||||
display: inline-block; |
||||
margin: 35rpx; |
||||
width: 124rpx; |
||||
height: 124rpx; |
||||
border: 2px dotted #CCCCCC; |
||||
border-radius: 50%; |
||||
|
||||
.help_item_2_yao{ |
||||
margin: 34rpx 33rpx; |
||||
width: 56rpx; |
||||
height: 56rpx; |
||||
font-size: 60rpx; |
||||
font-family: PingFang SC; |
||||
font-weight: 400; |
||||
color: #CCCCCC; |
||||
line-height: 48rpx; |
||||
} |
||||
|
||||
} |
||||
|
||||
|
||||
} |
||||
|
||||
.help_btn{ |
||||
text-align: center; |
||||
margin: 0 75rpx; |
||||
margin-bottom: 30rpx; |
||||
width: 500rpx; |
||||
height: 86rpx; |
||||
background: linear-gradient(0deg, #DE4224 0%, #B81706 100%); |
||||
border-radius: 43rpx; |
||||
|
||||
.help_btn_font{ |
||||
font-size: 32rpx; |
||||
font-family: PingFang SC; |
||||
font-weight: 400; |
||||
color: #FFFFFF; |
||||
line-height: 86rpx; |
||||
background: center; |
||||
} |
||||
} |
||||
} |
||||
|
||||
|
||||
|
||||
.avatar-text { |
||||
border-radius: 50%; |
||||
border: 1px dashed #ccc; |
||||
} |
||||
|
||||
|
||||
.help_div { |
||||
width: 710rpx; |
||||
height: 996rpx; |
||||
top: -560rpx; |
||||
margin-left: 20rpx; |
||||
margin-right: 20rpx; |
||||
background: linear-gradient(0deg, #F33D2F 100%, rgba(197, 18, 27, 0.01) 0%); |
||||
border-radius: 40rpx; |
||||
|
||||
|
||||
.help_card { |
||||
width: 630rpx; |
||||
height: 886rpx; |
||||
margin: 0rpx 39rpx; |
||||
top: 55rpx; |
||||
background: #FFFFFF; |
||||
border-radius: 24rpx; |
||||
|
||||
.help_tip { |
||||
text-align: center; |
||||
font-size: 32rpx; |
||||
font-family: PingFang SC; |
||||
font-weight: 400; |
||||
color: #010101; |
||||
line-height: 55rpx; |
||||
top: 15rpx; |
||||
} |
||||
|
||||
.help_list { |
||||
margin: 68rpx 25rpx 25rpx 20rpx; |
||||
height: 580rpx; |
||||
|
||||
} |
||||
|
||||
.help_btn { |
||||
text-align: center; |
||||
margin: 0 75rpx; |
||||
margin-bottom: 30rpx; |
||||
width: 500rpx; |
||||
height: 86rpx; |
||||
background: linear-gradient(0deg, #DE4224 0%, #B81706 100%); |
||||
border-radius: 43rpx; |
||||
|
||||
.help_btn_font { |
||||
font-size: 32rpx; |
||||
font-family: PingFang SC; |
||||
font-weight: 400; |
||||
color: #FFFFFF; |
||||
line-height: 86rpx; |
||||
background: center; |
||||
} |
||||
} |
||||
} |
||||
|
||||
|
||||
} |
||||
</style> |
Loading…
Reference in new issue