You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

379 lines
12 KiB

<template>
<view>
<view class="bg" v-bind:style="{backgroundImage: 'url('+toBase64Url+')'}">
<text class="num" style="font-size: 32upx;color: #000000;margin-bottom: 10px">
<text style="font-size: 32upx;font-weight: bold;color: #000000;margin-right:10upx;">当前等级</text>
<text style="font-size: 30upx;font-weight: bold;margin-right:6upx;"> </text>
<text style="font-size: 50upx;font-weight: bold;font-weight: bold;">{{ dengji }}</text>
</text>
<view style="font-size: 28upx;margin-top: 32upx;color: #000000;">{{ dengjides }}</view>
</view>
<view style="text-align: left;color: #333333;font-size: 28upx;">
<view style="margin-top: 16upx;background: #FFFFFF;border-radius: 16upx;padding: 26upx;margin: 12upx;">
<view style="font-size: 32upx;font-weight: bold;margin-bottom: 16upx;">邀请规则</view>
<view>1每成功邀请1位好友提升1级最高{{ invitatioNum }}级每级对应相应的返现比例</view>
<view style="margin-top: 8upx">2邀请成功可享受终身粉丝佣金{{ teamMoney }}%提成</view>
<view style="margin-top: 8upx" v-if="setting==2">3已邀请成功的好友再邀请好友可享受非直属好友佣金{{ threeMoney }}%提成</view>
</view>
<!-- #ifdef MP-WEIXIN -->
<view style="margin-top: 16upx;background: #FFFFFF;border-radius: 16upx;padding: 26upx;margin: 12upx;">
<view style="font-size: 32upx;font-weight: bold;margin-bottom: 16upx;margin-top: 16upx;">邀请方式</view>
<view>1点击下方分享给好友分享好友请好友注册即可升级</view>
</view>
<!-- #endif -->
<!-- #ifndef MP-WEIXIN -->
<view style="margin-top: 16upx;background: #FFFFFF;border-radius: 16upx;padding: 26upx;margin: 12upx;">
<view style="font-size: 32upx;font-weight: bold;margin-bottom: 16upx;margin-top: 16upx;">邀请方式</view>
<view style="margin-top: 8upx;">点击下方分享邀请链接生成邀请海报生成专属推广信息分享好友让好友注册即可升级</view>
</view>
<!-- #endif -->
</view>
<view style="display: flex;margin-top: 64upx;margin-left: 16upx;margin-right: 16upx;">
<!-- #ifdef MP-WEIXIN -->
<button @click="showPopu()" style="text-align: center;width: 95%;background: #ED3113;font-size: 32upx;color: white;border-radius: 20upx;height: 80upx;line-height: 80upx;margin-left: 20upx;">
分享给好友
</button>
<!-- #endif -->
<!-- #ifdef H5 -->
<view @click="showModal()" style="margin-right: 32upx;text-align: center;width: 50%;background: #FFCB49;font-size: 32upx;color: white;border-radius: 20upx;height: 80upx;line-height: 80upx">
生成邀请海报
</view>
<view @click="shareYQ()" style="text-align: center;width: 50%;background: #ED3113;font-size: 32upx;color: white;border-radius: 20upx;height: 80upx;line-height: 80upx;margin-left: 20upx;">
分享邀请链接
</view>
<!-- #endif -->
<!-- #ifdef APP-PLUS -->
<view @click="showModal()" style="margin-right: 32upx;text-align: center;width: 50%;background: #FFCB49;font-size: 32upx;color: white;border-radius: 20upx;height: 80upx;line-height: 80upx">
生成邀请海报
</view>
<view @click="shareWeiXin()" style="text-align: center;width: 50%;background: #ED3113;font-size: 32upx;color: white;border-radius: 20upx;height: 80upx;line-height: 80upx;margin-left: 20upx;">
分享邀请链接
</view>
<!-- #endif -->
</view>
<tki-qrcode ref="qrcode" :val="url" :size="200" background="#fff" foreground="#000" pdground="#000" :onval="true"
:loadMake="true" @result="qrR" :show="false"></tki-qrcode>
<view class="cu-modal" :class="modalName == 'Image' ? 'show' : ''" @tap="hideModal">
<view class="cu-dialog" v-if="backImage && XCXErweima && haibaoShow" @tap="hideModal">
<view class="bg-img">
<!-- #ifdef MP-WEIXIN -->
<!-- <wm-poster @success="posterSuccess" :imgSrc="backImage" :Referrer="'我的邀请码:'+relationId" :QrSrc="XCXErweima" :Title="title"
:LineType="false"></wm-poster> -->
<!-- #endif -->
<!-- #ifndef MP-WEIXIN -->
<!-- <wm-poster @success="posterSuccess" :imgSrc="backImage" :Referrer="'我的邀请码:'+relationId" :QrSrc="erweimapath"
:Title="title" :LineType="false"></wm-poster> -->
<!-- #endif -->
</view>
</view>
</view>
<uni-popup ref="popusshare" type="bottom">
<view style="width: 100%;height: max-content;background: #FFFFFF;border-top-left-radius: 20rpx;border-top-right-radius: 20rpx;padding: 40rpx;">
<view style="display: flex;">
<view style="width: 50%;text-align: center;" v-for='(item,index) in bottomData' :key='index' @tap='goShare(index)'>
<button v-if="index === 0" style="text-align:center;background: #FFFFFF;" open-type='share'>
<image :src="item.icon" style="width: 80rpx;height: 80rpx;"></image>
<view style="color: #000000;font-size: 28rpx;">{{item.text}}</view>
</button>
<view v-if="index != 0">
<image :src="item.icon" style="width: 80rpx;height: 80rpx;"></image>
<view style="margin-top: 38rpx;color: #000000;font-size: 28rpx;">{{item.text}}</view>
</view>
</view>
</view>
</view>
</uni-popup>
</view>
</template>
<script>
import uniPopup from '@/components/uni-popup/uni-popup.vue';
// import wmPoster from '@/components/wm-poster/wm-posterorders.vue';
import tkiQrcode from '@/components/tki-qrcode/tki-qrcode.vue';
import appShare from '@/utils/share.js';
export default {
components: {
tkiQrcode,
uniPopup
// wmPoster
},
data() {
return {
erweimapath: '',
poster: {},
qrShow: false,
haibaoImg: null,
haibaoShow: false,
backgroundImage: '',
modalName: '',
totalMoney: '0',
threeMoney: '',
setting: 1,
dengji: 0,
itemendprice: '识别二维码免费领取',
tuiguang: '',
backImage: '',
title: '',
itemtitle: '',
relationId: '',
itemprice: '',
image: '',
toBase64Url: 'https://api.shengqianxiong.com.cn/VIP.png',
imageUrl: '../../static/logo2.png',
erweima: '',
itempic: '',
teamMoney: '20',
XCXErweima: '',
url: '',
bottomData: [{
text: '分享好友',
icon: 'https://img-cdn-qiniu.dcloud.net.cn/uni-ui/grid-2.png',
name: 'wx'
},
{
text: '生成海报',
icon: 'https://img-cdn-qiniu.dcloud.net.cn/uni-ui/grid-5.png',
name: 'more'
}
],
invitatioNum: 0,
WXtuiguang:'',
dengjides: '生成海报'
};
},
onShareAppMessage(res) {
return {
path: '/pages/zysc/index/index?userByinvitationId=' + this.relationId, //这是为了传参 onload(data){let id=data.id;}
title: this.title,
imageUrl: this.backImage
}
},
onLoad() {
this.getSetting();
// #ifdef MP-WEIXIN
wx.getSetting({
success(res) {
if (!res.authSetting['scope.writePhotosAlbum']) {
wx.authorize({
scope: 'scope.writePhotosAlbum',
success() {
console.log('授权成功');
}
});
}
}
});
// #endif
let number = this.$queue.invitaionNum();
this.teamMoney = parseFloat(this.$queue.teamMoney()) * 100;
this.threeMoney = parseFloat(this.$queue.threeMoney()) * 100;
this.invitatioNum = parseInt(number);
},
onShow() {
this.tuiguang = this.$queue.getData('yqTuiGuang');
this.WXtuiguang = this.$queue.getData('yqWXTuiGuang');
let relationId = this.$queue.getData('relation_id');
if (relationId) {
this.relationId = relationId;
this.getBackGroundImageErweima(relationId);
this.XCXErweima = this.$queue.publicYuMing() +
'/tao/user/getImg?page=pages/zysc/index/index&scene=' +
relationId + '&width=200'
// #ifdef H5
this.url = this.$queue.publicYuMing() + '/?userByinvitationId=' + relationId;
//#endif
}
// #ifdef APP-PLUS
this.url = this.$queue.publicYuMing() + '/#/pages/member/download?userByinvitationId=' + relationId;
// #endif
let userId = this.$queue.getData('userId');
if (userId) {
this.getUserInfo(userId);
}
this.getBackGroundImage();
},
methods: {
getSetting() {
this.$Request.getT('/common/type/91').then(res => {
if (res.status == 0) {
if (res.data && res.data.value) {
this.setting = res.data.value
}
}
});
},
posterSuccess(haibaoImg) {
this.haibaoImg = haibaoImg;
this.modalName = 'Image';
},
showModal() {
if (!this.haibaoImg) {
this.haibaoShow = true;
this.$queue.showLoading('海报生成中...');
} else {
this.modalName = 'Image';
}
},
hideModal() {
this.modalName = null;
},
qrR(path) {
this.erweimapath = path;
},
showPopu() {
this.$refs.popusshare.open();
},
goShare(index) {
this.$refs.popusshare.close();
//0,分享好友 1,生成海报
if (index === 1) {
this.showModal();
}
},
getBackGroundImageErweima(relationId) {
this.$Request.getT('/user/getImg?page=/pages/zysc/index/index&scene=userByinvitationId=' + relationId +
'&width=200').then(res => {
});
},
getBackGroundImage() {
this.$Request.getT('/selfActivity/state?state=6').then(res => {
if (res.status === 0) {
this.backImage = res.data[0].image_url;
this.title = res.data[0].title;
}
});
},
hideModal() {
this.modalName = null;
},
shareWeiXin() {
let shareData = {
shareUrl: this.url,
shareTitle: '邀请你加入地摊侠!先领券,再购物,更划算!',
shareContent: '邀请码:' + this.relationId + ',点击进入,在地摊侠中和我一起购物返利赚大钱吧!',
shareImg: '../../static/logo2.png',
type: 0
};
appShare(shareData, res => {
console.log('分享成功回调', res);
});
},
shareYQ() {
this.sharurl();
},
getUserInfo(userId) {
this.$Request.getT('/user/' + userId).then(res => {
if (res.status === 0) {
if (res.data.gradeDes) {
this.dengji = res.data.gradeDes;
} else {
this.dengji = 0;
}
if (res.data.gradeNumber) {
if (res.data.gradeNumber == '还可邀请0人') {
this.dengjides = '已到达最高等级';
} else {
this.dengjides = res.data.gradeNumber;
}
} else {
this.dengjides = '还可邀请' + this.invitatioNum + '人';
}
}
});
},
sharurl() {
let that = this;
uni.showModal({
title: '链接推广',
content: this.tuiguang +'\n'+ this.url,
showCancel: true,
cancelText: '关闭',
confirmText: '一键复制',
success: res => {
if (res.confirm) {
uni.setClipboardData({
data: this.tuiguang + this.url,
success: function() {
console.log('success');
that.$queue.showToast('复制成功');
}
});
}
}
});
},
getMoney() {
let that = this;
let relationId = this.$queue.getData('relation_id');
if (relationId) {
this.$Request.getT('/user/getCount?invitation=' + relationId).then(res => {
if (res.status === 0 && res.data) {
that.totalMoney = res.data;
} else if (res.status === -102) {
this.$queue.showToast(res.msg);
this.$queue.logout();
uni.navigateTo({
url: '/pages/member/register'
});
} else {
that.totalMoney = '0';
}
});
}
},
getOut() {
let that = this;
let relationId = this.$queue.getData('relation_id');
if (relationId) {
if (this.totalMoney > 2) {
that.$queue.showLoading('结算中...');
this.$Request.getT('/user/getCash?invitation=' + relationId).then(res => {
if (res.status === 0 && res.data) {
uni.showModal({
showCancel: false,
title: '结算成功',
content: '请返回【我的】点击【立即提现】'
});
that.getMoney();
}
uni.hideLoading();
});
} else {
uni.showModal({
showCancel: false,
title: '结算提醒',
content: '邀请必须够3人才可申请结算'
});
}
} else {
uni.navigateTo({
url: '/pages/member/register'
});
}
}
}
};
</script>
<style lang="scss" scoped>
@import '../../static/css/index.css';
.bg {
background-repeat: round;
background-size: 100%;
padding: 42upx;
margin: 12upx;
}
button {
font-size: 14px;
}
button::after {
border: none;
}
</style>