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.
542 lines
12 KiB
542 lines
12 KiB
<template>
|
|
<view class="" style="padding-top: calc(var(--status-bar-height) + 88rpx);">
|
|
<view class="nav_area dis-flex-between-center">
|
|
<view style="flex: 0.3;"></view>
|
|
<view class="" style="font-size: 18px;color: #101010;">用户</view>
|
|
<view style="flex: 0.3;text-align: right;" @click="add">新增用户</view>
|
|
</view>
|
|
<view class="search_area">
|
|
<view class="search_box">
|
|
<input type="text" v-model="account" placeholder="请输入用户id/手机号码" placeholder-style="color: #ededed;">
|
|
<button @click="search()">搜索</button>
|
|
</view>
|
|
</view>
|
|
<view class="list_area">
|
|
<view v-for="(item,index) in listsData" :key="index" class="list-item">
|
|
<view class="edit" @click="edit(item, index)"></view>
|
|
<view class="delete" @click="remove(item, index)">删除</view>
|
|
<view class="update" @click="update(item, index)">升级代理</view>
|
|
<view class="info">
|
|
<image :src="item.avatar" mode=""></image>
|
|
<view class="">ID：{{item.id}}</view>
|
|
</view>
|
|
<view class="amount">
|
|
<view class="amount2">
|
|
<view class=""><text>所属代理ID：</text>{{item.aid}}</view>
|
|
<view class=""><text>电话：</text>{{item.phone}}</view>
|
|
<view class=""><text>余额：</text>{{item.balance}}</view>
|
|
<view class=""><text>可提余额：</text>{{item.withdrawal_balance}}</view>
|
|
</view>
|
|
<view class="amount1">
|
|
<view class="red" @click="modifyScore(1, item, index)">上分</view>
|
|
<view class="red" @click="modifyScore(2, item, index)">下分</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="list-item" style="height: 0px;padding: 0px;"></view>
|
|
</view>
|
|
<view class="edit_mask" v-if="showEdit" @click.stop="">
|
|
<view class="edit_area" :class="editType=='add'?'add':'edit'">
|
|
<view class="title">{{title}}</view>
|
|
<view class="content">
|
|
<view class="input_box" v-if="editType=='edit'">
|
|
<view class="">ID:</view>
|
|
<input type="text" disabled v-model="editInfo.id" class="disabled">
|
|
</view>
|
|
<view class="input_box">
|
|
<view class="">电话:</view>
|
|
<input type="text" placeholder="电话为登陆账号" v-model="editInfo.phone"
|
|
:disabled="editType=='edit'" :class="editType=='edit'?'disabled':''">
|
|
</view>
|
|
<view class="input_box">
|
|
<view class="">密码:</view>
|
|
<input placeholder="请输入新密码" v-model="editInfo.password">
|
|
</view>
|
|
</view>
|
|
<view class="btngroup">
|
|
<view class="cancel" @click="cancel">取消</view>
|
|
<view class="confirm" @click="confirm">确定</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="edit_mask" v-if="showScore" @click.stop="">
|
|
<view class="score_area">
|
|
<view class="title">{{scoreTitle}}</view>
|
|
<view class="content">
|
|
<view class="info_box">
|
|
<view class="">ID：<text>{{scoreInfo.id}}</text></view>
|
|
</view>
|
|
<view class="info_box">
|
|
<view class="">电话：<text>{{scoreInfo.phone}}</text></view>
|
|
</view>
|
|
<view class="info_box">
|
|
<view class="">余额：<text>{{scoreInfo.balance}}</text></view>
|
|
<view class="">可提余额：<text>{{scoreInfo.withdrawal_balance}}</text></view>
|
|
</view>
|
|
<view class="input_box">
|
|
<input type="number" :placeholder="scoreTip" v-model="limit">
|
|
</view>
|
|
</view>
|
|
<view class="btngroup">
|
|
<view class="cancel" @click="showScore=false">取消</view>
|
|
<view class="confirm" @click="submit">确定</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import API from '@/common/js/api.js'
|
|
export default {
|
|
data(){
|
|
return {
|
|
listsData: [
|
|
{id:111,phone:'135XXXX7777',balance:'1000.00',withdrawal_balance:'1000.00'},
|
|
{id:123,phone:'135XXXX7777',balance:'1000.00',withdrawal_balance:'1000.00'},
|
|
{id:222,phone:'135XXXX7777',balance:'1000.00',withdrawal_balance:'1000.00'}
|
|
],
|
|
showEdit: false,
|
|
editType: 'add',//add/edit
|
|
title: "新增用户",
|
|
originInfo: {
|
|
id: '',phone: '',password: ''
|
|
},
|
|
editInfo: {},
|
|
showScore: false,
|
|
scoreTitle: '',
|
|
scoreTip: '',//输入框默认显示
|
|
scoreInfo: {},
|
|
limit: '',// 上下分额度
|
|
account: '',//搜索
|
|
noMore: false,
|
|
page: 1,
|
|
modifyType: 1,//1上2下
|
|
}
|
|
},
|
|
methods: {
|
|
getUserList(){
|
|
API.request('/adminUserTeam/userList', {
|
|
limit: 10,title: this.account,page: this.page
|
|
}, res=>{
|
|
if(res.data.list.length<10){
|
|
this.noMore = true;
|
|
}
|
|
if(this.page>1){
|
|
this.listsData = this.listsData.concat(res.data.list);
|
|
}else{
|
|
this.listsData = res.data.list;
|
|
}
|
|
})
|
|
},
|
|
// 编辑用户
|
|
edit(val, i){
|
|
this.title = "编辑";
|
|
this.editType = "edit";
|
|
this.showEdit = true;
|
|
this.editInfo = val;
|
|
},
|
|
// 删除用户
|
|
remove(val, i){
|
|
let _this = this;
|
|
uni.showModal({
|
|
title:'温馨提示',
|
|
content:"确定是否删除该用户信息",
|
|
success(res) {
|
|
if(res.confirm){
|
|
API.request('/adminUserTeam/deleteUser', {
|
|
user_id: val.id
|
|
}, res=>{
|
|
uni.showToast({
|
|
title: res.msg
|
|
})
|
|
_this.listsData.splice(i, 1);
|
|
// _this.account = '';
|
|
// _this.search();
|
|
})
|
|
}
|
|
|
|
}
|
|
})
|
|
},
|
|
update(val, i){
|
|
let _this = this;
|
|
uni.showModal({
|
|
title:'温馨提示',
|
|
content:"确定该用户是否升级代理",
|
|
success(res) {
|
|
if(res.confirm){
|
|
API.request('/adminUserTeam/upGradationAgent', {
|
|
aid: val.id
|
|
}, res=>{
|
|
uni.showToast({
|
|
title: res.msg
|
|
})
|
|
_this.account = '';
|
|
_this.search();
|
|
})
|
|
}
|
|
|
|
}
|
|
})
|
|
},
|
|
cancel(){
|
|
this.showEdit = false;
|
|
},
|
|
// 提交用户新增编辑
|
|
confirm(){
|
|
if(!this.editInfo.password){
|
|
uni.showToast({
|
|
title: '请输入新密码',
|
|
icon: 'none'
|
|
})
|
|
}
|
|
if(!this.editInfo.phone){
|
|
uni.showToast({
|
|
title: '请输入登陆账号',
|
|
icon: 'none'
|
|
})
|
|
}
|
|
if(this.editType=='add'){
|
|
API.request('/adminUserTeam/addUser', {
|
|
phone: this.editInfo.phone,
|
|
password: this.editInfo.password
|
|
}, res=>{
|
|
uni.showToast({
|
|
title: res.msg
|
|
})
|
|
this.account = '';
|
|
this.search();
|
|
this.showEdit = false;
|
|
})
|
|
}else if(this.editType=='edit'){
|
|
API.request('/adminUserTeam/editUser', {
|
|
user_id: this.editInfo.id,
|
|
phone: this.editInfo.phone,
|
|
password: this.editInfo.password
|
|
}, res=>{
|
|
uni.showToast({
|
|
title: res.msg
|
|
})
|
|
this.account = '';
|
|
this.search();
|
|
this.showEdit = false;
|
|
})
|
|
}
|
|
|
|
},
|
|
add(){
|
|
this.title = "新增用户";
|
|
this.editType = "add";
|
|
this.showEdit = true;
|
|
this.editInfo = this.originInfo;
|
|
},
|
|
// 打开上分下分弹窗
|
|
modifyScore(type, val, i){
|
|
if(type===1){
|
|
this.scoreTitle = '上分'
|
|
this.scoreTip = '请输入上分额度'
|
|
}else if(type===2){
|
|
this.scoreTitle = '下分'
|
|
this.scoreTip = '请输入下分额度'
|
|
}
|
|
this.scoreInfo = val;
|
|
this.modifyType = type;
|
|
this.showScore = true;
|
|
},
|
|
// 提交上分下分
|
|
submit(){
|
|
if(!this.limit){
|
|
uni.showToast({
|
|
title: this.scoreTip,
|
|
icon: 'none'
|
|
})
|
|
return;
|
|
}
|
|
let url = this.modifyType===1?'/adminUserTeam/upScores':'/adminUserTeam/downScores'
|
|
API.request(url, {
|
|
user_id: this.scoreInfo.id,
|
|
quota: this.limit
|
|
}, res=>{
|
|
uni.showToast({
|
|
title: res.msg
|
|
})
|
|
this.limit = '';
|
|
this.account = '';
|
|
this.search();
|
|
this.showScore = false;
|
|
})
|
|
},
|
|
search(){
|
|
this.page = 1;
|
|
this.noMore = false;
|
|
this.getUserList();
|
|
}
|
|
},
|
|
onShow() {
|
|
this.account = '';
|
|
this.search();
|
|
},
|
|
onReachBottom() {
|
|
if(!this.noMore){
|
|
this.page++;
|
|
this.getUserList();
|
|
}else{
|
|
uni.showToast({
|
|
title: '没有更多了',
|
|
icon: 'none'
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.dis-flex-between-center{
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
.nav_area {
|
|
position: fixed;
|
|
top: 0px;
|
|
left: 0px;
|
|
z-index: 99;
|
|
background-color: #fff;
|
|
box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.05);
|
|
width: 700rpx;
|
|
height: 88rpx;
|
|
padding: 0px 25rpx;
|
|
padding-top: var(--status-bar-height);
|
|
box-sizing: content-box;
|
|
color: #b0b0b0;
|
|
font-size: 14px;
|
|
|
|
}
|
|
.search_area{
|
|
.search_box{
|
|
width: 700rpx;
|
|
height: 80rpx;
|
|
border: 1px solid #EDEDED;
|
|
border-radius: 40rpx;
|
|
display: flex;
|
|
margin: 15px auto;
|
|
}
|
|
input{
|
|
flex: 1;
|
|
height: 80rpx;
|
|
padding: 0px 20px;
|
|
font-size: 14px;
|
|
}
|
|
button{
|
|
width: 165rpx;
|
|
height: 80rpx;
|
|
background-color: #F05859;
|
|
border-radius: 40rpx;
|
|
color: #fff;
|
|
font-size: 14px;
|
|
line-height: 40px;
|
|
}
|
|
}
|
|
|
|
.list_area{
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-between;
|
|
padding: 0px 10px;
|
|
|
|
.list-item{
|
|
width: 340rpx;
|
|
// height: 172rpx;
|
|
border-radius: 10px;
|
|
box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.11);
|
|
box-sizing: border-box;
|
|
padding: 10px;
|
|
margin: 0px auto 10px;
|
|
font-size: 14px;
|
|
position: relative;
|
|
|
|
.edit{
|
|
position: absolute;
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
background-image: url("../../static/backgroundUser/riLine-edit-line@2x.png");
|
|
background-size: contain;
|
|
top: 108rpx;
|
|
right: 26rpx;
|
|
}
|
|
.delete{
|
|
position: absolute;
|
|
width: 76rpx;
|
|
height: 48rpx;
|
|
top: 0px;
|
|
right: 0px;
|
|
border-radius: 3px 10px 3px 3px;
|
|
font-size: 12px;
|
|
line-height: 48rpx;
|
|
text-align: center;
|
|
color: #999;
|
|
background-color: #f1f1f1;
|
|
}
|
|
.update{
|
|
position: absolute;
|
|
// width: 76rpx;
|
|
padding: 0px 5px;
|
|
height: 48rpx;
|
|
top: 0px;
|
|
left: 0px;
|
|
border-radius: 10px 3px 3px 3px;
|
|
font-size: 12px;
|
|
line-height: 48rpx;
|
|
text-align: center;
|
|
color: #F14128;
|
|
background-color: #f1f1f1;
|
|
}
|
|
}
|
|
.info{
|
|
text-align: center;
|
|
margin-right: 10px;
|
|
}
|
|
.amount{
|
|
flex: 1;
|
|
margin-top: 10px;
|
|
}
|
|
.amount2{
|
|
line-height: 50rpx;
|
|
}
|
|
.amount1{
|
|
display: flex;
|
|
justify-content: space-between;
|
|
padding: 0px 20px;
|
|
margin: 10px 0px 5px;
|
|
}
|
|
text{
|
|
color: #999;
|
|
}
|
|
.red{
|
|
color: #F05859;
|
|
}
|
|
image{
|
|
width: 80rpx;
|
|
height: 80rpx;
|
|
border-radius: 50%;
|
|
}
|
|
}
|
|
.edit_mask{
|
|
width: 100vw;
|
|
height: 100vh;
|
|
position: fixed;
|
|
top: 0px;
|
|
left: 0px;
|
|
background-color: rgba(0,0,0,.5);
|
|
z-index: 999;
|
|
|
|
.title{
|
|
height: 140rpx;
|
|
text-align: center;
|
|
line-height: 140rpx;
|
|
font-size: 18px;
|
|
}
|
|
.btngroup{
|
|
height: 90rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
border-top: 2rpx solid #f1f1f1;
|
|
.cancel{
|
|
line-height: 90rpx;
|
|
color: #999;
|
|
border-right: 2rpx solid #f1f1f1;
|
|
}
|
|
.confirm, .cancel{
|
|
width: 50%;
|
|
text-align: center;
|
|
}
|
|
}
|
|
}
|
|
.edit_area{
|
|
width: 670rpx;
|
|
border-radius: 10px;
|
|
background-color: #fff;
|
|
color: #444;
|
|
&.add{
|
|
height: 480rpx;
|
|
margin: calc(50vh - 240rpx) auto;
|
|
.content{
|
|
height: 248rpx;
|
|
}
|
|
}
|
|
&.edit{
|
|
height: 626rpx;
|
|
margin: calc(50vh - 313rpx) auto;
|
|
.content{
|
|
height: 394rpx;
|
|
}
|
|
}
|
|
|
|
|
|
.input_box{
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding: 0px 40rpx;
|
|
margin-bottom: 40rpx;
|
|
font-size: 16px;
|
|
view{
|
|
flex: 1;
|
|
text-align: center;
|
|
}
|
|
.disabled /deep/ .uni-input-input{
|
|
background: #ebebeb !important;
|
|
}
|
|
input{
|
|
width: 430rpx;
|
|
height: 80rpx;
|
|
text-align: center;
|
|
font-size: 14px;
|
|
border: 1px solid #ededed;
|
|
border-radius: 5px;
|
|
}
|
|
}
|
|
|
|
}
|
|
.score_area{
|
|
width: 670rpx;
|
|
border-radius: 10px;
|
|
background-color: #fff;
|
|
color: #444;
|
|
height: 570rpx;
|
|
margin: calc(50vh - 285rpx) auto;
|
|
|
|
.content{
|
|
height: 338rpx;
|
|
padding: 0px 55rpx;
|
|
box-sizing: border-box;
|
|
}
|
|
.info_box{
|
|
height: 66rpx;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
font-size: 16px;
|
|
color: #999;
|
|
margin-bottom: 6rpx;
|
|
|
|
text{
|
|
color: #101010;
|
|
}
|
|
}
|
|
.input_box{
|
|
width: 560rpx;
|
|
height: 80rpx;
|
|
border-radius: 5px;
|
|
border: 1px solid #ededed;
|
|
text-align: center;
|
|
|
|
input{
|
|
height: 80rpx;
|
|
font-size: 14px;
|
|
}
|
|
}
|
|
}
|
|
|
|
</style>
|