多维表格
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.
 
 
 
 
 
 

37 lines
1.0 KiB

<script setup lang="ts">
const { socialFeed, loadFeed, isErrorOccurred } = useProductFeed()
const scrollContainer = ref<HTMLElement>()
const { isLoading } = useInfiniteScroll(
scrollContainer,
async () => {
if (isLoading.value) return
await loadFeed({
type: 'all',
loadMore: true,
})
},
{ distance: 1, interval: 2000 },
)
</script>
<template>
<div
ref="scrollContainer"
:style="{
height: 'calc(100dvh - var(--toolbar-height) - 3.1rem)',
}"
class="overflow-y-auto nc-scrollbar-md w-full"
>
<div v-if="isErrorOccurred?.social && !socialFeed.length" class="h-full flex justify-center items-center">
<FeedError page="all" />
</div>
<div v-else-if="isLoading && !socialFeed.length" class="flex items-center justify-center h-full w-full">
<GeneralLoader size="xlarge" />
</div>
<div v-else class="flex flex-col my-6 items-center gap-6">
<FeedRecentsCard v-for="feed in socialFeed" :key="feed.Id" :item="feed" />
</div>
</div>
</template>