update vuetify => 3.5.7

2026-05-10 17:42:50 +08:00 · 2024-04-02 11:37:25 +08:00
parent 1488017bf2
commit fd1ee398c4
9 changed files with 145 additions and 125 deletions
--- a/package.json
+++ b/package.json
@@ -53,7 +53,7 @@
    "vue3-ace-editor": "^2.2.4",
    "vue3-apexcharts": "^1.4.1",
    "vue3-perfect-scrollbar": "^1.6.0",
-    "vuetify": "3.3.5",
+    "vuetify": "3.5.7",
    "vuetify-use-dialog": "^0.6.0",
    "vuex": "^4.1.0",
    "vuex-persistedstate": "^4.1.0",
@@ -110,4 +110,4 @@
  "resolutions": {
    "postcss": "8"
  }
-}
+}
--- a/src/components/cards/MediaCard.vue
+++ b/src/components/cards/MediaCard.vue
@@ -438,6 +438,7 @@ function getYear(airDate: string) {
          'transition transform-cpu duration-300 scale-105 shadow-lg': hover.isHovering,
          'ring-1': isImageLoaded,
        }"
+        @click.stop="goMediaDetail"
      >
        <VImg
          aspect-ratio="2/3"
@@ -453,55 +454,54 @@ function getYear(airDate: string) {
              <VSkeletonLoader class="object-cover aspect-w-2 aspect-h-3" />
            </div>
          </template>
-          <!-- 类型角标 -->
-          <VChip
-            v-show="isImageLoaded"
-            variant="elevated"
-            size="small"
-            :class="getChipColor(props.media?.type || '')"
-            class="absolute left-2 top-2 bg-opacity-80 shadow-md text-white font-bold"
-          >
-            {{ props.media?.type }}
-          </VChip>
-          <!-- 本地存在标识 -->
-          <ExistIcon v-if="isExists" />
-          <!-- 评分角标 -->
-          <VChip
-            v-if="isImageLoaded && props.media?.vote_average && !isExists"
-            variant="elevated"
-            size="small"
-            :class="getChipColor('rating')"
-            class="absolute right-2 top-2 bg-opacity-80 shadow-md text-white font-bold"
-          >
-            {{ props.media?.vote_average }}
-          </VChip>
-          <!-- 详情 -->
-          <VCardText
-            v-show="hover.isHovering || imageLoadError"
-            class="w-full flex flex-col flex-wrap justify-end align-left text-white absolute bottom-0 cursor-pointer pa-2"
-            @click.stop="goMediaDetail"
-          >
-            <span class="font-bold">{{ props.media?.year }}</span>
-            <h1 class="mb-1 text-white font-extrabold text-xl line-clamp-2 overflow-hidden text-ellipsis ...">
-              {{ props.media?.title }}
-            </h1>
-            <p class="leading-4 line-clamp-4 overflow-hidden text-ellipsis ...">
-              {{ props.media?.overview }}
-            </p>
-            <div class="flex align-center justify-between">
-              <IconBtn
-                icon="mdi-magnify"
-                color="white"
-                @click.stop="handleSearch"
-              />
-              <IconBtn
-                icon="mdi-heart"
-                :color="isSubscribed ? 'error' : 'white'"
-                @click.stop="handleSubscribe"
-              />
-            </div>
-          </VCardText>
        </VImg>
+        <!-- 类型角标 -->
+        <VChip
+          v-show="isImageLoaded"
+          variant="elevated"
+          size="small"
+          :class="getChipColor(props.media?.type || '')"
+          class="absolute left-2 top-2 bg-opacity-80 shadow-md text-white font-bold"
+        >
+          {{ props.media?.type }}
+        </VChip>
+        <!-- 本地存在标识 -->
+        <ExistIcon v-if="isExists" />
+        <!-- 评分角标 -->
+        <VChip
+          v-if="isImageLoaded && props.media?.vote_average && !isExists"
+          variant="elevated"
+          size="small"
+          :class="getChipColor('rating')"
+          class="absolute right-2 top-2 bg-opacity-80 shadow-md text-white font-bold"
+        >
+          {{ props.media?.vote_average }}
+        </VChip>
+        <!-- 详情 -->
+        <VCardText
+          v-show="hover.isHovering || imageLoadError"
+          class="w-full flex flex-col flex-wrap justify-end align-left text-white absolute bottom-0 cursor-pointer pa-2"
+        >
+          <span class="font-bold">{{ props.media?.year }}</span>
+          <h1 class="mb-1 text-white font-extrabold text-xl line-clamp-2 overflow-hidden text-ellipsis ...">
+            {{ props.media?.title }}
+          </h1>
+          <p class="leading-4 line-clamp-4 overflow-hidden text-ellipsis ...">
+            {{ props.media?.overview }}
+          </p>
+          <div class="flex align-center justify-between">
+            <IconBtn
+              icon="mdi-magnify"
+              color="white"
+              @click.stop="handleSearch"
+            />
+            <IconBtn
+              icon="mdi-heart"
+              :color="isSubscribed ? 'error' : 'white'"
+              @click.stop="handleSubscribe"
+            />
+          </div>
+        </VCardText>
      </VCard>
    </template>
  </VHover>
--- a/src/pages/dashboard.vue
+++ b/src/pages/dashboard.vue
@@ -54,6 +54,16 @@ function setDashboardConfig() {
 </script>

 <template>
+  <!-- 底部操作按钮 -->
+  <VFab
+    icon="mdi-view-dashboard-edit"
+    location="bottom end"
+    size="x-large"
+    fixed
+    app
+    appear
+    @click="dialog = true"
+  />
  <VRow class="match-height">
    <VCol
      v-if="config.storage"
@@ -132,10 +142,6 @@ function setDashboardConfig() {
      <MediaServerLatest />
    </VCol>
  </VRow>
-  <!-- 底部操作按钮 -->
-  <span class="fixed right-5 bottom-5">
-    <VBtn icon="mdi-view-dashboard-edit" class="me-2" color="primary" size="x-large" @click="dialog = true" />
-  </span>
  <!-- 弹窗，根据配置生成选项 -->
  <VDialog
    v-model="dialog"
--- a/src/pages/resource.vue
+++ b/src/pages/resource.vue
@@ -127,20 +127,24 @@ onMounted(() => {
    />
  </div>
  <!-- 视图切换 -->
-  <span v-if="dataList.length > 0" class="fixed right-5 bottom-5">
-    <VBtn
-      v-if="viewType === 'list'"
-      size="x-large"
-      icon="mdi-view-grid"
-      color="primary"
-      @click="setViewType('card')"
-    />
-    <VBtn
-      v-else
-      size="x-large"
-      icon="mdi-view-list"
-      color="primary"
-      @click="setViewType('list')"
-    />
-  </span>
+  <VFab
+    v-if="viewType === 'list'"
+    icon="mdi-view-grid"
+    location="bottom end"
+    size="x-large"
+    fixed
+    app
+    appear
+    @click="setViewType('card')"
+  />
+  <VFab
+    v-else
+    icon="mdi-view-list"
+    location="bottom end"
+    size="x-large"
+    fixed
+    app
+    appear
+    @click="setViewType('list')"
+  />
 </template>
--- a/src/views/plugin/PluginCardListView.vue
+++ b/src/views/plugin/PluginCardListView.vue
@@ -1,5 +1,4 @@
 <script lang="ts" setup>
-import { useDefer } from '@/@core/utils/dom'
 import api from '@/api'
 import type { Plugin } from '@/api/types'
 import NoDataFound from '@/components/NoDataFound.vue'
@@ -24,9 +23,6 @@ const PluginAppDialog = ref(false)
 // 插件安装统计
 const PluginStatistics = ref<{ [key: string]: number }>({})

-// 延迟加载
-let defer = (_: number) => true
-
 // 关闭插件市场窗口
 function pluginDialogClose() {
  PluginAppDialog.value = false
@@ -98,7 +94,6 @@ function refreshData() {
 // 对uninstalledList进行排序，按PluginStatistics倒序
 const sortedUninstalledList = computed(() => {
  const list = uninstalledList.value.filter(item => !item.has_update)
-  defer = useDefer(list.length)
  if (PluginStatistics.value.length === 0)
    return list
  return list.sort((a, b) => {
@@ -155,11 +150,14 @@ onBeforeMount(() => {
  >
    <!-- Dialog Activator -->
    <template #activator="{ props }">
-      <VBtn
-        icon="mdi-store-plus"
+      <VFab
        v-bind="props"
+        icon="mdi-store-plus"
+        location="bottom end"
        size="x-large"
-        class="fixed right-5 bottom-5"
+        fixed
+        app
+        appear
      />
    </template>

@@ -198,18 +196,13 @@ onBeforeMount(() => {
          />
        </div>
        <div v-if="isAppMarketLoaded" class="grid gap-4 grid-plugin-card">
-          <div
-            v-for="(data, index) in sortedUninstalledList"
-            :key="index"
-          >
-            <PluginAppCard
-              v-if="defer(index)"
-              :key="`${data.id}_v${data.plugin_version}`"
-              :plugin="data"
-              :count="PluginStatistics[data.id || '0']"
-              @install="pluginInstalled"
-            />
-          </div>
+          <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"
--- a/src/views/reorganize/TransferHistoryView.vue
+++ b/src/views/reorganize/TransferHistoryView.vue
@@ -307,6 +307,30 @@ const dropdownItems = ref([
 </script>

 <template>
+  <!-- 底部操作按钮 -->
+  <VFab
+    v-if="selected.length > 0"
+    icon="mdi-trash-can-outline"
+    color="error"
+    location="bottom end"
+    size="x-large"
+    fixed
+    app
+    appear
+    @click="removeHistoryBatch"
+  />
+  <VFab
+    v-if="selected.length > 0"
+    class="mb-2"
+    icon="mdi-redo-variant"
+    location="bottom end"
+    size="x-large"
+    fixed
+    app
+    appear
+    @click="retransferBatch"
+  />
+
  <VCard class="pb-5">
    <VCardItem>
      <VCardTitle>
@@ -354,29 +378,29 @@ const dropdownItems = ref([
      <template #item.title="{ item }">
        <div class="d-flex align-center">
          <VAvatar>
-            <VIcon :icon="getIcon(item.value.type || '')" />
+            <VIcon :icon="getIcon(item.type || '')" />
          </VAvatar>
          <div class="d-flex flex-column ms-1">
            <span class="d-block text-high-emphasis">
-              {{ item.value.title }} {{ item.value.seasons }}{{ item.value.episodes }}
+              {{ item?.title }} {{ item?.seasons }}{{ item?.episodes }}
            </span>
-            <small>{{ item.value.category }}</small>
+            <small>{{ item?.category }}</small>
          </div>
        </div>
      </template>
      <template #item.src="{ item }">
-        <small>{{ item.value.src }} <br>=> {{ item.value.dest }}</small>
+        <small>{{ item?.src }} <br>=> {{ item?.dest }}</small>
      </template>
      <template #item.mode="{ item }">
        <VChip variant="outlined" color="primary" size="small">
-          {{ TransferDict[item.value.mode] }}
+          {{ TransferDict[item?.mode || ''] }}
        </VChip>
      </template>
      <template #item.status="{ item }">
-        <VChip v-if="item.value.status" color="success" size="small">
+        <VChip v-if="item?.status" color="success" size="small">
          成功
        </VChip>
-        <v-tooltip v-else :text="item.value.errmsg">
+        <v-tooltip v-else :text="item?.errmsg">
          <template #activator="{ props }">
            <VChip v-bind="props" color="error" size="small">
              失败
@@ -385,7 +409,7 @@ const dropdownItems = ref([
        </v-tooltip>
      </template>
      <template #item.date="{ item }">
-        <small>{{ item.value.date }}</small>
+        <small>{{ item?.date }}</small>
      </template>
      <template #item.actions="{ item }">
        <IconBtn>
@@ -397,7 +421,7 @@ const dropdownItems = ref([
                :key="i"
                variant="plain"
                :base-color="menu.props.color"
-                @click="menu.props.click(item.value)"
+                @click="menu.props.click(item)"
              >
                <template #prepend>
                  <VIcon :icon="menu.props.prependIcon" />
@@ -413,19 +437,6 @@ const dropdownItems = ref([
      </template>
    </VDataTableServer>
  </VCard>
-  <!-- 底部操作按钮 -->
-  <span v-if="selected.length > 0" class="fixed right-5 bottom-5">
-    <VTooltip text="批量重新整理">
-      <template #activator="{ props }">
-        <VBtn v-bind="props" icon="mdi-redo-variant" class="me-2" color="primary" size="x-large" @click="retransferBatch" />
-      </template>
-    </VTooltip>
-    <VTooltip text="批量删除">
-      <template #activator="{ props }">
-        <VBtn v-bind="props" icon="mdi-trash-can-outline" color="error" size="x-large" @click="removeHistoryBatch" />
-      </template>
-    </VTooltip>
-  </span>
  <!-- 底部弹窗 -->
  <VBottomSheet v-model="deleteConfirmDialog" inset>
    <VCard class="text-center rounded-t">
--- a/src/views/site/SiteCardListView.vue
+++ b/src/views/site/SiteCardListView.vue
@@ -70,13 +70,16 @@ onBeforeMount(fetchData)
    error-description="已添加并支持的站点将会在这里显示。"
  />
  <!-- 新增站点按钮 -->
-  <VBtn
+  <VFab
    icon="mdi-plus"
+    location="bottom end"
    size="x-large"
-    class="fixed right-5 bottom-5"
-    oper="add"
+    fixed
+    app
+    appear
    @click="siteAddDialog = true"
  />
+  <!-- 新增站点弹窗 -->
  <SiteAddEditForm
    v-if="siteAddDialog"
    v-model="siteAddDialog"
--- a/src/views/subscribe/SubscribeListView.vue
+++ b/src/views/subscribe/SubscribeListView.vue
@@ -93,12 +93,15 @@ const filteredDataList = computed(() => {
    />
  </PullRefresh>
  <!-- 底部操作按钮 -->
-  <span class="fixed right-5 bottom-5">
-    <VTooltip text="设置默认订阅规则">
-      <template #activator="{ props }">
-        <VBtn v-bind="props" icon="mdi-file-document-edit" class="me-2" color="primary" size="x-large" @click="subscribeEditDialog = true" />
-      </template>
-    </vtooltip></span>
+  <VFab
+    icon="mdi-file-document-edit"
+    location="bottom end"
+    size="x-large"
+    fixed
+    app
+    appear
+    @click="subscribeEditDialog = true"
+  />
  <!-- 订阅编辑弹窗 -->
  <SubscribeEditForm
    v-model="subscribeEditDialog"
--- a/yarn.lock
+++ b/yarn.lock
@@ -7966,10 +7966,10 @@ vuetify-use-dialog@^0.6.0:
  dependencies:
    nanoid "^4.0.2"

-vuetify@3.3.5:
-  version "3.3.5"
-  resolved "https://registry.yarnpkg.com/vuetify/-/vuetify-3.3.5.tgz#b927214d106122240e79f4d65e49bfec0e86e189"
-  integrity sha512-vkfPgPmKfSJa+jq6Ov+CTg7L1t2jLPKa7Slef9OrVHcLqg+gLuIj0z4PJE6E9HjFTUbgZShShOGxps52REJRIA==
+vuetify@3.5.7:
+  version "3.5.7"
+  resolved "https://registry.yarnpkg.com/vuetify/-/vuetify-3.5.7.tgz#9dfa027a582aa7d2211c8019c33ef7cadd66c5c0"
+  integrity sha512-BFj/puY8odRwY50pRfE1gpawnxreY8PtPb/tDw3oumxSLXhoXw8q6YLA6QUvqZrYEzcYpojxZIYhNWUky2KN1w==

 vuex-persistedstate@^4.1.0:
  version "4.1.0"