shop-applet/pages/users/promoter_rank/index.vue

308 lines
38 KiB
Vue
Raw Normal View History

2024-05-14 17:25:13 +08:00
<template>
<view :style="viewColor">
<view class="PromoterRank">
<view class="redBg">
<view class="header">
<view class="nav acea-row row-center-wrapper">
<view class="item" :class="active == index ? 'view-color' : ''" v-for="(item,index) in navList" :key="index"
@click="switchTap(index)">
{{ item }}
</view>
</view>
<view class="rank acea-row row-bottom row-around">
<view class="item" v-if="Two.uid">
<view class="pictrue pictrue2">
<image :src="Two.avatar ? Two.avatar : '/static/images/f.png'"></image>
</view>
<view class="name line1">{{Two.nickname}}</view>
<view class="num">{{Two.count}}</view>
</view>
<view class="item" v-if="One.uid">
<view class="pictrue pictrue1">
<image :src="One.avatar ? One.avatar : '/static/images/f.png'"></image>
</view>
<view class="name line1">{{One.nickname}}</view>
<view class="num">{{One.count}}</view>
</view>
<view class="item" v-if="Three.uid">
<view class="pictrue pictrue3">
<image :src="Three.avatar ? Three.avatar : '/static/images/f.png'"></image>
</view>
<view class="name line1">{{Three.nickname}}</view>
<view class="num">{{Three.count}}</view>
</view>
</view>
</view>
</view>
<view class="list" v-if="rankList.length">
<view class="item acea-row row-between-wrapper" v-for="(item,index) in rankList" :key="index">
<view class="num">{{index+4}}</view>
<view class="picTxt acea-row row-between-wrapper">
<view class="pictrue">
<image :src="item.avatar ? item.avatar : '/static/images/f.png'"></image>
</view>
<view class="text line1">{{item.nickname}}</view>
</view>
<view class="people">{{item.count}}</view>
</view>
</view>
</view>
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
</view>
</template>
<script>
// +----------------------------------------------------------------------
// | CRMEB [ CRMEB赋能开发者助力企业发展 ]
// +----------------------------------------------------------------------
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
// +----------------------------------------------------------------------
// | Licensed CRMEB并不是自由软件未经许可不能去掉CRMEB相关版权
// +----------------------------------------------------------------------
// | Author: CRMEB Team <admin@crmeb.com>
// +----------------------------------------------------------------------
import { getRankList } from '@/api/user.js';
import { mapGetters } from "vuex";
import authorize from '@/components/Authorize';
export default {
components: {
authorize
},
data() {
return {
navList: ["周榜", "月榜"],
active: 0,
page: 1,
limit: 10,
type: 'week',
loading: false,
loadend: false,
rankList: [],
Two: {},
One: {},
Three: {},
isAuto: false, //没有授权的不会自动授权
isShowAuth: false //是否隐藏授权
};
},
computed: mapGetters(['isLogin','viewColor']),
onLoad() {
if (this.isLogin) {
this.getRanklist();
} else {
this.isAuto = true;
this.isShowAuth = true
}
},
methods: {
onLoadFun() {
this.getRanklist();
this.isShowAuth = false;
},
// 授权关闭
authColse: function(e) {
this.isShowAuth = e
},
getRanklist: function() {
let that = this;
if (that.loadend) return;
if (that.loading) return;
that.loading = true;
getRankList({
page: that.page,
limit: that.limit,
type: that.active
}).then(res => {
let list = res.data.list;
that.rankList.push.apply(that.rankList, list);
if (that.page == 1) {
that.One = that.rankList.shift() || {};
that.Two = that.rankList.shift() || {};
that.Three = that.rankList.shift() || {};
}
that.loadend = list.length < that.limit;
that.loading = false;
that.$set(that, 'rankList', that.rankList);
that.One = that.One;
that.Two = that.Two;
that.Three = that.Three;
that.page = that.page + 1;
}).catch(err => {
that.loading = false;
})
},
switchTap: function(index) {
if (this.active === index) return;
this.active = index;
this.type = index ? 'month' : 'week';
this.page = 1;
this.loadend = false;
this.$set(this, 'rankList', []);
this.Two = {};
this.One = {};
this.Three = {};
this.getRanklist();
},
},
onReachBottom: function() {
this.getRanklist();
}
}
</script>
<style scoped lang="scss">
.PromoterRank .redBg {
padding: 45rpx 0 30rpx 0;
height: 460rpx;
background-color: var(--view-theme);
background-image: url('data:image/png;base64,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
background-repeat: no-repeat;
background-size: 100% auto;
background-position: left bottom;
}
.PromoterRank .header {
width: 100%;
background-size: 100% 100%;
}
.PromoterRank .header .nav {
width: 450rpx;
height: 66rpx;
border: 1px solid #fff;
border-radius: 33rpx;
font-size: 30rpx;
color: #fff;
margin: 0 auto;
}
.PromoterRank .header .nav .item {
width: 223rpx;
height: 100%;
text-align: center;
line-height: 60rpx;
}
.view-color{
color: var(--view-theme);
}
.PromoterRank .header .nav .item.view-color:nth-of-type(1) {
background-color: #fff;
border-radius: 33rpx 0 0 33rpx;
}
.PromoterRank .header .nav .item.view-color:nth-of-type(2) {
background-color: #fff;
border-radius: 0 33rpx 33rpx 0;
}
.PromoterRank .header .rank {
padding: 0 20rpx;
margin-top: 15rpx;
}
.PromoterRank .header .rank .item .pictrue {
background-size: 100% 100%;
width: 136rpx;
height: 177rpx;
position: relative;
margin: 0 auto;
}
.PromoterRank .header .rank .item .pictrue image {
position: absolute;
width: 130rpx;
height: 130rpx;
display: block;
bottom: 2rpx;
border-radius: 50%;
left: 50%;
margin-left: -65rpx;
}
.PromoterRank .header .rank .item:nth-of-type(2) .pictrue {
width: 156rpx;
height: 205rpx;
}
.pictrue1{
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJwAAADNCAYAAABNahkfAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQyIDc5LjE2MDkyNCwgMjAxNy8wNy8xMy0wMTowNjozOSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDoxNGUyNzRkOS00YmQ4LTUzNGItYWZkZS02ZTlmMTgxYmZlYWUiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NUU1MTlBRjBEOEU1MTFFOUEwRjRGRTQyMUZGNDk5NEIiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NUU1MTlBRUZEOEU1MTFFOUEwRjRGRTQyMUZGNDk5NEIiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6OTAxZGU2OWItNWM2My0xOTQ1LTllZmMtMGIzNjcwYTFmNWUxIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjE0ZTI3NGQ5LTRiZDgtNTM0Yi1hZmRlLTZlOWYxODFiZmVhZSIv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
}
.pictrue2{
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIgAAACxCAYAAAAfz/U3AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQyIDc5LjE2MDkyNCwgMjAxNy8wNy8xMy0wMTowNjozOSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDoxNGUyNzRkOS00YmQ4LTUzNGItYWZkZS02ZTlmMTgxYmZlYWUiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6ODVBODg2MzdEOEU1MTFFOTg4RTM5OTQyQjhDODMzMTciIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6ODVBODg2MzZEOEU1MTFFOTg4RTM5OTQyQjhDODMzMTciIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6OTAxZGU2OWItNWM2My0xOTQ1LTllZmMtMGIzNjcwYTFmNWUxIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjE0ZTI3NGQ5LTRiZDgtNTM0Yi1hZmRlLTZlOWYxODFiZmVhZSIv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
}
.PromoterRank .header .rank .item:nth-of-type(2) .pictrue image {
width: 150rpx;
height: 150rpx;
margin-left: -75rpx;
}
.PromoterRank .header .rank .item .pictrue3 {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIgAAACxCAYAAAAfz/U3AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQyIDc5LjE2MDkyNCwgMjAxNy8wNy8xMy0wMTowNjozOSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDoxNGUyNzRkOS00YmQ4LTUzNGItYWZkZS02ZTlmMTgxYmZlYWUiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MTExRTlGRDlEOEU2MTFFOTg0MDg4RjQ5MDM3QjNGRTIiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MTExRTlGRDhEOEU2MTFFOTg0MDg4RjQ5MDM3QjNGRTIiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTggKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6OTAxZGU2OWItNWM2My0xOTQ1LTllZmMtMGIzNjcwYTFmNWUxIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjE0ZTI3NGQ5LTRiZDgtNTM0Yi1hZmRlLTZlOWYxODFiZmVhZSIv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
}
.PromoterRank .header .rank .item:nth-of-type(3) .pictrue image {
margin-left: -64rpx;
}
.PromoterRank .header .rank .item .name {
font-size: 30rpx;
color: #fff;
margin-top: 22rpx;
text-align: center;
width: 170rpx;
}
.PromoterRank .header .rank .item .num {
font-size: 30rpx;
color: #fff;
text-align: center;
}
.PromoterRank .list {
width: 710rpx;
background-color: #fff;
border-radius: 20rpx;
margin: -30rpx auto 0 auto;
padding: 0 30rpx;
}
.PromoterRank .list .item {
border-bottom: 1px solid #f3f3f3;
height: 101rpx;
font-size: 28rpx;
}
.PromoterRank .list .item .num {
color: #666;
width: 70rpx;
}
.PromoterRank .list .item .picTxt {
width: 350rpx;
}
.PromoterRank .list .item .picTxt .pictrue {
width: 68rpx;
height: 68rpx;
}
.PromoterRank .list .item .picTxt .pictrue image {
width: 100%;
height: 100%;
display: block;
border-radius: 50%;
}
.PromoterRank .list .item .picTxt .text {
width: 262rpx;
color: #333;
}
.PromoterRank .list .item .people {
width: 175rpx;
text-align: right;
color: var(--view-priceColor);
}
</style>