rollback

src/views/plugin/PluginCardListView.vue

@@ -8,7 +8,6 @@ import PluginCard from '@/components/cards/PluginCard.vue'
 import noImage from '@images/logos/plugin.png'
 import { useDisplay } from 'vuetify'
 import { isNullOrEmptyObject } from '@/@core/utils'
-import Grid from 'vue-virtual-scroll-grid'
 
 // 显示器宽度
 const display = useDisplay()
@@ -275,24 +274,6 @@ function pluginLabels(label: string | undefined) {
   return label.split(',')
 }
 
-// 插件分页提供器
-const pluginsPageProvider = (pageNumber: number, pageSize: number) => {
-  return new Promise<Plugin[]>(resolve => {
-    const start = pageNumber * pageSize
-    const end = start + pageSize
-    resolve(dataList.value.slice(start, end + 1))
-  })
-}
-
-// 插件市场分页提供器
-const pluginsMarketPageProvider = (pageNumber: number, pageSize: number) => {
-  return new Promise<Plugin[]>(resolve => {
-    const start = pageNumber * pageSize
-    const end = start + pageSize
-    resolve(sortedUninstalledList.value.slice(start, end + 1))
-  })
-}
-
 // 加载时获取数据
 onBeforeMount(async () => {
   await refreshData()
@@ -302,28 +283,18 @@ onBeforeMount(async () => {
 
 <template>
   <LoadingBanner v-if="!isRefreshed" class="mt-12" />
-  <Grid
-    :length="dataList.length"
-    :pageSize="20"
-    :pageProvider="pluginsPageProvider"
-    class="grid gap-4 grid-plugin-card"
-  >
-    <template v-slot:probe>
-      <PluginAppCard />
-    </template>
-    <template v-slot:default="{ item, style, index }">
-      <PluginCard
-        :style="style"
-        :key="index"
-        :count="PluginStatistics[item.id || '0']"
-        :plugin="item"
-        :action="pluginActions[item.id || '0']"
-        @remove="refreshData"
-        @save="refreshData"
-        @action-done="pluginActions[item.id || '0'] = false"
-      />
-    </template>
-  </Grid>
+  <div v-if="dataList.length > 0" class="grid gap-4 grid-plugin-card">
+    <PluginCard
+      v-for="data in dataList"
+      :key="`${data.id}_v${data.plugin_version}`"
+      :count="PluginStatistics[data.id || '0']"
+      :plugin="data"
+      :action="pluginActions[data.id || '0']"
+      @remove="refreshData"
+      @save="refreshData"
+      @action-done="pluginActions[data.id || '0'] = false"
+    />
+  </div>
   <NoDataFound
     v-if="dataList.length === 0 && isRefreshed"
     error-code="404"
@@ -405,26 +376,15 @@ onBeforeMount(async () => {
             </VCol>
           </VRow>
         </div>
-        <Grid
-          v-if="isAppMarketLoaded"
-          :length="sortedUninstalledList.length"
-          :pageSize="20"
-          :pageProvider="pluginsMarketPageProvider"
-          class="grid gap-4 grid-plugin-card"
-        >
-          <template v-slot:probe>
-            <PluginAppCard />
-          </template>
-          <template v-slot:default="{ item, style, index }">
-            <PluginAppCard
-              :style="style"
-              :key="index"
-              :plugin="item"
-              :count="PluginStatistics[item.id || '0']"
-              @install="pluginInstalled"
-            />
-          </template>
-        </Grid>
+        <div v-if="isAppMarketLoaded" class="grid gap-4 grid-plugin-card">
+          <PluginAppCard
+            v-for="data in sortedUninstalledList"
+            :key="`${data.id}_v${data.plugin_version}`"
+            :plugin="data"
+            :count="PluginStatistics[data.id || '0']"
+            @install="pluginInstalled"
+          />
+        </div>
         <NoDataFound
           v-if="uninstalledList.length === 0 && isAppMarketLoaded"
           error-code="404"

src/views/site/SiteCardListView.vue

@@ -24,8 +24,7 @@ async function fetchData() {
     dataList.value = await api.get('site/')
     isRefreshed.value = true
     defer = useDefer(dataList.value.length)
-  }
-  catch (error) {
+  } catch (error) {
     console.error(error)
   }
 }
@@ -35,25 +34,10 @@ onBeforeMount(fetchData)
 </script>
 
 <template>
-  <LoadingBanner
-    v-if="!isRefreshed"
-    class="mt-12"
-  />
-  <div
-    v-if="dataList.length > 0"
-    class="grid gap-3 grid-site-card"
-  >
-    <div
-      v-for="(data, index) in dataList"
-      :key="index"
-    >
-      <SiteCard
-        v-if="defer(index)"
-        :key="data.id"
-        :site="data"
-        @remove="fetchData"
-        @update="fetchData"
-      />
+  <LoadingBanner v-if="!isRefreshed" class="mt-12" />
+  <div v-if="dataList.length > 0" class="grid gap-3 grid-site-card">
+    <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
@@ -63,21 +47,18 @@ onBeforeMount(fetchData)
     error-description="已添加并支持的站点将会在这里显示。"
   />
   <!-- 新增站点按钮 -->
-  <VFab
-    icon="mdi-plus"
-    location="bottom end"
-    size="x-large"
-    fixed
-    app
-    appear
-    @click="siteAddDialog = true"
-  />
+  <VFab icon="mdi-plus" location="bottom end" size="x-large" fixed app appear @click="siteAddDialog = true" />
   <!-- 新增站点弹窗 -->
   <SiteAddEditDialog
     v-if="siteAddDialog"
     v-model="siteAddDialog"
     oper="add"
-    @save="siteAddDialog = false; fetchData()"
+    @save="
+      () => {
+        siteAddDialog = false
+        fetchData()
+      }
+    "
     @close="siteAddDialog = false"
   />
 </template>