|
|
|
|
<template>
|
|
|
|
|
<view>
|
|
|
|
|
<uni-card :is-shadow="false" :border="false" is-full spacing="0" margin="20">
|
|
|
|
|
<uni-search-bar class="search" radius="5" placeholder="请输入成员名称" clearButton="auto" cancelButton="none" v-model="keyword" />
|
|
|
|
|
</uni-card>
|
|
|
|
|
|
|
|
|
|
<ul class="list">
|
|
|
|
|
<li v-for="item in list">
|
|
|
|
|
<image class="avatar" src="@/static/image/avatar.png" mode=""></image>
|
|
|
|
|
<view class="info">
|
|
|
|
|
<view class="name">Luna</view>
|
|
|
|
|
<view class="text">手机号码：1352351253</view>
|
|
|
|
|
<view class="text">加入时间：2020-01-02</view>
|
|
|
|
|
</view>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
|
|
|
|
|
<uni-icons class="plus" type="plus-filled" size="60" color="#007eff" @click="$util.to('../addStaff/addStaff')"></uni-icons>
|
|
|
|
|
</view>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import { teamList } from '@/apis/modules/parner.js'
|
|
|
|
|
export default {
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
reachBottom: 0, // 是否是上拉加载。0->否,1->是,-1->加载完所有数据
|
|
|
|
|
status: 'more', // 上拉加载状态 more|loading|noMore
|
|
|
|
|
searchTimer: null,
|
|
|
|
|
keyword: '',
|
|
|
|
|
list: [],
|
|
|
|
|
page: 1,
|
|
|
|
|
pageSize: 10
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
watch: {
|
|
|
|
|
keyword () {
|
|
|
|
|
clearTimeout(this.searchTimer)
|
|
|
|
|
this.searchTimer = setTimeout(() => {
|
|
|
|
|
this.initList()
|
|
|
|
|
}, 500)
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
// 下拉刷新
|
|
|
|
|
onPullDownRefresh() {
|
|
|
|
|
this.initList()
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
uni.stopPullDownRefresh()
|
|
|
|
|
}, 1500)
|
|
|
|
|
},
|
|
|
|
|
// 上拉加载
|
|
|
|
|
onReachBottom() {
|
|
|
|
|
if (this.reachBottom >= 0) {
|
|
|
|
|
this.reachBottom = 1
|
|
|
|
|
this.status = 'loading'
|
|
|
|
|
this.getList()
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
onShow() {
|
|
|
|
|
this.initList()
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
getList() {
|
|
|
|
|
teamList({
|
|
|
|
|
id: uni.getStorageSync('team').teamId
|
|
|
|
|
}).then(({ data }) => {
|
|
|
|
|
// 未加载完所有数据，并且不是筛选，则拼接list，否则直接赋值
|
|
|
|
|
this.list = this.reachBottom > 0 ? [...this.list, ...data.records] : data.records
|
|
|
|
|
this.page++ // 每次获取了数据后page+1
|
|
|
|
|
const noMore = this.list.length === data.total // 是否加载完所有数据
|
|
|
|
|
this.status = noMore ? 'noMore' : 'more' // 加载完了则设置为noMore
|
|
|
|
|
this.reachBottom = noMore ? -1 : 0 // 加载完了则设置为-1
|
|
|
|
|
}).catch(e => {})
|
|
|
|
|
},
|
|
|
|
|
initList() {
|
|
|
|
|
this.page = 1
|
|
|
|
|
this.reachBottom = 0
|
|
|
|
|
this.getList()
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
|
|
.list {
|
|
|
|
|
margin-top: 10px;
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
li {
|
|
|
|
|
display: flex;
|
|
|
|
|
align-items: center;
|
|
|
|
|
padding: 10px 20px;
|
|
|
|
|
border-bottom: 1px solid #f7f7f7;
|
|
|
|
|
&:last-child {
|
|
|
|
|
border-bottom: 0;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.avatar {
|
|
|
|
|
width: 40px;
|
|
|
|
|
height: 40px;
|
|
|
|
|
margin-right: 15px;
|
|
|
|
|
border-radius: 50%;
|
|
|
|
|
}
|
|
|
|
|
.name {
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
color: #333;
|
|
|
|
|
}
|
|
|
|
|
.text {
|
|
|
|
|
font-size: 13px;
|
|
|
|
|
color: #858585;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
.plus {
|
|
|
|
|
position: fixed;
|
|
|
|
|
bottom: 20px;
|
|
|
|
|
right: 20px;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
