72 lines
1.4 KiB
Vue
72 lines
1.4 KiB
Vue
<template>
|
||
<view class="min-page color-333 u-font-28 ">
|
||
<view class="u-font-32 font-bold ">助力人（{{totalRow}}人）</view>
|
||
<view class="list u-m-t-40">
|
||
<view class="item" v-for="(item,index) in list" :key="index">
|
||
<up-avatar size="140rpx" :src="item.userAvator"></up-avatar>
|
||
<view class="u-m-t-16 u-line-1">{{item.userName}}</view>
|
||
</view>
|
||
</view>
|
||
<up-empty v-if="!list.length" text="暂无助力人"></up-empty>
|
||
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
|
||
import { onReachBottom } from '@dcloudio/uni-app'
|
||
import * as Api from '@/common/api/market/package.js'
|
||
const query=reactive({
|
||
page:1,size:50
|
||
})
|
||
|
||
const totalRow=ref(0)
|
||
const isEnd=ref(false)
|
||
const list=ref([])
|
||
function getList(){
|
||
Api.helpPage(query).then(res=>{
|
||
totalRow.value=res.totalRow||0
|
||
isEnd.value= query.page>= res.totalPage*1 ?true :false
|
||
if(query.page==1){
|
||
list.value=res.records
|
||
}else{
|
||
list.value.push(...res.records)
|
||
}
|
||
})
|
||
}
|
||
|
||
onReachBottom(()=>{
|
||
if(isEnd.value){
|
||
return
|
||
}
|
||
query.page++
|
||
getList()
|
||
})
|
||
onLoad((opt)=>{
|
||
Object.assign(query,opt)
|
||
getList()
|
||
})
|
||
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.min-page{
|
||
padding: 32rpx 52rpx;
|
||
}
|
||
.list{
|
||
display: grid;
|
||
grid-template-columns: repeat(4, 1fr);
|
||
grid-column-gap: 28rpx;
|
||
grid-row-gap: 32rpx;
|
||
.item{
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
align-items: center;
|
||
text-align: center;
|
||
.u-line-1{
|
||
max-width: 140rpx;
|
||
}
|
||
}
|
||
}
|
||
</style> |