113 lines
2.1 KiB
Vue
113 lines
2.1 KiB
Vue
<template>
|
|
<scroll-view :scroll-y="true" @scrolltolower="onScrollBottom()" style="height: 100%;">
|
|
<slot></slot>
|
|
|
|
<!-- 加载更多 -->
|
|
<u-loadmore icon-size="28" font-size="28" margin-top="30" v-if="showLoadMore || loadedAll"
|
|
:status="loadedAll ? 'nomore' : 'loading'" />
|
|
|
|
<!-- 空数据页 -->
|
|
<view v-if="resObject.list.length == 0" style="padding-top: 100rpx;">
|
|
<u-empty text="无数据" :icon="getCdnUrl('kong.png')" textSize="28" width="86" height="97">
|
|
</u-empty>
|
|
</view>
|
|
</scroll-view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
watch: {
|
|
searchParam: {
|
|
handler(cval, oval) {
|
|
this.getDataList(true)
|
|
},
|
|
deep: true
|
|
}
|
|
},
|
|
props: {
|
|
searchParam: {
|
|
default () {
|
|
return {}
|
|
}
|
|
},
|
|
getListFun: {
|
|
default () {
|
|
return () => {}
|
|
}
|
|
},
|
|
resObject: {
|
|
default () {
|
|
return {
|
|
list: []
|
|
}
|
|
}
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
page: { // 分页参数
|
|
pageNum: 1,
|
|
pageSize: 20,
|
|
},
|
|
showLoadMore: false, // 是否显示加载更多的loading
|
|
loadedAll: false, // 是否加载了所有数据
|
|
}
|
|
},
|
|
created() {
|
|
this.getDataList(true)
|
|
},
|
|
onHide() {
|
|
|
|
},
|
|
unmounted() {},
|
|
|
|
methods: {
|
|
async onScrollBottom() {
|
|
this.$emit('onScrollBottom')
|
|
if (this.loadedAll || this.showLoadMore) {
|
|
return
|
|
}
|
|
this.showLoadMore = true
|
|
this.page.pageNum++
|
|
await this.getDataList()
|
|
this.showLoadMore = false
|
|
},
|
|
async getDataList(reload) {
|
|
if (reload) {
|
|
this.page.pageNum = 1
|
|
this.showLoading()
|
|
}
|
|
const res = await this.getListFun({
|
|
...this.page,
|
|
...this.searchParam
|
|
})
|
|
let list = res.rows || []
|
|
if (reload) {
|
|
this.hideLoading()
|
|
} else {
|
|
list = this.resObject.list.concat(list)
|
|
}
|
|
this.loadedAll = res.total <= list.length
|
|
this.updateRes({
|
|
list,
|
|
total: res.total
|
|
})
|
|
},
|
|
updateRes(obj) {
|
|
this.$emit('update:resObject', {
|
|
...this.resObject,
|
|
page: this.page,
|
|
showLoadMore: this.showLoadMore,
|
|
loadedAll: this.loadedAll,
|
|
...obj,
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.sch-cont {
|
|
position: relative;
|
|
}
|
|
</style> |