huxiaofeng666
/
jwl-applet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
Labels Milestones
New Pull Request

样式调整 #41

Merged
qiushanhe merged 1 commits from dev-qsh into master 8 months ago
Conversation 0 Commits 1 Files Changed 1
1 changed files with 222 additions and 273 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 495
      src/pages/me/help.vue

495
src/pages/me/help.vue
Unescape View File

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