fix: replace virtual card grid with progressive loading

This commit is contained in:
jxxghp
2026-05-09 22:23:45 +08:00
parent 5909d2423c
commit 2f1a356e65
13 changed files with 289 additions and 326 deletions

View File

@@ -4,7 +4,7 @@ import { Workflow } from '@/api/types'
import WorkflowAddEditDialog from '@/components/dialog/WorkflowAddEditDialog.vue'
import WorkflowTaskCard from '@/components/cards/WorkflowTaskCard.vue'
import NoDataFound from '@/components/NoDataFound.vue'
import VirtualCardGrid from '@/components/misc/VirtualCardGrid.vue'
import ProgressiveCardGrid from '@/components/misc/ProgressiveCardGrid.vue'
import { useI18n } from 'vue-i18n'
// 国际化
@@ -67,7 +67,7 @@ defineExpose({
<template>
<div>
<LoadingBanner v-if="!isRefreshed" class="mt-12" />
<VirtualCardGrid
<ProgressiveCardGrid
v-if="workflowList.length > 0 && isRefreshed"
:items="workflowList"
:get-item-key="item => item.id"
@@ -78,7 +78,7 @@ defineExpose({
<template #default="{ item }">
<WorkflowTaskCard :workflow="item" :event-types="eventTypes" @refresh="fetchData" />
</template>
</VirtualCardGrid>
</ProgressiveCardGrid>
<NoDataFound
v-if="workflowList.length === 0 && isRefreshed"
error-code="404"

View File

@@ -3,7 +3,7 @@ import api from '@/api'
import type { WorkflowShare } from '@/api/types'
import NoDataFound from '@/components/NoDataFound.vue'
import WorkflowShareCard from '@/components/cards/WorkflowShareCard.vue'
import VirtualCardGrid from '@/components/misc/VirtualCardGrid.vue'
import ProgressiveCardGrid from '@/components/misc/ProgressiveCardGrid.vue'
import { useI18n } from 'vue-i18n'
// 国际化
@@ -157,7 +157,7 @@ onActivated(() => {
<VInfiniteScroll mode="intersect" side="end" :items="dataList" class="overflow-visible px-2" @load="fetchData" :key="currentKey">
<template #loading />
<template #empty />
<VirtualCardGrid
<ProgressiveCardGrid
v-if="dataList.length > 0"
:items="dataList"
:get-item-key="item => item.id"
@@ -173,7 +173,7 @@ onActivated(() => {
@update="emit('update')"
/>
</template>
</VirtualCardGrid>
</ProgressiveCardGrid>
<NoDataFound
v-if="dataList.length === 0 && isRefreshed"
error-code="404"