|
|
|
@ -1,7 +1,7 @@ |
|
|
|
|
<template> |
|
|
|
|
<view :style="viewColor"> |
|
|
|
|
<view class="promoter-list"> |
|
|
|
|
<view class='promoterHeader'> |
|
|
|
|
<!-- <view class='promoterHeader'> |
|
|
|
|
<view class='headerCon acea-row row-between-wrapper'> |
|
|
|
|
<view> |
|
|
|
|
<view class='name'>推广人数</view> |
|
|
|
@ -9,17 +9,20 @@ |
|
|
|
|
</view> |
|
|
|
|
<view class='iconfont icon-tuandui'></view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view class='nav acea-row row-around'> |
|
|
|
|
</view> --> |
|
|
|
|
<!-- <view class='nav acea-row row-around'> |
|
|
|
|
<view :class="grade == 0 ? 'item on' : 'item'" @click='setType(0)'>一级({{userInfo.one_level_count}})</view> |
|
|
|
|
<view :class="grade == 1 ? 'item on' : 'item'" @click='setType(1)'>二级({{userInfo.two_level_count}})</view> |
|
|
|
|
</view> |
|
|
|
|
<view class='search acea-row row-between-wrapper'> |
|
|
|
|
<view class='input'><input placeholder='点击搜索会员名称' placeholder-class='placeholder' v-model="keyword" @confirm="submitForm" confirm-type='search' name="search"></input></view> |
|
|
|
|
<button class='iconfont icon-sousuo2' @click="submitForm"></button> |
|
|
|
|
</view> --> |
|
|
|
|
<view class='search'> |
|
|
|
|
<view class='input'> |
|
|
|
|
<u-search placeholder='根据手机号/微信名/账号检索' v-model="keyword" @search="submitForm" @custom="submitForm" bgColor="#ffffff" :showAction="false"></u-search> |
|
|
|
|
<!-- <input placeholder='点击搜索会员名称' placeholder-class='placeholder' v-model="keyword" @confirm="submitForm" confirm-type='search' name="search"></input> --> |
|
|
|
|
</view> |
|
|
|
|
<!-- <button class='iconfont icon-sousuo2' @click="submitForm"></button> --> |
|
|
|
|
</view> |
|
|
|
|
<view class='list'> |
|
|
|
|
<view class="sortNav acea-row row-middle"> |
|
|
|
|
<!-- <view class="sortNav acea-row row-middle"> |
|
|
|
|
<view class="sortItem" @click='setSort("spread_count ASC")' v-if="sort == 'spread_count DESC'">团队排序 |
|
|
|
|
<image :src="domain+'/static/diy/sort1'+keyColor+'.png'"></image> |
|
|
|
|
</view> |
|
|
|
@ -47,22 +50,39 @@ |
|
|
|
|
<view class="sortItem" @click='setSort("pay_count DESC")' v-else>订单排序 |
|
|
|
|
<image src="/static/images/sort2.png"></image> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</view> --> |
|
|
|
|
<block v-for="(item,index) in recordList" :key="index"> |
|
|
|
|
<view class='item acea-row row-between-wrapper'> |
|
|
|
|
<view class='item'> |
|
|
|
|
<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'> |
|
|
|
|
<view class="titleContent"> |
|
|
|
|
<view class="name"> |
|
|
|
|
{{item.nickname}} |
|
|
|
|
</view> |
|
|
|
|
<view class="recomText"> |
|
|
|
|
<image src="/static/images/reco.png" mode=""></image> |
|
|
|
|
<text>初级代理</text> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
<view class="phone"> |
|
|
|
|
{{item.phone}} |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
<!-- <view class='text'> |
|
|
|
|
<view class='name line1'>{{item.nickname}}</view> |
|
|
|
|
<view>加入时间: {{item.spread_time}}</view> |
|
|
|
|
</view> |
|
|
|
|
</view> --> |
|
|
|
|
</view> |
|
|
|
|
<view class="right"> |
|
|
|
|
<view><text class='num t-color'>{{item.spread_count ? item.spread_count : 0}}</text>人</view> |
|
|
|
|
<view><text class="num">{{item.pay_count ? item.pay_count : 0}}</text>单</view> |
|
|
|
|
<view><text class="num">{{item.pay_price ? item.pay_price : 0}}</text>元</view> |
|
|
|
|
<view>加入时间: <text>{{item.create_time}}</text></view> |
|
|
|
|
<!-- <view><text class='num t-color'>{{item.spread_count ? item.spread_count : 0}}</text>人</view> --> |
|
|
|
|
<!-- <view><text class="num">{{item.pay_count ? item.pay_count : 0}}</text>单</view> --> |
|
|
|
|
<!-- <view><text class="num">{{item.pay_price ? item.pay_price : 0}}</text>元</view> --> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</block> |
|
|
|
@ -73,18 +93,9 @@ |
|
|
|
|
</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 { |
|
|
|
|
spreadPeople, |
|
|
|
|
getUserInfo, |
|
|
|
|
// getUserInfo, |
|
|
|
|
spreadInfo |
|
|
|
|
} from '@/api/user.js'; |
|
|
|
|
import { mapGetters } from "vuex"; |
|
|
|
@ -116,7 +127,7 @@ |
|
|
|
|
onLoad() { |
|
|
|
|
if (this.isLogin) { |
|
|
|
|
this.userSpreadNewList(); |
|
|
|
|
this.getUserInfo() |
|
|
|
|
// this.getUserInfo() |
|
|
|
|
} else { |
|
|
|
|
this.isAuto = true; |
|
|
|
|
this.isShowAuth = true |
|
|
|
@ -125,36 +136,36 @@ |
|
|
|
|
onShow: function() { |
|
|
|
|
if (this.is_show){ |
|
|
|
|
this.userSpreadNewList(); |
|
|
|
|
this.getUserInfo(); |
|
|
|
|
// this.getUserInfo(); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
onHide: function() { |
|
|
|
|
this.is_show = true; |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
getUserInfo(){ |
|
|
|
|
spreadInfo().then(res => { |
|
|
|
|
this.userInfo = res.data |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
// getUserInfo(){ |
|
|
|
|
// spreadInfo().then(res => { |
|
|
|
|
// this.userInfo = res.data |
|
|
|
|
// }); |
|
|
|
|
// }, |
|
|
|
|
onLoadFun: function(e) { |
|
|
|
|
this.isShowAuth = false; |
|
|
|
|
this.userSpreadNewList(); |
|
|
|
|
this.getUserInfo() |
|
|
|
|
// this.getUserInfo() |
|
|
|
|
}, |
|
|
|
|
// 授权关闭 |
|
|
|
|
authColse: function(e) { |
|
|
|
|
this.isShowAuth = e |
|
|
|
|
}, |
|
|
|
|
setSort: function(sort) { |
|
|
|
|
let that = this; |
|
|
|
|
that.sort = sort; |
|
|
|
|
that.page = 1; |
|
|
|
|
that.limit = 20; |
|
|
|
|
that.status = false; |
|
|
|
|
that.$set(that, 'recordList', []); |
|
|
|
|
that.userSpreadNewList(); |
|
|
|
|
}, |
|
|
|
|
// setSort: function(sort) { |
|
|
|
|
// let that = this; |
|
|
|
|
// that.sort = sort; |
|
|
|
|
// that.page = 1; |
|
|
|
|
// that.limit = 20; |
|
|
|
|
// that.status = false; |
|
|
|
|
// that.$set(that, 'recordList', []); |
|
|
|
|
// that.userSpreadNewList(); |
|
|
|
|
// }, |
|
|
|
|
// setKeyword: function(e) { |
|
|
|
|
// this.keyword = e.detail.value; |
|
|
|
|
// }, |
|
|
|
@ -166,26 +177,26 @@ |
|
|
|
|
this.userSpreadNewList(); |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
setType: function(grade) { |
|
|
|
|
if (this.grade != grade) { |
|
|
|
|
this.grade = grade; |
|
|
|
|
this.page = 1; |
|
|
|
|
this.limit = 20; |
|
|
|
|
this.keyword = ''; |
|
|
|
|
this.sort = ''; |
|
|
|
|
this.status = false; |
|
|
|
|
this.$set(this, 'recordList', []); |
|
|
|
|
this.userSpreadNewList(); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
// setType: function(grade) { |
|
|
|
|
// if (this.grade != grade) { |
|
|
|
|
// this.grade = grade; |
|
|
|
|
// this.page = 1; |
|
|
|
|
// this.limit = 20; |
|
|
|
|
// this.keyword = ''; |
|
|
|
|
// this.sort = ''; |
|
|
|
|
// this.status = false; |
|
|
|
|
// this.$set(this, 'recordList', []); |
|
|
|
|
// this.userSpreadNewList(); |
|
|
|
|
// } |
|
|
|
|
// }, |
|
|
|
|
userSpreadNewList: function() { |
|
|
|
|
let that = this; |
|
|
|
|
let page = that.page; |
|
|
|
|
let limit = that.limit; |
|
|
|
|
let status = that.status; |
|
|
|
|
let keyword = that.keyword; |
|
|
|
|
let sort = that.sort; |
|
|
|
|
let grade = that.grade; |
|
|
|
|
// let sort = that.sort; |
|
|
|
|
// let grade = that.grade; |
|
|
|
|
let recordList = that.recordList; |
|
|
|
|
let recordListNew = []; |
|
|
|
|
if (status == true) return; |
|
|
|
@ -193,8 +204,8 @@ |
|
|
|
|
page: page, |
|
|
|
|
limit: limit, |
|
|
|
|
keyword: keyword, |
|
|
|
|
level: grade+1, |
|
|
|
|
sort: sort, |
|
|
|
|
// level: grade+1, |
|
|
|
|
// sort: sort, |
|
|
|
|
}).then(res => { |
|
|
|
|
let len = res.data.list.length; |
|
|
|
|
let recordListData = res.data.list; |
|
|
|
@ -215,143 +226,182 @@ |
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<style scoped lang="scss"> |
|
|
|
|
.promoterHeader { |
|
|
|
|
background-image: linear-gradient(to right, var(--view-bntColor21) 0%, var(--view-bntColor22) 100%); |
|
|
|
|
} |
|
|
|
|
.t-color { |
|
|
|
|
color: var(--view-theme); |
|
|
|
|
} |
|
|
|
|
.promoter-list .nav { |
|
|
|
|
background-color: #fff; |
|
|
|
|
height: 86rpx; |
|
|
|
|
line-height: 86rpx; |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
color: #282828; |
|
|
|
|
border-bottom: 1px solid #eee; |
|
|
|
|
} |
|
|
|
|
// .promoterHeader { |
|
|
|
|
// background-image: linear-gradient(to right, var(--view-bntColor21) 0%, var(--view-bntColor22) 100%); |
|
|
|
|
// } |
|
|
|
|
// .t-color { |
|
|
|
|
// color: var(--view-theme); |
|
|
|
|
// } |
|
|
|
|
// .promoter-list .nav { |
|
|
|
|
// background-color: #fff; |
|
|
|
|
// height: 86rpx; |
|
|
|
|
// line-height: 86rpx; |
|
|
|
|
// font-size: 28rpx; |
|
|
|
|
// color: #282828; |
|
|
|
|
// border-bottom: 1px solid #eee; |
|
|
|
|
// } |
|
|
|
|
|
|
|
|
|
.promoter-list .nav .item.on { |
|
|
|
|
border-bottom: 5rpx solid var(--view-theme); |
|
|
|
|
color: var(--view-theme); |
|
|
|
|
} |
|
|
|
|
// .promoter-list .nav .item.on { |
|
|
|
|
// border-bottom: 5rpx solid var(--view-theme); |
|
|
|
|
// color: var(--view-theme); |
|
|
|
|
// } |
|
|
|
|
|
|
|
|
|
.promoter-list .search { |
|
|
|
|
width: 100%; |
|
|
|
|
background-color: #fff; |
|
|
|
|
height: 86rpx; |
|
|
|
|
padding-left: 30rpx; |
|
|
|
|
box-sizing: border-box; |
|
|
|
|
} |
|
|
|
|
// .promoter-list .search { |
|
|
|
|
// width: 100%; |
|
|
|
|
// background-color: #fff; |
|
|
|
|
// height: 86rpx; |
|
|
|
|
// padding-left: 30rpx; |
|
|
|
|
// box-sizing: border-box; |
|
|
|
|
// } |
|
|
|
|
|
|
|
|
|
.promoter-list .search .input { |
|
|
|
|
width: 610rpx; |
|
|
|
|
height: 60rpx; |
|
|
|
|
border-radius: 50rpx; |
|
|
|
|
background-color: #f5f5f5; |
|
|
|
|
text-align: center; |
|
|
|
|
position: relative; |
|
|
|
|
} |
|
|
|
|
// .promoter-list .search .input { |
|
|
|
|
// width: 610rpx; |
|
|
|
|
// height: 60rpx; |
|
|
|
|
// border-radius: 50rpx; |
|
|
|
|
// background-color: #f5f5f5; |
|
|
|
|
// text-align: center; |
|
|
|
|
// position: relative; |
|
|
|
|
// } |
|
|
|
|
|
|
|
|
|
.promoter-list .search .input input { |
|
|
|
|
height: 100%; |
|
|
|
|
font-size: 26rpx; |
|
|
|
|
width: 610rpx; |
|
|
|
|
text-align: center; |
|
|
|
|
} |
|
|
|
|
// .promoter-list .search .input input { |
|
|
|
|
// height: 100%; |
|
|
|
|
// font-size: 26rpx; |
|
|
|
|
// width: 610rpx; |
|
|
|
|
// text-align: center; |
|
|
|
|
// } |
|
|
|
|
|
|
|
|
|
.promoter-list .search .input .placeholder { |
|
|
|
|
color: #bbb; |
|
|
|
|
} |
|
|
|
|
// .promoter-list .search .input .placeholder { |
|
|
|
|
// color: #bbb; |
|
|
|
|
// } |
|
|
|
|
|
|
|
|
|
.promoter-list .search .input .iconfont { |
|
|
|
|
position: absolute; |
|
|
|
|
right: 28rpx; |
|
|
|
|
color: #999; |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
top: 50%; |
|
|
|
|
transform: translateY(-50%); |
|
|
|
|
} |
|
|
|
|
// .promoter-list .search .input .iconfont { |
|
|
|
|
// position: absolute; |
|
|
|
|
// right: 28rpx; |
|
|
|
|
// color: #999; |
|
|
|
|
// font-size: 28rpx; |
|
|
|
|
// top: 50%; |
|
|
|
|
// transform: translateY(-50%); |
|
|
|
|
// } |
|
|
|
|
|
|
|
|
|
.promoter-list .search .iconfont { |
|
|
|
|
font-size: 45rpx; |
|
|
|
|
color: #515151; |
|
|
|
|
width: 110rpx; |
|
|
|
|
height: 60rpx; |
|
|
|
|
line-height: 60rpx; |
|
|
|
|
// .promoter-list .search .iconfont { |
|
|
|
|
// font-size: 45rpx; |
|
|
|
|
// color: #515151; |
|
|
|
|
// width: 110rpx; |
|
|
|
|
// height: 60rpx; |
|
|
|
|
// line-height: 60rpx; |
|
|
|
|
// } |
|
|
|
|
.promoter-list{ |
|
|
|
|
margin:24rpx; |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.promoter-list .list { |
|
|
|
|
margin-top: 12rpx; |
|
|
|
|
margin-top: 24rpx; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.promoter-list .list .sortNav { |
|
|
|
|
background-color: #fff; |
|
|
|
|
height: 76rpx; |
|
|
|
|
border-bottom: 1px solid #eee; |
|
|
|
|
color: #333; |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
} |
|
|
|
|
// .promoter-list .list .sortNav { |
|
|
|
|
// background-color: #fff; |
|
|
|
|
// height: 76rpx; |
|
|
|
|
// border-bottom: 1px solid #eee; |
|
|
|
|
// color: #333; |
|
|
|
|
// font-size: 28rpx; |
|
|
|
|
// } |
|
|
|
|
|
|
|
|
|
.promoter-list .list .sortNav .sortItem { |
|
|
|
|
text-align: center; |
|
|
|
|
flex: 1; |
|
|
|
|
} |
|
|
|
|
// .promoter-list .list .sortNav .sortItem { |
|
|
|
|
// text-align: center; |
|
|
|
|
// flex: 1; |
|
|
|
|
// } |
|
|
|
|
|
|
|
|
|
.promoter-list .list .sortNav .sortItem image { |
|
|
|
|
width: 24rpx; |
|
|
|
|
height: 24rpx; |
|
|
|
|
margin-left: 6rpx; |
|
|
|
|
vertical-align: -3rpx; |
|
|
|
|
} |
|
|
|
|
// .promoter-list .list .sortNav .sortItem image { |
|
|
|
|
// width: 24rpx; |
|
|
|
|
// height: 24rpx; |
|
|
|
|
// margin-left: 6rpx; |
|
|
|
|
// vertical-align: -3rpx; |
|
|
|
|
// } |
|
|
|
|
|
|
|
|
|
.promoter-list .list .item { |
|
|
|
|
background-color: #fff; |
|
|
|
|
border-bottom: 1px solid #eee; |
|
|
|
|
height: 152rpx; |
|
|
|
|
padding: 0 30rpx 0 20rpx; |
|
|
|
|
font-size: 24rpx; |
|
|
|
|
color: #666; |
|
|
|
|
margin-bottom: 20rpx; |
|
|
|
|
border-radius: 10px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.promoter-list .list .item .picTxt { |
|
|
|
|
width: 440rpx; |
|
|
|
|
// width: 440rpx; |
|
|
|
|
padding:30rpx; |
|
|
|
|
display: flex; |
|
|
|
|
border-bottom: 1px solid #eeeeee; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.promoter-list .list .item .picTxt .pictrue { |
|
|
|
|
width: 106rpx; |
|
|
|
|
height: 106rpx; |
|
|
|
|
border-radius: 50%; |
|
|
|
|
border: 1px solid #eee; |
|
|
|
|
border-radius: 5px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.promoter-list .list .item .picTxt .pictrue image { |
|
|
|
|
width: 100%; |
|
|
|
|
height: 100%; |
|
|
|
|
border-radius: 50%; |
|
|
|
|
border: 3rpx solid #fff; |
|
|
|
|
box-shadow: 0 0 10rpx #aaa; |
|
|
|
|
box-sizing: border-box; |
|
|
|
|
// border-radius: 50%; |
|
|
|
|
// border: 3rpx solid #fff; |
|
|
|
|
// box-shadow: 0 0 10rpx #aaa; |
|
|
|
|
// box-sizing: border-box; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.promoter-list .list .item .picTxt .text { |
|
|
|
|
width: 304rpx; |
|
|
|
|
flex: 1; |
|
|
|
|
margin-left: 20rpx; |
|
|
|
|
} |
|
|
|
|
.phone{ |
|
|
|
|
margin-top:14rpx; |
|
|
|
|
font-size: 24rpx; |
|
|
|
|
color: #666; |
|
|
|
|
color: #999999; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.promoter-list .list .item .picTxt .text .name { |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
color: #333; |
|
|
|
|
margin-bottom: 13rpx; |
|
|
|
|
|
|
|
|
|
font-family: Alibaba PuHuiTi; |
|
|
|
|
font-weight: 400; |
|
|
|
|
font-size: 30rpx; |
|
|
|
|
color: #333333; |
|
|
|
|
} |
|
|
|
|
.recomText{ |
|
|
|
|
position: relative; |
|
|
|
|
width:120rpx; |
|
|
|
|
height:38rpx; |
|
|
|
|
margin-left:10rpx; |
|
|
|
|
text{ |
|
|
|
|
font-weight: 400; |
|
|
|
|
font-size: 22rpx; |
|
|
|
|
color: #FFFFFF; |
|
|
|
|
position: absolute; |
|
|
|
|
z-index: 2; |
|
|
|
|
width: 100%; |
|
|
|
|
text-align: center; |
|
|
|
|
left: 0; |
|
|
|
|
top: 2px; |
|
|
|
|
} |
|
|
|
|
image{ |
|
|
|
|
width:100%; |
|
|
|
|
height:100%; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.promoter-list .list .item .right { |
|
|
|
|
width: 240rpx; |
|
|
|
|
text-align: right; |
|
|
|
|
font-size: 22rpx; |
|
|
|
|
color: #333; |
|
|
|
|
padding: 20rpx 30rpx; |
|
|
|
|
color:#333; |
|
|
|
|
font-size: 24rpx; |
|
|
|
|
text{ |
|
|
|
|
color:#999999; |
|
|
|
|
margin-left:20rpx; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.promoter-list .list .item .right .num{ |
|
|
|
|
margin-right: 7rpx; |
|
|
|
|
.titleContent{ |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// .promoter-list .list .item .right .num{ |
|
|
|
|
// margin-right: 7rpx; |
|
|
|
|
// } |
|
|
|
|
</style> |
|
|
|
|