|
|
|
<template>
|
|
|
|
<view class="user">
|
|
|
|
<view class="search">
|
|
|
|
<!-- <view class="box">
|
|
|
|
<image src="/static/news/icon-search.png"></image>
|
|
|
|
<input type="search" placeholder="商品名称/编码" />
|
|
|
|
</view> -->
|
|
|
|
<u-search placeholder="输入用户昵称/姓名/手机号" @search="searchhandle" shape="round" :show-action="false" height="60" bg-color="#ffffff" v-model="keyword"></u-search>
|
|
|
|
</view>
|
|
|
|
<view class="user-bd">
|
|
|
|
<view class="li" v-for="i in list" :key="i.user_id" @click="goVipDetails(i)">
|
|
|
|
<view class="a">
|
|
|
|
<view class="l">
|
|
|
|
<image :src="i.avatar_url?i.avatar_url:$picUrl+'/static/news/avater.png'"></image>
|
|
|
|
</view>
|
|
|
|
<view class="r">
|
|
|
|
<view class="m">
|
|
|
|
<view class="n">{{i.nick_name}}</view>
|
|
|
|
<view class="btn">{{i.user_type_text}}</view>
|
|
|
|
|
|
|
|
</view>
|
|
|
|
<view class="n">
|
|
|
|
<view>
|
|
|
|
<text>{{i.mobile}}</text>
|
|
|
|
<image @click.stop="copyText(i.mobile)" :src="$picUrl+'/static/news/icon-copy.png'" style="margin-top:-4rpx;"></image>
|
|
|
|
</view>
|
|
|
|
<image :src="$picUrl+'/static/news/tel.png'" @click.stop="makeCall(i.mobile)"></image>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<!-- <view class="m">
|
|
|
|
<view class="n">{{nick_name}}</view>
|
|
|
|
<view class="n">真实姓名:张三</view>
|
|
|
|
<view class="n">{{mobile}}<image :src="$picUrl+'/static/news/icon-copy.png'"></image></view>
|
|
|
|
</view>
|
|
|
|
<view class="r">
|
|
|
|
<view class="btn">会员</view>
|
|
|
|
<image :src="$picUrl+'/static/news/tel.png'"></image>
|
|
|
|
</view> -->
|
|
|
|
</view>
|
|
|
|
<view class="b">
|
|
|
|
<view class="l">余额(元)<text>¥{{i.balance?i.balance:0.00}}</text></view>
|
|
|
|
<view class="l">积分(分)<text>{{i.points?i.points:0}}</text></view>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<!-- <view class="li" v-for="i in 2" :key="i">
|
|
|
|
<view class="a">
|
|
|
|
<view class="l">
|
|
|
|
<image :src="$picUrl+'/static/news/avater.png'"></image>
|
|
|
|
</view>
|
|
|
|
<view class="m">
|
|
|
|
<view class="n">昵称</view>
|
|
|
|
<view class="n">真实姓名:张三</view>
|
|
|
|
<view class="n">18089800909<image :src="$picUrl+'/static/news/avater.png'"></image></view>
|
|
|
|
</view>
|
|
|
|
<view class="r">
|
|
|
|
<view class="btn btn-on">游客</view>
|
|
|
|
<image :src="$picUrl+'/static/news/tel.png'"></image>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="b">
|
|
|
|
<view class="l">余额(元)<text>¥0.00</text></view>
|
|
|
|
<view class="l">积分(分)<text>0.00</text></view>
|
|
|
|
</view>
|
|
|
|
</view> -->
|
|
|
|
</view>
|
|
|
|
</view>
|
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
|
|
|
import * as Vip from '@/api/user/vip'
|
|
|
|
export default {
|
|
|
|
data() {
|
|
|
|
return {
|
|
|
|
keyword:'',
|
|
|
|
page:1,
|
|
|
|
total:0,
|
|
|
|
list:[],
|
|
|
|
title:'会员管理'
|
|
|
|
};
|
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
searchhandle(){
|
|
|
|
this.list=[]
|
|
|
|
this.page = 1;
|
|
|
|
this.getList()
|
|
|
|
|
|
|
|
},
|
|
|
|
async getList(){
|
|
|
|
let res = await Vip.getVipList({page:this.page,search:this.keyword,user_type:this.title=='会员管理'?"10,20":'30'})
|
|
|
|
console.log(res,"===")
|
|
|
|
this.list.push(...res.data.list.data);
|
|
|
|
this.total = res.data.list.total;
|
|
|
|
},
|
|
|
|
copyText(text) {
|
|
|
|
uni.setClipboardData({
|
|
|
|
data: text,
|
|
|
|
success: () => {
|
|
|
|
uni.showToast({
|
|
|
|
title: '复制成功',
|
|
|
|
icon: 'success',
|
|
|
|
duration: 2000
|
|
|
|
});
|
|
|
|
},
|
|
|
|
fail: () => {
|
|
|
|
uni.showToast({
|
|
|
|
title: '复制失败',
|
|
|
|
icon: 'none'
|
|
|
|
});
|
|
|
|
}
|
|
|
|
});
|
|
|
|
},
|
|
|
|
makeCall(phoneNumber) {
|
|
|
|
uni.getSetting({
|
|
|
|
success(res) {
|
|
|
|
if (!res.authSetting['scope.phoneCall']) {
|
|
|
|
// 没有权限,需要请求用户授权
|
|
|
|
uni.authorize({
|
|
|
|
scope: 'scope.phoneCall',
|
|
|
|
success() {
|
|
|
|
// 用户已授权,可以拨打电话
|
|
|
|
uni.makePhoneCall({
|
|
|
|
phoneNumber: phoneNumber // 电话号码
|
|
|
|
});
|
|
|
|
},
|
|
|
|
fail() {
|
|
|
|
// 用户拒绝授权,可以引导用户开启
|
|
|
|
uni.showModal({
|
|
|
|
title: '提示',
|
|
|
|
content: '需要电话权限',
|
|
|
|
success: function(modalRes) {
|
|
|
|
if (modalRes.confirm) {
|
|
|
|
uni.openSetting();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
}
|
|
|
|
});
|
|
|
|
} else {
|
|
|
|
// 已经有权限,直接拨打电话
|
|
|
|
uni.makePhoneCall({
|
|
|
|
phoneNumber: phoneNumber // 电话号码
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
},
|
|
|
|
goVipDetails(item){
|
|
|
|
let details = JSON.stringify(item)
|
|
|
|
uni.navigateTo({
|
|
|
|
url:"/pages/news/user/index?item="+details+"&title="+this.title
|
|
|
|
})
|
|
|
|
}
|
|
|
|
},
|
|
|
|
onLoad(option) {
|
|
|
|
this.title = option.title
|
|
|
|
uni.setNavigationBarTitle({
|
|
|
|
title: this.title
|
|
|
|
});
|
|
|
|
this.list = []
|
|
|
|
this.getList()
|
|
|
|
},
|
|
|
|
onReachBottom() {
|
|
|
|
if (this.list.length < this.total) {
|
|
|
|
this.page++;
|
|
|
|
this.getList()
|
|
|
|
}
|
|
|
|
},
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
|
.user{
|
|
|
|
padding: 0 0 130rpx;
|
|
|
|
overflow: hidden;
|
|
|
|
.search{
|
|
|
|
width: 750rpx;
|
|
|
|
padding: 34rpx 34rpx 0 34rpx;
|
|
|
|
box-sizing: border-box;
|
|
|
|
// .box{
|
|
|
|
// padding: 15rpx 25rpx;
|
|
|
|
// box-sizing: border-box;
|
|
|
|
// display: flex;
|
|
|
|
// align-items: center;
|
|
|
|
// background: #F3F3F3;
|
|
|
|
// border-radius: 60rpx;
|
|
|
|
// image{
|
|
|
|
// width: 28rpx;
|
|
|
|
// height: 28rpx;
|
|
|
|
// margin-right: 22rpx;
|
|
|
|
// }
|
|
|
|
// input{
|
|
|
|
// flex: 1;
|
|
|
|
// font-size: 28rpx;
|
|
|
|
// line-height: 30rpx;
|
|
|
|
// }
|
|
|
|
// }
|
|
|
|
}
|
|
|
|
&-bd{
|
|
|
|
padding: 0 34rpx;
|
|
|
|
overflow: hidden;
|
|
|
|
.li{
|
|
|
|
padding:0 12rpx;
|
|
|
|
background-color: #FFFFFF;
|
|
|
|
overflow: hidden;
|
|
|
|
border-radius: 8rpx;
|
|
|
|
margin-top: 18rpx;
|
|
|
|
// &:first-child{
|
|
|
|
// margin-top: 0;
|
|
|
|
// }
|
|
|
|
.a{
|
|
|
|
display: flex;
|
|
|
|
// align-items: flex-start;
|
|
|
|
align-items: center;
|
|
|
|
justify-content: space-between;
|
|
|
|
padding: 15rpx 0 30rpx;
|
|
|
|
border-bottom: 1px solid #F2F2F2;
|
|
|
|
.l{
|
|
|
|
width: 114rpx;
|
|
|
|
height: 114rpx;
|
|
|
|
margin-right: 25rpx;
|
|
|
|
image{
|
|
|
|
width: 100%;
|
|
|
|
height: 100%;
|
|
|
|
border-radius: 50%;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.r{
|
|
|
|
flex: 1;
|
|
|
|
// width: 98rpx;
|
|
|
|
// overflow: hidden;
|
|
|
|
.m{
|
|
|
|
// flex: 1;
|
|
|
|
// max-width: 400rpx;
|
|
|
|
// margin-right: 20rpx;
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
justify-content: space-between;
|
|
|
|
|
|
|
|
.btn{
|
|
|
|
// width: 98rpx;
|
|
|
|
padding:0 10rpx;
|
|
|
|
height: 56rpx;
|
|
|
|
line-height: 56rpx;
|
|
|
|
background: #FFFFFF;
|
|
|
|
border-radius: 3px 3px 3px 3px;
|
|
|
|
border: 1px solid #FFA928;
|
|
|
|
text-align: center;
|
|
|
|
|
|
|
|
font-family: PingFang SC, PingFang SC;
|
|
|
|
font-weight: 400;
|
|
|
|
font-size: 28rpx;
|
|
|
|
color: #FFA928;
|
|
|
|
|
|
|
|
&-on{
|
|
|
|
border-color:#FFA928;
|
|
|
|
color: #FFA928;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
.n{
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
justify-content: space-between;
|
|
|
|
margin-top:20rpx;
|
|
|
|
text{
|
|
|
|
font-size: 28rpx;
|
|
|
|
color: #454545;
|
|
|
|
}
|
|
|
|
image{
|
|
|
|
width: 30rpx;
|
|
|
|
height: 30rpx;
|
|
|
|
margin-left: 10rpx;
|
|
|
|
vertical-align: middle;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// image{
|
|
|
|
// display: block;
|
|
|
|
// width: 30rpx;
|
|
|
|
// height: 30rpx;
|
|
|
|
// float: right;
|
|
|
|
// margin-top: 20rpx;
|
|
|
|
// margin-right: 20rpx;
|
|
|
|
// }
|
|
|
|
}
|
|
|
|
// .m{
|
|
|
|
// flex: 1;
|
|
|
|
// max-width: 400rpx;
|
|
|
|
// margin-right: 20rpx;
|
|
|
|
// .n{
|
|
|
|
// font-size: 28rpx;
|
|
|
|
// font-weight: 400;
|
|
|
|
// color: #545454;
|
|
|
|
// height: 50rpx;
|
|
|
|
// image{
|
|
|
|
// width: 30rpx;
|
|
|
|
// height: 30rpx;
|
|
|
|
// margin-left: 10rpx;
|
|
|
|
// vertical-align: middle;
|
|
|
|
// margin-top: -1px;
|
|
|
|
// }
|
|
|
|
// }
|
|
|
|
// }
|
|
|
|
|
|
|
|
}
|
|
|
|
.b{
|
|
|
|
padding-top: 20rpx;
|
|
|
|
padding-bottom: 20rpx;
|
|
|
|
overflow: hidden;
|
|
|
|
display: flex;
|
|
|
|
align-items: center;
|
|
|
|
.l{
|
|
|
|
flex: 1;
|
|
|
|
text-align: center;
|
|
|
|
font-size: 28rpx;
|
|
|
|
font-weight: 400;
|
|
|
|
color: #B1B1B1;
|
|
|
|
text{
|
|
|
|
font-size: 28rpx;
|
|
|
|
font-weight: 400;
|
|
|
|
color: #454545;
|
|
|
|
display: block;
|
|
|
|
margin-top: 12rpx;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</style>
|