江西小程序管理端
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.
 
 
 

137 lines
3.0 KiB

<template>
<view class="pageBgImg">
<topNavbar title="驾校教练"></topNavbar>
<view class="pad">
<view class="search_Box">
<searchRow placeholder="搜索教练员" @searchFn="searchFn"></searchRow>
</view>
<view class="ul">
<view class="card" v-for="(item,index) in list" :key="index" @click="$goPage('/pages/userCenter/schoolCoach/coachComment/coachComment?id='+ item.id)">
<view class="avatar">
<image :src="item.photoPath" mode="" @error="handleImageError(item)"></image>
</view>
<view class="rightTxt">
<view class="name">{{item.name}}</view>
<view class="star_row">
<view class="starBox">
<u-rate active-color="#1989FA" inactive-color="#1989FA" gutter="1" :size="16" :value="item.stars" :readonly="true" style="pointer-events: none;"></u-rate>
<view class="num">{{item.stars}}分</view>
</view>
<moreRight text="查看详情"/>
</view>
</view>
</view>
</view>
</view>
<view style="padding-bottom: 20rpx;" v-if="list.length">
<u-loadmore :status="status" />
</view>
<nodata v-if="!list.length&&status=='nomore'"></nodata>
</view>
</template>
<script>
import { coachPage } from '@/config/api.js'
export default {
data() {
return {
list: [],
params: {
pageNo: 1,
pageSize: 20
},
total: 20,
status: 'loading'
}
},
onLoad() {
this.coachPageFn()
},
onPullDownRefresh() {
this.list = []
this.params.pageNo = 1
this.coachPageFn().then(()=>{uni.stopPullDownRefresh()})
},
onReachBottom() {
if(this.total>this.list.length) {
this.coachPageFn()
}
},
methods: {
async coachPageFn() {
const {data: res} = await coachPage(this.params)
this.params.pageNo ++
this.list.push(...res.list)
this.total = res.total
if(this.list.length>=this.total) {
this.status = 'nomore'
}else {
this.status = 'loading'
}
console.log(res)
},
searchFn(val) {
console.log(val)
this.params.name = val
this.list = []
this.params.pageNo = 1
this.coachPageFn()
},
handleImageError(item) {
item.photoPath = require('@/static/images/index/avatar.png')
}
}
}
</script>
<style lang="scss" scoped>
.pageBgImg {
.search_Box {
margin-bottom: 20rpx;
searchrow {
}
}
.ul {
width: 100%;
.card {
padding: 28rpx 30rpx;
margin-bottom: 20rpx;
display: flex;
align-items: center;
.avatar {
width: 108rpx;
height: 108rpx;
border-radius: 50%;
overflow: hidden;
}
.rightTxt {
padding-left: 20rpx;
flex: 1;
.name {
font-size: 32rpx;
color: #333;
font-weight: 500;
margin-bottom: 10rpx;
}
.star_row {
display: flex;
justify-content: space-between;
.starBox {
display: flex;
padding: 6rpx 0 6rpx 0;
.num {
color: $themC;
}
}
}
}
}
}
}
</style>