karlcarlo
a5c5d753b6
- 新增大量图片资源，包括图标、背景图、海报等，用于页面展示 - 添加字体文件及样式配置，支持自定义字体 - 引入 uni-ui 组件库，包括图标、弹窗、日期选择器等常用组件 - 添加网络状态监听、加密工具等基础工具函数 - 配置 Vuex 状态管理，包括购物车数量、热门搜索词等 - 增加页面组件，如用户协议、分销信息、提现状态等 - 配置项目构建和忽略文件，优化开发体验
243 lines
7.2 KiB
Vue
243 lines
7.2 KiB
Vue
<template>
|
||
<view class="px-20">
|
||
<NavBar
|
||
custom=""
|
||
textSize="34rpx"
|
||
iconColor="#333333"
|
||
textColor="#333333"
|
||
:isScrolling="pageScrollStatus"
|
||
showBack>
|
||
<view class="flex-center fs-34 nav-tab fw-400">
|
||
<text :class="{'text--w111-333 fw-500': tabActive == 0}" @tap="checkTab(0)">普通用户</text>
|
||
<text class="pl-44" :class="{'text--w111-333 fw-500': tabActive == 1}" @tap="checkTab(1)">采购商</text>
|
||
</view>
|
||
</NavBar>
|
||
<view class="flex-between-center mt-10">
|
||
<view class="flex-1 h-72 rd-40rpx bg--w111-fff px-32 flex-y-center relative">
|
||
<text class="iconfont icon-ic_search fs-28"></text>
|
||
<input v-model="params.keyword" class="pl-18 flex-1 line1 fs-28"
|
||
placeholder="请输入采购商名称/手机号/ID"
|
||
placeholder-class="text--w111-999" @confirm="searchSubmit" v-if="tabActive" />
|
||
<input v-model="params.nickname" class="pl-18 flex-1 line1 fs-28"
|
||
placeholder="请输入用户昵称/手机号/用户ID"
|
||
placeholder-class="text--w111-999" @confirm="searchSubmit" v-else />
|
||
<text class="iconfont icon-ic_close1 fs-28 text--w111-999 z-10" v-if="params.nickname" @tap="clearWord"></text>
|
||
</view>
|
||
<view class="w-72 h-72 rd-50-p111- bg--w111-fff flex-center ml-20" @tap="goPage('/pages/behalf/record/index')">
|
||
<text class="iconfont icon-ic_order text--w111-666"></text>
|
||
</view>
|
||
</view>
|
||
<view class="add-box w-full h-176 rd-24rpx mt-32 flex-col flex-center text-primary"
|
||
@tap="goPage('/pages/behalf/goods_list/index?uid=0')" v-show="!tabActive">
|
||
<text class="iconfont icon-ic_picture fs-44"></text>
|
||
<text class="fs-24 lh-34rpx pt-12">未注册用户点此下单</text>
|
||
</view>
|
||
<view v-if="userList.length && tabActive == 0">
|
||
<view class="w-full h-176 rd-24rpx item flex-between-center bg--w111-fff mt-20"
|
||
v-for="(item,index) in userList" :key="index">
|
||
<view class="flex-y-center">
|
||
<easy-loadimage
|
||
:image-src="item.avatar"
|
||
width="96rpx"
|
||
height="96rpx"
|
||
borderRadius="50%"></easy-loadimage>
|
||
<view class="w-400 ml-24">
|
||
<view class="fs-28 fw-500 flex-y-center">
|
||
<text>{{item.nickname}}</text>
|
||
<view class="svip flex-center" v-if="item.isMember == 1">SVIP</view>
|
||
<view class="vip flex-center" v-if="item.level_status == 1 && item.level_grade">
|
||
<text class="iconfont icon-huiyuandengji"></text>
|
||
V{{item.level_grade}}
|
||
</view>
|
||
</view>
|
||
<view class="fs-24 text--w111-999 lh-34rpx pt-4">{{item.phone}}</view>
|
||
<view class="flex-y-center fs-24 lh-34rpx">
|
||
<view class="flex-y-center">
|
||
<text class="text--w111-999 pr-10">积分:</text>
|
||
<text>{{item.integral}}</text>
|
||
</view>
|
||
<view class="flex-y-center pl-30">
|
||
<text class="text--w111-999 pr-10">余额:</text>
|
||
<text>{{item.now_money}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="w-144 h-56 rd-28rpx flex-center fs-24 text--w111-fff bg-primary" @tap="goPage('/pages/behalf/goods_list/index?uid=' + item.uid)">下单</view>
|
||
</view>
|
||
<view class="flex-center fs-26 text--w111-999 pt-24" v-if="userList.length > 0">{{loadTit}}...</view>
|
||
</view>
|
||
<view v-else-if="userList.length && tabActive == 1">
|
||
<view class="w-full h-176 rd-24rpx item flex-between-center bg--w111-fff mt-20"
|
||
v-for="(item,index) in userList" :key="index">
|
||
<view class="flex-y-center">
|
||
<easy-loadimage
|
||
:image-src="item.user_avatar"
|
||
width="96rpx"
|
||
height="96rpx"
|
||
borderRadius="50%"></easy-loadimage>
|
||
<view class="w-400 ml-24">
|
||
<view class="fs-28 fw-500 flex-y-center">
|
||
<text class="pr-12">{{item.channel_name}}</text>
|
||
<view class="channel-tag flex-center flex-center fs-18">采购商身份</view>
|
||
</view>
|
||
<view class="fs-24 text--w111-999 lh-34rpx pt-4">{{item.phone}} (ID:{{item.id}})</view>
|
||
<view class="fs-24 text--w111-999 lh-34rpx">
|
||
渠道折扣：<text class="text--w111-333">{{item.identity_discount / 10}}折</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="w-144 h-56 rd-28rpx flex-center fs-24 text--w111-fff bg-primary" @tap="goPage('/pages/behalf/goods_list/index?uid=' + item.uid + '&is_channel=1')">下单</view>
|
||
</view>
|
||
<view class="flex-center fs-26 text--w111-999 pt-24" v-if="userList.length > 0">{{loadTit}}...</view>
|
||
</view>
|
||
<view v-else class="mt-20">
|
||
<emptyPage title="暂无用户信息～" src="/statics/images/empty-box.png"></emptyPage>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
<script>
|
||
import { adminUserList, adminChannelListApi } from "@/api/admin.js";
|
||
import emptyPage from '@/components/emptyPage.vue';
|
||
import NavBar from "@/components/NavBar.vue"
|
||
export default {
|
||
name:'userList',
|
||
data(){
|
||
return {
|
||
params:{
|
||
page:1,
|
||
limit:10,
|
||
nickname:'',
|
||
keyword: ''
|
||
},
|
||
userList:[],
|
||
status: false,
|
||
loadTit:'正在加载',
|
||
pageScrollStatus:false,
|
||
tabActive: 0
|
||
}
|
||
},
|
||
components: {
|
||
emptyPage,
|
||
NavBar
|
||
},
|
||
onLoad() {
|
||
this.getList();
|
||
},
|
||
onPageScroll(object) {
|
||
if (object.scrollTop > 30) {
|
||
this.pageScrollStatus = true;
|
||
} else if (object.scrollTop < 30) {
|
||
this.pageScrollStatus = false;
|
||
}
|
||
uni.$emit('scroll');
|
||
},
|
||
methods:{
|
||
checkTab(val){
|
||
this.tabActive = val;
|
||
this.userList = [];
|
||
this.status = false;
|
||
this.params.page = 1;
|
||
this.getList();
|
||
},
|
||
getList(){
|
||
let that = this;
|
||
if (that.status) return;
|
||
that.loadTit = '加载更多';
|
||
let funApi = this.tabActive ? adminChannelListApi : adminUserList;
|
||
funApi(this.params).then(res => {
|
||
let len = res.data.list.length;
|
||
this.userList = this.userList.concat(res.data.list)
|
||
that.params.page++;
|
||
that.status = this.params.limit > len;
|
||
that.params.page = that.params.page;
|
||
that.loadTit = that.status ? '没有更多内容啦~' : '加载更多';
|
||
}).catch(err=>{
|
||
that.loadTit = '加载更多';
|
||
return this.$util.Tips({
|
||
title: err
|
||
});
|
||
})
|
||
},
|
||
searchSubmit(){
|
||
this.params.page = 1;
|
||
this.status = false;
|
||
this.userList = [];
|
||
this.getList();
|
||
},
|
||
clearWord(){
|
||
this.params.nickname = ''
|
||
},
|
||
goPage(url){
|
||
uni.navigateTo({
|
||
url
|
||
})
|
||
}
|
||
},
|
||
onReachBottom(e) {
|
||
this.getList()
|
||
}
|
||
}
|
||
</script>
|
||
<style lang="scss">
|
||
.text-primary{
|
||
color: $primary-admin;
|
||
}
|
||
.bg-primary{
|
||
background: $primary-admin;
|
||
}
|
||
.add-box{
|
||
border: 2rpx dashed $primary-admin;
|
||
background: $light-primary-admin;
|
||
color: $primary-admin;
|
||
}
|
||
.add-icon{
|
||
border: 2rpx solid $primary-admin;
|
||
}
|
||
.item{
|
||
padding: 30rpx 24rpx;
|
||
}
|
||
.icon-ic_close1{
|
||
position: absolute;
|
||
right: 34rpx;
|
||
top: 50%;
|
||
transform: translateY(-50%);
|
||
}
|
||
.nav-tab{
|
||
color: #606266;
|
||
}
|
||
.svip {
|
||
width: 56rpx;
|
||
height: 26rpx;
|
||
background: linear-gradient(270deg, #484643 0%, #1F1B17 100%);
|
||
border-radius: 100rpx;
|
||
font-size: 18rpx;
|
||
font-weight: 600;
|
||
color: #FDDAA4;
|
||
margin-left: 10rpx;
|
||
}
|
||
.vip{
|
||
width: 64rpx;
|
||
height: 26rpx;
|
||
background: #FEF0D9;
|
||
border: 1px solid #FACC7D;
|
||
border-radius: 50rpx;
|
||
font-size: 18rpx;
|
||
font-weight: 500;
|
||
color: #DFA541;
|
||
margin-left: 10rpx;
|
||
.iconfont {
|
||
font-size: 20rpx;
|
||
margin-right: 4rpx;
|
||
}
|
||
}
|
||
.channel-tag{
|
||
width: 110rpx;
|
||
height: 28rpx;
|
||
background: #FEF0D9;
|
||
border-radius: 20rpx;
|
||
border: 1rpx solid #FACC7D;
|
||
color: #DFA541;
|
||
}
|
||
</style>
|