fix

src/views/site/SiteCardListView.vue

@@ -4,6 +4,7 @@ import type { Site } from '@/api/types'
 import SiteCard from '@/components/cards/SiteCard.vue'
 import NoDataFound from '@/components/NoDataFound.vue'
 import SiteAddEditForm from '@/components/form/SiteAddEditForm.vue'
+import { useDefer } from '@/@core/utils/dom'
 
 // 数据列表
 const dataList = ref<Site[]>([])
@@ -14,11 +15,15 @@ const isRefreshed = ref(false)
 // 新增站点对话框
 const siteAddDialog = ref(false)
 
+// 延迟加载
+let defer = (_: number) => true
+
 // 获取站点列表数据
 async function fetchData() {
   try {
     dataList.value = await api.get('site/')
     isRefreshed.value = true
+    defer = useDefer(dataList.value.length)
   }
   catch (error) {
     console.error(error)
@@ -45,13 +50,18 @@ onBeforeMount(fetchData)
     v-if="dataList.length > 0"
     class="grid gap-3 grid-site-card"
   >
-    <SiteCard
-      v-for="data in dataList"
-      :key="data.id"
-      :site="data"
-      @remove="fetchData"
-      @update="fetchData"
-    />
+    <div
+      v-for="(data, index) in dataList"
+      :key="index"
+    >
+      <SiteCard
+        v-if="defer(index)"
+        :key="data.id"
+        :site="data"
+        @remove="fetchData"
+        @update="fetchData"
+      />
+    </div>
   </div>
   <NoDataFound
     v-if="dataList.length === 0 && isRefreshed"