|
@@ -0,0 +1,106 @@
|
|
|
+<script setup lang="ts" generic="T extends Object, R extends { list: T[] }, Q extends T">
|
|
|
+import { ResPageData } from '@designer-hub/app/src/core/libs/models'
|
|
|
+// import { NetImages } from '../core/libs/net-images'
|
|
|
+import { NetImages } from '@designer-hub/app/src/core/libs/net-images'
|
|
|
+import { getRect, addUnit } from 'wot-design-uni/components/common/util'
|
|
|
+
|
|
|
+const props = withDefaults(
|
|
|
+ defineProps<{
|
|
|
+ request: (query: any) => Promise<IResData<R>>
|
|
|
+ query?: Partial<Q> & { [key: symbol]: any }
|
|
|
+ automatic?: boolean
|
|
|
+ }>(),
|
|
|
+ { automatic: true, query: () => ({}) },
|
|
|
+)
|
|
|
+const slot = defineSlots<{
|
|
|
+ default(props: { data?: R['list']; items?: T[]; source?: R }): any
|
|
|
+ top: () => any
|
|
|
+}>()
|
|
|
+const { proxy } = getCurrentInstance() as any
|
|
|
+const pageNo = ref(1)
|
|
|
+const pageSize = ref(10)
|
|
|
+const nomore = ref(false)
|
|
|
+const topRef = ref()
|
|
|
+const height = ref(0)
|
|
|
+const windowInfo = ref<UniNamespace.GetWindowInfoResult>()
|
|
|
+const { data, run: setData } = useRequest(
|
|
|
+ () => props.request({ pageNo: pageNo.value, pageSize: pageSize.value, ...props.query }),
|
|
|
+ { immediate: false },
|
|
|
+)
|
|
|
+const items = ref<T[]>([])
|
|
|
+
|
|
|
+const setPlaceholderHeight = () => {
|
|
|
+ getRect('.bottom-app-bar', false, proxy).then((res) => {
|
|
|
+ height.value = res.height as number
|
|
|
+ })
|
|
|
+}
|
|
|
+onMounted(async () => {
|
|
|
+ nextTick(() => {
|
|
|
+ setPlaceholderHeight()
|
|
|
+ })
|
|
|
+ windowInfo.value = await uni.getWindowInfo()
|
|
|
+ if (props.automatic) {
|
|
|
+ console.log('Page Helper Automatic')
|
|
|
+ await setData()
|
|
|
+ items.value = data.value?.list || []
|
|
|
+ }
|
|
|
+})
|
|
|
+watch(
|
|
|
+ () => props.query,
|
|
|
+ async () => {
|
|
|
+ console.log('Page Helper Query Change')
|
|
|
+ pageNo.value = 1
|
|
|
+ pageSize.value = 10
|
|
|
+ await setData()
|
|
|
+ items.value = data.value?.list || []
|
|
|
+ },
|
|
|
+)
|
|
|
+onReachBottom(async () => {
|
|
|
+ console.log('Page Helper Reach Bottom')
|
|
|
+
|
|
|
+ if (data.value?.list?.length < pageSize.value) {
|
|
|
+ return (nomore.value = true)
|
|
|
+ }
|
|
|
+ pageNo.value++
|
|
|
+ await setData()
|
|
|
+ items.value = items.value.concat(data.value?.list || [])
|
|
|
+})
|
|
|
+defineExpose({
|
|
|
+ reload: async () => {
|
|
|
+ console.log('Page Helper Reload')
|
|
|
+ pageNo.value = 1
|
|
|
+ pageSize.value = 10
|
|
|
+ await setData()
|
|
|
+ items.value = data.value?.list || []
|
|
|
+ },
|
|
|
+ refresh: async () => {
|
|
|
+ console.log('Page Helper Refresh')
|
|
|
+ await setData()
|
|
|
+ },
|
|
|
+})
|
|
|
+</script>
|
|
|
+<template>
|
|
|
+ <div
|
|
|
+ class="flex-grow flex flex-col"
|
|
|
+ :style="{ paddingBottom: addUnit(windowInfo?.safeAreaInsets.bottom || 0) }"
|
|
|
+ >
|
|
|
+ <div class="relative" :style="{ height: addUnit(height) }">
|
|
|
+ <div
|
|
|
+ ref="topRef"
|
|
|
+ class="bottom-app-bar fixed absolute left-0 right-0 z-1"
|
|
|
+ :style="{ top: addUnit(windowInfo?.windowTop || 0) }"
|
|
|
+ >
|
|
|
+ <!-- {{ topRef.offsetHeight }} -->
|
|
|
+ <slot name="top"></slot>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <template v-if="!items?.length">
|
|
|
+ <wd-status-tip :image="NetImages.NotContent" tip="暂无内容"></wd-status-tip>
|
|
|
+ </template>
|
|
|
+ <slot :source="{ list: items }"></slot>
|
|
|
+ <template v-if="nomore">
|
|
|
+ <div class="my-4"><wd-divider>没有更多了</wd-divider></div>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+</template>
|