fix(SiteCard): 修改站点卡片的点击事件和菜单项文本以优化用户体验

- 增加防抖，解决输入打断

auto-imports.d.ts

@@ -3,6 +3,7 @@
 // @ts-nocheck
 // noinspection JSUnusedGlobalSymbols
 // Generated by unplugin-auto-import
+// biome-ignore lint: disable
 export {}
 declare global {
   const EffectScope: typeof import('vue')['EffectScope']
@@ -66,6 +67,7 @@ declare global {
   const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
   const onClickOutside: typeof import('@vueuse/core')['onClickOutside']
   const onDeactivated: typeof import('vue')['onDeactivated']
+  const onElementRemoval: typeof import('@vueuse/core')['onElementRemoval']
   const onErrorCaptured: typeof import('vue')['onErrorCaptured']
   const onKeyStroke: typeof import('@vueuse/core')['onKeyStroke']
   const onLongPress: typeof import('@vueuse/core')['onLongPress']
@@ -77,6 +79,7 @@ declare global {
   const onStartTyping: typeof import('@vueuse/core')['onStartTyping']
   const onUnmounted: typeof import('vue')['onUnmounted']
   const onUpdated: typeof import('vue')['onUpdated']
+  const onWatcherCleanup: typeof import('vue')['onWatcherCleanup']
   const pausableWatch: typeof import('@vueuse/core')['pausableWatch']
   const provide: typeof import('vue')['provide']
   const provideLocal: typeof import('@vueuse/core')['provideLocal']
@@ -190,6 +193,7 @@ declare global {
   const useFullscreen: typeof import('@vueuse/core')['useFullscreen']
   const useGamepad: typeof import('@vueuse/core')['useGamepad']
   const useGeolocation: typeof import('@vueuse/core')['useGeolocation']
+  const useId: typeof import('vue')['useId']
   const useIdle: typeof import('@vueuse/core')['useIdle']
   const useImage: typeof import('@vueuse/core')['useImage']
   const useInfiniteScroll: typeof import('@vueuse/core')['useInfiniteScroll']
@@ -209,6 +213,7 @@ declare global {
   const useMemoize: typeof import('@vueuse/core')['useMemoize']
   const useMemory: typeof import('@vueuse/core')['useMemory']
   const useMin: typeof import('@vueuse/math')['useMin']
+  const useModel: typeof import('vue')['useModel']
   const useMounted: typeof import('@vueuse/core')['useMounted']
   const useMouse: typeof import('@vueuse/core')['useMouse']
   const useMouseInElement: typeof import('@vueuse/core')['useMouseInElement']
@@ -234,6 +239,7 @@ declare global {
   const usePreferredDark: typeof import('@vueuse/core')['usePreferredDark']
   const usePreferredLanguages: typeof import('@vueuse/core')['usePreferredLanguages']
   const usePreferredReducedMotion: typeof import('@vueuse/core')['usePreferredReducedMotion']
+  const usePreferredReducedTransparency: typeof import('@vueuse/core')['usePreferredReducedTransparency']
   const usePrevious: typeof import('@vueuse/core')['usePrevious']
   const useProjection: typeof import('@vueuse/math')['useProjection']
   const useRafFn: typeof import('@vueuse/core')['useRafFn']
@@ -242,6 +248,7 @@ declare global {
   const useRound: typeof import('@vueuse/math')['useRound']
   const useRoute: typeof import('vue-router')['useRoute']
   const useRouter: typeof import('vue-router')['useRouter']
+  const useSSRWidth: typeof import('@vueuse/core')['useSSRWidth']
   const useScreenOrientation: typeof import('@vueuse/core')['useScreenOrientation']
   const useScreenSafeArea: typeof import('@vueuse/core')['useScreenSafeArea']
   const useScriptTag: typeof import('@vueuse/core')['useScriptTag']
@@ -261,6 +268,7 @@ declare global {
   const useSum: typeof import('@vueuse/math')['useSum']
   const useSupported: typeof import('@vueuse/core')['useSupported']
   const useSwipe: typeof import('@vueuse/core')['useSwipe']
+  const useTemplateRef: typeof import('vue')['useTemplateRef']
   const useTemplateRefsList: typeof import('@vueuse/core')['useTemplateRefsList']
   const useTextDirection: typeof import('@vueuse/core')['useTextDirection']
   const useTextSelection: typeof import('@vueuse/core')['useTextSelection']
@@ -313,9 +321,10 @@ declare global {
 // for type re-export
 declare global {
   // @ts-ignore
-  export type { Component, ComponentPublicInstance, ComputedRef, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue'
+  export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
   import('vue')
 }
+
 // for vue template auto import
 import { UnwrapRef } from 'vue'
 declare module 'vue' {
@@ -382,6 +391,7 @@ declare module 'vue' {
     readonly onBeforeUpdate: UnwrapRef<typeof import('vue')['onBeforeUpdate']>
     readonly onClickOutside: UnwrapRef<typeof import('@vueuse/core')['onClickOutside']>
     readonly onDeactivated: UnwrapRef<typeof import('vue')['onDeactivated']>
+    readonly onElementRemoval: UnwrapRef<typeof import('@vueuse/core')['onElementRemoval']>
     readonly onErrorCaptured: UnwrapRef<typeof import('vue')['onErrorCaptured']>
     readonly onKeyStroke: UnwrapRef<typeof import('@vueuse/core')['onKeyStroke']>
     readonly onLongPress: UnwrapRef<typeof import('@vueuse/core')['onLongPress']>
@@ -393,6 +403,7 @@ declare module 'vue' {
     readonly onStartTyping: UnwrapRef<typeof import('@vueuse/core')['onStartTyping']>
     readonly onUnmounted: UnwrapRef<typeof import('vue')['onUnmounted']>
     readonly onUpdated: UnwrapRef<typeof import('vue')['onUpdated']>
+    readonly onWatcherCleanup: UnwrapRef<typeof import('vue')['onWatcherCleanup']>
     readonly pausableWatch: UnwrapRef<typeof import('@vueuse/core')['pausableWatch']>
     readonly provide: UnwrapRef<typeof import('vue')['provide']>
     readonly provideLocal: UnwrapRef<typeof import('@vueuse/core')['provideLocal']>
@@ -506,6 +517,7 @@ declare module 'vue' {
     readonly useFullscreen: UnwrapRef<typeof import('@vueuse/core')['useFullscreen']>
     readonly useGamepad: UnwrapRef<typeof import('@vueuse/core')['useGamepad']>
     readonly useGeolocation: UnwrapRef<typeof import('@vueuse/core')['useGeolocation']>
+    readonly useId: UnwrapRef<typeof import('vue')['useId']>
     readonly useIdle: UnwrapRef<typeof import('@vueuse/core')['useIdle']>
     readonly useImage: UnwrapRef<typeof import('@vueuse/core')['useImage']>
     readonly useInfiniteScroll: UnwrapRef<typeof import('@vueuse/core')['useInfiniteScroll']>
@@ -525,6 +537,7 @@ declare module 'vue' {
     readonly useMemoize: UnwrapRef<typeof import('@vueuse/core')['useMemoize']>
     readonly useMemory: UnwrapRef<typeof import('@vueuse/core')['useMemory']>
     readonly useMin: UnwrapRef<typeof import('@vueuse/math')['useMin']>
+    readonly useModel: UnwrapRef<typeof import('vue')['useModel']>
     readonly useMounted: UnwrapRef<typeof import('@vueuse/core')['useMounted']>
     readonly useMouse: UnwrapRef<typeof import('@vueuse/core')['useMouse']>
     readonly useMouseInElement: UnwrapRef<typeof import('@vueuse/core')['useMouseInElement']>
@@ -550,6 +563,7 @@ declare module 'vue' {
     readonly usePreferredDark: UnwrapRef<typeof import('@vueuse/core')['usePreferredDark']>
     readonly usePreferredLanguages: UnwrapRef<typeof import('@vueuse/core')['usePreferredLanguages']>
     readonly usePreferredReducedMotion: UnwrapRef<typeof import('@vueuse/core')['usePreferredReducedMotion']>
+    readonly usePreferredReducedTransparency: UnwrapRef<typeof import('@vueuse/core')['usePreferredReducedTransparency']>
     readonly usePrevious: UnwrapRef<typeof import('@vueuse/core')['usePrevious']>
     readonly useProjection: UnwrapRef<typeof import('@vueuse/math')['useProjection']>
     readonly useRafFn: UnwrapRef<typeof import('@vueuse/core')['useRafFn']>
@@ -558,6 +572,7 @@ declare module 'vue' {
     readonly useRound: UnwrapRef<typeof import('@vueuse/math')['useRound']>
     readonly useRoute: UnwrapRef<typeof import('vue-router')['useRoute']>
     readonly useRouter: UnwrapRef<typeof import('vue-router')['useRouter']>
+    readonly useSSRWidth: UnwrapRef<typeof import('@vueuse/core')['useSSRWidth']>
     readonly useScreenOrientation: UnwrapRef<typeof import('@vueuse/core')['useScreenOrientation']>
     readonly useScreenSafeArea: UnwrapRef<typeof import('@vueuse/core')['useScreenSafeArea']>
     readonly useScriptTag: UnwrapRef<typeof import('@vueuse/core')['useScriptTag']>
@@ -577,6 +592,7 @@ declare module 'vue' {
     readonly useSum: UnwrapRef<typeof import('@vueuse/math')['useSum']>
     readonly useSupported: UnwrapRef<typeof import('@vueuse/core')['useSupported']>
     readonly useSwipe: UnwrapRef<typeof import('@vueuse/core')['useSwipe']>
+    readonly useTemplateRef: UnwrapRef<typeof import('vue')['useTemplateRef']>
     readonly useTemplateRefsList: UnwrapRef<typeof import('@vueuse/core')['useTemplateRefsList']>
     readonly useTextDirection: UnwrapRef<typeof import('@vueuse/core')['useTextDirection']>
     readonly useTextSelection: UnwrapRef<typeof import('@vueuse/core')['useTextSelection']>
@@ -626,313 +642,4 @@ declare module 'vue' {
     readonly watchWithFilter: UnwrapRef<typeof import('@vueuse/core')['watchWithFilter']>
     readonly whenever: UnwrapRef<typeof import('@vueuse/core')['whenever']>
   }
-}
-declare module '@vue/runtime-core' {
-  interface GlobalComponents {}
-  interface ComponentCustomProperties {
-    readonly EffectScope: UnwrapRef<typeof import('vue')['EffectScope']>
-    readonly asyncComputed: UnwrapRef<typeof import('@vueuse/core')['asyncComputed']>
-    readonly autoResetRef: UnwrapRef<typeof import('@vueuse/core')['autoResetRef']>
-    readonly computed: UnwrapRef<typeof import('vue')['computed']>
-    readonly computedAsync: UnwrapRef<typeof import('@vueuse/core')['computedAsync']>
-    readonly computedEager: UnwrapRef<typeof import('@vueuse/core')['computedEager']>
-    readonly computedInject: UnwrapRef<typeof import('@vueuse/core')['computedInject']>
-    readonly computedWithControl: UnwrapRef<typeof import('@vueuse/core')['computedWithControl']>
-    readonly controlledComputed: UnwrapRef<typeof import('@vueuse/core')['controlledComputed']>
-    readonly controlledRef: UnwrapRef<typeof import('@vueuse/core')['controlledRef']>
-    readonly createApp: UnwrapRef<typeof import('vue')['createApp']>
-    readonly createEventHook: UnwrapRef<typeof import('@vueuse/core')['createEventHook']>
-    readonly createGenericProjection: UnwrapRef<typeof import('@vueuse/math')['createGenericProjection']>
-    readonly createGlobalState: UnwrapRef<typeof import('@vueuse/core')['createGlobalState']>
-    readonly createInjectionState: UnwrapRef<typeof import('@vueuse/core')['createInjectionState']>
-    readonly createLogger: UnwrapRef<typeof import('vuex')['createLogger']>
-    readonly createNamespacedHelpers: UnwrapRef<typeof import('vuex')['createNamespacedHelpers']>
-    readonly createProjection: UnwrapRef<typeof import('@vueuse/math')['createProjection']>
-    readonly createReactiveFn: UnwrapRef<typeof import('@vueuse/core')['createReactiveFn']>
-    readonly createReusableTemplate: UnwrapRef<typeof import('@vueuse/core')['createReusableTemplate']>
-    readonly createSharedComposable: UnwrapRef<typeof import('@vueuse/core')['createSharedComposable']>
-    readonly createStore: UnwrapRef<typeof import('vuex')['createStore']>
-    readonly createTemplatePromise: UnwrapRef<typeof import('@vueuse/core')['createTemplatePromise']>
-    readonly createUnrefFn: UnwrapRef<typeof import('@vueuse/core')['createUnrefFn']>
-    readonly customRef: UnwrapRef<typeof import('vue')['customRef']>
-    readonly debouncedRef: UnwrapRef<typeof import('@vueuse/core')['debouncedRef']>
-    readonly debouncedWatch: UnwrapRef<typeof import('@vueuse/core')['debouncedWatch']>
-    readonly defineAsyncComponent: UnwrapRef<typeof import('vue')['defineAsyncComponent']>
-    readonly defineComponent: UnwrapRef<typeof import('vue')['defineComponent']>
-    readonly eagerComputed: UnwrapRef<typeof import('@vueuse/core')['eagerComputed']>
-    readonly effectScope: UnwrapRef<typeof import('vue')['effectScope']>
-    readonly extendRef: UnwrapRef<typeof import('@vueuse/core')['extendRef']>
-    readonly getCurrentInstance: UnwrapRef<typeof import('vue')['getCurrentInstance']>
-    readonly getCurrentScope: UnwrapRef<typeof import('vue')['getCurrentScope']>
-    readonly h: UnwrapRef<typeof import('vue')['h']>
-    readonly ignorableWatch: UnwrapRef<typeof import('@vueuse/core')['ignorableWatch']>
-    readonly inject: UnwrapRef<typeof import('vue')['inject']>
-    readonly injectLocal: UnwrapRef<typeof import('@vueuse/core')['injectLocal']>
-    readonly isDefined: UnwrapRef<typeof import('@vueuse/core')['isDefined']>
-    readonly isProxy: UnwrapRef<typeof import('vue')['isProxy']>
-    readonly isReactive: UnwrapRef<typeof import('vue')['isReactive']>
-    readonly isReadonly: UnwrapRef<typeof import('vue')['isReadonly']>
-    readonly isRef: UnwrapRef<typeof import('vue')['isRef']>
-    readonly logicAnd: UnwrapRef<typeof import('@vueuse/math')['logicAnd']>
-    readonly logicNot: UnwrapRef<typeof import('@vueuse/math')['logicNot']>
-    readonly logicOr: UnwrapRef<typeof import('@vueuse/math')['logicOr']>
-    readonly makeDestructurable: UnwrapRef<typeof import('@vueuse/core')['makeDestructurable']>
-    readonly mapActions: UnwrapRef<typeof import('vuex')['mapActions']>
-    readonly mapGetters: UnwrapRef<typeof import('vuex')['mapGetters']>
-    readonly mapMutations: UnwrapRef<typeof import('vuex')['mapMutations']>
-    readonly mapState: UnwrapRef<typeof import('vuex')['mapState']>
-    readonly markRaw: UnwrapRef<typeof import('vue')['markRaw']>
-    readonly nextTick: UnwrapRef<typeof import('vue')['nextTick']>
-    readonly onActivated: UnwrapRef<typeof import('vue')['onActivated']>
-    readonly onBeforeMount: UnwrapRef<typeof import('vue')['onBeforeMount']>
-    readonly onBeforeRouteLeave: UnwrapRef<typeof import('vue-router')['onBeforeRouteLeave']>
-    readonly onBeforeRouteUpdate: UnwrapRef<typeof import('vue-router')['onBeforeRouteUpdate']>
-    readonly onBeforeUnmount: UnwrapRef<typeof import('vue')['onBeforeUnmount']>
-    readonly onBeforeUpdate: UnwrapRef<typeof import('vue')['onBeforeUpdate']>
-    readonly onClickOutside: UnwrapRef<typeof import('@vueuse/core')['onClickOutside']>
-    readonly onDeactivated: UnwrapRef<typeof import('vue')['onDeactivated']>
-    readonly onErrorCaptured: UnwrapRef<typeof import('vue')['onErrorCaptured']>
-    readonly onKeyStroke: UnwrapRef<typeof import('@vueuse/core')['onKeyStroke']>
-    readonly onLongPress: UnwrapRef<typeof import('@vueuse/core')['onLongPress']>
-    readonly onMounted: UnwrapRef<typeof import('vue')['onMounted']>
-    readonly onRenderTracked: UnwrapRef<typeof import('vue')['onRenderTracked']>
-    readonly onRenderTriggered: UnwrapRef<typeof import('vue')['onRenderTriggered']>
-    readonly onScopeDispose: UnwrapRef<typeof import('vue')['onScopeDispose']>
-    readonly onServerPrefetch: UnwrapRef<typeof import('vue')['onServerPrefetch']>
-    readonly onStartTyping: UnwrapRef<typeof import('@vueuse/core')['onStartTyping']>
-    readonly onUnmounted: UnwrapRef<typeof import('vue')['onUnmounted']>
-    readonly onUpdated: UnwrapRef<typeof import('vue')['onUpdated']>
-    readonly pausableWatch: UnwrapRef<typeof import('@vueuse/core')['pausableWatch']>
-    readonly provide: UnwrapRef<typeof import('vue')['provide']>
-    readonly provideLocal: UnwrapRef<typeof import('@vueuse/core')['provideLocal']>
-    readonly reactify: UnwrapRef<typeof import('@vueuse/core')['reactify']>
-    readonly reactifyObject: UnwrapRef<typeof import('@vueuse/core')['reactifyObject']>
-    readonly reactive: UnwrapRef<typeof import('vue')['reactive']>
-    readonly reactiveComputed: UnwrapRef<typeof import('@vueuse/core')['reactiveComputed']>
-    readonly reactiveOmit: UnwrapRef<typeof import('@vueuse/core')['reactiveOmit']>
-    readonly reactivePick: UnwrapRef<typeof import('@vueuse/core')['reactivePick']>
-    readonly readonly: UnwrapRef<typeof import('vue')['readonly']>
-    readonly ref: UnwrapRef<typeof import('vue')['ref']>
-    readonly refAutoReset: UnwrapRef<typeof import('@vueuse/core')['refAutoReset']>
-    readonly refDebounced: UnwrapRef<typeof import('@vueuse/core')['refDebounced']>
-    readonly refDefault: UnwrapRef<typeof import('@vueuse/core')['refDefault']>
-    readonly refThrottled: UnwrapRef<typeof import('@vueuse/core')['refThrottled']>
-    readonly refWithControl: UnwrapRef<typeof import('@vueuse/core')['refWithControl']>
-    readonly resolveComponent: UnwrapRef<typeof import('vue')['resolveComponent']>
-    readonly resolveRef: UnwrapRef<typeof import('@vueuse/core')['resolveRef']>
-    readonly resolveUnref: UnwrapRef<typeof import('@vueuse/core')['resolveUnref']>
-    readonly shallowReactive: UnwrapRef<typeof import('vue')['shallowReactive']>
-    readonly shallowReadonly: UnwrapRef<typeof import('vue')['shallowReadonly']>
-    readonly shallowRef: UnwrapRef<typeof import('vue')['shallowRef']>
-    readonly syncRef: UnwrapRef<typeof import('@vueuse/core')['syncRef']>
-    readonly syncRefs: UnwrapRef<typeof import('@vueuse/core')['syncRefs']>
-    readonly templateRef: UnwrapRef<typeof import('@vueuse/core')['templateRef']>
-    readonly throttledRef: UnwrapRef<typeof import('@vueuse/core')['throttledRef']>
-    readonly throttledWatch: UnwrapRef<typeof import('@vueuse/core')['throttledWatch']>
-    readonly toRaw: UnwrapRef<typeof import('vue')['toRaw']>
-    readonly toReactive: UnwrapRef<typeof import('@vueuse/core')['toReactive']>
-    readonly toRef: UnwrapRef<typeof import('vue')['toRef']>
-    readonly toRefs: UnwrapRef<typeof import('vue')['toRefs']>
-    readonly toValue: UnwrapRef<typeof import('vue')['toValue']>
-    readonly triggerRef: UnwrapRef<typeof import('vue')['triggerRef']>
-    readonly tryOnBeforeMount: UnwrapRef<typeof import('@vueuse/core')['tryOnBeforeMount']>
-    readonly tryOnBeforeUnmount: UnwrapRef<typeof import('@vueuse/core')['tryOnBeforeUnmount']>
-    readonly tryOnMounted: UnwrapRef<typeof import('@vueuse/core')['tryOnMounted']>
-    readonly tryOnScopeDispose: UnwrapRef<typeof import('@vueuse/core')['tryOnScopeDispose']>
-    readonly tryOnUnmounted: UnwrapRef<typeof import('@vueuse/core')['tryOnUnmounted']>
-    readonly unref: UnwrapRef<typeof import('vue')['unref']>
-    readonly unrefElement: UnwrapRef<typeof import('@vueuse/core')['unrefElement']>
-    readonly until: UnwrapRef<typeof import('@vueuse/core')['until']>
-    readonly useAbs: UnwrapRef<typeof import('@vueuse/math')['useAbs']>
-    readonly useActiveElement: UnwrapRef<typeof import('@vueuse/core')['useActiveElement']>
-    readonly useAnimate: UnwrapRef<typeof import('@vueuse/core')['useAnimate']>
-    readonly useArrayDifference: UnwrapRef<typeof import('@vueuse/core')['useArrayDifference']>
-    readonly useArrayEvery: UnwrapRef<typeof import('@vueuse/core')['useArrayEvery']>
-    readonly useArrayFilter: UnwrapRef<typeof import('@vueuse/core')['useArrayFilter']>
-    readonly useArrayFind: UnwrapRef<typeof import('@vueuse/core')['useArrayFind']>
-    readonly useArrayFindIndex: UnwrapRef<typeof import('@vueuse/core')['useArrayFindIndex']>
-    readonly useArrayFindLast: UnwrapRef<typeof import('@vueuse/core')['useArrayFindLast']>
-    readonly useArrayIncludes: UnwrapRef<typeof import('@vueuse/core')['useArrayIncludes']>
-    readonly useArrayJoin: UnwrapRef<typeof import('@vueuse/core')['useArrayJoin']>
-    readonly useArrayMap: UnwrapRef<typeof import('@vueuse/core')['useArrayMap']>
-    readonly useArrayReduce: UnwrapRef<typeof import('@vueuse/core')['useArrayReduce']>
-    readonly useArraySome: UnwrapRef<typeof import('@vueuse/core')['useArraySome']>
-    readonly useArrayUnique: UnwrapRef<typeof import('@vueuse/core')['useArrayUnique']>
-    readonly useAsyncQueue: UnwrapRef<typeof import('@vueuse/core')['useAsyncQueue']>
-    readonly useAsyncState: UnwrapRef<typeof import('@vueuse/core')['useAsyncState']>
-    readonly useAttrs: UnwrapRef<typeof import('vue')['useAttrs']>
-    readonly useAverage: UnwrapRef<typeof import('@vueuse/math')['useAverage']>
-    readonly useBase64: UnwrapRef<typeof import('@vueuse/core')['useBase64']>
-    readonly useBattery: UnwrapRef<typeof import('@vueuse/core')['useBattery']>
-    readonly useBluetooth: UnwrapRef<typeof import('@vueuse/core')['useBluetooth']>
-    readonly useBreakpoints: UnwrapRef<typeof import('@vueuse/core')['useBreakpoints']>
-    readonly useBroadcastChannel: UnwrapRef<typeof import('@vueuse/core')['useBroadcastChannel']>
-    readonly useBrowserLocation: UnwrapRef<typeof import('@vueuse/core')['useBrowserLocation']>
-    readonly useCached: UnwrapRef<typeof import('@vueuse/core')['useCached']>
-    readonly useCeil: UnwrapRef<typeof import('@vueuse/math')['useCeil']>
-    readonly useClamp: UnwrapRef<typeof import('@vueuse/math')['useClamp']>
-    readonly useClipboard: UnwrapRef<typeof import('@vueuse/core')['useClipboard']>
-    readonly useClipboardItems: UnwrapRef<typeof import('@vueuse/core')['useClipboardItems']>
-    readonly useCloned: UnwrapRef<typeof import('@vueuse/core')['useCloned']>
-    readonly useColorMode: UnwrapRef<typeof import('@vueuse/core')['useColorMode']>
-    readonly useConfirmDialog: UnwrapRef<typeof import('@vueuse/core')['useConfirmDialog']>
-    readonly useCounter: UnwrapRef<typeof import('@vueuse/core')['useCounter']>
-    readonly useCssModule: UnwrapRef<typeof import('vue')['useCssModule']>
-    readonly useCssVar: UnwrapRef<typeof import('@vueuse/core')['useCssVar']>
-    readonly useCssVars: UnwrapRef<typeof import('vue')['useCssVars']>
-    readonly useCurrentElement: UnwrapRef<typeof import('@vueuse/core')['useCurrentElement']>
-    readonly useCycleList: UnwrapRef<typeof import('@vueuse/core')['useCycleList']>
-    readonly useDark: UnwrapRef<typeof import('@vueuse/core')['useDark']>
-    readonly useDateFormat: UnwrapRef<typeof import('@vueuse/core')['useDateFormat']>
-    readonly useDebounce: UnwrapRef<typeof import('@vueuse/core')['useDebounce']>
-    readonly useDebounceFn: UnwrapRef<typeof import('@vueuse/core')['useDebounceFn']>
-    readonly useDebouncedRefHistory: UnwrapRef<typeof import('@vueuse/core')['useDebouncedRefHistory']>
-    readonly useDeviceMotion: UnwrapRef<typeof import('@vueuse/core')['useDeviceMotion']>
-    readonly useDeviceOrientation: UnwrapRef<typeof import('@vueuse/core')['useDeviceOrientation']>
-    readonly useDevicePixelRatio: UnwrapRef<typeof import('@vueuse/core')['useDevicePixelRatio']>
-    readonly useDevicesList: UnwrapRef<typeof import('@vueuse/core')['useDevicesList']>
-    readonly useDisplayMedia: UnwrapRef<typeof import('@vueuse/core')['useDisplayMedia']>
-    readonly useDocumentVisibility: UnwrapRef<typeof import('@vueuse/core')['useDocumentVisibility']>
-    readonly useDraggable: UnwrapRef<typeof import('@vueuse/core')['useDraggable']>
-    readonly useDropZone: UnwrapRef<typeof import('@vueuse/core')['useDropZone']>
-    readonly useElementBounding: UnwrapRef<typeof import('@vueuse/core')['useElementBounding']>
-    readonly useElementByPoint: UnwrapRef<typeof import('@vueuse/core')['useElementByPoint']>
-    readonly useElementHover: UnwrapRef<typeof import('@vueuse/core')['useElementHover']>
-    readonly useElementSize: UnwrapRef<typeof import('@vueuse/core')['useElementSize']>
-    readonly useElementVisibility: UnwrapRef<typeof import('@vueuse/core')['useElementVisibility']>
-    readonly useEventBus: UnwrapRef<typeof import('@vueuse/core')['useEventBus']>
-    readonly useEventListener: UnwrapRef<typeof import('@vueuse/core')['useEventListener']>
-    readonly useEventSource: UnwrapRef<typeof import('@vueuse/core')['useEventSource']>
-    readonly useEyeDropper: UnwrapRef<typeof import('@vueuse/core')['useEyeDropper']>
-    readonly useFavicon: UnwrapRef<typeof import('@vueuse/core')['useFavicon']>
-    readonly useFetch: UnwrapRef<typeof import('@vueuse/core')['useFetch']>
-    readonly useFileDialog: UnwrapRef<typeof import('@vueuse/core')['useFileDialog']>
-    readonly useFileSystemAccess: UnwrapRef<typeof import('@vueuse/core')['useFileSystemAccess']>
-    readonly useFloor: UnwrapRef<typeof import('@vueuse/math')['useFloor']>
-    readonly useFocus: UnwrapRef<typeof import('@vueuse/core')['useFocus']>
-    readonly useFocusWithin: UnwrapRef<typeof import('@vueuse/core')['useFocusWithin']>
-    readonly useFps: UnwrapRef<typeof import('@vueuse/core')['useFps']>
-    readonly useFullscreen: UnwrapRef<typeof import('@vueuse/core')['useFullscreen']>
-    readonly useGamepad: UnwrapRef<typeof import('@vueuse/core')['useGamepad']>
-    readonly useGeolocation: UnwrapRef<typeof import('@vueuse/core')['useGeolocation']>
-    readonly useIdle: UnwrapRef<typeof import('@vueuse/core')['useIdle']>
-    readonly useImage: UnwrapRef<typeof import('@vueuse/core')['useImage']>
-    readonly useInfiniteScroll: UnwrapRef<typeof import('@vueuse/core')['useInfiniteScroll']>
-    readonly useIntersectionObserver: UnwrapRef<typeof import('@vueuse/core')['useIntersectionObserver']>
-    readonly useInterval: UnwrapRef<typeof import('@vueuse/core')['useInterval']>
-    readonly useIntervalFn: UnwrapRef<typeof import('@vueuse/core')['useIntervalFn']>
-    readonly useKeyModifier: UnwrapRef<typeof import('@vueuse/core')['useKeyModifier']>
-    readonly useLastChanged: UnwrapRef<typeof import('@vueuse/core')['useLastChanged']>
-    readonly useLink: UnwrapRef<typeof import('vue-router')['useLink']>
-    readonly useLocalStorage: UnwrapRef<typeof import('@vueuse/core')['useLocalStorage']>
-    readonly useMagicKeys: UnwrapRef<typeof import('@vueuse/core')['useMagicKeys']>
-    readonly useManualRefHistory: UnwrapRef<typeof import('@vueuse/core')['useManualRefHistory']>
-    readonly useMath: UnwrapRef<typeof import('@vueuse/math')['useMath']>
-    readonly useMax: UnwrapRef<typeof import('@vueuse/math')['useMax']>
-    readonly useMediaControls: UnwrapRef<typeof import('@vueuse/core')['useMediaControls']>
-    readonly useMediaQuery: UnwrapRef<typeof import('@vueuse/core')['useMediaQuery']>
-    readonly useMemoize: UnwrapRef<typeof import('@vueuse/core')['useMemoize']>
-    readonly useMemory: UnwrapRef<typeof import('@vueuse/core')['useMemory']>
-    readonly useMin: UnwrapRef<typeof import('@vueuse/math')['useMin']>
-    readonly useMounted: UnwrapRef<typeof import('@vueuse/core')['useMounted']>
-    readonly useMouse: UnwrapRef<typeof import('@vueuse/core')['useMouse']>
-    readonly useMouseInElement: UnwrapRef<typeof import('@vueuse/core')['useMouseInElement']>
-    readonly useMousePressed: UnwrapRef<typeof import('@vueuse/core')['useMousePressed']>
-    readonly useMutationObserver: UnwrapRef<typeof import('@vueuse/core')['useMutationObserver']>
-    readonly useNavigatorLanguage: UnwrapRef<typeof import('@vueuse/core')['useNavigatorLanguage']>
-    readonly useNetwork: UnwrapRef<typeof import('@vueuse/core')['useNetwork']>
-    readonly useNow: UnwrapRef<typeof import('@vueuse/core')['useNow']>
-    readonly useObjectUrl: UnwrapRef<typeof import('@vueuse/core')['useObjectUrl']>
-    readonly useOffsetPagination: UnwrapRef<typeof import('@vueuse/core')['useOffsetPagination']>
-    readonly useOnline: UnwrapRef<typeof import('@vueuse/core')['useOnline']>
-    readonly usePageLeave: UnwrapRef<typeof import('@vueuse/core')['usePageLeave']>
-    readonly useParallax: UnwrapRef<typeof import('@vueuse/core')['useParallax']>
-    readonly useParentElement: UnwrapRef<typeof import('@vueuse/core')['useParentElement']>
-    readonly usePerformanceObserver: UnwrapRef<typeof import('@vueuse/core')['usePerformanceObserver']>
-    readonly usePermission: UnwrapRef<typeof import('@vueuse/core')['usePermission']>
-    readonly usePointer: UnwrapRef<typeof import('@vueuse/core')['usePointer']>
-    readonly usePointerLock: UnwrapRef<typeof import('@vueuse/core')['usePointerLock']>
-    readonly usePointerSwipe: UnwrapRef<typeof import('@vueuse/core')['usePointerSwipe']>
-    readonly usePrecision: UnwrapRef<typeof import('@vueuse/math')['usePrecision']>
-    readonly usePreferredColorScheme: UnwrapRef<typeof import('@vueuse/core')['usePreferredColorScheme']>
-    readonly usePreferredContrast: UnwrapRef<typeof import('@vueuse/core')['usePreferredContrast']>
-    readonly usePreferredDark: UnwrapRef<typeof import('@vueuse/core')['usePreferredDark']>
-    readonly usePreferredLanguages: UnwrapRef<typeof import('@vueuse/core')['usePreferredLanguages']>
-    readonly usePreferredReducedMotion: UnwrapRef<typeof import('@vueuse/core')['usePreferredReducedMotion']>
-    readonly usePrevious: UnwrapRef<typeof import('@vueuse/core')['usePrevious']>
-    readonly useProjection: UnwrapRef<typeof import('@vueuse/math')['useProjection']>
-    readonly useRafFn: UnwrapRef<typeof import('@vueuse/core')['useRafFn']>
-    readonly useRefHistory: UnwrapRef<typeof import('@vueuse/core')['useRefHistory']>
-    readonly useResizeObserver: UnwrapRef<typeof import('@vueuse/core')['useResizeObserver']>
-    readonly useRound: UnwrapRef<typeof import('@vueuse/math')['useRound']>
-    readonly useRoute: UnwrapRef<typeof import('vue-router')['useRoute']>
-    readonly useRouter: UnwrapRef<typeof import('vue-router')['useRouter']>
-    readonly useScreenOrientation: UnwrapRef<typeof import('@vueuse/core')['useScreenOrientation']>
-    readonly useScreenSafeArea: UnwrapRef<typeof import('@vueuse/core')['useScreenSafeArea']>
-    readonly useScriptTag: UnwrapRef<typeof import('@vueuse/core')['useScriptTag']>
-    readonly useScroll: UnwrapRef<typeof import('@vueuse/core')['useScroll']>
-    readonly useScrollLock: UnwrapRef<typeof import('@vueuse/core')['useScrollLock']>
-    readonly useSessionStorage: UnwrapRef<typeof import('@vueuse/core')['useSessionStorage']>
-    readonly useShare: UnwrapRef<typeof import('@vueuse/core')['useShare']>
-    readonly useSlots: UnwrapRef<typeof import('vue')['useSlots']>
-    readonly useSorted: UnwrapRef<typeof import('@vueuse/core')['useSorted']>
-    readonly useSpeechRecognition: UnwrapRef<typeof import('@vueuse/core')['useSpeechRecognition']>
-    readonly useSpeechSynthesis: UnwrapRef<typeof import('@vueuse/core')['useSpeechSynthesis']>
-    readonly useStepper: UnwrapRef<typeof import('@vueuse/core')['useStepper']>
-    readonly useStorage: UnwrapRef<typeof import('@vueuse/core')['useStorage']>
-    readonly useStorageAsync: UnwrapRef<typeof import('@vueuse/core')['useStorageAsync']>
-    readonly useStore: UnwrapRef<typeof import('vuex')['useStore']>
-    readonly useStyleTag: UnwrapRef<typeof import('@vueuse/core')['useStyleTag']>
-    readonly useSum: UnwrapRef<typeof import('@vueuse/math')['useSum']>
-    readonly useSupported: UnwrapRef<typeof import('@vueuse/core')['useSupported']>
-    readonly useSwipe: UnwrapRef<typeof import('@vueuse/core')['useSwipe']>
-    readonly useTemplateRefsList: UnwrapRef<typeof import('@vueuse/core')['useTemplateRefsList']>
-    readonly useTextDirection: UnwrapRef<typeof import('@vueuse/core')['useTextDirection']>
-    readonly useTextSelection: UnwrapRef<typeof import('@vueuse/core')['useTextSelection']>
-    readonly useTextareaAutosize: UnwrapRef<typeof import('@vueuse/core')['useTextareaAutosize']>
-    readonly useThrottle: UnwrapRef<typeof import('@vueuse/core')['useThrottle']>
-    readonly useThrottleFn: UnwrapRef<typeof import('@vueuse/core')['useThrottleFn']>
-    readonly useThrottledRefHistory: UnwrapRef<typeof import('@vueuse/core')['useThrottledRefHistory']>
-    readonly useTimeAgo: UnwrapRef<typeof import('@vueuse/core')['useTimeAgo']>
-    readonly useTimeout: UnwrapRef<typeof import('@vueuse/core')['useTimeout']>
-    readonly useTimeoutFn: UnwrapRef<typeof import('@vueuse/core')['useTimeoutFn']>
-    readonly useTimeoutPoll: UnwrapRef<typeof import('@vueuse/core')['useTimeoutPoll']>
-    readonly useTimestamp: UnwrapRef<typeof import('@vueuse/core')['useTimestamp']>
-    readonly useTitle: UnwrapRef<typeof import('@vueuse/core')['useTitle']>
-    readonly useToNumber: UnwrapRef<typeof import('@vueuse/core')['useToNumber']>
-    readonly useToString: UnwrapRef<typeof import('@vueuse/core')['useToString']>
-    readonly useToggle: UnwrapRef<typeof import('@vueuse/core')['useToggle']>
-    readonly useTransition: UnwrapRef<typeof import('@vueuse/core')['useTransition']>
-    readonly useTrunc: UnwrapRef<typeof import('@vueuse/math')['useTrunc']>
-    readonly useUrlSearchParams: UnwrapRef<typeof import('@vueuse/core')['useUrlSearchParams']>
-    readonly useUserMedia: UnwrapRef<typeof import('@vueuse/core')['useUserMedia']>
-    readonly useVModel: UnwrapRef<typeof import('@vueuse/core')['useVModel']>
-    readonly useVModels: UnwrapRef<typeof import('@vueuse/core')['useVModels']>
-    readonly useVibrate: UnwrapRef<typeof import('@vueuse/core')['useVibrate']>
-    readonly useVirtualList: UnwrapRef<typeof import('@vueuse/core')['useVirtualList']>
-    readonly useWakeLock: UnwrapRef<typeof import('@vueuse/core')['useWakeLock']>
-    readonly useWebNotification: UnwrapRef<typeof import('@vueuse/core')['useWebNotification']>
-    readonly useWebSocket: UnwrapRef<typeof import('@vueuse/core')['useWebSocket']>
-    readonly useWebWorker: UnwrapRef<typeof import('@vueuse/core')['useWebWorker']>
-    readonly useWebWorkerFn: UnwrapRef<typeof import('@vueuse/core')['useWebWorkerFn']>
-    readonly useWindowFocus: UnwrapRef<typeof import('@vueuse/core')['useWindowFocus']>
-    readonly useWindowScroll: UnwrapRef<typeof import('@vueuse/core')['useWindowScroll']>
-    readonly useWindowSize: UnwrapRef<typeof import('@vueuse/core')['useWindowSize']>
-    readonly watch: UnwrapRef<typeof import('vue')['watch']>
-    readonly watchArray: UnwrapRef<typeof import('@vueuse/core')['watchArray']>
-    readonly watchAtMost: UnwrapRef<typeof import('@vueuse/core')['watchAtMost']>
-    readonly watchDebounced: UnwrapRef<typeof import('@vueuse/core')['watchDebounced']>
-    readonly watchDeep: UnwrapRef<typeof import('@vueuse/core')['watchDeep']>
-    readonly watchEffect: UnwrapRef<typeof import('vue')['watchEffect']>
-    readonly watchIgnorable: UnwrapRef<typeof import('@vueuse/core')['watchIgnorable']>
-    readonly watchImmediate: UnwrapRef<typeof import('@vueuse/core')['watchImmediate']>
-    readonly watchOnce: UnwrapRef<typeof import('@vueuse/core')['watchOnce']>
-    readonly watchPausable: UnwrapRef<typeof import('@vueuse/core')['watchPausable']>
-    readonly watchPostEffect: UnwrapRef<typeof import('vue')['watchPostEffect']>
-    readonly watchSyncEffect: UnwrapRef<typeof import('vue')['watchSyncEffect']>
-    readonly watchThrottled: UnwrapRef<typeof import('@vueuse/core')['watchThrottled']>
-    readonly watchTriggerable: UnwrapRef<typeof import('@vueuse/core')['watchTriggerable']>
-    readonly watchWithFilter: UnwrapRef<typeof import('@vueuse/core')['watchWithFilter']>
-    readonly whenever: UnwrapRef<typeof import('@vueuse/core')['whenever']>
-  }
-}
+}

components.d.ts

@@ -1,10 +1,10 @@
 /* eslint-disable */
-/* prettier-ignore */
 // @ts-nocheck
 // Generated by unplugin-vue-components
 // Read more: https://github.com/vuejs/core/pull/3399
 export {}
 
+/* prettier-ignore */
 declare module 'vue' {
   export interface GlobalComponents {
     DialogCloseBtn: typeof import('./src/@core/components/DialogCloseBtn.vue')['default']

index.html

@@ -1,5 +1,6 @@
 <!DOCTYPE html>
-<html lang="en">
+<html lang="en"
+  style="overflow: hidden auto; min-block-size: calc(100% + env(safe-area-inset-top) + env(safe-area-inset-bottom));background: var(--initial-loader-bg, #fff);">
 
 <head>
   <meta http-equiv="pragma" content="no-cache">
@@ -29,9 +30,17 @@
   <meta name="HandheldFriendly" content="True" />
   <meta name="MobileOptimized" content="320" />
   <link rel="stylesheet" type="text/css" href="/loader.css" />
+  <script>
+    const loaderColor = localStorage.getItem('materio-initial-loader-bg') || '#FFFFFF'
+    if (loaderColor)
+      document.documentElement.style.setProperty('--initial-loader-bg', loaderColor)
+    const primaryColor = localStorage.getItem('materio-initial-loader-color') || '#9155FD'
+    if (primaryColor)
+      document.documentElement.style.setProperty('--initial-loader-color', primaryColor)
+  </script>
 </head>
 
-<body>
+<body style="margin: 0;">
   <div id="loading-bg">
     <div class="loading-logo">
       <!-- Logo -->
@@ -146,16 +155,6 @@
   </div>
   <div id="app"></div>
   <script type="module" src="/src/main.ts"></script>
-  <script>
-    const loaderColor = localStorage.getItem('materio-initial-loader-bg') || '#FFFFFF'
-    const primaryColor = localStorage.getItem('materio-initial-loader-color') || '#9155FD'
-
-    if (loaderColor)
-      document.documentElement.style.setProperty('--initial-loader-bg', loaderColor)
-
-    if (primaryColor)
-      document.documentElement.style.setProperty('--initial-loader-color', primaryColor)
-  </script>
 </body>
 
-</html>
+</html>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "moviepilot",
-  "version": "2.1.3",
+  "version": "2.2.9",
   "private": true,
   "bin": "dist/service.js",
   "scripts": {
@@ -19,87 +19,86 @@
     ]
   },
   "dependencies": {
-    "@fullcalendar/core": "^6.1.8",
-    "@fullcalendar/daygrid": "^6.1.8",
-    "@fullcalendar/interaction": "^6.1.7",
-    "@fullcalendar/list": "^6.1.7",
-    "@fullcalendar/timegrid": "^6.1.7",
-    "@fullcalendar/vue3": "^6.1.8",
-    "@iconify/utils": "^2.1.22",
-    "@vueuse/core": "^10.1.2",
-    "@vueuse/math": "^10.1.2",
-    "ace-builds": "^1.32.6",
-    "apexcharts-clevision": "^3.28.5",
-    "axios": "1.6.8",
-    "colorthief": "^2.4.0",
-    "dayjs": "^1.11.10",
-    "express": "^4.18.2",
-    "express-http-proxy": "^2.0.0",
+    "@fullcalendar/core": "^6.1.15",
+    "@fullcalendar/daygrid": "^6.1.15",
+    "@fullcalendar/interaction": "^6.1.15",
+    "@fullcalendar/list": "^6.1.15",
+    "@fullcalendar/timegrid": "^6.1.15",
+    "@fullcalendar/vue3": "^6.1.15",
+    "@iconify/utils": "^2.2.1",
+    "@vue-js-cron/vuetify": "^5.0.9",
+    "@vueuse/core": "^12.4.0",
+    "@vueuse/math": "^12.4.0",
+    "ace-builds": "^1.37.4",
+    "apexcharts": "^4.0.0",
+    "axios": "^1.7.9",
+    "colorthief": "^2.6.0",
+    "copy-to-clipboard": "^3.3.3",
+    "dayjs": "^1.11.13",
+    "express": "^4.21.2",
+    "express-http-proxy": "^2.1.1",
     "lodash": "^4.17.21",
     "mousetrap": "^1.6.5",
     "nprogress": "^0.2.0",
-    "qrcode.vue": "^3.4.1",
-    "sass": "^1.59.3",
-    "tailwindcss": "^3.3.2",
-    "unplugin-vue-define-options": "^1.3.5",
-    "vue": "^3.3.2",
-    "vue-router": "^4.2.0",
-    "vue-toast-notification": "^3",
+    "qrcode.vue": "^3.6.0",
+    "sass": "^1.83.4",
+    "tailwindcss": "^ 3.4.17",
+    "vue": "^3.5.13",
+    "vue-router": "^4.5.0",
+    "vue-toast-notification": "^3.1.3",
     "vue3-ace-editor": "^2.2.4",
-    "vue3-apexcharts": "^1.4.1",
+    "vue3-apexcharts": "^1.8.0",
     "vue3-perfect-scrollbar": "^2.0.0",
     "vuedraggable": "^4.1.0",
-    "vuetify": "3.6.8",
+    "vuetify": "3.7.3",
     "vuetify-use-dialog": "^0.6.11",
     "vuex": "^4.1.0",
     "vuex-persistedstate": "^4.1.0",
     "webfontloader": "^1.6.28"
   },
   "devDependencies": {
-    "@antfu/eslint-config-vue": "^0.43.1",
     "@iconify-json/mdi": "^1.1.52",
     "@iconify/tools": "^4.0.4",
-    "@iconify/vue": "4.1.1",
-    "@intlify/unplugin-vue-i18n": "^4.0.0",
+    "@iconify/vue": "^4.3.0",
+    "@intlify/unplugin-vue-i18n": "^6.0.3",
     "@tailwindcss/aspect-ratio": "^0.4.2",
     "@types/lodash": "^4.14.197",
     "@types/node": "^20.1.4",
     "@types/webfontloader": "^1.6.34",
-    "@typescript-eslint/eslint-plugin": "^7.5.0",
-    "@typescript-eslint/parser": "^7.5.0",
+    "@typescript-eslint/eslint-plugin": "^8.20.0",
+    "@typescript-eslint/parser": "^8.20.0",
     "@vitejs/plugin-vue": "^5.0.4",
-    "@vitejs/plugin-vue-jsx": "^3.0.0",
+    "@vitejs/plugin-vue-jsx": "^4.1.1",
     "autoprefixer": "^10.4.14",
-    "eslint": "^9.0.0",
-    "eslint-config-airbnb-base": "^15.0.0",
+    "eslint": "^9.18.0",
     "eslint-import-resolver-typescript": "^3.5.1",
     "eslint-plugin-import": "^2.26.0",
-    "eslint-plugin-promise": "^6.0.1",
+    "eslint-plugin-promise": "^7.2.1",
     "eslint-plugin-regex": "^1.10.0",
-    "eslint-plugin-sonarjs": "^0.25.1",
-    "eslint-plugin-unicorn": "^52.0.0",
+    "eslint-plugin-sonarjs": "^3.0.1",
+    "eslint-plugin-unicorn": "^56.0.1",
     "eslint-plugin-vue": "^9.12.0",
-    "postcss": "8",
+    "postcss": "^8.5.1",
     "postcss-html": "^1.5.0",
-    "stylelint": "16.3.1",
-    "stylelint-config-idiomatic-order": "10.0.0",
-    "stylelint-config-standard-scss": "13.1.0",
+    "stylelint": "^16.13.2",
+    "stylelint-config-idiomatic-order": "^10.0.0",
+    "stylelint-config-standard-scss": "^14.0.0",
     "stylelint-use-logical-spec": "5.0.1",
     "terser": "^5.36.0",
     "type-fest": "^4.15.0",
     "typescript": "^5.0.4",
-    "unplugin-auto-import": "^0.17.5",
-    "unplugin-vue-components": "^0.26.0",
-    "vite": "^5.2.8",
+    "unplugin-auto-import": "^19.0.0",
+    "unplugin-vue-components": "^28.0.0",
+    "unplugin-vue-define-options": "^1.5.3",
+    "vite": "^5.4.11",
     "vite-plugin-pages": "^0.32.1",
-    "vite-plugin-pwa": "^0.20.0",
+    "vite-plugin-pwa": "^0.21.1",
     "vite-plugin-vue-layouts": "^0.11.0",
-    "vite-plugin-vuetify": "2.0.3",
-    "vue-shepherd": "^3.0.0",
-    "vue-tsc": "^2.0.10"
+    "vite-plugin-vuetify": "2.0.4",
+    "vue-shepherd": "^4.1.0",
+    "vue-tsc": "^2.0.10",
+    "workbox-build": "^7.3.0",
+    "workbox-window": "^7.3.0"
   },
-  "packageManager": "yarn@1.22.18",
-  "resolutions": {
-    "postcss": "8"
-  }
+  "packageManager": "yarn@1.22.18"
 }

public/loader.css

@@ -1,16 +1,6 @@
-body {
-  margin: 0;
-}
-
-html {
-  overflow: hidden auto;
-  background: var(--initial-loader-bg, #fff);
-  min-block-size: calc(100% + env(safe-area-inset-top));
-}
-
 #loading-bg {
-  position: absolute;
-  z-index: 999;
+  position: fixed;
+  z-index: 9999;
   display: block;
   background: var(--initial-loader-bg, #fff);
   block-size: 100vh;

src/@core/components/ThemeSwitcher.vue

@@ -5,7 +5,7 @@ import type { ThemeSwitcherTheme } from '@layouts/types'
 import api from '@/api'
 import { checkPrefersColorSchemeIsDark } from '@/@core/utils'
 import { useToast } from 'vue-toast-notification'
-import { VAceEditor } from 'vue3-ace-editor'
+import { saveLocalTheme } from '../utils/theme'
 
 // 显示器宽度
 const display = useDisplay()
@@ -103,8 +103,7 @@ function updateTheme() {
   savedTheme.value = theme
   themeTransition()
   // 保存主题到本地
-  localStorage.setItem('theme', theme)
-  localStorage.setItem('materio-initial-loader-bg', globalTheme.current.value.colors.background)
+  saveLocalTheme(theme, globalTheme)
 }
 
 // 切换主题
@@ -115,7 +114,7 @@ function changeTheme(theme: string) {
   // 保存主题到服务端
   try {
     api.post('/user/config/Layout', {
-      theme: nextTheme
+      theme: nextTheme,
     })
   } catch (e) {
     console.error('保存主题到服务端失败')
@@ -176,7 +175,7 @@ async function saveCustomCSS() {
       },
     })
 
-    if (result.success) $toast.success('自定义CSS保存成功！')
+    if (result.success) $toast.success('自定义CSS保存成功，请刷新页面生效！')
   } catch (e) {
     console.error('保存自定义 CSS 到服务端失败')
   }
@@ -210,7 +209,7 @@ onMounted(() => {
     </VList>
   </VMenu>
   <!-- 自定义 CSS -- -->
-  <VDialog v-model="cssDialog" persistent max-width="50rem" scrollable :fullscreen="!display.mdAndUp.value">
+  <VDialog v-if="cssDialog" v-model="cssDialog" persistent max-width="50rem" scrollable :fullscreen="!display.mdAndUp.value">
     <VCard title="自定义主题风格">
       <DialogCloseBtn @click="cssDialog = false" />
       <VDivider />

src/@core/scss/pages/page-auth.scss

@@ -1,5 +1,5 @@
 .auth-wrapper {
-  min-block-size: calc(var(--vh, 1vh) * 100 + env(safe-area-inset-top));
+  min-block-size: calc(var(--vh, 1vh) * 100 + env(safe-area-inset-top) + env(safe-area-inset-bottom));
 }
 
 .auth-footer-mask {

src/@core/scss/template/_mixins.scss

@@ -1,9 +1,10 @@
+@use "sass:map";
 @use "vuetify/lib/styles/settings" as vuetify_settings;
 
 @mixin avatar-font-sizes($map: $avatar-sizes) {
   @each $sizeName, $multiplier in vuetify_settings.$size-scales {
     /* stylelint-disable-next-line scss/no-global-function-names */
-    $size: map-get($map, $sizeName);
+    $size: map.get($map, $sizeName);
 
     &.v-avatar--size-#{$sizeName} {
       font-size: #{$size}px;

src/@core/scss/template/libs/full-calendar.scss

@@ -92,8 +92,7 @@
   .fc-header-toolbar {
     flex-wrap: wrap;
     margin: 1.25rem;
-    column-gap: 0.5rem;
-    row-gap: 1rem;
+    gap: 1rem 0.5rem;
   }
 
   .fc-toolbar-chunk {
@@ -238,7 +237,7 @@
         inline-size: 1.5625rem;
         margin-inline-end: 0.25rem;
 
-        @media (max-width: 1264px) {
+        @media (width <= 1264px) {
           display: block !important;
         }
 

src/@core/utils/dom.ts

@@ -10,8 +10,7 @@ export function useDefer(maxFrameCount = 1) {
   const refreshFrameCount = () => {
     requestAnimationFrame(() => {
       frameCount.value++
-      if (frameCount.value < maxFrameCount)
-        refreshFrameCount()
+      if (frameCount.value < maxFrameCount) refreshFrameCount()
     })
   }
   refreshFrameCount()
@@ -19,3 +18,9 @@ export function useDefer(maxFrameCount = 1) {
     return frameCount.value >= showInFrameCount
   }
 }
+
+export function ensureRenderComplete(callback: () => void) {
+  requestAnimationFrame(() => {
+    requestAnimationFrame(callback)
+  })
+}

src/@core/utils/formatters.ts

@@ -153,3 +153,12 @@ export function formatDateDifference(dateString: string): string {
   if (!dateString) return ''
   return dayjs(dateString).fromNow()
 }
+
+// 格式化评份，如为10及以下的数按原值显示，否则格式化为xxM、xxK显示
+export function formatRating(rating: number): string {
+  if (!rating) return ''
+  if (rating <= 10) return rating.toString()
+  if (rating < 1000) return rating.toLocaleString()
+  if (rating < 1000 * 1000) return `${(rating / 1000).toFixed(1)}K`
+  return `${(rating / 1000 / 1000).toFixed(1)}M`
+}

src/@core/utils/navigator.ts

@@ -1,3 +1,5 @@
+import copy from 'copy-to-clipboard'
+
 // 请求和获取剪贴板内容
 export async function getClipboardContent() {
   if (navigator.clipboard && window.isSecureContext) {
@@ -13,20 +15,10 @@ export async function getClipboardContent() {
   }
 }
 
-// 将内容复制到剪贴板，兼容非安全域场景
+// 将内容复制到剪贴板
 export async function copyToClipboard(content: string) {
-  if (navigator.clipboard && window.isSecureContext) {
-    await navigator.clipboard.writeText(content)
-  } else {
-    const input = document.createElement('textarea')
-    input.value = content
-    document.body.appendChild(input)
-    // 阻止事件冒泡到其他元素，确保 focusin 事件只在 textarea 元素上处理，不会影响其他元素
-    input.addEventListener('focusin', e => e.stopPropagation())
-    input.select()
-    document.execCommand('copy')
-    document.body.removeChild(input)
-  }
+  const success = copy(content)
+  return success
 }
 
 // VAPID公钥转Uint8Array

src/@core/utils/theme.ts

@@ -0,0 +1,6 @@
+export function saveLocalTheme(name: string, theme: any) {
+  // 存储主题到本地
+  localStorage.setItem('theme', name)
+  localStorage.setItem('materio-initial-loader-bg', theme.current.value.colors.background)
+  localStorage.setItem('materio-initial-loader-color', theme.current.value.colors.primary)
+}

src/@iconify/tsconfig.tsbuildinfo

@@ -0,0 +1 @@
+{"root":["./build-icons.ts"],"version":"5.7.3"}

src/@layouts/styles/_default-layout.scss

@@ -5,7 +5,7 @@
 @use "@configured-variables" as variables;
 
 html {
-  min-height: calc(100% + env(safe-area-inset-top));
+  min-height: calc(100% + env(safe-area-inset-top) + env(safe-area-inset-bottom));
   background: rgb(var(--v-theme-background));
   overflow-y: overlay;
 }

src/@layouts/styles/_global.scss

@@ -7,5 +7,5 @@
 
 html {
   box-sizing: border-box;
-  min-height: calc(100% + env(safe-area-inset-top))
+  min-height: calc(100% + env(safe-area-inset-top) + env(safe-area-inset-bottom))
 }

src/App.vue

@@ -1,15 +1,16 @@
 <script lang="ts" setup>
 import { useTheme } from 'vuetify'
 import { checkPrefersColorSchemeIsDark } from '@/@core/utils'
-
-const { global: globalTheme } = useTheme()
+import { ensureRenderComplete, removeEl } from './@core/utils/dom'
 
 // 生效主题
-async function setTheme() {
-  let themeValue = localStorage.getItem('theme') || 'light'
-  const autoTheme = checkPrefersColorSchemeIsDark() ? 'dark' : 'light'
-  globalTheme.name.value = themeValue === 'auto' ? autoTheme : themeValue
-}
+const { global: globalTheme } = useTheme()
+let themeValue = localStorage.getItem('theme') || 'light'
+const autoTheme = checkPrefersColorSchemeIsDark() ? 'dark' : 'light'
+globalTheme.name.value = themeValue === 'auto' ? autoTheme : themeValue
+
+// 显示状态
+const show = ref(false)
 
 // ApexCharts 全局配置
 declare global {
@@ -41,14 +42,24 @@ if (window.Apex) {
   }
 }
 
-// 页面加载时，加载当前用户数据
-onBeforeMount(async () => {
-  setTheme()
+onMounted(() => {
+  ensureRenderComplete(() => {
+    nextTick(() => {
+      setTimeout(() => {
+        // 移除加载动画
+        removeEl('#loading-bg')
+        // 将background属性从html的style中移除
+        document.documentElement.style.removeProperty('background')
+        // 显示页面
+        show.value = true
+      }, 1500)
+    })
+  })
 })
 </script>
 
 <template>
-  <VApp>
+  <VApp v-show="show">
     <RouterView />
   </VApp>
 </template>

src/api/types.ts

@@ -14,6 +14,10 @@ export interface Subscribe {
   tmdbid: number
   // 豆瓣ID
   doubanid?: string
+  // Bangumi ID
+  bangumiid?: string
+  // 其它媒体ID
+  mediaid?: string
   // 季号
   season?: number
   // 海报
@@ -88,6 +92,8 @@ export interface SubscribeShare {
   share_comment?: string
   // 分享人
   share_user?: string
+  // 分享人唯一ID
+  share_uid?: string
   // 订阅名称
   name?: string
   // 订阅年份
@@ -184,7 +190,7 @@ export interface TransferHistory {
 export interface MediaInfo {
   // 来源：themoviedb、douban、bangumi
   source?: string
-  // 类型 电影、电视剧
+  // 类型 电影、电视剧、合集
   type?: string
   // 媒体标题
   title?: string
@@ -204,6 +210,12 @@ export interface MediaInfo {
   douban_id?: string
   // Bangumi ID
   bangumi_id?: string
+  // 合集ID
+  collection_id?: number
+  // 其它媒体ID前缀
+  mediaid_prefix?: string
+  // 其它媒体ID值
+  media_id?: string
   // 媒体原语种
   original_language?: string
   // 媒体原发行标题
@@ -276,6 +288,24 @@ export interface MediaInfo {
   names?: string[]
 }
 
+// 季信息
+export interface MediaSeason {
+  // 上映日期
+  air_date?: string
+  // 总集数
+  episode_count?: number
+  // 季名称
+  name?: string
+  // 描述
+  overview?: string
+  // 海报
+  poster_path?: string
+  // 季号
+  season_number?: number
+  // 评分
+  vote_average?: number
+}
+
 // TMDB季信息
 export interface TmdbSeason {
   // 上映日期
@@ -1100,6 +1130,7 @@ export interface FilterRuleGroup {
   category?: string
 }
 
+// 订阅下载文件详情
 export interface SubscribeDownloadFileInfo {
   // 种子名称
   torrent_title?: string
@@ -1113,6 +1144,7 @@ export interface SubscribeDownloadFileInfo {
   file_path?: string
 }
 
+// 订阅媒体库文件详情
 export interface SubscribeLibraryFileInfo {
   // 存储
   storage?: string
@@ -1120,6 +1152,7 @@ export interface SubscribeLibraryFileInfo {
   file_path?: string
 }
 
+// 订阅集详情
 export interface SubscribeEpisodeInfo {
   // 标题
   title?: string
@@ -1133,6 +1166,7 @@ export interface SubscribeEpisodeInfo {
   library?: SubscribeLibraryFileInfo[]
 }
 
+// 订阅详情
 export interface SubscrbieInfo {
   // 订阅信息
   subscribe: Subscribe
@@ -1140,6 +1174,7 @@ export interface SubscrbieInfo {
   episodes: Record<number, SubscribeEpisodeInfo>
 }
 
+// 整理表单
 export interface TransferForm {
   // 文件项
   fileitem: FileItem
@@ -1178,3 +1213,44 @@ export interface TransferForm {
   // 媒体库类别子目录
   library_category_folder?: boolean
 }
+
+// 整理队列
+export interface TransferQueue {
+  // 媒体信息
+  media: MediaInfo
+  // 季
+  season?: number
+  // 任务列表
+  tasks: {
+    // 文件项
+    fileitem: FileItem
+    // 元数据
+    meta: MetaInfo
+    // 状态
+    state: string
+  }[]
+}
+
+// 探索的数据源
+export interface DiscoverSource {
+  // 数据源名称
+  name: string
+  // 媒体ID的前缀，不含:
+  mediaid_prefix: string
+  // 媒体数据源API地址
+  api_path: string
+  // 过滤参数
+  filter_params: { [key: string]: any }
+  // 过滤参数UI配置
+  filter_ui: RenderProps[]
+  // UI依赖关系字典
+  depends?: { [key: string]: string[] }
+}
+
+// 推荐的数据源
+export interface RecommendSource {
+  // 数据源名称
+  name: string
+  // 媒体数据源API地址
+  api_path: string
+}

src/assets/images/logos/tmdb_title.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 273.42 35.52"><defs><style>.cls-1{fill:url(#linear-gradient);}</style><linearGradient id="linear-gradient" y1="17.76" x2="273.42" y2="17.76" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#90cea1"/><stop offset="0.56" stop-color="#3cbec9"/><stop offset="1" stop-color="#00b3e5"/></linearGradient></defs><title>Asset 3</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><path class="cls-1" d="M191.85,35.37h63.9A17.67,17.67,0,0,0,273.42,17.7h0A17.67,17.67,0,0,0,255.75,0h-63.9A17.67,17.67,0,0,0,174.18,17.7h0A17.67,17.67,0,0,0,191.85,35.37ZM10.1,35.42h7.8V6.92H28V0H0v6.9H10.1Zm28.1,0H46V8.25h.1L55.05,35.4h6L70.3,8.25h.1V35.4h7.8V0H66.45l-8.2,23.1h-.1L50,0H38.2ZM89.14.12h11.7a33.56,33.56,0,0,1,8.08,1,18.52,18.52,0,0,1,6.67,3.08,15.09,15.09,0,0,1,4.53,5.52,18.5,18.5,0,0,1,1.67,8.25,16.91,16.91,0,0,1-1.62,7.58,16.3,16.3,0,0,1-4.38,5.5,19.24,19.24,0,0,1-6.35,3.37,24.53,24.53,0,0,1-7.55,1.15H89.14Zm7.8,28.2h4a21.66,21.66,0,0,0,5-.55A10.58,10.58,0,0,0,110,26a8.73,8.73,0,0,0,2.68-3.35,11.9,11.9,0,0,0,1-5.08,9.87,9.87,0,0,0-1-4.52,9.17,9.17,0,0,0-2.63-3.18A11.61,11.61,0,0,0,106.22,8a17.06,17.06,0,0,0-4.68-.63h-4.6ZM133.09.12h13.2a32.87,32.87,0,0,1,4.63.33,12.66,12.66,0,0,1,4.17,1.3,7.94,7.94,0,0,1,3,2.72,8.34,8.34,0,0,1,1.15,4.65,7.48,7.48,0,0,1-1.67,5,9.13,9.13,0,0,1-4.43,2.82V17a10.28,10.28,0,0,1,3.18,1,8.51,8.51,0,0,1,2.45,1.85,7.79,7.79,0,0,1,1.57,2.62,9.16,9.16,0,0,1,.55,3.2,8.52,8.52,0,0,1-1.2,4.68,9.32,9.32,0,0,1-3.1,3A13.38,13.38,0,0,1,152.32,35a22.5,22.5,0,0,1-4.73.5h-14.5Zm7.8,14.15h5.65a7.65,7.65,0,0,0,1.78-.2,4.78,4.78,0,0,0,1.57-.65,3.43,3.43,0,0,0,1.13-1.2,3.63,3.63,0,0,0,.42-1.8A3.3,3.3,0,0,0,151,8.6a3.42,3.42,0,0,0-1.23-1.13A6.07,6.07,0,0,0,148,6.9a9.9,9.9,0,0,0-1.85-.18h-5.3Zm0,14.65h7a8.27,8.27,0,0,0,1.83-.2,4.67,4.67,0,0,0,1.67-.7,3.93,3.93,0,0,0,1.23-1.3,3.8,3.8,0,0,0,.47-1.95,3.16,3.16,0,0,0-.62-2,4,4,0,0,0-1.58-1.18,8.23,8.23,0,0,0-2-.55,15.12,15.12,0,0,0-2.05-.15h-5.9Z"/></g></g></svg>

src/components/cards/CustomRuleCard.vue

@@ -98,13 +98,13 @@ function onClose() {
       <DialogCloseBtn @click="onClose" />
       <VCardText class="flex justify-space-between align-center gap-3">
         <div class="align-self-start">
-          <h5 class="text-h6 mb-1">{{ props.rule.id }}</h5>
-          <div class="text-body-1 mb-3">{{ props.rule.name }}</div>
+          <h5 class="text-h6 mb-1">{{ props.rule.name }}</h5>
+          <div class="text-body-1 mb-3">{{ props.rule.id }}</div>
         </div>
         <VImg :src="filter_svg" cover class="mt-7" max-width="3rem" />
       </VCardText>
     </VCard>
-    <VDialog v-model="ruleInfoDialog" scrollable max-width="40rem" persistent>
+    <VDialog v-if="ruleInfoDialog" v-model="ruleInfoDialog" scrollable max-width="40rem" persistent>
       <VCard :title="`${props.rule.id} - 配置`" class="rounded-t">
         <DialogCloseBtn v-model="ruleInfoDialog" />
         <VDivider />
@@ -174,9 +174,9 @@ function onClose() {
               <VCol cols="6">
                 <VTextField
                   v-model="ruleInfo.publish_time"
-                  placeholder="0"
+                  placeholder="0/1-10"
                   label="发布时间（分钟）"
-                  hint="距离资源发布的最小时间间隔"
+                  hint="距离资源发布的最小时间间隔或时间区间"
                   persistent-hint
                   active
                 />

src/components/cards/DirectoryCard.vue

@@ -1,6 +1,5 @@
 <script lang="ts" setup>
 import type { TransferDirectoryConf } from '@/api/types'
-import { VDivider, VSpacer, VTextField } from 'vuetify/lib/components/index.mjs'
 import api from '@/api'
 import { nextTick } from 'vue'
 import { storageOptions } from '@/api/constants'
@@ -20,12 +19,6 @@ const props = defineProps({
   height: String,
 })
 
-// 下载路径
-const downloadPath = ref<string>('')
-
-// 媒体库路径
-const libraryPath = ref<string>('')
-
 // 卡版是否折叠状态
 const isCollapsed = ref(true)
 
@@ -105,13 +98,13 @@ async function loadTransferTypeItems() {
 // 整理方式无数据提示
 const computedNoDataText = computed(() => {
   if (!props.directory.library_storage && !props.directory.storage) {
-    return '无可用整理方式！请先选择下载器储存与媒体库储存！'
+    return '请选择储存'
   } else if (!props.directory.library_storage) {
-    return '无可用整理方式！请先选择媒体库储存！'
+    return '请选择媒体库储存'
   } else if (!props.directory.storage) {
-    return '无可用整理方式！请先选择下载器储存！'
+    return '请选择下载器储存'
   } else {
-    return '选择的存储没有支持的整理方法！'
+    return '选择的存储类型没有支持的整理方式'
   }
 })
 
@@ -131,24 +124,6 @@ function onClose() {
   emit('close')
 }
 
-// 下载路径更新
-function updateDownloadPath(value: string) {
-  downloadPath.value = value
-  emit('update:modelValue', {
-    download: downloadPath.value,
-    library: libraryPath.value,
-  })
-}
-
-// 媒体库路径更新
-function updateLibraryPath(value: string) {
-  libraryPath.value = value
-  emit('update:modelValue', {
-    download: downloadPath.value,
-    library: libraryPath.value,
-  })
-}
-
 // 根据选中的媒体类型，获取对应的媒体类别
 const getCategories = computed(() => {
   const default_value = [{ title: '全部', value: '' }]
@@ -228,16 +203,12 @@ watch(
             />
           </VCol>
           <VCol cols="8">
-            <VPathField @update:modelValue="updateDownloadPath" :storage="props.directory.storage">
-              <template #activator="{ menuprops }">
-                <VTextField
-                  v-model="props.directory.download_path"
-                  v-bind="menuprops"
-                  variant="underlined"
-                  label="下载目录/源目录"
-                />
-              </template>
-            </VPathField>
+            <VPathField
+              v-model="props.directory.download_path"
+              :storage="props.directory.storage"
+              variant="underlined"
+              label="下载目录/源目录"
+            />
           </VCol>
           <VCol cols="6" v-if="!props.directory.media_type || props.directory.media_type === ''">
             <VSwitch v-model="props.directory.download_type_folder" label="按类型分类"></VSwitch>
@@ -275,16 +246,12 @@ watch(
             />
           </VCol>
           <VCol cols="8">
-            <VPathField @update:modelValue="updateLibraryPath" :storage="props.directory.library_storage">
-              <template #activator="{ menuprops }">
-                <VTextField
-                  v-model="props.directory.library_path"
-                  v-bind="menuprops"
-                  variant="underlined"
-                  label="媒体库目录"
-                />
-              </template>
-            </VPathField>
+            <VPathField
+              v-model="props.directory.library_path"
+              :storage="props.directory.library_storage"
+              variant="underlined"
+              label="媒体库目录"
+            />
           </VCol>
           <VCol cols="4">
             <VSelect

src/components/cards/DownloaderCard.vue

@@ -172,7 +172,7 @@ onUnmounted(() => {
         </div>
       </VCardText>
     </VCard>
-    <VDialog v-model="downloaderInfoDialog" scrollable max-width="40rem" persistent>
+    <VDialog v-if="downloaderInfoDialog" v-model="downloaderInfoDialog" scrollable max-width="40rem" persistent>
       <VCard :title="`${props.downloader.name} - 配置`" class="rounded-t">
         <DialogCloseBtn v-model="downloaderInfoDialog" />
         <VDivider />

src/components/cards/FilterRuleGroupCard.vue

@@ -101,7 +101,7 @@ function filterCardClose(pri: string) {
 }
 
 // 分享规则
-function shareRules() {
+async function shareRules() {
   if (filterRuleCards.value.length === 0) return
 
   const value = filterRuleCards.value
@@ -110,8 +110,10 @@ function shareRules() {
     .join('>')
 
   try {
-    copyToClipboard(value)
-    $toast.success('优先级规则已复制到剪贴板')
+    let success
+    success = copyToClipboard(value)
+    if (await success) $toast.success('优先级规则已复制到剪贴板！')
+    else $toast.error('优先级规则复制失败：可能是浏览器不支持或被用户阻止！')
   } catch (error) {
     $toast.error('优先级规则复制失败！')
     console.error(error)
@@ -218,12 +220,12 @@ function onClose() {
         <VImg :src="filter_group_svg" cover class="mt-10" max-width="3rem" />
       </VCardText>
     </VCard>
-    <VDialog v-model="groupInfoDialog" scrollable max-width="80rem" persistent>
+    <VDialog v-if="groupInfoDialog" v-model="groupInfoDialog" scrollable max-width="80rem" persistent>
       <VCard :title="`${props.group.name} - 配置`" class="rounded-t">
         <DialogCloseBtn v-model="groupInfoDialog" />
         <VDivider />
-        <VCardText>
-          <VRow>
+        <VCardItem class="pt-1">
+          <VRow class="mt-1">
             <VCol cols="12" md="6">
               <VTextField
                 v-model="groupInfo.name"
@@ -255,7 +257,7 @@ function onClose() {
               />
             </VCol>
           </VRow>
-        </VCardText>
+        </VCardItem>
         <VCardText>
           <draggable
             v-model="filterRuleCards"

src/components/cards/LibraryCard.vue

@@ -91,7 +91,17 @@ async function drawImages(imageList: string[]) {
     const img = new Image()
     img.setAttribute('crossorigin', 'anonymous')
     img.src = imgSrc
-    await new Promise(resolve => (img.onload = resolve))
+    try {
+      await new Promise<void>((resolve, reject) => {
+        img.onload = () => resolve()
+        img.onerror = () => reject(new Error(`Failed to load image: ${imgSrc}`))
+      })
+    } catch (error) {
+      console.error(error)
+      ctx.fillStyle = '#e5e7eb'
+      ctx.fillRect(MARGIN_WIDTH * index + POSTER_WIDTH * (index - 1), MARGIN_HEIGHT, POSTER_WIDTH, POSTER_HEIGHT)
+      return
+    }
 
     const x = MARGIN_WIDTH * index + POSTER_WIDTH * (index - 1)
     const y = MARGIN_HEIGHT

src/components/cards/MediaCard.vue

@@ -2,11 +2,11 @@
 import type { PropType, Ref } from 'vue'
 import { useToast } from 'vue-toast-notification'
 import SubscribeEditDialog from '../dialog/SubscribeEditDialog.vue'
-import { formatSeason } from '@/@core/utils/formatters'
+import { formatSeason, formatRating } from '@/@core/utils/formatters'
 import api from '@/api'
 import { doneNProgress, startNProgress } from '@/api/nprogress'
-import type { MediaInfo, NotExistMediaInfo, Subscribe, TmdbSeason } from '@/api/types'
-import router from '@/router'
+import type { MediaInfo, NotExistMediaInfo, Subscribe, MediaSeason } from '@/api/types'
+import router, { registerAbortController } from '@/router'
 import noImage from '@images/no-image.jpeg'
 import tmdbImage from '@images/logos/tmdb.png'
 import doubanImage from '@images/logos/douban-black.png'
@@ -55,10 +55,10 @@ const subscribeEditDialog = ref(false)
 const subscribeId = ref<number>()
 
 // 季详情
-const seasonInfos = ref<TmdbSeason[]>([])
+const seasonInfos = ref<MediaSeason[]>([])
 
 // 选中的订阅季
-const seasonsSelected = ref<TmdbSeason[]>([])
+const seasonsSelected = ref<MediaSeason[]>([])
 
 // 来源角标字典
 const sourceIconDict: { [key: string]: any } = {
@@ -67,11 +67,18 @@ const sourceIconDict: { [key: string]: any } = {
   bangumi: bangumiImage,
 }
 
+// 绑定MediaCard元素
+const mediaCardRef = ref<HTMLElement | null>(null)
+
+// 创建Intersection Observer实例
+const observer = ref<IntersectionObserver | null>(null)
+
 // 获得mediaid
 function getMediaId() {
   if (props.media?.tmdb_id) return `tmdb:${props.media?.tmdb_id}`
   else if (props.media?.douban_id) return `douban:${props.media?.douban_id}`
-  else return `bangumi:${props.media?.bangumi_id}`
+  else if (props.media?.bangumi_id) return `bangumi:${props.media?.bangumi_id}`
+  else return `${props.media?.mediaid_prefix}:${props.media?.media_id}`
 }
 
 // 订阅弹窗选择的多季
@@ -90,13 +97,11 @@ function getChipColor(type: string) {
 }
 
 // 添加订阅处理
-
 async function handleAddSubscribe() {
-  if (props.media?.type === '电视剧' && props.media?.tmdb_id) {
-    // TMDB电视剧
-    // 查询TMDB所有季信息
+  if (props.media?.type === '电视剧') {
+    // 查询所有季信息
     await getMediaSeasons()
-    if (!seasonInfos.value) {
+    if (!seasonInfos.value || seasonInfos.value.length === 0) {
       $toast.error(`${props.media?.title} 查询剧集信息失败！`)
       return
     }
@@ -112,11 +117,6 @@ async function handleAddSubscribe() {
       seasonsSelected.value = []
       subscribeSeasonDialog.value = true
     }
-  } else if (props.media?.type === '电视剧') {
-    // 豆瓣电视剧，只会有一季
-    const season = props.media?.season ?? 1
-    // 添加订阅
-    addSubscribe(season)
   } else {
     // 电影
     addSubscribe()
@@ -141,6 +141,7 @@ async function addSubscribe(season = 0) {
       tmdbid: props.media?.tmdb_id,
       doubanid: props.media?.douban_id,
       bangumiid: props.media?.bangumi_id,
+      mediaid: props.media?.media_id ? `${props.media?.mediaid_prefix}:${props.media?.media_id}` : '',
       season,
       best_version,
     })
@@ -219,6 +220,9 @@ async function handleCheckSubscribe() {
 // 查询当前媒体是否已入库
 async function handleCheckExists() {
   try {
+    const abortController = new AbortController()
+    registerAbortController(abortController)
+    const { signal } = abortController
     const result: { [key: string]: any } = await api.get('mediaserver/exists', {
       params: {
         tmdbid: props.media?.tmdb_id,
@@ -227,6 +231,7 @@ async function handleCheckExists() {
         season: props.media?.season,
         mtype: props.media?.type,
       },
+      signal,
     })
 
     if (result.success) isExists.value = true
@@ -238,13 +243,16 @@ async function handleCheckExists() {
 // 调用API检查是否已订阅，电视剧需要指定季
 async function checkSubscribe(season = 0) {
   try {
+    const abortController = new AbortController()
+    registerAbortController(abortController)
+    const { signal } = abortController
     const mediaid = getMediaId()
-
     const result: Subscribe = await api.get(`subscribe/media/${mediaid}`, {
       params: {
         season,
         title: props.media?.title,
       },
+      signal,
     })
 
     return result.id || null
@@ -267,7 +275,6 @@ async function checkSeasonsNotExists() {
         let state = 0
         if (item.episodes.length === 0) state = 2
         else if (item.episodes.length < item.total_episode) state = 1
-
         seasonsNotExisted.value[item.season] = state
       })
     }
@@ -282,11 +289,20 @@ async function checkSeasonsNotExists() {
 
 // 查询TMDB的所有季信息
 async function getMediaSeasons() {
+  startNProgress()
   try {
-    seasonInfos.value = await api.get(`tmdb/seasons/${props.media?.tmdb_id}`)
+    seasonInfos.value = await api.get('media/seasons', {
+      params: {
+        mediaid: getMediaId(),
+        title: props.media?.title,
+        year: props.media?.year,
+        season: props.media?.season,
+      },
+    })
   } catch (error) {
     console.error(error)
   }
+  doneNProgress()
 }
 
 // 查询订阅弹窗规则
@@ -336,13 +352,26 @@ function getExistText(season: number) {
 // 打开详情页
 function goMediaDetail(isHovering = false) {
   if (isHovering) {
-    router.push({
-      path: '/media',
-      query: {
-        mediaid: getMediaId(),
-        type: props.media?.type,
-      },
-    })
+    if (props.media?.collection_id) {
+      // 跳转到合集列表
+      router.push({
+        path: `/browse/tmdb/collection/${props.media?.collection_id}`,
+        query: {
+          title: props.media?.title,
+        },
+      })
+    } else {
+      // 跳转到媒体详情页
+      router.push({
+        path: '/media',
+        query: {
+          mediaid: getMediaId(),
+          title: props.media?.title,
+          year: props.media?.year,
+          type: props.media?.type,
+        },
+      })
+    }
   }
 }
 
@@ -354,15 +383,50 @@ function handleSearch() {
       keyword: getMediaId(),
       type: props.media?.type,
       area: 'title',
+      title: props.media?.title,
+      year: props.media?.year,
       season: props.media?.season,
     },
   })
 }
 
-// 装载时检查是否已订阅
-onBeforeMount(() => {
+// 懒加载检查
+function handleCheckLazy() {
+  if (props.media?.collection_id) {
+    return
+  }
   handleCheckSubscribe()
   handleCheckExists()
+}
+
+// 在元素进入视窗时触发懒加载函数
+function setupIntersectionObserver() {
+  if (mediaCardRef.value) {
+    observer.value = new IntersectionObserver(
+      entries => {
+        entries.forEach(entry => {
+          if (entry.isIntersecting) {
+            // 只要MediaCard进入视窗，就调用懒加载的操作
+            handleCheckLazy()
+            // 加载后销毁观察者实例
+            observer.value?.disconnect()
+            observer.value = null
+          }
+        })
+      },
+      { threshold: 0.1 },
+    )
+    observer.value.observe(mediaCardRef.value)
+  }
+}
+
+onMounted(() => {
+  setupIntersectionObserver()
+})
+
+onBeforeUnmount(() => {
+  observer.value?.disconnect()
+  observer.value = null
 })
 
 // 计算图片地址
@@ -407,82 +471,85 @@ function onRemoveSubscribe() {
 <template>
   <VHover>
     <template #default="hover">
-      <VCard
-        v-bind="hover.props"
-        :height="props.height"
-        :width="props.width"
-        class="outline-none shadow ring-gray-500 rounded-lg"
-        :class="{
-          'transition transform-cpu duration-300 scale-105 shadow-lg': hover.isHovering,
-          'ring-1': isImageLoaded,
-        }"
-        @click.stop="goMediaDetail(hover.isHovering ?? false)"
-      >
-        <VImg
-          aspect-ratio="2/3"
-          :src="getImgUrl"
-          class="object-cover aspect-w-2 aspect-h-3"
-          cover
-          @load="isImageLoaded = true"
-          @error="imageLoadError = true"
+      <div ref="mediaCardRef">
+        <VCard
+          v-bind="hover.props"
+          :height="props.height"
+          :width="props.width"
+          class="outline-none shadow ring-gray-500 rounded-lg"
+          :class="{
+            'transition transform-cpu duration-300 scale-105 shadow-lg': hover.isHovering,
+            'ring-1': isImageLoaded,
+          }"
+          @click.stop="goMediaDetail(hover.isHovering ?? false)"
         >
-          <template #placeholder>
-            <div class="w-full h-full">
-              <VSkeletonLoader class="object-cover aspect-w-2 aspect-h-3" />
+          <VImg
+            aspect-ratio="2/3"
+            :src="getImgUrl"
+            class="object-cover aspect-w-2 aspect-h-3"
+            cover
+            @load="isImageLoaded = true"
+            @error="imageLoadError = true"
+          >
+            <template #placeholder>
+              <div class="w-full h-full">
+                <VSkeletonLoader class="object-cover aspect-w-2 aspect-h-3" />
+              </div>
+            </template>
+          </VImg>
+          <!-- 详情 -->
+          <VCardText
+            v-show="hover.isHovering || imageLoadError"
+            class="w-full h-full flex flex-col flex-wrap justify-end align-left text-white absolute bottom-0 cursor-pointer pa-2"
+            style="background: linear-gradient(rgba(45, 55, 72, 40%) 0%, rgba(45, 55, 72, 90%) 100%)"
+          >
+            <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 v-if="props.media?.collection_id" class="mb-3" @click.stop=""></div>
+            <div v-else 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>
-          </template>
-        </VImg>
-        <!-- 详情 -->
-        <VCardText
-          v-show="hover.isHovering || imageLoadError"
-          class="w-full h-full flex flex-col flex-wrap justify-end align-left text-white absolute bottom-0 cursor-pointer pa-2"
-          style="background: linear-gradient(rgba(45, 55, 72, 40%) 0%, rgba(45, 55, 72, 90%) 100%)"
-        >
-          <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>
-        <!-- 类型角标 -->
-        <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 && !hover.isHovering" />
-        <!-- 评分角标 -->
-        <VChip
-          v-if="isImageLoaded && props.media?.vote_average && !(isExists && !hover.isHovering)"
-          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>
-        <!--来源图标-->
-        <VAvatar
-          size="24"
-          density="compact"
-          class="absolute bottom-1 right-1"
-          tile
-          v-if="!hover.isHovering && isImageLoaded && props.media?.source"
-        >
-          <VImg cover :src="sourceIconDict[props.media?.source]" class="shadow-lg" />
-        </VAvatar>
-      </VCard>
+          </VCardText>
+          <!-- 类型角标 -->
+          <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 && !hover.isHovering" />
+          <!-- 评分角标 -->
+          <VChip
+            v-if="isImageLoaded && props.media?.vote_average && !(isExists && !hover.isHovering)"
+            variant="elevated"
+            size="small"
+            :class="getChipColor('rating')"
+            class="absolute right-2 top-2 bg-opacity-80 shadow-md text-white font-bold"
+          >
+            {{ formatRating(props.media?.vote_average) }}
+          </VChip>
+          <!--来源图标-->
+          <VAvatar
+            size="24"
+            density="compact"
+            class="absolute bottom-1 right-1"
+            tile
+            v-if="!hover.isHovering && isImageLoaded && props.media?.source && !imageLoadError"
+          >
+            <VImg cover :src="sourceIconDict[props.media?.source]" class="shadow-lg" />
+          </VAvatar>
+        </VCard>
+      </div>
     </template>
   </VHover>
   <!-- 订阅季弹窗 -->
@@ -536,7 +603,7 @@ function onRemoveSubscribe() {
         </VList>
       </VCardText>
       <div class="my-2 text-center">
-        <VBtn :disabled="seasonsSelected.length === 0" width="30%" @click="subscribeSeasons">
+        <VBtn size="large" :disabled="seasonsSelected.length === 0" width="30%" @click="subscribeSeasons">
           {{ seasonsSelected.length === 0 ? '请选择订阅季' : '提交订阅' }}
         </VBtn>
       </div>

src/components/cards/MediaInfoCard.vue

@@ -4,7 +4,7 @@ import type { Context } from '@/api/types'
 import { isNullOrEmptyObject } from '@/@core/utils'
 
 // 输入参数
-const props = defineProps({
+defineProps({
   context: Object as PropType<Context>,
 })
 
@@ -45,8 +45,7 @@ function openTmdbPage(type: string, tmdbId: number) {
             </template>
           </VImg>
         </div>
-
-        <div>
+        <div class="flex-grow">
           <VCardItem class="pb-1">
             <VCardTitle class="text-center text-md-left">
               {{ context?.media_info?.title || context?.meta_info?.name }}

src/components/cards/MediaServerCard.vue

@@ -185,7 +185,7 @@ onMounted(() => {
         <VImg :src="getIcon" cover class="mt-7 me-3" max-width="3rem" min-width="3rem" />
       </VCardText>
     </VCard>
-    <VDialog v-model="mediaServerInfoDialog" scrollable max-width="40rem" persistent>
+    <VDialog v-if="mediaServerInfoDialog" v-model="mediaServerInfoDialog" scrollable max-width="40rem" persistent>
       <VCard :title="`${props.mediaserver.name} - 配置`" class="rounded-t">
         <DialogCloseBtn v-model="mediaServerInfoDialog" />
         <VDivider />

src/components/cards/MessageCard.vue

@@ -1,4 +1,5 @@
 <script lang="ts" setup>
+import { isNullOrEmptyObject } from '@/@core/utils'
 import type { Message } from '@/api/types'
 import { formatDateDifference } from '@core/utils/formatters'
 
@@ -45,24 +46,31 @@ function replaceNewLine(value: string) {
 </script>
 
 <template>
-  <VCard variant="tonal" :width="props.width" :height="props.height" @click="openLink">
+  <VCard variant="tonal" :width="props.width" :height="props.height" @click="openLink" max-width="23rem">
     <div v-if="props.message?.image" class="relative text-center card-cover-blurred">
       <VImg
         :src="props.message?.image"
-        aspect-ratio="4/3"
+        aspect-ratio="3/2"
         cover
+        position="top"
         :class="{ shadow: isImageLoaded }"
         @load="imageLoaded"
         @error="imageLoadError = true"
       />
     </div>
     <div
-      v-if="props.message?.title && !props.message?.image && !props.message?.note"
+      v-if="
+        props.message?.title &&
+        !props.message?.text &&
+        !props.message?.image &&
+        isNullOrEmptyObject(props.message?.note) &&
+        props.message?.action === 0
+      "
       class="rounded-md text-body-1 py-2 px-4 elevation-2 bg-primary text-white chat-right mb-1"
     >
       <p class="mb-0">{{ props.message?.title }}</p>
     </div>
-    <VCardTitle v-else-if="props.message?.title">
+    <VCardTitle v-else-if="props.message?.title" class="break-words whitespace-break-spaces">
       {{ props.message?.title }}
     </VCardTitle>
     <div
@@ -72,13 +80,13 @@ function replaceNewLine(value: string) {
       <p class="mb-0">{{ props.message?.text }}</p>
     </div>
     <VCardText v-if="props.message?.text && props.message?.action === 1" v-html="replaceNewLine(props.message?.text)" />
-    <VCardText v-if="props.message?.note">
+    <VCardText v-if="!isNullOrEmptyObject(props.message?.note)">
       <VList>
         <VListItem v-for="(value, key) in noteToJson()" :key="key" two-line>
-          <VListItemTitle v-if="value.title_year" class="font-bold">
+          <VListItemTitle v-if="value.title_year" class="font-bold break-words whitespace-break-spaces">
             {{ key + 1 }}. {{ value.title_year }}
           </VListItemTitle>
-          <VListItemTitle v-if="value.enclosure" class="font-bold whitespace-break-spaces">
+          <VListItemTitle v-if="value.enclosure" class="font-bold break-words whitespace-break-spaces">
             {{ key + 1 }}. {{ value.title }} {{ value.volume_factor }} ↑{{ value.seeders }}
           </VListItemTitle>
           <VListItemSubtitle v-if="value.type">

src/components/cards/NotificationChannelCard.vue

@@ -7,7 +7,7 @@ import synologychat_image from '@images/logos/synologychat.png'
 import slack_image from '@images/logos/slack.webp'
 import chrome_image from '@images/logos/chrome.png'
 import { useToast } from 'vue-toast-notification'
-import { cloneDeep } from "lodash"
+import { cloneDeep } from 'lodash'
 
 // 定义输入
 const props = defineProps({
@@ -132,7 +132,7 @@ function onClose() {
         <VImg :src="getIcon" cover class="mt-7 me-3" max-width="3rem" />
       </VCardText>
     </VCard>
-    <VDialog v-model="notificationInfoDialog" scrollable max-width="40rem" persistent>
+    <VDialog v-if="notificationInfoDialog" v-model="notificationInfoDialog" scrollable max-width="40rem" persistent>
       <VCard :title="`${props.notification.name} - 配置`" class="rounded-t">
         <DialogCloseBtn v-model="notificationInfoDialog" />
         <VDivider />

src/components/cards/PluginAppCard.vue

@@ -43,11 +43,8 @@ const imageLoadError = ref(false)
 // 更新日志弹窗
 const releaseDialog = ref(false)
 
-// 计算插件标签
-const pluginLabels = computed(() => {
-  if (!props.plugin?.plugin_label) return []
-  return props.plugin.plugin_label.split(',')
-})
+// 插件详情弹窗
+const detailDialog = ref(false)
 
 // 图片加载完成
 async function imageLoaded() {
@@ -76,7 +73,7 @@ async function installPlugin() {
 
     if (result.success) {
       $toast.success(`插件 ${props.plugin?.plugin_name} 安装成功！`)
-
+      detailDialog.value = false
       // 通知父组件刷新
       emit('install')
     } else {
@@ -149,80 +146,141 @@ const dropdownItems = ref([
 </script>
 
 <template>
-  <VCard :width="props.width" :height="props.height" @click="installPlugin" class="flex flex-col">
-    <div class="me-n3 absolute bottom-0 right-3">
-      <IconBtn>
-        <VIcon icon="mdi-dots-vertical" />
-        <VMenu activator="parent" close-on-content-click>
-          <VList>
-            <VListItem
-              v-for="(item, i) in dropdownItems"
-              v-show="item.show"
-              :key="i"
-              variant="plain"
-              @click="item.props.click"
-            >
-              <template #prepend>
-                <VIcon :icon="item.props.prependIcon" />
-              </template>
-              <VListItemTitle v-text="item.title" />
-            </VListItem>
-          </VList>
-        </VMenu>
-      </IconBtn>
-    </div>
-    <div
-      class="relative flex flex-row items-start pa-3 justify-between grow"
-      :style="{ background: `${backgroundColor}` }"
-    >
+  <div>
+    <VCard :width="props.width" :height="props.height" @click="detailDialog = true" class="flex flex-col h-full">
       <div
-        class="absolute inset-0 bg-cover bg-center"
-        :style="{ background: `${backgroundColor}`, filter: 'brightness(0.5)' }"
-      ></div>
-      <div class="relative flex-1 min-w-0">
-        <VCardTitle class="text-white px-2 text-shadow whitespace-nowrap overflow-hidden text-ellipsis">
-          {{ props.plugin?.plugin_name }}
-          <span class="text-sm text-gray-200">v{{ props.plugin?.plugin_version }}</span>
-        </VCardTitle>
-        <VCardText class="text-white px-2 py-1 text-shadow line-clamp-3">
-          {{ props.plugin?.plugin_desc }}
-        </VCardText>
+        class="relative flex flex-row items-start pa-3 justify-between grow"
+        :style="{ background: `${backgroundColor}` }"
+      >
+        <div
+          class="absolute inset-0 bg-cover bg-center"
+          :style="{ background: `${backgroundColor}`, filter: 'brightness(0.5)' }"
+        ></div>
+        <div class="relative flex-1 min-w-0">
+          <VCardTitle class="text-white text-lg px-2 text-shadow whitespace-nowrap overflow-hidden text-ellipsis ...">
+            {{ props.plugin?.plugin_name }}
+            <span class="text-sm text-gray-200">v{{ props.plugin?.plugin_version }}</span>
+          </VCardTitle>
+          <VCardText class="text-white text-sm px-2 py-0 text-shadow overflow-hidden line-clamp-3 ...">
+            {{ props.plugin?.plugin_desc }}
+          </VCardText>
+        </div>
+        <div class="relative flex-shrink-0 self-center">
+          <VAvatar size="64">
+            <VImg
+              ref="imageRef"
+              :src="iconPath"
+              aspect-ratio="4/3"
+              cover
+              :class="{ shadow: isImageLoaded }"
+              @load="imageLoaded"
+              @error="imageLoadError = true"
+            />
+          </VAvatar>
+        </div>
       </div>
-      <div class="relative flex-shrink-0 self-center">
-        <VAvatar size="64">
-          <VImg
-            ref="imageRef"
-            :src="iconPath"
-            aspect-ratio="4/3"
-            cover
-            :class="{ shadow: isImageLoaded }"
-            @load="imageLoaded"
-            @error="imageLoadError = true"
-          />
-        </VAvatar>
-      </div>
-    </div>
-    <VCardText class="flex flex-none align-self-baseline py-3 w-full align-end">
-      <span>
-        <VIcon icon="mdi-github" class="me-1" />
-        <a :href="props.plugin?.author_url" target="_blank" @click.stop>
-          {{ props.plugin?.plugin_author }}
-        </a>
-      </span>
-      <span v-if="props.count" class="ms-3">
-        <VIcon icon="mdi-download" />
-        <span class="text-sm ms-1 mt-1">{{ props.count?.toLocaleString() }}</span>
-      </span>
-    </VCardText>
-  </VCard>
-  <!-- 安装插件进度框 -->
-  <ProgressDialog v-if="progressDialog" v-model="progressDialog" :text="progressText" />
-  <!-- 更新日志 -->
-  <VDialog v-if="releaseDialog" v-model="releaseDialog" width="600" scrollable>
-    <VCard :title="`${props.plugin?.plugin_name} 更新说明`">
-      <DialogCloseBtn @click="releaseDialog = false" />
-      <VDivider />
-      <VersionHistory :history="props.plugin?.history" />
+      <VCardText class="flex flex-none align-self-baseline py-3 w-full align-end">
+        <span>
+          <VIcon icon="mdi-github" class="me-1" />
+          <a :href="props.plugin?.author_url" target="_blank" @click.stop>
+            {{ props.plugin?.plugin_author }}
+          </a>
+        </span>
+        <span v-if="props.count" class="ms-3">
+          <VIcon icon="mdi-download" />
+          <span class="text-sm ms-1 mt-1">{{ props.count?.toLocaleString() }}</span>
+        </span>
+        <div class="me-n3 absolute bottom-1 right-3">
+          <IconBtn>
+            <VIcon icon="mdi-dots-vertical" />
+            <VMenu activator="parent" close-on-content-click>
+              <VList>
+                <VListItem
+                  v-for="(item, i) in dropdownItems"
+                  v-show="item.show"
+                  :key="i"
+                  variant="plain"
+                  @click="item.props.click"
+                >
+                  <template #prepend>
+                    <VIcon :icon="item.props.prependIcon" />
+                  </template>
+                  <VListItemTitle v-text="item.title" />
+                </VListItem>
+              </VList>
+            </VMenu>
+          </IconBtn>
+        </div>
+      </VCardText>
     </VCard>
-  </VDialog>
+    <!-- 安装插件进度框 -->
+    <ProgressDialog v-if="progressDialog" v-model="progressDialog" :text="progressText" />
+    <!-- 更新日志 -->
+    <VDialog v-if="releaseDialog" v-model="releaseDialog" width="600" scrollable>
+      <VCard :title="`${props.plugin?.plugin_name} 更新说明`">
+        <DialogCloseBtn @click="releaseDialog = false" />
+        <VDivider />
+        <VersionHistory :history="props.plugin?.history" />
+      </VCard>
+    </VDialog>
+    <!-- 插件详情-->
+    <VDialog v-if="detailDialog" v-model="detailDialog" max-width="30rem">
+      <VCard>
+        <DialogCloseBtn @click="detailDialog = false" />
+        <VCardText>
+          <VCol>
+            <div class="d-flex justify-space-between flex-wrap flex-md-nowrap flex-column flex-md-row">
+              <div class="mx-auto mt-5">
+                <VAvatar size="64">
+                  <VImg
+                    ref="imageRef"
+                    :src="iconPath"
+                    aspect-ratio="4/3"
+                    cover
+                    :class="{ shadow: isImageLoaded }"
+                    @load="imageLoaded"
+                    @error="imageLoadError = true"
+                  />
+                </VAvatar>
+              </div>
+              <div class="flex-grow">
+                <VCardItem>
+                  <VCardTitle class="text-center text-md-left">
+                    {{ props.plugin?.plugin_name }}
+                  </VCardTitle>
+                  <VCardSubtitle
+                    class="text-center text-md-left break-words whitespace-break-spaces line-clamp-4 overflow-hidden text-ellipsis ..."
+                  >
+                    {{ props.plugin?.plugin_desc }}
+                  </VCardSubtitle>
+                  <VList lines="one">
+                    <VListItem class="ps-0">
+                      <VListItemTitle class="text-center text-md-left">
+                        <span class="font-weight-medium">版本：</span>
+                        <span class="text-body-1"> v{{ props.plugin?.plugin_version }}</span>
+                      </VListItemTitle>
+                    </VListItem>
+                    <VListItem class="ps-0">
+                      <VListItemTitle class="text-center text-md-left">
+                        <span class="font-weight-medium">作者：</span>
+                        <span class="text-body-1 cursor-pointer" @click="visitPluginPage">
+                          {{ props.plugin?.plugin_author }}
+                        </span>
+                      </VListItemTitle>
+                    </VListItem>
+                  </VList>
+                  <div class="text-center text-md-left">
+                    <VBtn color="primary" @click="installPlugin" prepend-icon="mdi-download"> 安装到本地 </VBtn>
+                    <div class="text-xs mt-2" v-if="props.count">
+                      <VIcon icon="mdi-fire" />共 {{ props.count?.toLocaleString() }} 次下载
+                    </div>
+                  </div>
+                </VCardItem>
+              </div>
+            </div>
+          </VCol>
+        </VCardText>
+      </VCard>
+    </VDialog>
+  </div>
 </template>

src/components/cards/PluginCard.vue

@@ -1,7 +1,6 @@
 <script lang="ts" setup>
 import { useToast } from 'vue-toast-notification'
 import { useConfirm } from 'vuetify-use-dialog'
-import { VIcon } from 'vuetify/lib/components/index.mjs'
 import api from '@/api'
 import type { Plugin } from '@/api/types'
 import FormRender from '@/components/render/FormRender.vue'
@@ -15,6 +14,8 @@ import ProgressDialog from '../dialog/ProgressDialog.vue'
 
 // 显示器宽度
 const display = useDisplay()
+// APP
+const appMode = inject('pwaMode') && display.mdAndDown.value
 
 // 输入参数
 const props = defineProps({
@@ -49,6 +50,9 @@ const pluginConfigDialog = ref(false)
 // 插件配置表单数据
 const pluginConfigForm = ref({})
 
+// 菜单显示状态
+const menuVisible = ref(false)
+
 // 进度框
 const progressDialog = ref(false)
 
@@ -390,130 +394,167 @@ watch(
 </script>
 
 <template>
-  <!-- 插件卡片 -->
-  <VCard v-if="isVisible" :width="props.width" :height="props.height" @click="openPluginDetail" class="flex flex-col">
-    <div class="me-n3 absolute bottom-0 right-3">
-      <IconBtn>
-        <VIcon icon="mdi-dots-vertical" />
-        <VMenu activator="parent" close-on-content-click>
-          <VList>
-            <VListItem
-              v-for="(item, i) in dropdownItems"
-              v-show="item.show"
-              :key="i"
-              variant="plain"
-              :base-color="item.props.color"
-              @click="item.props.click"
-            >
-              <template #prepend>
-                <VIcon :icon="item.props.prependIcon" />
-              </template>
-              <VListItemTitle v-text="item.title" />
-            </VListItem>
-          </VList>
-        </VMenu>
-      </IconBtn>
-    </div>
-    <div
-      class="relative flex flex-row items-start pa-3 justify-between grow"
-      :style="{ background: `${backgroundColor}` }"
+  <div>
+    <!-- 插件卡片 -->
+    <VHover>
+      <template #default="hover">
+        <VCard
+          v-if="isVisible"
+          v-bind="hover.props"
+          :width="props.width"
+          :height="props.height"
+          @click="openPluginDetail"
+          class="flex flex-col h-full"
+        >
+          <div
+            class="relative flex flex-row items-start pa-3 justify-between grow"
+            :style="{ background: `${backgroundColor}` }"
+          >
+            <div
+              class="absolute inset-0 bg-cover bg-center"
+              :style="{ background: `${backgroundColor}`, filter: 'brightness(0.5)' }"
+            />
+            <div class="relative flex-1 min-w-0">
+              <VCardTitle class="text-white text-lg px-2 text-shadow whitespace-nowrap overflow-hidden text-ellipsis">
+                <VBadge v-if="props.plugin?.state" dot inline color="success" />
+                {{ props.plugin?.plugin_name }}
+                <span class="text-sm mt-1 text-gray-200"> v{{ props.plugin?.plugin_version }} </span>
+              </VCardTitle>
+              <VCardText class="px-2 py-0 text-white text-sm text-shadow overflow-hidden line-clamp-3 ...">
+                {{ props.plugin?.plugin_desc }}
+              </VCardText>
+            </div>
+            <div class="relative flex-shrink-0 self-center">
+              <VAvatar size="64">
+                <VImg
+                  ref="imageRef"
+                  :src="iconPath"
+                  aspect-ratio="4/3"
+                  cover
+                  :class="{ shadow: isImageLoaded }"
+                  @load="imageLoaded"
+                  @error="imageLoadError = true"
+                />
+              </VAvatar>
+            </div>
+          </div>
+          <VCardText class="flex flex-none align-self-baseline py-3 w-full align-end">
+            <span class="author-info">
+              <VImg :src="authorPath" class="author-avatar" @load="isAvatarLoaded = true">
+                <VIcon v-if="!isAvatarLoaded" icon="mdi-github" class="me-1" />
+              </VImg>
+              <a :href="props.plugin?.author_url" target="_blank" @click.stop>
+                {{ props.plugin?.plugin_author }}
+              </a>
+            </span>
+            <span v-if="props.count" class="ms-3">
+              <VIcon icon="mdi-download" />
+              <span class="text-sm ms-1 mt-1">{{ props.count?.toLocaleString() }}</span>
+            </span>
+            <div class="me-n3 absolute bottom-1 right-3">
+              <IconBtn>
+                <VIcon icon="mdi-dots-vertical" />
+                <VMenu v-model="menuVisible" activator="parent" close-on-content-click>
+                  <VList>
+                    <VListItem
+                      v-for="(item, i) in dropdownItems"
+                      v-show="item.show"
+                      :key="i"
+                      variant="plain"
+                      :base-color="item.props.color"
+                      @click="item.props.click"
+                    >
+                      <template #prepend>
+                        <VIcon :icon="item.props.prependIcon" />
+                      </template>
+                      <VListItemTitle v-text="item.title" />
+                    </VListItem>
+                  </VList>
+                </VMenu>
+              </IconBtn>
+            </div>
+          </VCardText>
+          <div v-if="hover.isHovering" class="me-n3 absolute top-0 right-5">
+            <VIcon class="cursor-move text-white">mdi-drag</VIcon>
+          </div>
+          <div v-else-if="props.plugin?.has_update" class="me-n3 absolute top-0 right-5">
+            <VIcon icon="mdi-new-box" class="text-white" />
+          </div>
+        </VCard>
+      </template>
+    </VHover>
+
+    <!-- 插件配置页面 -->
+    <VDialog
+      v-if="pluginConfigDialog"
+      v-model="pluginConfigDialog"
+      scrollable
+      max-width="60rem"
+      :fullscreen="!display.mdAndUp.value"
     >
-      <div
-        class="absolute inset-0 bg-cover bg-center"
-        :style="{ background: `${backgroundColor}`, filter: 'brightness(0.5)' }"
-      />
-      <div class="relative flex-1 min-w-0">
-        <VCardTitle class="text-white px-2 text-shadow whitespace-nowrap overflow-hidden text-ellipsis">
-          <VBadge v-if="props.plugin?.state" dot inline color="success" />
-          {{ props.plugin?.plugin_name }}
-          <span class="text-sm mt-1 text-gray-200">v{{ props.plugin?.plugin_version }}</span>
-        </VCardTitle>
-        <VCardText class="px-2 py-1 text-white text-shadow line-clamp-3">
-          {{ props.plugin?.plugin_desc }}
+      <VCard :title="`${props.plugin?.plugin_name} - 配置`" class="rounded-t">
+        <DialogCloseBtn v-model="pluginConfigDialog" />
+        <VDivider />
+        <VCardText>
+          <FormRender v-for="(item, index) in pluginFormItems" :key="index" :config="item" :model="pluginConfigForm" />
         </VCardText>
-      </div>
-      <div class="relative flex-shrink-0 self-center">
-        <VAvatar size="64">
-          <VImg
-            ref="imageRef"
-            :src="iconPath"
-            aspect-ratio="4/3"
-            cover
-            :class="{ shadow: isImageLoaded }"
-            @load="imageLoaded"
-            @error="imageLoadError = true"
-          />
-        </VAvatar>
-      </div>
-    </div>
-    <VCardText class="flex flex-none align-self-baseline py-3 w-full align-end">
-      <span class="author-info">
-        <VImg :src="authorPath" class="author-avatar" @load="isAvatarLoaded = true">
-          <VIcon v-if="!isAvatarLoaded" icon="mdi-github" class="me-1" />
-        </VImg>
-        <a :href="props.plugin?.author_url" target="_blank" @click.stop>
-          {{ props.plugin?.plugin_author }}
-        </a>
-      </span>
-      <span v-if="props.count" class="ms-3">
-        <VIcon icon="mdi-download" />
-        <span class="text-sm ms-1 mt-1">{{ props.count?.toLocaleString() }}</span>
-      </span>
-    </VCardText>
-    <div v-if="props.plugin?.has_update" class="me-n3 absolute top-0 right-5">
-      <VIcon icon="mdi-new-box" class="text-white" />
-    </div>
-  </VCard>
+        <VCardActions class="pt-3">
+          <VBtn v-if="pluginPageItems.length > 0" @click="showPluginInfo" variant="outlined" color="info">
+            查看数据
+          </VBtn>
+          <VSpacer />
+          <VBtn @click="savePluginConf" variant="elevated" prepend-icon="mdi-content-save" class="px-5"> 保存 </VBtn>
+        </VCardActions>
+      </VCard>
+    </VDialog>
 
-  <!-- 插件配置页面 -->
-  <VDialog v-model="pluginConfigDialog" scrollable max-width="60rem" :fullscreen="!display.mdAndUp.value">
-    <VCard :title="`${props.plugin?.plugin_name} - 配置`" class="rounded-t">
-      <DialogCloseBtn v-model="pluginConfigDialog" />
-      <VDivider />
-      <VCardText>
-        <FormRender v-for="(item, index) in pluginFormItems" :key="index" :config="item" :form="pluginConfigForm" />
-      </VCardText>
-      <VCardActions class="pt-3">
-        <VBtn v-if="pluginPageItems.length > 0" @click="showPluginInfo" variant="outlined" color="info">
-          查看数据
-        </VBtn>
-        <VSpacer />
-        <VBtn @click="savePluginConf" variant="elevated" prepend-icon="mdi-content-save" class="px-5"> 保存 </VBtn>
-      </VCardActions>
-    </VCard>
-  </VDialog>
+    <!-- 插件数据页面 -->
+    <VDialog
+      v-if="pluginInfoDialog"
+      v-model="pluginInfoDialog"
+      scrollable
+      max-width="80rem"
+      :fullscreen="!display.mdAndUp.value"
+    >
+      <VCard :title="`${props.plugin?.plugin_name}`" class="rounded-t">
+        <DialogCloseBtn v-model="pluginInfoDialog" />
+        <VCardText class="min-h-40">
+          <PageRender @action="loadPluginPage" v-for="(item, index) in pluginPageItems" :key="index" :config="item" />
+        </VCardText>
+        <VFab
+          icon="mdi-cog"
+          location="bottom"
+          size="x-large"
+          fixed
+          app
+          appear
+          @click="showPluginConfig"
+          :class="{ 'mb-10': appMode }"
+        />
+      </VCard>
+    </VDialog>
 
-  <!-- 插件数据页面 -->
-  <VDialog v-model="pluginInfoDialog" scrollable max-width="80rem" :fullscreen="!display.mdAndUp.value">
-    <VCard :title="`${props.plugin?.plugin_name}`" class="rounded-t">
-      <DialogCloseBtn v-model="pluginInfoDialog" />
-      <VCardText class="min-h-40">
-        <PageRender @action="loadPluginPage" v-for="(item, index) in pluginPageItems" :key="index" :config="item" />
-      </VCardText>
-      <VFab icon="mdi-cog" location="bottom" size="x-large" fixed app appear @click="showPluginConfig" />
-    </VCard>
-  </VDialog>
+    <!-- 进度框 -->
+    <ProgressDialog v-if="progressDialog" v-model="progressDialog" :text="progressText" />
 
-  <!-- 进度框 -->
-  <ProgressDialog v-if="progressDialog" v-model="progressDialog" :text="progressText" />
-
-  <!-- 更新日志 -->
-  <VDialog v-if="releaseDialog" v-model="releaseDialog" width="600" scrollable>
-    <VCard :title="`${props.plugin?.plugin_name} 更新说明`">
-      <DialogCloseBtn @click="releaseDialog = false" />
-      <VDivider />
-      <VersionHistory :history="props.plugin?.history" />
-      <VDivider />
-      <VCardText>
-        <VBtn @click="updatePlugin" block>
-          <template #prepend>
-            <VIcon icon="mdi-arrow-up-circle-outline" />
-          </template>
-          更新到最新版本
-        </VBtn>
-      </VCardText>
-    </VCard>
-  </VDialog>
+    <!-- 更新日志 -->
+    <VDialog v-if="releaseDialog" v-model="releaseDialog" width="600" scrollable>
+      <VCard :title="`${props.plugin?.plugin_name} 更新说明`">
+        <DialogCloseBtn @click="releaseDialog = false" />
+        <VDivider />
+        <VersionHistory :history="props.plugin?.history" />
+        <VDivider />
+        <VCardItem>
+          <VBtn @click="updatePlugin" block>
+            <template #prepend>
+              <VIcon icon="mdi-arrow-up-circle-outline" />
+            </template>
+            更新到最新版本
+          </VBtn>
+        </VCardItem>
+      </VCard>
+    </VDialog>
+  </div>
 </template>
 
 <style lang="scss" scoped>

src/components/cards/PosterCard.vue

@@ -31,7 +31,7 @@ const getImgUrl = computed(() => {
 })
 
 // 跳转播放
-function goPlay(isHovering = false) {
+function goPlay(isHovering: boolean | null = false) {
   if (props.media?.link && isHovering) window.open(props.media?.link, '_blank')
 }
 </script>
@@ -48,13 +48,11 @@ function goPlay(isHovering = false) {
           'transition transform-cpu duration-300 scale-105 shadow-lg': hover.isHovering,
           'ring-1': isImageLoaded,
         }"
-        @click.stop="goPlay(hover.isHovering)"
       >
         <VImg
           aspect-ratio="2/3"
           :src="getImgUrl"
           class="object-cover aspect-w-2 aspect-h-3"
-          :class="hover.isHovering ? 'on-hover' : ''"
           cover
           @load="isImageLoaded = true"
           @error="imageLoadError = true"
@@ -78,7 +76,9 @@ function goPlay(isHovering = false) {
         <!-- 详情 -->
         <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"
+          class="w-full h-full flex flex-col flex-wrap justify-end align-left text-white absolute bottom-0 cursor-pointer pa-2 pb-5"
+          style="background: linear-gradient(rgba(45, 55, 72, 40%) 0%, rgba(45, 55, 72, 90%) 100%)"
+          @click.stop="goPlay(hover.isHovering)"
         >
           <span class="font-bold">{{ props.media?.subtitle }}</span>
           <h1 class="mb-1 text-white font-extrabold text-xl line-clamp-2 overflow-hidden text-ellipsis ...">
@@ -89,9 +89,3 @@ function goPlay(isHovering = false) {
     </template>
   </VHover>
 </template>
-
-<style lang="scss">
-.on-hover img {
-  @apply brightness-50;
-}
-</style>

src/components/cards/SiteCard.vue

@@ -8,7 +8,6 @@ import SiteCookieUpdateDialog from '../dialog/SiteCookieUpdateDialog.vue'
 import api from '@/api'
 import type { Site, SiteStatistic, SiteUserData } from '@/api/types'
 import { isNullOrEmptyObject } from '@/@core/utils'
-import { VCardActions, VExpandTransition, VProgressLinear, VSpacer } from 'vuetify/lib/components/index.mjs'
 import { formatFileSize } from '@/@core/utils/formatters'
 
 // 输入参数
@@ -27,7 +26,7 @@ const siteIcon = ref<string>('')
 const $toast = useToast()
 
 // 测试按钮文字
-const testButtonText = ref('测试')
+const testButtonText = ref('测试连通性')
 
 // 测试按钮可用性
 const testButtonDisable = ref(false)
@@ -44,9 +43,6 @@ const resourceDialog = ref(false)
 // 用户数据弹窗
 const siteUserDataDialog = ref(false)
 
-// 站点操作显示
-const siteActionShow = ref(false)
-
 // 站点使用统计
 const siteStats = ref<SiteStatistic>({})
 
@@ -69,7 +65,7 @@ async function testSite() {
     if (result.success) $toast.success(`${cardProps.site?.name} 连通性测试成功，可正常使用！`)
     else $toast.error(`${cardProps.site?.name} 连通性测试失败：${result.message}`)
 
-    testButtonText.value = '测试'
+    testButtonText.value = '测试连通性'
     testButtonDisable.value = false
 
     getSiteStats()
@@ -156,7 +152,7 @@ onMounted(() => {
   <div>
     <VCard
       :variant="cardProps.site?.is_active ? 'elevated' : 'outlined'"
-      class="overflow-hidden"
+      class="overflow-hidden h-full flex flex-col"
       @click="siteEditDialog = true"
     >
       <template #image>
@@ -166,10 +162,10 @@ onMounted(() => {
       </template>
       <VCardItem style="padding-block-end: 0">
         <VCardTitle class="font-bold">
-          <span @click.stop="openSitePage">{{ cardProps.site?.name }}</span>
+          {{ cardProps.site?.name }}
         </VCardTitle>
         <VCardSubtitle>
-          <span @click.stop="openSitePage">{{ cardProps.site?.url }}</span>
+          {{ cardProps.site?.url }}
         </VCardSubtitle>
       </VCardItem>
       <VCardText class="py-1">
@@ -195,44 +191,48 @@ onMounted(() => {
         </VTooltip>
       </VCardText>
       <VCardActions>
-        <VBtn
-          :icon="siteActionShow ? 'mdi-chevron-up' : 'mdi-chevron-down'"
-          @click.stop="siteActionShow = !siteActionShow"
-        />
+        <IconBtn>
+          <VIcon icon="mdi-chevron-down" color="primary" />
+          <VMenu activator="parent" close-on-content-click>
+            <VList>
+              <VListItem variant="plain" @click="handleResourceBrowse">
+                <template #prepend>
+                  <VIcon icon="mdi-search-web" />
+                </template>
+                <VListItemTitle>浏览站点资源</VListItemTitle>
+              </VListItem>
+              <VListItem variant="plain" @click="handleSiteUserData">
+                <template #prepend>
+                  <VIcon icon="mdi-chart-bell-curve" />
+                </template>
+                <VListItemTitle>查看站点数据</VListItemTitle>
+              </VListItem>
+              <VListItem variant="plain" :disabled="testButtonDisable" @click.stop="testSite">
+                <template #prepend>
+                  <VIcon icon="mdi-link" />
+                </template>
+                <VListItemTitle>{{ testButtonText }}</VListItemTitle>
+              </VListItem>
+              <VListItem variant="plain" v-if="!cardProps.site?.public" @click="handleSiteUpdate">
+                <template #prepend>
+                  <VIcon icon="mdi-refresh" />
+                </template>
+                <VListItemTitle>更新 Cookie & UA</VListItemTitle>
+              </VListItem>
+              <VListItem variant="plain" @click="openSitePage">
+                <template #prepend>
+                  <VIcon icon="mdi-open-in-new" />
+                </template>
+                <VListItemTitle>访问站点</VListItemTitle>
+              </VListItem>
+            </VList>
+          </VMenu>
+        </IconBtn>
         <span class="text-sm">
           ↑ {{ formatFileSize(cardProps.data?.upload || 0) }} / ↓ {{ formatFileSize(cardProps.data?.download || 0) }}
         </span>
         <VSpacer />
       </VCardActions>
-      <VDivider class="mb-1" v-if="siteActionShow" />
-      <VExpandTransition>
-        <div v-show="siteActionShow" class="py-1 pe-12">
-          <VBtn v-if="!cardProps.site?.public" @click.stop="handleSiteUpdate" variant="text">
-            <template #prepend>
-              <VIcon icon="mdi-refresh" />
-            </template>
-            更新
-          </VBtn>
-          <VBtn :disabled="testButtonDisable" @click.stop="testSite" variant="text">
-            <template #prepend>
-              <VIcon icon="mdi-link" />
-            </template>
-            {{ testButtonText }}
-          </VBtn>
-          <VBtn @click.stop="handleResourceBrowse" variant="text">
-            <template #prepend>
-              <VIcon icon="mdi-web" />
-            </template>
-            浏览
-          </VBtn>
-          <VBtn @click.stop="handleSiteUserData" variant="text">
-            <template #prepend>
-              <VIcon icon="mdi-chart-bell-curve" />
-            </template>
-            数据
-          </VBtn>
-        </div>
-      </VExpandTransition>
       <StatIcon v-if="cardProps.site?.is_active" :color="statColor" />
       <span class="absolute top-1 right-8">
         <VIcon class="cursor-move">mdi-drag</VIcon>

src/components/cards/SubscribeCard.vue

@@ -38,11 +38,11 @@ const subscribeFilesDialog = ref(false)
 // 分享订阅弹窗
 const subscribeShareDialog = ref(false)
 
-// 定义一个变量来保存当前的订阅状态
+// 当前的订阅状态
 const subscribeState = ref<string>(props.media?.state ?? 'P')
 
 // 上一次更新时间
-const lastUpdateText = ref(props.media && props.media.last_update ? formatDateDifference(props.media.last_update) : '')
+const lastUpdateText = computed(() => (props.media?.last_update ? formatDateDifference(props.media.last_update) : ''))
 
 // 图片加载完成响应
 function imageLoadHandler() {
@@ -116,7 +116,7 @@ async function resetSubscribe() {
   try {
     const isConfirmed = await createConfirm({
       title: '确认',
-      content: `重置后 ${props.media?.name} 已下载记录将被清除，未入库的剧集将会重新下载，是否确认？`,
+      content: `重置后 ${props.media?.name} 将恢复初始状态，已下载记录将被清除，未入库的内容将会重新下载，是否确认？`,
     })
     if (!isConfirmed) return
     // 重置
@@ -124,6 +124,7 @@ async function resetSubscribe() {
     // 提示
     if (result.success) {
       $toast.success(`${props.media?.name} 重置成功！`)
+      subscribeState.value = 'R'
       emit('save')
     } else $toast.error(`${props.media?.name} 重置失败：${result.message}`)
   } catch (e) {
@@ -141,12 +142,22 @@ async function editSubscribeDialog() {
   subscribeEditDialog.value = true
 }
 
+// 获得mediaid
+function getMediaId() {
+  if (props.media?.tmdbid) return `tmdb:${props.media?.tmdbid}`
+  else if (props.media?.doubanid) return `douban:${props.media?.doubanid}`
+  else if (props.media?.bangumiid) return `bangumi:${props.media?.bangumiid}`
+  else return props.media?.mediaid
+}
+
 // 查看媒体详情
 async function viewMediaDetail() {
   router.push({
     path: '/media',
     query: {
-      mediaid: `${props.media?.tmdbid ? `tmdb:${props.media?.tmdbid}` : `douban:${props.media?.doubanid}`}`,
+      mediaid: getMediaId(),
+      title: props.media?.name,
+      year: props.media?.year,
       type: props.media?.type,
     },
   })
@@ -208,7 +219,6 @@ const dropdownItems = computed(() => [
       click: resetSubscribe,
       color: 'warning',
     },
-    show: props.media?.type === '电视剧',
   },
   {
     title: '分享',
@@ -239,6 +249,14 @@ watch(
   },
 )
 
+// 监听订阅状态
+watch(
+  () => props.media?.state,
+  newState => {
+    subscribeState.value = newState ?? 'P'
+  },
+)
+
 // 计算backdrop图片地址
 const backdropUrl = computed(() => {
   const url = props.media?.backdrop || props.media?.poster
@@ -271,134 +289,136 @@ function onSubscribeEditRemove() {
 </script>
 
 <template>
-  <VHover>
-    <template #default="hover">
-      <VCard
-        v-bind="hover.props"
-        :key="props.media?.id"
-        class="flex flex-col rounded-lg"
-        :class="{
-          'outline-dashed outline-1': props.media?.best_version && imageLoaded,
-          'transition transform-cpu duration-300 scale-105 shadow-lg': hover.isHovering,
-          'opacity-70': subscribeState === 'S',
-        }"
-        min-height="170"
-        @click="editSubscribeDialog"
-      >
-        <div class="me-n3 absolute top-1 right-2">
-          <IconBtn>
-            <VIcon icon="mdi-dots-vertical" color="white" />
-            <VMenu activator="parent" close-on-content-click>
-              <VList>
-                <template v-for="(item, i) in dropdownItems" :key="i">
-                  <VListItem
-                    v-if="item.show !== false"
-                    variant="plain"
-                    :base-color="item.props.color"
-                    @click="item.props.click"
-                  >
-                    <template #prepend>
-                      <VIcon :icon="item.props.prependIcon" />
-                    </template>
-                    <VListItemTitle v-text="item.title" />
-                  </VListItem>
-                </template>
-              </VList>
-            </VMenu>
-          </IconBtn>
-        </div>
-        <template #image>
-          <VImg :src="backdropUrl || posterUrl" aspect-ratio="3/2" cover @load="imageLoadHandler" position="top">
-            <template #placeholder>
-              <div class="w-full h-full">
-                <VSkeletonLoader class="object-cover aspect-w-3 aspect-h-2" />
-              </div>
-            </template>
-            <div class="absolute inset-0 subscribe-card-background"></div>
-          </VImg>
-          <div
-            v-if="subscribeState === 'P'"
-            class="absolute inset-0 bg-yellow-900 opacity-40 pointer-events-none"
-          ></div>
-        </template>
-        <div>
-          <VCardText class="flex items-center">
-            <div class="h-auto w-12 flex-shrink-0 overflow-hidden rounded-md shadow-lg" v-if="imageLoaded">
-              <VImg :src="posterUrl" aspect-ratio="2/3" cover @click.stop="viewMediaDetail">
-                <template #placeholder>
-                  <div class="w-full h-full">
-                    <VSkeletonLoader class="object-cover aspect-w-2 aspect-h-3" />
-                  </div>
-                </template>
-              </VImg>
-            </div>
-            <div class="flex flex-col justify-center overflow-hidden pl-2 xl:pl-4">
-              <div class="text-sm font-medium text-white sm:pt-1">{{ props.media?.year }}</div>
-              <div class="mr-2 min-w-0 text-lg font-bold text-white">
-                {{ props.media?.name }}
-                {{ formatSeason(props.media?.season ? props.media?.season.toString() : '') }}
-              </div>
-            </div>
-          </VCardText>
-          <VCardText class="flex justify-space-between align-center flex-wrap">
-            <div class="flex align-center">
-              <IconBtn
-                v-if="props.media?.total_episode"
-                v-bind="props"
-                icon="mdi-progress-download"
-                color="white"
-                class="me-1"
-              />
-              <div v-if="props.media?.season" class="text-subtitle-2 me-4 text-white">
-                {{ (props.media?.total_episode || 0) - (props.media?.lack_episode || 0) }} /
-                {{ props.media?.total_episode }}
-              </div>
-              <IconBtn v-if="props.media?.username" icon="mdi-account" color="white" class="me-1" />
-              <span v-if="props.media?.username" class="text-subtitle-2 me-4 text-white">
-                {{ props.media?.username }}
-              </span>
-            </div>
-          </VCardText>
-          <VCardText v-if="lastUpdateText" class="absolute right-0 bottom-0 d-flex align-center p-2 text-gray-300">
-            <VIcon icon="mdi-download" class="me-1" />
-            {{ lastUpdateText }}
-          </VCardText>
-          <div class="w-full absolute bottom-0">
-            <VProgressLinear
-              v-if="getPercentage() > 0"
-              :model-value="getPercentage()"
-              bg-color="success"
-              color="success"
-            />
+  <div>
+    <VHover>
+      <template #default="hover">
+        <VCard
+          v-bind="hover.props"
+          :key="props.media?.id"
+          class="flex flex-col rounded-lg h-full"
+          :class="{
+            'outline-dashed outline-1': props.media?.best_version && imageLoaded,
+            'transition transform-cpu duration-300 scale-105 shadow-lg': hover.isHovering,
+            'opacity-70': subscribeState === 'S',
+          }"
+          min-height="170"
+          @click="editSubscribeDialog"
+        >
+          <div class="me-n3 absolute top-1 right-2">
+            <IconBtn>
+              <VIcon icon="mdi-dots-vertical" color="white" />
+              <VMenu activator="parent" close-on-content-click>
+                <VList>
+                  <template v-for="(item, i) in dropdownItems" :key="i">
+                    <VListItem
+                      v-if="item.show !== false"
+                      variant="plain"
+                      :base-color="item.props.color"
+                      @click="item.props.click"
+                    >
+                      <template #prepend>
+                        <VIcon :icon="item.props.prependIcon" />
+                      </template>
+                      <VListItemTitle v-text="item.title" />
+                    </VListItem>
+                  </template>
+                </VList>
+              </VMenu>
+            </IconBtn>
           </div>
-        </div>
-      </VCard>
-    </template>
-  </VHover>
-  <!-- 订阅编辑弹窗 -->
-  <SubscribeEditDialog
-    v-if="subscribeEditDialog"
-    v-model="subscribeEditDialog"
-    :subid="props.media?.id"
-    @remove="onSubscribeEditRemove"
-    @save="onSubscribeEditSave"
-    @close="subscribeEditDialog = false"
-  />
+          <template #image>
+            <VImg :src="backdropUrl || posterUrl" aspect-ratio="3/2" cover @load="imageLoadHandler" position="top">
+              <template #placeholder>
+                <div class="w-full h-full">
+                  <VSkeletonLoader class="object-cover aspect-w-3 aspect-h-2" />
+                </div>
+              </template>
+              <div class="absolute inset-0 subscribe-card-background"></div>
+            </VImg>
+            <div v-if="subscribeState === 'P'" class="absolute inset-0 bg-yellow-900 opacity-80 pointer-events-none" />
+          </template>
+          <div>
+            <VCardText class="flex items-center">
+              <div class="h-auto w-12 flex-shrink-0 overflow-hidden rounded-md shadow-lg" v-if="imageLoaded">
+                <VImg :src="posterUrl" aspect-ratio="2/3" cover @click.stop="viewMediaDetail">
+                  <template #placeholder>
+                    <div class="w-full h-full">
+                      <VSkeletonLoader class="object-cover aspect-w-2 aspect-h-3" />
+                    </div>
+                  </template>
+                </VImg>
+              </div>
+              <div class="flex flex-col justify-center overflow-hidden pl-2 xl:pl-4">
+                <div class="text-sm font-medium text-white sm:pt-1">{{ props.media?.year }}</div>
+                <div class="mr-2 min-w-0 text-lg font-bold text-white">
+                  {{ props.media?.name }}
+                  {{ formatSeason(props.media?.season ? props.media?.season.toString() : '') }}
+                </div>
+              </div>
+            </VCardText>
+            <VCardText class="flex justify-space-between align-center flex-wrap">
+              <div class="flex align-center">
+                <IconBtn
+                  v-if="props.media?.total_episode"
+                  v-bind="props"
+                  icon="mdi-progress-download"
+                  color="white"
+                  class="me-1"
+                />
+                <div v-if="props.media?.season" class="text-subtitle-2 me-4 text-white">
+                  {{ (props.media?.total_episode || 0) - (props.media?.lack_episode || 0) }} /
+                  {{ props.media?.total_episode }}
+                </div>
+                <IconBtn v-if="props.media?.username" icon="mdi-account" color="white" class="me-1" />
+                <span v-if="props.media?.username" class="text-subtitle-2 me-4 text-white">
+                  {{ props.media?.username }}
+                </span>
+              </div>
+            </VCardText>
+            <VCardText v-if="lastUpdateText" class="absolute right-0 bottom-0 d-flex align-center p-2 text-gray-300">
+              <VIcon icon="mdi-download" class="me-1" />
+              {{ lastUpdateText }}
+            </VCardText>
+            <div class="w-full absolute bottom-0">
+              <VProgressLinear
+                v-if="getPercentage() > 0"
+                :model-value="getPercentage()"
+                bg-color="success"
+                color="success"
+              />
+            </div>
+            <div v-if="hover.isHovering" class="me-n3 absolute top-1 right-10">
+              <IconBtn><VIcon class="cursor-move text-white">mdi-drag</VIcon></IconBtn>
+            </div>
+          </div>
+        </VCard>
+      </template>
+    </VHover>
+    <!-- 订阅编辑弹窗 -->
+    <SubscribeEditDialog
+      v-if="subscribeEditDialog"
+      v-model="subscribeEditDialog"
+      :subid="props.media?.id"
+      @remove="onSubscribeEditRemove"
+      @save="onSubscribeEditSave"
+      @close="subscribeEditDialog = false"
+    />
 
-  <!-- 订阅文件信息弹窗 -->
-  <SubscribeFilesDialog
-    v-if="subscribeFilesDialog"
-    v-model="subscribeFilesDialog"
-    :subid="props.media?.id"
-    @close="subscribeFilesDialog = false"
-  />
-  <!-- 分享订阅弹窗 -->
-  <SubscribeShareDialog
-    v-if="subscribeShareDialog"
-    v-model="subscribeShareDialog"
-    :sub="props.media"
-    @close="subscribeShareDialog = false"
-  />
+    <!-- 订阅文件信息弹窗 -->
+    <SubscribeFilesDialog
+      v-if="subscribeFilesDialog"
+      v-model="subscribeFilesDialog"
+      :subid="props.media?.id"
+      @close="subscribeFilesDialog = false"
+    />
+    <!-- 分享订阅弹窗 -->
+    <SubscribeShareDialog
+      v-if="subscribeShareDialog"
+      v-model="subscribeShareDialog"
+      :sub="props.media"
+      @close="subscribeShareDialog = false"
+    />
+  </div>
 </template>
 <style lang="scss">
 .subscribe-card-background {

src/components/cards/SubscribeShareCard.vue

@@ -1,23 +1,17 @@
 <script lang="ts" setup>
 import { formatDateDifference } from '@/@core/utils/formatters'
-import api from '@/api'
-import { doneNProgress, startNProgress } from '@/api/nprogress'
 import type { SubscribeShare } from '@/api/types'
 import router from '@/router'
-import { useToast } from 'vue-toast-notification'
-import { useConfirm } from 'vuetify-use-dialog'
 import SubscribeEditDialog from '../dialog/SubscribeEditDialog.vue'
+import ForkSubscribeDialog from '../dialog/ForkSubscribeDialog.vue'
 
 // 输入参数
 const props = defineProps({
   media: Object as PropType<SubscribeShare>,
 })
 
-// 提示框
-const $toast = useToast()
-
-// 确认框
-const createConfirm = useConfirm()
+// 定义删除事件
+const emit = defineEmits(['delete'])
 
 // 从 provide 中获取全局设置
 const globalSettings: any = inject('globalSettings')
@@ -28,6 +22,9 @@ const imageLoaded = ref(false)
 // 订阅编辑弹窗
 const subscribeEditDialog = ref(false)
 
+// 复用订阅弹窗
+const forkSubscribeDialog = ref(false)
+
 // 订阅ID
 const subscribeId = ref<number>()
 
@@ -57,121 +54,128 @@ const posterUrl = computed(() => {
   return url
 })
 
+// 获得mediaid
+function getMediaId() {
+  if (props.media?.tmdbid) return `tmdb:${props.media?.tmdbid}`
+  else if (props.media?.doubanid) return `douban:${props.media?.doubanid}`
+}
+
 // 查看媒体详情
 async function viewMediaDetail() {
   router.push({
     path: '/media',
     query: {
-      mediaid: `${props.media?.tmdbid ? `tmdb:${props.media?.tmdbid}` : `douban:${props.media?.doubanid}`}`,
+      mediaid: getMediaId(),
+      title: props.media?.name,
+      year: props.media?.year,
       type: props.media?.type,
     },
   })
 }
 
 // 复用订阅
-async function forkSubscribe() {
-  // 开始处理
-  startNProgress()
-  try {
-    // 确认
-    const isConfirmed = await createConfirm({
-      title: '确认',
-      content: `是否确认添加来自 ${props.media?.share_user} 分享的订阅：${props.media?.share_title}？`,
-    })
-    if (!isConfirmed) return
+function showForkSubscribe() {
+  forkSubscribeDialog.value = true
+}
 
-    // 请求API
-    const result: { [key: string]: any } = await api.post('subscribe/fork', props.media)
+// 完成复用订阅
+function finishForkSubscribe(subid: number) {
+  subscribeId.value = subid
+  forkSubscribeDialog.value = false
+  subscribeEditDialog.value = true
+}
 
-    // 订阅状态
-    if (result.success) {
-      $toast.success(`${props.media?.share_title} 添加订阅成功！`)
-      // 弹出订阅编辑弹窗
-      subscribeId.value = result.data.id
-      subscribeEditDialog.value = true
-    } else {
-      $toast.error(`${props.media?.share_title} 添加订阅失败：${result.message}！`)
-    }
-  } catch (error) {
-    console.error(error)
-  } finally {
-    doneNProgress()
-  }
+// 删除订阅分享时处理
+function doDelete() {
+  forkSubscribeDialog.value = false
+  // 通知父组件刷新
+  emit('delete')
 }
 </script>
 
 <template>
-  <VHover>
-    <template #default="hover">
-      <VCard
-        v-bind="hover.props"
-        :key="props.media?.id"
-        class="flex flex-col rounded-lg"
-        :class="{
-          'transition transform-cpu duration-300 scale-105 shadow-lg': hover.isHovering,
-        }"
-        min-height="170"
-        @click="forkSubscribe"
-      >
-        <template #image>
-          <VImg :src="backdropUrl || posterUrl" aspect-ratio="3/2" cover @load="imageLoadHandler" position="top">
-            <template #placeholder>
-              <div class="w-full h-full">
-                <VSkeletonLoader class="object-cover aspect-w-3 aspect-h-2" />
+  <div class="h-full">
+    <VHover>
+      <template #default="hover">
+        <VCard
+          v-bind="hover.props"
+          :key="props.media?.id"
+          class="flex flex-col rounded-lg h-full"
+          :class="{
+            'transition transform-cpu duration-300 scale-105 shadow-lg': hover.isHovering,
+          }"
+          min-height="170"
+          @click="showForkSubscribe"
+        >
+          <template #image>
+            <VImg :src="backdropUrl || posterUrl" aspect-ratio="3/2" cover @load="imageLoadHandler" position="top">
+              <template #placeholder>
+                <div class="w-full h-full">
+                  <VSkeletonLoader class="object-cover aspect-w-3 aspect-h-2" />
+                </div>
+              </template>
+              <div class="absolute inset-0 subscribe-card-background"></div>
+            </VImg>
+          </template>
+          <div class="h-full flex flex-col">
+            <VCardText class="flex items-center pb-1 grow">
+              <div class="h-auto w-12 flex-shrink-0 overflow-hidden rounded-md shadow-lg" v-if="imageLoaded">
+                <VImg :src="posterUrl" aspect-ratio="2/3" cover @click.stop="viewMediaDetail">
+                  <template #placeholder>
+                    <div class="w-full h-full">
+                      <VSkeletonLoader class="object-cover aspect-w-2 aspect-h-3" />
+                    </div>
+                  </template>
+                </VImg>
               </div>
-            </template>
-            <div class="absolute inset-0 subscribe-card-background"></div>
-          </VImg>
-        </template>
-        <div>
-          <VCardText class="flex items-center pb-1">
-            <div class="h-auto w-12 flex-shrink-0 overflow-hidden rounded-md shadow-lg" v-if="imageLoaded">
-              <VImg :src="posterUrl" aspect-ratio="2/3" cover @click.stop="viewMediaDetail">
-                <template #placeholder>
-                  <div class="w-full h-full">
-                    <VSkeletonLoader class="object-cover aspect-w-2 aspect-h-3" />
-                  </div>
-                </template>
-              </VImg>
-            </div>
-            <div class="flex flex-col justify-center pl-2 xl:pl-4">
-              <div class="mr-2 min-w-0 text-lg font-bold text-white line-clamp-2 overflow-hidden text-ellipsis ...">
-                {{ props.media?.share_title }}
+              <div class="flex flex-col justify-center pl-2 xl:pl-4">
+                <div class="mr-2 min-w-0 text-lg font-bold text-white line-clamp-2 overflow-hidden text-ellipsis ...">
+                  {{ props.media?.share_title }}
+                </div>
+                <div class="text-sm font-medium text-gray-200 sm:pt-1 line-clamp-3 overflow-hidden text-ellipsis ...">
+                  {{ props.media?.share_comment }}
+                </div>
               </div>
-              <div class="text-sm font-medium text-gray-200 sm:pt-1 line-clamp-3 overflow-hidden text-ellipsis ...">
-                {{ props.media?.share_comment }}
+            </VCardText>
+            <VCardText class="flex justify-space-between align-center flex-wrap">
+              <div class="flex align-center">
+                <IconBtn v-bind="props" icon="mdi-account" color="white" class="me-1" />
+                <div class="text-subtitle-2 me-4 text-white">
+                  {{ props.media?.share_user }}
+                </div>
+                <IconBtn v-if="props.media?.count" icon="mdi-fire" color="white" class="me-1" />
+                <span v-if="props.media?.count" class="text-subtitle-2 me-4 text-white">
+                  {{ props.media?.count.toLocaleString() }}
+                </span>
               </div>
-            </div>
-          </VCardText>
-          <VCardText class="flex justify-space-between align-center flex-wrap">
-            <div class="flex align-center">
-              <IconBtn v-bind="props" icon="mdi-account" color="white" class="me-1" />
-              <div class="text-subtitle-2 me-4 text-white">
-                {{ props.media?.share_user }}
-              </div>
-              <IconBtn v-if="props.media?.count" icon="mdi-fire" color="error" class="me-1" />
-              <span v-if="props.media?.count" class="text-subtitle-2 me-4 text-white">
-                {{ props.media?.count.toLocaleString() }}
-              </span>
-            </div>
-          </VCardText>
-          <VCardText class="absolute right-0 bottom-0 d-flex align-center p-2 text-gray-300">
-            <VIcon icon="mdi-calcdar" class="me-1" />
-            {{ dateText }}
-          </VCardText>
-        </div>
-      </VCard>
-    </template>
-  </VHover>
-  <!-- 订阅编辑弹窗 -->
-  <SubscribeEditDialog
-    v-if="subscribeEditDialog"
-    v-model="subscribeEditDialog"
-    :subid="subscribeId"
-    @close="subscribeEditDialog = false"
-    @save="subscribeEditDialog = false"
-    @remove="subscribeEditDialog = false"
-  />
+            </VCardText>
+            <VCardText class="absolute right-0 bottom-0 d-flex align-center p-2 text-gray-300">
+              <VIcon icon="mdi-calcdar" class="me-1" />
+              {{ dateText }}
+            </VCardText>
+          </div>
+        </VCard>
+      </template>
+    </VHover>
+    <!-- 订阅编辑弹窗 -->
+    <SubscribeEditDialog
+      v-if="subscribeEditDialog"
+      v-model="subscribeEditDialog"
+      :subid="subscribeId"
+      @close="subscribeEditDialog = false"
+      @save="subscribeEditDialog = false"
+      @remove="subscribeEditDialog = false"
+    />
+    <!-- 复用订阅弹窗 -->
+    <ForkSubscribeDialog
+      v-if="forkSubscribeDialog"
+      v-model="forkSubscribeDialog"
+      :media="props.media"
+      @close="forkSubscribeDialog = false"
+      @fork="finishForkSubscribe"
+      @delete="doDelete"
+    />
+  </div>
 </template>
 <style lang="scss">
 .subscribe-card-background {

src/components/dialog/ForkSubscribeDialog.vue

@@ -0,0 +1,277 @@
+<script setup lang="ts">
+import api from '@/api'
+import { doneNProgress, startNProgress } from '@/api/nprogress'
+import { SubscribeShare } from '@/api/types'
+import router from '@/router'
+import { useToast } from 'vue-toast-notification'
+import { VBtn } from 'vuetify/lib/components/index.mjs'
+
+// 输入参数
+const props = defineProps({
+  media: Object as PropType<SubscribeShare>,
+})
+
+// 定义事件
+const emit = defineEmits(['fork', 'delete', 'close'])
+
+// 从 provide 中获取全局设置
+const globalSettings: any = inject('globalSettings')
+
+// 提示框
+const $toast = useToast()
+
+// 处理中
+const processing = ref(false)
+
+// 删除中
+const deleting = ref(false)
+
+// 是否折叠
+const isExpanded = ref(false)
+
+// follow用户列表
+const followUsers = ref<string[]>([])
+
+// 当前用户是否已follow
+const isFollowed = computed(() => followUsers.value.includes(props.media?.share_uid || ''))
+
+// 折叠展开
+function toggleExpand() {
+  isExpanded.value = !isExpanded.value
+}
+
+// 加载follow用户列表
+async function queryFollowUsers() {
+  try {
+    const result: { [key: string]: any } = await api.get('system/setting/FollowSubscribers')
+    followUsers.value = result.data?.value ?? []
+  } catch (error) {
+    console.log(error)
+  }
+}
+
+// follow用户
+async function followUser() {
+  try {
+    const result: { [key: string]: any } = await api.post(`subscribe/follow?share_uid=${props.media?.share_uid}`)
+    if (result.success) {
+      queryFollowUsers()
+    }
+  } catch (error) {
+    console.log(error)
+  }
+}
+
+// unfollow用户
+async function unfollowUser() {
+  try {
+    const result: { [key: string]: any } = await api.delete('subscribe/follow', {
+      params: {
+        share_uid: props.media?.share_uid,
+      },
+    })
+    if (result.success) {
+      queryFollowUsers()
+    }
+  } catch (error) {
+    console.log(error)
+  }
+}
+
+// 计算海报图片地址
+const posterUrl = computed(() => {
+  const url = props.media?.poster
+  // 使用图片缓存
+  if (globalSettings.GLOBAL_IMAGE_CACHE && url)
+    return `${import.meta.env.VITE_API_BASE_URL}system/cache/image?url=${encodeURIComponent(url)}`
+  return url
+})
+
+// 获得mediaid
+function getMediaId() {
+  if (props.media?.tmdbid) return `tmdb:${props.media?.tmdbid}`
+  else if (props.media?.doubanid) return `douban:${props.media?.doubanid}`
+}
+
+// 查看媒体详情
+async function viewMediaDetail() {
+  router.push({
+    path: '/media',
+    query: {
+      mediaid: getMediaId(),
+      title: props.media?.name,
+      year: props.media?.year,
+      type: props.media?.type,
+    },
+  })
+}
+
+// 复用订阅
+async function doFork() {
+  // 开始处理
+  startNProgress()
+  try {
+    processing.value = true
+    // 请求API
+    const result: { [key: string]: any } = await api.post('subscribe/fork', props.media)
+    // 订阅状态
+    if (result.success) {
+      $toast.success(`${props.media?.share_title} 添加订阅成功！`)
+      // 完成
+      emit('fork', result.data.id)
+    } else {
+      $toast.error(`${props.media?.share_title} 添加订阅失败：${result.message}！`)
+    }
+  } catch (error) {
+    console.error(error)
+  } finally {
+    processing.value = false
+    doneNProgress()
+  }
+}
+
+// 删除订阅分享
+async function doDelete() {
+  // 开始处理
+  startNProgress()
+  try {
+    deleting.value = true
+    // 请求API
+    const result: { [key: string]: any } = await api.delete(`subscribe/share/${props.media?.id}`, {
+      params: {
+        share_uid: globalSettings.USER_UNIQUE_ID,
+      },
+    })
+    // 订阅状态
+    if (result.success) {
+      $toast.success(`${props.media?.share_title} 取消分享成功！`)
+      // 完成
+      emit('delete', result.data.id)
+    } else {
+      $toast.error(`${props.media?.share_title} 取消分享失败：${result.message}！`)
+    }
+  } catch (error) {
+    console.error(error)
+  } finally {
+    deleting.value = false
+    doneNProgress()
+  }
+}
+
+onMounted(() => {
+  queryFollowUsers()
+})
+</script>
+<template>
+  <VDialog max-width="40rem" scrollable>
+    <VCard>
+      <DialogCloseBtn @click="emit('close')" />
+      <VCardText>
+        <VCol>
+          <div class="d-flex justify-space-between flex-wrap flex-md-nowrap flex-column flex-md-row">
+            <div class="ma-auto">
+              <VImg
+                width="10rem"
+                aspect-ratio="2/3"
+                class="object-cover aspect-w-2 aspect-h-3 rounded-lg ring-1 ring-gray-500"
+                :src="posterUrl"
+                @click="viewMediaDetail"
+                cover
+              >
+                <template #placeholder>
+                  <div class="w-full h-full">
+                    <VSkeletonLoader class="object-cover aspect-w-2 aspect-h-3" />
+                  </div>
+                </template>
+              </VImg>
+            </div>
+            <div class="flex-grow">
+              <VCardItem>
+                <VCardTitle
+                  class="text-center text-md-left break-words whitespace-break-spaces line-clamp-2 overflow-hidden text-ellipsis"
+                >
+                  {{ props.media?.share_title }}
+                </VCardTitle>
+                <VCardSubtitle
+                  class="text-center text-md-left break-words whitespace-break-spaces line-clamp-4 overflow-hidden text-ellipsis"
+                >
+                  {{ props.media?.share_comment }}
+                </VCardSubtitle>
+                <VList lines="one">
+                  <VListItem class="ps-0">
+                    <VListItemTitle class="text-center text-md-left">
+                      <span class="font-weight-medium">分享人：</span>
+                      <span class="text-body-1"> {{ media?.share_user }}</span>
+                    </VListItemTitle>
+                  </VListItem>
+                  <VListItem class="ps-0" v-if="media?.keyword">
+                    <VListItemTitle class="text-center text-md-left">
+                      <span class="font-weight-medium">搜索词：</span>
+                      <span class="text-body-1"> {{ media?.keyword }}</span>
+                    </VListItemTitle>
+                  </VListItem>
+                  <VListItem class="ps-0" v-if="media?.custom_words" @click.stop="toggleExpand">
+                    <VListItemTitle
+                      class="text-center text-md-left break-words whitespace-break-spaces"
+                      :class="{
+                        'line-clamp-4 overflow-hidden text-ellipsis': !isExpanded,
+                      }"
+                    >
+                      <span class="font-weight-medium">识别词：</span>
+                      <span class="text-body-1"> {{ media?.custom_words }}</span>
+                    </VListItemTitle>
+                  </VListItem>
+                </VList>
+                <div class="text-center text-md-left">
+                  <div>
+                    <VBtn
+                      color="primary"
+                      :disabled="processing"
+                      @click="doFork"
+                      prepend-icon="mdi-heart"
+                      :loading="processing"
+                    >
+                      订阅
+                    </VBtn>
+                    <VBtn
+                      v-if="props.media?.share_uid && props.media?.share_uid === globalSettings.USER_UNIQUE_ID"
+                      color="error"
+                      :disabled="deleting"
+                      @click="doDelete"
+                      prepend-icon="mdi-delete"
+                      :loading="deleting"
+                      class="ms-2"
+                    >
+                      取消分享
+                    </VBtn>
+                    <VBtn
+                      v-else-if="isFollowed && props.media?.share_uid"
+                      color="warning"
+                      @click="unfollowUser"
+                      prepend-icon="mdi-account-remove"
+                      class="ms-2"
+                    >
+                      取消关注
+                    </VBtn>
+                    <VBtn
+                      v-else-if="props.media?.share_uid"
+                      @click="followUser"
+                      color="info"
+                      prepend-icon="mdi-account-plus"
+                      class="ms-2"
+                    >
+                      关注
+                    </VBtn>
+                  </div>
+                  <div class="text-xs mt-2" v-if="props.media?.count">
+                    <VIcon icon="mdi-fire" />共 {{ props.media?.count?.toLocaleString() }} 次复用
+                  </div>
+                </div>
+              </VCardItem>
+            </div>
+          </div>
+        </VCol>
+      </VCardText>
+    </VCard>
+  </VDialog>
+</template>

src/components/dialog/MediaInfoDialog.vue

@@ -0,0 +1,22 @@
+<script setup lang="ts">
+import { Context } from '@/api/types'
+import MediaInfoCard from '../cards/MediaInfoCard.vue'
+
+// 输入参数
+defineProps({
+  context: Object as PropType<Context>,
+})
+
+// 定义事件
+const emit = defineEmits(['close'])
+</script>
+<template>
+  <VDialog max-width="50rem">
+    <VCard>
+      <DialogCloseBtn @click="emit('close')" />
+      <VCardItem>
+        <MediaInfoCard :context="context" />
+      </VCardItem>
+    </VCard>
+  </VDialog>
+</template>

src/components/dialog/PluginMarketSettingDialog.vue

@@ -34,7 +34,7 @@ async function saveHandle() {
     if (result.success) {
       $toast.success('插件仓库保存成功')
       emit('save')
-    } else $toast.error('插件仓库保存失败！')
+    } else $toast.error(`插件仓库保存失败：${result?.message}！`)
   } catch (error) {
     console.log(error)
   }

src/components/dialog/ReorganizeDialog.vue

@@ -49,7 +49,7 @@ const progressEventSource = ref<EventSource>()
 const progressDialog = ref(false)
 
 // 整理进度文本
-const progressText = ref('请稍候 ...')
+const progressText = ref('正在处理 ...')
 
 // 整理进度
 const progressValue = ref(0)
@@ -65,6 +65,14 @@ const dialogTitle = computed(() => {
   return '手动整理'
 })
 
+// 禁用指定集数
+const disableEpisodeDetail = computed(() => {
+  if (props.items) {
+    if (transferForm.episode_format) return false
+    return !(props.items.length === 1 && props.items[0].type !== 'dir')
+  }
+})
+
 // 表单
 const transferForm = reactive<TransferForm>({
   fileitem: {} as FileItem,
@@ -119,9 +127,35 @@ watch(
       transferForm.library_type_folder = undefined
       transferForm.library_category_folder = undefined
     }
-  }
+  },
 )
 
+// 整理文件
+async function handleTransfer(item: FileItem, background: boolean = false) {
+  transferForm.fileitem = item
+  transferForm.logid = 0
+  try {
+    const result: { [key: string]: any } = await api.post(`transfer/manual?background=${background}`, transferForm)
+    if (!result.success) $toast.error(result.message)
+    else if (background) $toast.success(`文件 ${item.name} 已加入整理队列！`)
+  } catch (e) {
+    console.log(e)
+  }
+}
+
+// 整理日志
+async function handleTransferLog(logid: number, background: boolean = false) {
+  transferForm.logid = logid
+  transferForm.fileitem = {} as FileItem
+  try {
+    const result: { [key: string]: any } = await api.post(`transfer/manual?background=${background}`, transferForm)
+    if (!result.success) $toast.error(result.message)
+    else if (background) $toast.success(`历史记录 ${logid} 已加入整理队列！`)
+  } catch (e) {
+    console.log(e)
+  }
+}
+
 // 使用SSE监听加载进度
 function startLoadingProgress() {
   progressText.value = '请稍候 ...'
@@ -141,63 +175,49 @@ function stopLoadingProgress() {
 }
 
 // 整理文件
-async function transfer() {
+async function transfer(background: boolean = false) {
   if (!props.logids && !props.items) return
 
   // 显示进度条
   progressDialog.value = true
-  // 开始监听进度
-  startLoadingProgress()
+
+  if (!background) {
+    // 开始监听进度
+    startLoadingProgress()
+  }
 
   // 文件整理
   if (props.items) {
     for (const item of props.items) {
-      await handleTransfer(item)
+      await handleTransfer(item, background)
     }
   }
 
   // 日志整理
   if (props.logids) {
     for (const logid of props.logids) {
-      await handleTransferLog(logid)
+      await handleTransferLog(logid, background)
     }
   }
 
-  // 停止监听进度
-  stopLoadingProgress()
+  if (!background) {
+    // 停止监听进度
+    stopLoadingProgress()
+  }
+
   // 关闭进度条
   progressDialog.value = false
   // 重新加载
   emit('done')
 }
 
-// 整理文件
-async function handleTransfer(item: FileItem) {
-  transferForm.fileitem = item
-  transferForm.logid = 0
-  try {
-    const result: { [key: string]: any } = await api.post('transfer/manual', transferForm)
-    if (!result.success) $toast.error(`文件 ${item.path} 整理失败：${result.message}！`)
-  } catch (e) {
-    console.log(e)
-  }
-}
-
-// 整理日志
-async function handleTransferLog(logid: number) {
-  transferForm.logid = logid
-  transferForm.fileitem = {} as FileItem
-  try {
-    const result: { [key: string]: any } = await api.post('transfer/manual', transferForm)
-    if (!result.success) $toast.error(`历史记录 ${logid} 重新整理失败：${result.message}！`)
-  } catch (e) {
-    console.log(e)
-  }
-}
-
 onMounted(() => {
   loadDirectories()
 })
+
+onUnmounted(() => {
+  stopLoadingProgress()
+})
 </script>
 
 <template>
@@ -224,7 +244,8 @@ onMounted(() => {
                 label="整理方式"
                 :items="transferTypeOptions"
                 hint="文件操作整理方式"
-                persistent-hint>
+                persistent-hint
+              >
                 <template v-slot:selection="{ item }">
                   {{ transferForm.transfer_type === '' ? '自动' : item.title }}
                 </template>
@@ -305,6 +326,7 @@ onMounted(() => {
             <VCol cols="12" md="4">
               <VTextField
                 v-model="transferForm.episode_detail"
+                :disabled="disableEpisodeDetail"
                 label="指定集数"
                 placeholder="起始集,终止集，如1或1,2"
                 hint="指定集数或范围，如1或1,2"
@@ -369,7 +391,7 @@ onMounted(() => {
               <VSwitch
                 v-model="transferForm.from_history"
                 label="复用历史识别信息"
-                hint="使用历史记录中已识别的媒体信息"
+                hint="使用历史整理记录中已识别的媒体信息"
                 persistent-hint
               />
             </VCol>
@@ -378,7 +400,12 @@ onMounted(() => {
       </VCardText>
       <VCardActions class="pt-3">
         <VSpacer />
-        <VBtn variant="elevated" @click="transfer" prepend-icon="mdi-arrow-right-bold" class="px-5"> 开始整理 </VBtn>
+        <VBtn variant="elevated" color="success" @click="transfer(true)" prepend-icon="mdi-plus" class="px-5">
+          加入整理队列
+        </VBtn>
+        <VBtn variant="elevated" @click="transfer(false)" prepend-icon="mdi-arrow-right-bold" class="px-5">
+          立即整理
+        </VBtn>
       </VCardActions>
     </VCard>
     <!-- 手动整理进度框 -->

src/components/dialog/SiteCookieUpdateDialog.vue

@@ -67,17 +67,18 @@ async function updateSiteCookie() {
 }
 </script>
 <template>
-  <VDialog max-width="50rem">
+  <VDialog max-width="30rem">
     <!-- Dialog Content -->
     <VCard title="更新站点Cookie & UA">
       <DialogCloseBtn @click="emit('close')" />
+      <VDivider />
       <VCardText>
         <VForm @submit.prevent="() => {}">
           <VRow>
-            <VCol cols="12" md="4">
+            <VCol cols="12">
               <VTextField v-model="userPwForm.username" label="用户名" :rules="[requiredValidator]" />
             </VCol>
-            <VCol cols="12" md="4">
+            <VCol cols="12">
               <VTextField
                 v-model="userPwForm.password"
                 label="密码"
@@ -88,19 +89,19 @@ async function updateSiteCookie() {
                 @keydown.enter="updateSiteCookie"
               />
             </VCol>
-            <VCol cols="12" md="4">
+            <VCol cols="12">
               <VTextField v-model="userPwForm.code" label="两步验证" />
             </VCol>
           </VRow>
         </VForm>
       </VCardText>
-
-      <VCardActions>
-        <VSpacer />
+      <VCardActions class="mx-auto">
         <VBtn
+          size="large"
           variant="elevated"
           @click="updateSiteCookie"
           :disabled="updateButtonDisable"
+          :loading="updateButtonDisable"
           prepend-icon="mdi-refresh"
           class="px-5"
         >

src/components/dialog/SiteResourceDialog.vue

@@ -99,11 +99,21 @@ onMounted(() => {
 })
 </script>
 <template>
-  <VDialog max-width="80rem" scrollable z-index="1010" :fullscreen="!display.mdAndUp.value">
-    <VCard :title="`浏览 - ${props.site?.name}`">
-      <DialogCloseBtn @click="emit('close')" />
-      <VDivider />
-      <VCardText class="pt-2">
+  <VDialog scrollable fullscreen :scrim="false" transition="dialog-bottom-transition">
+    <VCard>
+      <!-- Toolbar -->
+      <div>
+        <VToolbar color="primary">
+          <VToolbarTitle>{{ `浏览 - ${props.site?.name}` }}</VToolbarTitle>
+          <VSpacer />
+          <VToolbarItems>
+            <VBtn icon variant="plain" @click="emit('close')" class="me-3">
+              <VIcon size="large" color="white" icon="ri-close-line" />
+            </VBtn>
+          </VToolbarItems>
+        </VToolbar>
+      </div>
+      <VCardText class="px-0 py-0 my-0">
         <VDataTable
           v-model:items-per-page="resourceItemsPerPage"
           :headers="resourceHeaders"
@@ -119,6 +129,7 @@ onMounted(() => {
           items-per-page-text="每页条数"
           page-text="{0}-{1} 共 {2} 条"
           loading-text="加载中..."
+          class="h-full"
         >
           <template #item.title="{ item }">
             <a href="javascript:void(0)" @click.stop="addDownload(item)">

src/components/dialog/SiteUserDataDialog.vue

@@ -2,9 +2,7 @@
 import type { Site, SiteUserData } from '@/api/types'
 import api from '@/api'
 import { useDisplay, useTheme } from 'vuetify'
-import { VAvatar, VCardText, VIcon } from 'vuetify/lib/components/index.mjs'
 import { formatFileSize } from '@/@core/utils/formatters'
-import VueApexCharts from 'vue3-apexcharts'
 import ProgressDialog from '@/components/dialog/ProgressDialog.vue'
 
 // 显示器宽度
@@ -34,7 +32,6 @@ const siteDatas = ref<SiteUserData[]>([])
 // 最新一天的数据
 const siteData = computed(() => siteDatas.value[siteDatas.value.length - 1])
 
-
 // 站点数据列表中的上传量、下载量数据生成图形使用的数据
 const historySeries = computed(() => {
   return [
@@ -243,13 +240,12 @@ async function fetchSiteUserData() {
   }
 }
 
-
 // 刷新站点数据
-async function refreshSiteData(){
+async function refreshSiteData() {
   progressDialog.value = true
   try {
     const result: { [key: string]: any } = await api.post(`site/userdata/${props.site?.id}`)
-    if (result.success){
+    if (result.success) {
       await fetchSiteUserData()
     }
   } catch (error) {
@@ -267,12 +263,14 @@ onBeforeMount(async () => {
   <VDialog scrollable eager max-width="80rem" :fullscreen="!display.mdAndUp.value">
     <VCard class="rounded-t">
       <VCardItem>
-        <VCardTitle>{{ `数据 - ${props.site?.name}` }}
-        <IconBtn @click.stop="refreshSiteData" color="info"><VIcon icon="mdi-refresh"</VIcon></IconBtn>
+        <VCardTitle
+          >{{ `数据 - ${props.site?.name}` }}
+          <IconBtn @click.stop="refreshSiteData" color="info"><VIcon icon="mdi-refresh" /></IconBtn>
         </VCardTitle>
         <DialogCloseBtn @click="emit('close')" />
       </VCardItem>
-      <VCardText>
+      <VDivider />
+      <VCardText class="pt-5">
         <VRow class="match-height">
           <!-- 用户信息 -->
           <VCol cols="12" md="3">
@@ -441,7 +439,7 @@ onBeforeMount(async () => {
           <VCol>
             <VCard title="历史流量">
               <VCardText>
-                <VueApexCharts type="line" :options="historyChartOptions" :series="historySeries" :height="300" />
+                <VApexChart type="line" :options="historyChartOptions" :series="historySeries" :height="300" />
               </VCardText>
             </VCard>
           </VCol>
@@ -450,7 +448,7 @@ onBeforeMount(async () => {
           <VCol>
             <VCard title="做种分布">
               <VCardText>
-                <VueApexCharts type="scatter" :options="seedingChartOptions" :series="seedingSeries" :height="300" />
+                <VApexChart type="scatter" :options="seedingChartOptions" :series="seedingSeries" :height="300" />
               </VCardText>
             </VCard>
           </VCol>

src/components/dialog/SubscribeFilesDialog.vue

@@ -132,59 +132,63 @@ onBeforeMount(() => {
           <VWindow v-model="activeTab" class="mt-5 disable-tab-transition" :touch="false">
             <VWindowItem value="download">
               <transition name="fade-slide" appear>
-                <VDataTable
-                  items-per-page="50"
-                  :headers="downloadHeaders"
-                  :items="downloadInfos"
-                  :items-length="totalCount"
-                  density="compact"
-                  item-value="title"
-                  return-object
-                  fixed-header
-                  hover
-                  items-per-page-text="每页条数"
-                  page-text="{0}-{1} 共 {2} 条"
-                  loading-text="加载中..."
-                >
-                  <template #item.episode_number="{ item }">
-                    <div class="text-high-emphasis pt-1">{{ item.episode_number }}. {{ item.title }}</div>
-                  </template>
-                  <template #item.torrent_title="{ item }">
-                    <div class="text-xs" v-for="file in item.download">
-                      【{{ file.site_name }}】{{ file.torrent_title }}
-                    </div>
-                  </template>
-                  <template #item.file_path="{ item }">
-                    <div class="text-xs" v-for="file in item.download">{{ file.file_path }}</div>
-                  </template>
-                  <template #no-data> 没有数据 </template>
-                </VDataTable>
+                <div>
+                  <VDataTable
+                    items-per-page="50"
+                    :headers="downloadHeaders"
+                    :items="downloadInfos"
+                    :items-length="totalCount"
+                    density="compact"
+                    item-value="title"
+                    return-object
+                    fixed-header
+                    hover
+                    items-per-page-text="每页条数"
+                    page-text="{0}-{1} 共 {2} 条"
+                    loading-text="加载中..."
+                  >
+                    <template #item.episode_number="{ item }">
+                      <div class="text-high-emphasis pt-1">{{ item.episode_number }}. {{ item.title }}</div>
+                    </template>
+                    <template #item.torrent_title="{ item }">
+                      <div class="text-xs" v-for="file in item.download">
+                        【{{ file.site_name }}】{{ file.torrent_title }}
+                      </div>
+                    </template>
+                    <template #item.file_path="{ item }">
+                      <div class="text-xs" v-for="file in item.download">{{ file.file_path }}</div>
+                    </template>
+                    <template #no-data> 没有数据 </template>
+                  </VDataTable>
+                </div>
               </transition>
             </VWindowItem>
             <VWindowItem value="library">
               <transition name="fade-slide" appear>
-                <VDataTable
-                  items-per-page="50"
-                  :headers="libraryHeaders"
-                  :items="libraryInfos"
-                  :items-length="totalCount"
-                  density="compact"
-                  item-value="title"
-                  return-object
-                  fixed-header
-                  hover
-                  items-per-page-text="每页条数"
-                  page-text="{0}-{1} 共 {2} 条"
-                  loading-text="加载中..."
-                >
-                  <template #item.episode_number="{ item }">
-                    <div class="text-high-emphasis pt-1">{{ item.episode_number }}. {{ item.title }}</div>
-                  </template>
-                  <template #item.file_path="{ item }">
-                    <div class="text-xs" v-for="file in item.library">{{ file.file_path }}</div>
-                  </template>
-                  <template #no-data> 没有数据 </template>
-                </VDataTable>
+                <div>
+                  <VDataTable
+                    items-per-page="50"
+                    :headers="libraryHeaders"
+                    :items="libraryInfos"
+                    :items-length="totalCount"
+                    density="compact"
+                    item-value="title"
+                    return-object
+                    fixed-header
+                    hover
+                    items-per-page-text="每页条数"
+                    page-text="{0}-{1} 共 {2} 条"
+                    loading-text="加载中..."
+                  >
+                    <template #item.episode_number="{ item }">
+                      <div class="text-high-emphasis pt-1">{{ item.episode_number }}. {{ item.title }}</div>
+                    </template>
+                    <template #item.file_path="{ item }">
+                      <div class="text-xs" v-for="file in item.library">{{ file.file_path }}</div>
+                    </template>
+                    <template #no-data> 没有数据 </template>
+                  </VDataTable>
+                </div>
               </transition>
             </VWindowItem>
           </VWindow>

src/components/dialog/SubscribeHistoryDialog.vue

@@ -138,14 +138,7 @@ const dropdownItems = ref([
         <VCardTitle>{{ props.type + '订阅历史' }}</VCardTitle>
       </VCardItem>
       <VDivider />
-      <DialogCloseBtn
-        @click="
-          () => {
-            emit('close')
-          }
-        "
-      />
-      <!-- <VList lines="two" v-if="historyList.length > 0"> -->
+      <DialogCloseBtn @click="emit('close')" />
       <VList lines="two">
         <VInfiniteScroll mode="intersect" side="end" :items="historyList" class="overflow-hidden" @load="loadHistory">
           <template #loading>
@@ -207,7 +200,7 @@ const dropdownItems = ref([
           </template>
         </VInfiniteScroll>
       </VList>
-      <VCardText v-if="historyList.length === 0" class="text-center"> 没有已完成的订阅 </VCardText>
+      <VCardText v-if="historyList.length === 0 && isRefreshed" class="text-center"> 没有已完成的订阅 </VCardText>
     </VCard>
     <!-- 进度框 -->
     <ProgressDialog v-if="progressDialog" v-model="progressDialog" :text="progressText" />

src/components/dialog/SubscribeShareDialog.vue

@@ -4,6 +4,7 @@ import { requiredValidator } from '@/@validators'
 import api from '@/api'
 import type { Subscribe, SubscribeShare } from '@/api/types'
 import { useDisplay } from 'vuetify'
+import { formatSeason } from '@/@core/utils/formatters'
 
 // 显示器宽度
 const display = useDisplay()
@@ -16,16 +17,22 @@ const props = defineProps({
 // 定义触发的自定义事件
 const emit = defineEmits(['close'])
 
+// 分享处理状态
+const shareDoing = ref(false)
+
 // 订阅编辑表单
 const shareForm = ref<SubscribeShare>({
   subscribe_id: props.sub?.id ?? 0,
+  share_title: `${props.sub?.name} ${formatSeason(props.sub?.season ? props.sub?.season.toString() : '')}`,
 })
 
 // 分享订阅
 async function doShare() {
   if (!shareForm.value.share_title || !shareForm.value.share_comment || !shareForm.value.share_user) return
   try {
+    shareDoing.value = true
     const result: { [key: string]: any } = await api.post('subscribe/share', shareForm.value)
+    shareDoing.value = false
     // 提示
     if (result.success) {
       $toast.success(`${props.sub?.name} 分享成功！`)
@@ -56,8 +63,8 @@ const $toast = useToast()
             <VCol cols="12">
               <VTextField
                 v-model="shareForm.share_title"
+                readonly
                 label="标题"
-                hint="给分享取一个便于识别的名称"
                 :rules="[requiredValidator]"
                 persistent-hint
               />
@@ -67,7 +74,7 @@ const $toast = useToast()
                 v-model="shareForm.share_comment"
                 label="说明"
                 :rules="[requiredValidator]"
-                hint="关于该订阅的说明"
+                hint="填写关于该订阅的说明，订阅中的搜索词、识别词等将会默认包含在分享中"
                 persistent-hint
               />
             </VCol>
@@ -85,7 +92,16 @@ const $toast = useToast()
       </VCardText>
       <VCardActions class="pt-3">
         <VSpacer />
-        <VBtn variant="elevated" @click="doShare" prepend-icon="mdi-share" class="px-5"> 确认分享 </VBtn>
+        <VBtn
+          variant="elevated"
+          :disabled="shareDoing"
+          @click="doShare"
+          prepend-icon="mdi-share"
+          class="px-5"
+          :loading="shareDoing"
+        >
+          确认分享
+        </VBtn>
       </VCardActions>
     </VCard>
   </VDialog>

src/components/dialog/TransferQueueDialog.vue

@@ -0,0 +1,187 @@
+<script lang="ts" setup>
+import { formatFileSize } from '@/@core/utils/formatters'
+import api from '@/api'
+import { FileItem, TransferQueue } from '@/api/types'
+import { useDisplay } from 'vuetify'
+
+// 显示器宽度
+const display = useDisplay()
+// 定义触发的自定义事件
+const emit = defineEmits(['close'])
+
+// 数据列表
+const dataList = ref<TransferQueue[]>([])
+
+// 加载进度SSE
+const progressEventSource = ref<EventSource>()
+
+// 整理进度文本
+const progressText = ref('请稍候 ...')
+
+// 整理进度
+const progressValue = ref(0)
+
+// 数据可刷新标志
+const refreshFlag = ref(false)
+
+// 活动标签
+const activeTab = ref('')
+
+// 状态标签
+const stateDict: { [key: string]: string } = {
+  'waiting': '等待中',
+  'running': '正在整理',
+  'completed': '完成',
+  'failed': '失败',
+}
+
+// 获取状态颜色
+function getStateColor(state: string) {
+  if (state === 'waiting') return 'gray'
+  else if (state === 'running') return 'primary'
+  else if (state === 'completed') return 'success'
+  else return 'error'
+}
+
+// 从dataList中提取所有的媒体信息
+const mediaList = computed(() => {
+  return dataList.value.map(item => item.media)
+})
+
+// 按media计算总数和完成数，返回 x/x
+function getMediaCount(title_year: string) {
+  // 按title_year查询出所有media列表
+  const medias = dataList.value.filter(item => item.media.title_year === title_year)
+  // 计算media下任务的总数
+  const total = medias.reduce((acc, cur) => acc + cur.tasks.length, 0)
+  // 计算media下任务的完成数
+  const completed = medias.reduce((acc, cur) => acc + cur.tasks.filter(task => task.state === 'completed').length, 0)
+  return `${completed} / ${total}`
+}
+
+// 根据媒体信息获取对应的整理任务
+const activeTasks = computed(() => {
+  return dataList.value.find(item => item.media.title_year === activeTab.value)?.tasks
+})
+
+// 调用API获取队列信息
+async function get_transfer_queue() {
+  try {
+    dataList.value = await api.get('transfer/queue')
+    if (dataList.value.length > 0) {
+      if (!activeTab.value || activeTasks.value?.length == 0) activeTab.value = dataList.value[0].media.title_year || ''
+    }
+  } catch (error) {
+    console.error(error)
+  }
+}
+
+// 移除队列任务
+async function remove_queue_task(fileitem: FileItem) {
+  try {
+    await api.delete(`transfer/queue`, { data: fileitem })
+    get_transfer_queue()
+  } catch (error) {
+    console.error(error)
+  }
+}
+
+// 使用SSE监听加载进度
+function startLoadingProgress() {
+  progressText.value = '请稍候 ...'
+  progressEventSource.value = new EventSource(`${import.meta.env.VITE_API_BASE_URL}system/progress/filetransfer`)
+  progressEventSource.value.onmessage = event => {
+    const progress = JSON.parse(event.data)
+    if (progress) {
+      if (!progress.enable) {
+        progressText.value = '请稍候 ...'
+        progressValue.value = 0
+        if (refreshFlag.value) {
+          refreshFlag.value = false
+          get_transfer_queue()
+        }
+        return
+      }
+      progressText.value = progress.text
+      progressValue.value = progress.value
+      if (progress.value >= 100 && refreshFlag.value) {
+        refreshFlag.value = false
+        get_transfer_queue()
+      } else {
+        if (progress.value > 0 && refreshFlag.value && progress.text?.includes('整理完成')) {
+          refreshFlag.value = false
+          get_transfer_queue()
+        } else {
+          refreshFlag.value = true
+        }
+      }
+    }
+  }
+}
+
+// 停止监听加载进度
+function stopLoadingProgress() {
+  progressEventSource.value?.close()
+}
+
+onMounted(() => {
+  get_transfer_queue()
+  startLoadingProgress()
+})
+
+onUnmounted(() => {
+  stopLoadingProgress()
+})
+</script>
+
+<template>
+  <VDialog scrollable max-width="50rem" :fullscreen="!display.mdAndUp.value">
+    <VCard class="mx-auto" width="100%">
+      <VCardItem>
+        <VCardTitle>整理队列</VCardTitle>
+      </VCardItem>
+      <DialogCloseBtn @click="emit('close')" />
+      <VDivider />
+      <VProgressLinear
+        v-if="dataList.length > 0 && progressValue > 0"
+        :value="progressValue"
+        color="primary"
+        indeterminate
+      />
+      <VCardItem v-if="dataList.length > 0 && progressValue > 0" class="text-center pt-2">
+        <span class="text-sm">{{ progressText }}</span>
+      </VCardItem>
+      <VCardText v-if="dataList.length === 0" class="text-center"> 没有正在整理的任务 </VCardText>
+      <VCardText>
+        <VTabs v-model="activeTab" show-arrows class="v-tabs-pill" stacked>
+          <VTab
+            v-for="media in mediaList"
+            :value="media.title_year"
+            selected-class="v-slide-group-item--active v-tab--selected"
+          >
+            <div class="font-bold text-lg">{{ media.title }}</div>
+            <div>({{ getMediaCount(media.title_year || '') }})</div>
+          </VTab>
+        </VTabs>
+        <VWindow v-model="activeTab" class="mt-5 disable-tab-transition" :touch="false">
+          <VWindowItem v-for="media in mediaList" :value="media.title_year">
+            <VList>
+              <VListItem v-for="task in activeTasks">
+                <VListItemTitle>{{ task.fileitem.name }}</VListItemTitle>
+                <VListItemSubtitle>
+                  大小：{{ formatFileSize(task.fileitem.size || 0) }}
+                  <VChip size="small" :color="getStateColor(task.state)" class="ms-2">
+                    {{ stateDict[task.state] }}
+                  </VChip>
+                </VListItemSubtitle>
+                <template #append>
+                  <IconBtn size="small" icon="mdi-cancel" @click="remove_queue_task(task.fileitem)" />
+                </template>
+              </VListItem>
+            </VList>
+          </VWindowItem>
+        </VWindow>
+      </VCardText>
+    </VCard>
+  </VDialog>
+</template>

src/components/dialog/UserAddEditDialog.vue

@@ -269,41 +269,48 @@ onMounted(() => {
     >
       <DialogCloseBtn @click="emit('close')" />
       <VDivider />
-      <VCardText class="d-flex">
+      <VCardItem>
         <!-- 👉 Avatar -->
-        <VAvatar rounded="lg" size="100" class="me-6" :image="currentAvatar" />
+        <div class="flex flex-row">
+          <VAvatar rounded="lg" size="100" class="me-5" :image="currentAvatar" />
+          <!-- 👉 Upload Photo -->
+          <div class="flex flex-col justify-center gap-5">
+            <div class="flex flex-wrap gap-2">
+              <VBtn color="primary" @click="refInputEl?.click()">
+                <VIcon icon="mdi-cloud-upload-outline" />
+                <span v-if="display.mdAndUp.value" class="ms-2">上传新头像</span>
+              </VBtn>
 
-        <!-- 👉 Upload Photo -->
-        <form class="d-flex flex-column justify-center gap-5">
-          <div class="d-flex flex-wrap gap-2">
-            <VBtn color="primary" @click="refInputEl?.click()">
-              <VIcon icon="mdi-cloud-upload-outline" />
-              <span v-if="display.mdAndUp.value" class="ms-2">上传新头像</span>
-            </VBtn>
+              <input
+                ref="refInputEl"
+                type="file"
+                name="file"
+                accept=".jpeg,.png,.jpg,GIF"
+                hidden
+                @input="changeAvatar"
+              />
 
-            <input ref="refInputEl" type="file" name="file" accept=".jpeg,.png,.jpg,GIF" hidden @input="changeAvatar" />
+              <VBtn type="reset" color="info" variant="tonal" @click="restoreCurrentAvatar" v-if="props.oper !== 'add'">
+                <VIcon icon="mdi-refresh" />
+                <span v-if="display.mdAndUp.value" class="ms-2">重置</span>
+              </VBtn>
 
-            <VBtn type="reset" color="info" variant="tonal" @click="restoreCurrentAvatar" v-if="props.oper !== 'add'">
-              <VIcon icon="mdi-refresh" />
-              <span v-if="display.mdAndUp.value" class="ms-2">重置</span>
-            </VBtn>
-
-            <VBtn
-              type="reset"
-              :color="props.oper === 'add' ? 'info' : 'error'"
-              variant="tonal"
-              @click="resetDefaultAvatar"
-            >
-              <VIcon icon="mdi-image-sync-outline" />
-              <span v-if="display.mdAndUp.value" class="ms-2">默认</span>
-            </VBtn>
+              <VBtn
+                type="reset"
+                :color="props.oper === 'add' ? 'info' : 'error'"
+                variant="tonal"
+                @click="resetDefaultAvatar"
+              >
+                <VIcon icon="mdi-image-sync-outline" />
+                <span v-if="display.mdAndUp.value" class="ms-2">默认</span>
+              </VBtn>
+            </div>
+            <p class="text-body-1 mb-0">允许 JPG、PNG、GIF、WEBP 格式， 最大尺寸 800KB。</p>
           </div>
-
-          <p class="text-body-1 mb-0">允许 JPG、PNG、GIF、WEBP 格式， 最大尺寸 800KB。</p>
-        </form>
-      </VCardText>
+        </div>
+      </VCardItem>
       <VCardText>
-        <VForm @submit.prevent="() => {}" class="mt-3">
+        <VForm @submit.prevent="() => {}">
           <VDivider class="my-10">
             <span>用户基础设置</span>
           </VDivider>
@@ -355,7 +362,7 @@ onMounted(() => {
             </VCol>
           </VRow>
           <VDivider class="my-10">
-            <span>消息账号绑定</span>
+            <span>账号绑定</span>
           </VDivider>
           <VRow>
             <VCol cols="12" md="6">
@@ -388,6 +395,9 @@ onMounted(() => {
                 label="SynologyChat用户"
               />
             </VCol>
+            <VCol cols="12" md="6">
+              <VTextField v-model="userForm.settings.douban_userid" density="comfortable" clearable label="豆瓣用户" />
+            </VCol>
           </VRow>
         </VForm>
       </VCardText>

src/components/dialog/UserAuthDialog.vue

@@ -129,7 +129,7 @@ onMounted(async () => {
 </script>
 
 <template>
-  <VDialog width="40rem" scrollable max-height="85vh">
+  <VDialog width="40rem" max-height="85vh">
     <VCard title="用户认证" class="rounded-t">
       <DialogCloseBtn @click="emit('close')" />
       <VCardText>

src/components/field/CronField.vue

@@ -0,0 +1,46 @@
+<script setup lang="ts">
+import CronInput from '@/components/input/CronInput.vue'
+
+const attrs = useAttrs()
+
+const props = defineProps({
+  modelValue: {
+    type: String,
+    default: '* * * * *',
+  },
+})
+
+const emit = defineEmits(['update:modelValue'])
+
+const innerValue = ref(props.modelValue)
+
+watch(
+  () => props.modelValue,
+  value => {
+    innerValue.value = value
+  },
+)
+
+const propsWithoutModelValue = computed(() => {
+  const { modelValue, ...rest } = props
+  return { ...rest, ...attrs }
+})
+
+function updateModelValue(value: string) {
+  innerValue.value = value
+  emit('update:modelValue', value)
+}
+</script>
+
+<template>
+  <CronInput v-model="innerValue" @update:modelValue="updateModelValue">
+    <template #activator="{ menuprops }">
+      <VTextField
+        :modelValue="innerValue"
+        @update:modelValue="updateModelValue"
+        v-bind="{ ...menuprops, ...propsWithoutModelValue }"
+        clearable
+      />
+    </template>
+  </CronInput>
+</template>

src/components/field/PathField.vue

@@ -0,0 +1,49 @@
+<script setup lang="ts">
+import PathInput from '@/components/input/PathInput.vue'
+
+const attrs = useAttrs()
+
+const props = defineProps({
+  modelValue: {
+    type: String,
+    default: '* * * * *',
+  },
+  storage: {
+    type: String,
+    default: 'local',
+  },
+})
+
+const emit = defineEmits(['update:modelValue'])
+
+const innerValue = ref(props.modelValue)
+
+watch(
+  () => props.modelValue,
+  value => {
+    innerValue.value = value
+  },
+)
+
+const propsWithoutModelValue = computed(() => {
+  const { modelValue, ...rest } = props
+  return { ...rest, ...attrs }
+})
+
+function updateModelValue(value: string) {
+  innerValue.value = value
+  emit('update:modelValue', value)
+}
+</script>
+
+<template>
+  <PathInput v-model="innerValue" :storage="props.storage" @update:modelValue="updateModelValue">
+    <template #activator="{ menuprops }">
+      <VTextField
+        :modelValue="innerValue"
+        @update:modelValue="updateModelValue"
+        v-bind="{ ...menuprops, ...propsWithoutModelValue }"
+      />
+    </template>
+  </PathInput>
+</template>

src/components/filebrowser/FileList.vue

@@ -7,9 +7,9 @@ import ReorganizeDialog from '../dialog/ReorganizeDialog.vue'
 import { formatBytes } from '@core/utils/formatters'
 import type { Context, EndPoints, FileItem } from '@/api/types'
 import api from '@/api'
-import MediaInfoCard from '@/components/cards/MediaInfoCard.vue'
 import ProgressDialog from '../dialog/ProgressDialog.vue'
 import { useDisplay } from 'vuetify'
+import MediaInfoDialog from '../dialog/MediaInfoDialog.vue'
 
 // 显示器宽度
 const display = useDisplay()
@@ -735,14 +735,12 @@ onMounted(() => {
   <!-- 进度框 -->
   <ProgressDialog v-if="progressDialog" v-model="progressDialog" :text="progressText" :value="progressValue" />
   <!-- 识别结果对话框 -->
-  <VDialog v-if="nameTestDialog" v-model="nameTestDialog" width="50rem">
-    <VCard>
-      <DialogCloseBtn @click="nameTestDialog = false" />
-      <VCardItem>
-        <MediaInfoCard :context="nameTestResult" />
-      </VCardItem>
-    </VCard>
-  </VDialog>
+  <MediaInfoDialog
+    v-if="nameTestDialog"
+    v-model="nameTestDialog"
+    :context="nameTestResult"
+    @close="nameTestDialog = false"
+  />
 </template>
 
 <style lang="scss" scoped>

src/components/filebrowser/FileToolbar.vue

@@ -169,7 +169,7 @@ const sortIcon = computed(() => {
         </IconBtn>
       </template>
     </VTooltip>
-    <VDialog v-model="newFolderPopper" max-width="50rem">
+    <VDialog v-if="newFolderPopper" v-model="newFolderPopper" max-width="50rem">
       <template #activator="{ props }">
         <IconBtn v-bind="props">
           <VTooltip text="新建文件夹">

src/components/input/CronInput.vue

@@ -0,0 +1,38 @@
+<script setup lang="ts">
+const props = defineProps({
+  modelValue: {
+    type: String,
+    default: '* * * * *',
+  },
+})
+
+const emit = defineEmits(['update:modelValue'])
+
+const currentCron = ref(props.modelValue)
+
+watch(currentCron, newVal => {
+  emit('update:modelValue', newVal)
+})
+
+watch(
+  () => props.modelValue,
+  value => {
+    currentCron.value = value
+  },
+)
+</script>
+
+<template>
+  <div>
+    <VMenu :close-on-content-click="false" content-class="cursor-default" persistent>
+      <template v-slot:activator="{ props }">
+        <slot name="activator" :menuprops="props" />
+      </template>
+      <VList>
+        <VListItem>
+          <VCronVuetify v-model="currentCron" locale="zh-CN" :chip-props="{ color: 'success' }" class="mt-1" />
+        </VListItem>
+      </VList>
+    </VMenu>
+  </div>
+</template>

src/components/input/PathField.vue

@@ -1,102 +0,0 @@
-<script setup lang="ts">
-import api from '@/api'
-import { FileItem } from '@/api/types'
-
-const props = defineProps({
-  root: {
-    type: String,
-    default: '/',
-    required: true,
-  },
-  storage: {
-    type: String,
-    default: 'local',
-  },
-})
-
-const emit = defineEmits(['update:modelValue'])
-
-const activedDirs = ref<string[]>([])
-const openedDirs = ref<string[]>([])
-const isUserAction = ref(false) // 标志：是否为用户主动操作
-
-const treeItems = ref<FileItem[]>([
-  {
-    name: '/',
-    path: props.root,
-    children: [],
-    type: 'dir',
-    basename: props.root,
-    storage: props.storage,
-  },
-])
-
-async function fetchDirs(item: any) {
-  return api
-    .post('/storage/list', item)
-    .then((data: any) => {
-      data = data.filter((i: any) => i.type === 'dir')
-      item.children.push(...data)
-    })
-    .catch(err => console.warn(err))
-}
-
-const selectedPath = computed(() => {
-  if (activedDirs.value.length > 0) {
-    return activedDirs.value[0]
-  }
-  return ''
-})
-
-watch(activedDirs, newVal => {
-  if (!newVal.length || !isUserAction.value) return
-  emit('update:modelValue', selectedPath.value)
-  isUserAction.value = false
-})
-
-watch(
-  () => props.storage,
-  async newVal => {
-    treeItems.value = [
-      {
-        name: '/',
-        path: props.root,
-        children: [],
-        type: 'dir',
-        basename: props.root,
-        storage: newVal,
-      },
-    ]
-    openedDirs.value = []
-    activedDirs.value = []
-  },
-)
-
-function handleUserSelect() {
-  isUserAction.value = true
-}
-</script>
-
-<template>
-  <VMenu :close-on-content-click="false" content-class="cursor-default">
-    <template v-slot:activator="{ props }">
-      <slot name="activator" :menuprops="props" />
-    </template>
-    <VTreeview
-      v-model:activated="activedDirs"
-      v-model:opened="openedDirs"
-      :items="treeItems"
-      :load-children="fetchDirs"
-      item-key="path"
-      item-title="name"
-      item-value="path"
-      item-type="unknown"
-      activatable
-      return-object
-      max-height="20rem"
-      expand-icon="mdi-folder"
-      collapse-icon="mdi-folder-open"
-      @update:activated="handleUserSelect"
-    />
-  </VMenu>
-</template>

src/components/input/PathInput.vue

@@ -0,0 +1,174 @@
+<script setup lang="ts">
+import api from '@/api'
+import { FileItem } from '@/api/types'
+
+const props = defineProps({
+  modelValue: {
+    type: String,
+    default: '/',
+  },
+  root: {
+    type: String,
+    default: '/',
+    required: true,
+  },
+  storage: {
+    type: String,
+    default: 'local',
+  },
+})
+
+const emit = defineEmits(['update:modelValue'])
+
+const menuVisible = ref(false)
+
+const treeItems = ref<FileItem[]>([
+  {
+    name: '/',
+    path: props.root,
+    children: [],
+    type: 'dir',
+    basename: props.root,
+    storage: props.storage,
+  },
+])
+
+const activedDirs = ref<FileItem[]>([])
+
+const openedDirs = ref<FileItem[]>([])
+
+// 调用API查询子目录
+async function fetchDirs(item: any) {
+  return api
+    .post('/storage/list', item)
+    .then((data: any) => {
+      data = data.filter((i: any) => i.type === 'dir')
+      item.children?.push(...data)
+    })
+    .catch(err => console.warn(err))
+}
+
+// 递归查询路径
+function findPath(item: FileItem, path: string): FileItem | null {
+  if (item.path === path) {
+    return item
+  }
+  if (item.children) {
+    for (const child of item.children) {
+      const res: FileItem | null = findPath(child, path)
+      if (res) {
+        return res
+      }
+    }
+  }
+  return null
+}
+
+// 根据路径展开所有子目录
+async function expandDirs(path: string) {
+  // 分割路径
+  const paths = path.split('/').filter(i => i)
+  // 展开根目录
+  const root_item = treeItems.value[0]
+  await fetchDirs(root_item)
+  openedDirs.value.push(root_item)
+  // 逐级展开
+  let currentPath = '/'
+  for (const p of paths) {
+    currentPath += `${p}/`
+    // 查询当前目录
+    const item = findPath(root_item, currentPath)
+    if (!item) {
+      break
+    }
+    // 加载子目录
+    if (item.children?.length === 0) {
+      await fetchDirs(item)
+    }
+    // 打开当前目录
+    if (!openedDirs.value.includes(item) && path != currentPath) {
+      openedDirs.value.push(item)
+    }
+    // 选中当前目录
+    if (path == currentPath) {
+      activedDirs.value = [item]
+    }
+  }
+}
+
+// 当前选中项
+const selectedPath = computed(() => {
+  if (activedDirs.value.length > 0) {
+    return activedDirs.value[0].path
+  }
+  return ''
+})
+
+watch(activedDirs, newVal => {
+  if (!newVal.length) return
+  emit('update:modelValue', selectedPath.value)
+})
+
+watch(
+  () => menuVisible.value,
+  async visible => {
+    if (visible) {
+      treeItems.value = [
+        {
+          name: '/',
+          path: props.root,
+          children: [],
+          type: 'dir',
+          basename: props.root,
+          storage: props.storage,
+        },
+      ]
+      openedDirs.value = []
+      activedDirs.value = []
+      await expandDirs(props.modelValue)
+    }
+  },
+)
+
+watch(
+  () => props.storage,
+  async newVal => {
+    treeItems.value = [
+      {
+        name: '/',
+        path: props.root,
+        children: [],
+        type: 'dir',
+        basename: props.root,
+        storage: newVal,
+      },
+    ]
+    activedDirs.value = []
+    openedDirs.value = []
+  },
+)
+</script>
+
+<template>
+  <div>
+    <VMenu v-model="menuVisible" :close-on-content-click="false" content-class="cursor-default">
+      <template v-slot:activator="{ props }">
+        <slot name="activator" :menuprops="props" />
+      </template>
+      <VTreeview
+        v-model:activated="activedDirs"
+        v-model:opened="openedDirs"
+        :items="treeItems"
+        :load-children="fetchDirs"
+        item-key="path"
+        item-title="name"
+        item-value="path"
+        activatable
+        return-object
+        max-height="20rem"
+        expand-icon="mdi-folder"
+        collapse-icon="mdi-folder-open"
+      />
+    </VMenu>
+  </div>
+</template>

src/components/misc/FilterOption.vue

@@ -0,0 +1,7 @@
+<script lang="ts" setup>
+defineProps<{ title: string }>()
+</script>
+<template>
+  <VListSubheader>{{ title }}</VListSubheader>
+  <VListItem><slot /></VListItem>
+</template>

src/components/render/DashboardRender.vue

@@ -6,10 +6,21 @@ import { type PropType } from 'vue'
 const elementProps = defineProps({
   config: Object as PropType<RenderProps>,
 })
+// key
+const componentKey = ref(0)
+
+onActivated(() => {
+  componentKey.value++
+})
 </script>
 
 <template>
-  <Component :is="elementProps.config?.component" v-if="!elementProps.config?.html" v-bind="elementProps.config?.props">
+  <Component
+    :key="componentKey"
+    :is="elementProps.config?.component"
+    v-if="!elementProps.config?.html"
+    v-bind="elementProps.config?.props"
+  >
     {{ elementProps.config?.text }}
     <template v-for="(content, name) in elementProps.config?.slots || []" :key="name" v-slot:[name]="{ _props }">
       <slot :name="name" v-bind="_props">
@@ -23,6 +34,7 @@ const elementProps = defineProps({
     />
   </Component>
   <Component
+    :key="componentKey"
     :is="elementProps.config?.component"
     v-if="elementProps.config?.html"
     v-bind="elementProps.config?.props"

src/components/render/FormRender.vue

@@ -1,57 +1,141 @@
-<script lang="ts" setup>
+<script setup lang="ts">
 import { RenderProps } from '@/api/types'
-import { type PropType, ref } from 'vue'
 
-// 输入参数
-const elementProps = defineProps({
-  config: Object as PropType<RenderProps>,
-  form: Object as PropType<any>,
-})
+// 定义 props
+defineProps<{
+  config: RenderProps // JSON 配置
+  model: Record<string, any> // 数据模型
+}>()
 
-// 配置元素
-const formItem = ref<RenderProps>(
-  elementProps.config ?? {
-    component: 'div',
-    text: '',
-    html: '',
-    props: {},
-    content: [],
-  },
-)
+/**
+ * 解析属性，支持 v-model 和动态绑定
+ * @param rawProps 原始属性
+ * @param model 数据模型
+ * @returns 解析后的属性
+ */
+const parseProps = (rawProps: Record<string, any>, model: Record<string, any>) => {
+  const parsedProps: Record<string, any> = {}
 
-// 配置数据
-const formData = ref<any>(elementProps.form || {})
+  const isExpression = (value: string) => value.startsWith('{{') && value.endsWith('}}')
+  const extractExpression = (value: string) => value.slice(2, -2).trim()
+
+  for (const [key, value] of Object.entries(rawProps)) {
+    if (key === 'modelvalue') {
+      // 将 modelvalue 转换为 v-model:value 的形式
+      parsedProps['value'] = model[value]
+      parsedProps['onUpdate:value'] = (newValue: any) => {
+        model[value] = newValue
+      }
+    } else if (['model', 'v-model'].includes(key)) {
+      // 处理 v-model
+      parsedProps['modelValue'] = model[value]
+      parsedProps['onUpdate:modelValue'] = (newValue: any) => {
+        model[value] = newValue
+      }
+    } else if (['show', 'v-show'].includes(key)) {
+      // 处理 v-show，实现显示隐藏
+      const expression = isExpression(value) ? extractExpression(value) : value
+      const isVisible = new Function('model', `with(model) { return ${expression} }`)(model)
+      // 动态设置 style.display
+      if (!parsedProps.style) {
+        parsedProps.style = {}
+      }
+      parsedProps.style.display = isVisible ? '' : 'none'
+    } else if (key.startsWith('model:') || key.startsWith('v-model:')) {
+      // 处理 v-model:<prop>
+      const propName = key.split(':')[1]
+      parsedProps[propName] = model[value]
+      parsedProps[`onUpdate:${propName}`] = (newValue: any) => {
+        model[value] = newValue
+      }
+    } else if (key.startsWith('on')) {
+      // 处理事件监听，值是函数的代码
+      const eventName = key.replace('on', '').toLowerCase()
+      parsedProps[eventName] = new Function('model', `with(model) { return ${value} }`)(model)
+    } else {
+      // 如果是表达式，需要绑定
+      if (typeof value === 'string' && isExpression(value)) {
+        const expression = extractExpression(value)
+        parsedProps[key] = new Function('model', `with(model) { return ${expression} }`)(model)
+      } else if (typeof value === 'string' && value in model) {
+        // 如果是数据模型的属性，直接绑定
+        parsedProps[key] = model[value]
+      } else {
+        // 其他情况直接赋值
+        parsedProps[key] = value
+      }
+    }
+  }
+
+  return parsedProps
+}
+
+/**
+ * 渲染插槽内容
+ * @param slotContent 插槽配置
+ * @param model 数据模型
+ * @param slotScope 插槽作用域
+ */
+const renderSlotContent = (slotContent: any, model: any, slotScope: any) => {
+  if (Array.isArray(slotContent)) {
+    // 如果插槽内容是数组，递归渲染
+    return slotContent.map(childConfig => renderComponent(childConfig, model, slotScope))
+  }
+  // 如果插槽内容是单个配置，递归渲染
+  return renderComponent(slotContent, model, slotScope)
+}
+
+/**
+ * 渲染组件函数（递归支持嵌套）
+ * @param config JSON 配置
+ * @param model 数据模型
+ * @param slotScope 插槽作用域
+ * @returns 渲染的组件 VNode
+ */
+const renderComponent = (config: any, model: any, slotScope: any = {}) => {
+  const { component, props: componentProps = {}, content = [], slots = {}, html, text } = config
+
+  // 动态解析组件
+  const Component = resolveComponent(component)
+
+  // 解析属性
+  const parsedProps = parseProps(componentProps, model)
+
+  // 动态插槽解析
+  const slotNodes: Record<string, any> = {}
+  for (const [slotName, slotContent] of Object.entries(slots)) {
+    slotNodes[slotName] = (slotScopeData: any) =>
+      renderSlotContent(slotContent, model, { ...slotScope, ...slotScopeData })
+  }
+
+  // 渲染组件内容
+  const renderContent = () => {
+    // 如果配置了 `html`，直接渲染为 HTML 内容
+    if (html) {
+      return h(Component, { innerHTML: typeof html === 'string' ? html : model[html] })
+    }
+
+    // 如果配置了 `text`，直接渲染为文本内容
+    if (text) {
+      return typeof text === 'string' ? text : model[text]
+    }
+
+    // 如果配置了 `content`，递归渲染子组件
+    if (Array.isArray(content)) {
+      return content.map((childConfig: any) => renderComponent(childConfig, model, slotScope))
+    }
+
+    return null
+  }
+
+  // 渲染组件
+  return h(Component, parsedProps, {
+    ...slotNodes,
+    default: renderContent,
+  })
+}
 </script>
 
 <template>
-  <Component
-    :is="formItem.component"
-    v-if="!formItem.html && !!formItem.props?.modelvalue"
-    v-bind="formItem.props"
-    v-model:value="formData[formItem.props?.modelvalue]"
-  >
-    {{ formItem.text }}
-    <template v-for="(innerItem, innerIndex) in formItem.content || []" :key="innerIndex">
-      <FormRender
-        v-if="!!innerItem.props?.modelvalue"
-        v-model:value="formData[innerItem.props?.modelvalue]"
-        :config="innerItem"
-        :form="formData"
-      />
-      <FormRender v-else v-model="formData[innerItem.props?.model]" :config="innerItem" :form="formData" />
-    </template>
-  </Component>
-  <Component :is="formItem.component" v-else-if="formItem.html" v-bind="formItem.props" v-html="formItem.html" />
-  <Component :is="formItem.component" v-else v-bind="formItem.props" v-model="formData[formItem.props?.model]">
-    {{ formItem.text }}
-    <template v-for="(innerItem, innerIndex) in formItem.content || []" :key="innerIndex">
-      <FormRender
-        v-if="!!innerItem.props?.modelvalue"
-        v-model:value="formData[innerItem.props?.modelvalue]"
-        :config="innerItem"
-        :form="formData"
-      />
-      <FormRender v-else v-model="formData[innerItem.props?.model]" :config="innerItem" :form="formData" />
-    </template>
-  </Component>
+  <Component :is="renderComponent(config, model)" />
 </template>

src/components/render/PageRender.vue

@@ -9,7 +9,7 @@ import { RenderProps } from '@/api/types'
 const emit = defineEmits(['action'])
 
 // 输入参数
-const elementProps = defineProps({
+const props = defineProps({
   config: Object as PropType<RenderProps>,
 })
 
@@ -41,9 +41,9 @@ async function commonAction(api_path: string, method: string, params = {}) {
 // 组装事件
 let componentEvents = reactive<{ [key: string]: any }>({})
 watchEffect(() => {
-  if (!isNullOrEmptyObject(elementProps.config?.events)) {
-    for (const key in elementProps.config?.events) {
-      const attr = elementProps.config?.events[key]
+  if (!isNullOrEmptyObject(props.config?.events)) {
+    for (const key in props.config?.events) {
+      const attr = props.config?.events[key]
       const func = async () => {
         await commonAction(attr['api'], attr['method'], attr['params'])
       }
@@ -54,35 +54,20 @@ watchEffect(() => {
 </script>
 
 <template>
-  <Component
-    :is="elementProps.config?.component"
-    v-if="!elementProps.config?.html"
-    v-bind="elementProps.config?.props"
-    v-on="componentEvents"
-  >
-    {{ elementProps.config?.text }}
-    <template v-for="(content, name) in elementProps.config?.slots || []" :key="name" v-slot:[name]="{ _props }">
-      <slot :name="name" v-bind="_props">
-        <PageRender
-          v-for="(slotItem, slotIndex) in content || []"
-          :key="slotIndex"
-          :config="slotItem"
-          @action="emit('action')"
-        />
-      </slot>
-    </template>
+  <Component :is="config?.component" v-if="!config?.html" v-bind="config?.props" v-on="componentEvents">
+    {{ config?.text }}
     <PageRender
-      v-for="(innerItem, innerIndex) in elementProps.config?.content || []"
+      v-for="(innerItem, innerIndex) in config?.content || []"
       :key="innerIndex"
       :config="innerItem"
       @action="emit('action')"
     />
   </Component>
   <Component
-    :is="elementProps.config?.component"
-    v-if="elementProps.config?.html"
-    v-bind="elementProps.config?.props"
-    v-html="elementProps.config?.html"
+    :is="config?.component"
+    v-if="config?.html"
+    v-bind="config?.props"
+    v-html="config?.html"
     v-on="componentEvents"
   />
   <!-- 进度框 -->

src/layouts/components/DefaultLayout.vue

@@ -64,7 +64,7 @@ onMounted(() => {
           <VIcon icon="mdi-menu" />
         </IconBtn>
         <!-- 👉 Back Button -->
-        <IconBtn v-if="appMode && display.mdAndDown.value" class="ms-n2" @click="goBack">
+        <IconBtn v-if="appMode" class="ms-n2" @click="goBack">
           <VIcon icon="mdi-arrow-left" size="32" />
         </IconBtn>
         <!-- 👉 Search Bar -->

src/layouts/components/Footer.vue

@@ -1,38 +1,49 @@
 <script setup lang="ts">
+import { SystemNavMenus } from '@/router/menu'
 import { useDisplay } from 'vuetify'
+import { VMenu } from 'vuetify/lib/components/index.mjs'
 
 const display = useDisplay()
 const appMode = inject('pwaMode') && display.mdAndDown.value
 
 const route = useRoute()
 
-// 各按钮活动状态
+const moreMenuDialog = ref(false)
+
+const moreMemus = computed(() => SystemNavMenus.filter(menu => !menu.footer))
+
 const activeState = computed(() => {
   return {
     home: route.path === '/dashboard',
-    ranking: route.path === '/ranking',
+    recommend: route.path === '/recommend',
     movie: route.path === '/subscribe/movie',
     tv: route.path === '/subscribe/tv',
-    apps: route.path === '/apps',
   }
 })
+
+const moreActiveState = computed(() => {
+  return !Object.values(activeState.value).some(v => v)
+})
+
+const currentPath = computed(() => route.path)
 </script>
 
 <template>
-  <div v-if="appMode" class="w-100" style="block-size: calc(3.5rem + env(safe-area-inset-bottom))">
+  <div v-if="appMode" class="w-100">
     <VBottomNavigation
       grow
       horizontal
       color="primary"
       class="footer-nav border-t"
       style="block-size: calc(3.5rem + env(safe-area-inset-bottom))"
+      :z-index="9998"
     >
       <VBtn to="/dashboard" :ripple="false">
         <VIcon v-if="activeState.home" size="28">mdi-home</VIcon>
         <VIcon v-else size="28">mdi-home-outline</VIcon>
       </VBtn>
-      <VBtn to="/ranking" :ripple="false">
-        <VIcon v-if="activeState.ranking" size="28">mdi-star</VIcon>
+      <VBtn to="/recommend" :ripple="false">
+        <VIcon v-if="activeState.recommend" size="28">mdi-star</VIcon>
         <VIcon v-else size="28">mdi-star-outline</VIcon>
       </VBtn>
       <VBtn to="/subscribe/movie" :ripple="false">
@@ -43,9 +54,31 @@ const activeState = computed(() => {
         <VIcon v-if="activeState.tv" size="28">mdi-television-play</VIcon>
         <VIcon v-else size="28">mdi-television</VIcon>
       </VBtn>
-      <VBtn to="/apps" :ripple="false">
-        <VIcon v-if="activeState.apps" size="28">mdi-dots-horizontal-circle</VIcon>
-        <VIcon v-else size="28">mdi-dots-horizontal</VIcon>
+      <VBtn :ripple="false">
+        <VIcon
+          size="28"
+          :icon="moreMenuDialog ? 'mdi-close' : 'mdi-dots-horizontal'"
+          :color="moreActiveState ? 'primary' : ''"
+        />
+        <VMenu v-model="moreMenuDialog" close-on-content-click activator="parent">
+          <VDivider />
+          <VList class="font-bold" lines="one">
+            <VListSubheader class="bg-transparent"> 更多 </VListSubheader>
+            <VListItem
+              class="pe-20"
+              v-for="(menu, index) in moreMemus"
+              :key="index"
+              :prepend-icon="menu.icon"
+              nav
+              :to="menu.to"
+              :base-color="currentPath === menu.to ? 'primary' : undefined"
+            >
+              <VListItemTitle>
+                <span class="text-lg">{{ menu.title }}</span>
+              </VListItemTitle>
+            </VListItem>
+          </VList>
+        </VMenu>
       </VBtn>
     </VBottomNavigation>
   </div>
@@ -64,4 +97,3 @@ const activeState = computed(() => {
   background-color: transparent !important;
 }
 </style>
-}

src/layouts/components/UserProfile.vue

@@ -23,6 +23,9 @@ const progressDialog = ref(false)
 // 站点认证对话框
 const siteAuthDialog = ref(false)
 
+// 重启确认对话框
+const restartDialog = ref(false)
+
 // 执行注销操作
 function logout() {
   // 清除登录状态信息
@@ -33,13 +36,8 @@ function logout() {
 
 // 执行重启操作
 async function restart() {
-  // 弹出提示
-  const confirmed = await createConfirm({
-    title: '确认',
-    content: '确认重启系统吗？',
-  })
-
-  if (confirmed) {
+  {
+    restartDialog.value = false
     // 调用API重启
     try {
       // 显示等待框
@@ -60,6 +58,11 @@ async function restart() {
   }
 }
 
+// 显示重启确认对话框
+async function showRestartDialog() {
+  restartDialog.value = true
+}
+
 // 显示站点认证对话框
 function showSiteAuthDialog() {
   siteAuthDialog.value = true
@@ -130,7 +133,7 @@ const userLevel = computed(() => store.state.auth.level)
         <VDivider v-if="superUser" class="my-2" />
 
         <!-- 👉 restart -->
-        <VListItem v-if="superUser" @click="restart">
+        <VListItem v-if="superUser" @click="showRestartDialog">
           <template #prepend>
             <VIcon class="me-2" icon="mdi-restart" size="22" />
           </template>
@@ -152,4 +155,25 @@ const userLevel = computed(() => store.state.auth.level)
   <ProgressDialog v-if="progressDialog" v-model="progressDialog" text="正在重启 ..." />
   <!-- 用户认证对话框 -->
   <UserAuthDialog v-if="siteAuthDialog" v-model="siteAuthDialog" @done="siteAuthDone" @close="siteAuthDialog = false" />
+  <!-- 重启确认对话框 -->
+  <VDialog v-if="restartDialog" v-model="restartDialog" max-width="25rem">
+    <VCard>
+      <VCardItem>
+        <div class="flex items-center justify-center mt-3">
+          <VAvatar color="warning" variant="text" size="x-large">
+            <VIcon size="x-large" icon="mdi-alert" />
+          </VAvatar>
+          <div class="ms-3">
+            <p class="font-bold text-xl text-high-emphasis">确认重启系统吗？</p>
+            <p>重启后，您将被注销并需要重新登录。</p>
+          </div>
+        </div>
+      </VCardItem>
+      <VCardActions class="mx-auto">
+        <VBtn variant="elevated" color="error" @click="restart" prepend-icon="mdi-restart" class="px-5"> 确定 </VBtn>
+        <VBtn variant="tonal" color="secondary" class="px-5" @click="restartDialog = false">取消</VBtn>
+      </VCardActions>
+      <DialogCloseBtn @click="restartDialog = false" />
+    </VCard>
+  </VDialog>
 </template>

src/main.ts

@@ -1,20 +1,31 @@
+// 1. 配置与兼容性
+import './ace-config'
 import '@/@core/utils/compatibility'
 import '@/@iconify/icons-bundle'
 import '@/plugins/webfontloader'
-import App from '@/App.vue'
+
+// 2. 核心插件和 UI 框架
+import { createApp } from 'vue'
 import vuetify from '@/plugins/vuetify'
 import router from '@/router'
 import store from '@/store'
-import { createApp } from 'vue'
-import { removeEl } from './@core/utils/dom'
-import { fetchGlobalSettings } from './api'
-import { isPWA } from './@core/utils/navigator'
-import './ace-config'
+
+// 3. 全局组件
+import App from '@/App.vue'
 import { VAceEditor } from 'vue3-ace-editor'
 import { PerfectScrollbarPlugin } from 'vue3-perfect-scrollbar'
+import { CronVuetify } from '@vue-js-cron/vuetify'
+
+// 4. 工具函数和其他辅助模块
+import { fetchGlobalSettings } from './api'
+import { isPWA } from './@core/utils/navigator'
+
+// 5. 其他插件和功能模块
 import ToastPlugin from 'vue-toast-notification'
 import VuetifyUseDialog from 'vuetify-use-dialog'
 import VueApexCharts from 'vue3-apexcharts'
+
+// 6. 注册自定义组件
 import DialogCloseBtn from '@/@core/components/DialogCloseBtn.vue'
 import MediaCard from './components/cards/MediaCard.vue'
 import PosterCard from './components/cards/PosterCard.vue'
@@ -23,12 +34,18 @@ import PersonCard from './components/cards/PersonCard.vue'
 import MediaInfoCard from './components/cards/MediaInfoCard.vue'
 import TorrentCard from './components/cards/TorrentCard.vue'
 import MediaIdSelector from './components/misc/MediaIdSelector.vue'
-import PathField from './components/input/PathField.vue'
+import CronField from './components/field/CronField.vue'
+import PathField from './components/field/PathField.vue'
+
+// 7. 样式文件
+import '@core/scss/template/libs/vuetify/index.scss'
+import 'vuetify/styles'
 import '@core/scss/template/index.scss'
 import '@layouts/styles/index.scss'
-import '@styles/styles.scss'
 import 'vue-toast-notification/dist/theme-bootstrap.css'
 import 'vue3-perfect-scrollbar/style.css'
+import '@vue-js-cron/vuetify/dist/vuetify.css'
+import '@styles/styles.scss'
 
 // 创建Vue实例
 const app = createApp(App)
@@ -49,13 +66,13 @@ async function initializeApp() {
 // 注册全局组件
 initializeApp().then(() => {
   // 优先注册框架
-  app
-    .use(vuetify)
-  
+  app.use(vuetify)
+
   // 注册全局组件
   app
     .component('VAceEditor', VAceEditor)
     .component('VApexChart', VueApexCharts)
+    .component('VCronVuetify', CronVuetify)
     .component('VDialogCloseBtn', DialogCloseBtn)
     .component('VMediaCard', MediaCard)
     .component('VPosterCard', PosterCard)
@@ -64,12 +81,14 @@ initializeApp().then(() => {
     .component('VMediaInfoCard', MediaInfoCard)
     .component('VTorrentCard', TorrentCard)
     .component('VMediaIdSelector', MediaIdSelector)
+    .component('VCronField', CronField)
     .component('VPathField', PathField)
 
   // 注册插件
   app
     .use(router)
     .use(store)
+    .use(PerfectScrollbarPlugin)
     .use(ToastPlugin, {
       position: 'bottom-right',
     })
@@ -93,8 +112,5 @@ initializeApp().then(() => {
         cancellationText: '取消',
       },
     })
-    .use(PerfectScrollbarPlugin)
-    .use(VueApexCharts)
     .mount('#app')
-    .$nextTick(() => removeEl('#loading-bg'))
 })

src/pages/browse.vue

@@ -1,5 +1,4 @@
 <script setup lang="ts">
-import api from '@/api'
 import MediaCardListView from '@/views/discover/MediaCardListView.vue'
 import PersonCardListView from '@/views/discover/PersonCardListView.vue'
 

src/pages/dashboard.vue

@@ -340,7 +340,7 @@ onDeactivated(() => {
   />
 
   <!-- 弹窗，根据配置生成选项 -->
-  <VDialog v-model="dialog" max-width="35rem" scrollable>
+  <VDialog v-if="dialog" v-model="dialog" max-width="35rem" scrollable>
     <VCard>
       <VCardItem>
         <VCardTitle>设置仪表板</VCardTitle>

src/pages/discover.vue

@@ -0,0 +1,90 @@
+<script setup lang="ts">
+import { DiscoverTabs } from '@/router/menu'
+import router from '@/router'
+import TheMovieDbView from '@/views/discover/TheMovieDbView.vue'
+import DoubanView from '@/views/discover/DoubanView.vue'
+import BangumiView from '@/views/discover/BangumiView.vue'
+import ExtraSourceView from '@/views/discover/ExtraSourceView.vue'
+import { DiscoverSource } from '@/api/types'
+import api from '@/api'
+
+const route = useRoute()
+const activeTab = ref(route.query.tab)
+
+function jumpTab(tab: string) {
+  router.push('/subscribe/discover?tab=' + tab)
+}
+
+// 额外的数据源
+const extraDiscoverSources = ref<DiscoverSource[]>([])
+
+// 加载额外的发现数据源
+async function loadExtraDiscoverSources() {
+  try {
+    extraDiscoverSources.value = await api.get('discover/source')
+  } catch (error) {
+    console.log(error)
+  }
+}
+
+onMounted(async () => {
+  await loadExtraDiscoverSources()
+})
+
+onActivated(async () => {
+  loadExtraDiscoverSources()
+})
+</script>
+
+<template>
+  <div>
+    <VTabs v-model="activeTab" show-arrows>
+      <VTab v-for="item in DiscoverTabs" :value="item.tab" @to="jumpTab(item.tab)">
+        <div class="min-w-24">
+          {{ item.title }}
+        </div>
+      </VTab>
+      <VTab
+        v-for="item in extraDiscoverSources"
+        :key="item.mediaid_prefix"
+        :value="item.mediaid_prefix"
+        @to="jumpTab(item.mediaid_prefix)"
+      >
+        <div class="min-w-24">
+          {{ item.name }}
+        </div>
+      </VTab>
+    </VTabs>
+
+    <VWindow v-model="activeTab" class="mt-5 disable-tab-transition" :touch="false">
+      <VWindowItem value="themoviedb">
+        <transition name="fade-slide" appear>
+          <div>
+            <TheMovieDbView />
+          </div>
+        </transition>
+      </VWindowItem>
+      <VWindowItem value="douban">
+        <transition name="fade-slide" appear>
+          <div>
+            <DoubanView />
+          </div>
+        </transition>
+      </VWindowItem>
+      <VWindowItem value="bangumi">
+        <transition name="fade-slide" appear>
+          <div>
+            <BangumiView />
+          </div>
+        </transition>
+      </VWindowItem>
+      <VWindowItem v-for="item in extraDiscoverSources" :key="item.mediaid_prefix" :value="item.mediaid_prefix">
+        <transition name="fade-slide" appear>
+          <div>
+            <ExtraSourceView :source="item" />
+          </div>
+        </transition>
+      </VWindowItem>
+    </VWindow>
+  </div>
+</template>

src/pages/downloading.vue

@@ -29,20 +29,26 @@ function jumpTab(tab: string) {
 onMounted(async () => {
   await loadDownloaderSetting()
 })
+
+onActivated(async () => {
+  loadDownloaderSetting()
+})
 </script>
 
 <template>
   <div v-if="downloaders.length > 0">
     <VTabs v-model="activeTab">
       <VTab v-for="item in downloaders" :value="item.name" @to="jumpTab(item.name)">
-        <span class="mx-5">{{ item.name }}</span>
+        <span class="min-w-24">{{ item.name }}</span>
       </VTab>
     </VTabs>
 
     <VWindow v-model="activeTab" class="mt-5 disable-tab-transition" :touch="false">
       <VWindowItem v-for="item in downloaders" :value="item.name">
         <transition name="fade-slide" appear>
-          <DownloadingListView :name="item.name" />
+          <div>
+            <DownloadingListView :name="item.name" />
+          </div>
         </transition>
       </VWindowItem>
     </VWindow>

src/pages/login.vue

@@ -9,6 +9,7 @@ import logo from '@images/logo.png'
 import { useTheme } from 'vuetify'
 import { checkPrefersColorSchemeIsDark } from '@/@core/utils'
 import { urlBase64ToUint8Array } from '@/@core/utils/navigator'
+import { saveLocalTheme } from '@/@core/utils/theme'
 
 const { global: globalTheme } = useTheme()
 
@@ -85,8 +86,7 @@ async function setTheme() {
   const autoTheme = checkPrefersColorSchemeIsDark() ? 'dark' : 'light'
   globalTheme.name.value = themeValue === 'auto' ? autoTheme : themeValue
   // 存储主题到本地
-  localStorage.setItem('theme', themeValue)
-  localStorage.setItem('materio-initial-loader-bg', globalTheme.current.value.colors.background)
+  saveLocalTheme(themeValue, globalTheme)
 }
 
 // 订阅推送通知
@@ -130,7 +130,6 @@ function login() {
 
   // 进行表单校验
   if (!form.value.username || !form.value.password || (isOTP.value && !form.value.otp_password)) {
-    errorMessage.value = '请输入完整信息'
     return
   }
   // 用户名密码
@@ -175,11 +174,11 @@ function login() {
     })
     .catch((error: any) => {
       // 登录失败，显示错误提示
-      if (!error.response) errorMessage.value = '登录失败，请检查网络连接'
-      else if (error.response.status === 401) errorMessage.value = '登录失败，请检查用户名、密码或双重验证是否正确'
-      else if (error.response.status === 403) errorMessage.value = '登录失败，您没有权限访问'
-      else if (error.response.status === 500) errorMessage.value = '登录失败，服务器错误'
-      else errorMessage.value = `登录失败 ${error.response.status}，请检查用户名、密码或双重验证码是否正确`
+      if (!error.response) errorMessage.value = '登录失败，请检查网络连接！'
+      else if (error.response.status === 401) errorMessage.value = '登录失败，请检查用户名、密码或双重验证是否正确！'
+      else if (error.response.status === 403) errorMessage.value = '登录失败，您没有权限访问！'
+      else if (error.response.status === 500) errorMessage.value = '登录失败，服务器错误！'
+      else errorMessage.value = `登录失败 ${error.response.status}，请检查用户名、密码或双重验证码是否正确！`
     })
 }
 
@@ -241,7 +240,7 @@ onUnmounted(() => {
           <VCardTitle class="font-weight-bold text-2xl text-uppercase"> MoviePilot </VCardTitle>
         </VCardItem>
         <VCardText>
-          <VForm ref="refForm" @submit.prevent="() => {}">
+          <VForm ref="refForm" autocomplete="on" @submit.prevent="() => {}">
             <VRow>
               <!-- username -->
               <VCol cols="12">
@@ -250,6 +249,8 @@ onUnmounted(() => {
                   v-model="form.username"
                   label="用户名"
                   type="text"
+                  name="username"
+                  autocomplete="username"
                   :rules="[requiredValidator]"
                   @input="fetchOTP"
                 />
@@ -260,6 +261,8 @@ onUnmounted(() => {
                   v-model="form.password"
                   label="密码"
                   :type="isPasswordVisible ? 'text' : 'password'"
+                  name="current-password"
+                  autocomplete="current-password"
                   :append-inner-icon="isPasswordVisible ? 'mdi-eye-off-outline' : 'mdi-eye-outline'"
                   :rules="[requiredValidator]"
                   @click:append-inner="isPasswordVisible = !isPasswordVisible"
@@ -275,9 +278,9 @@ onUnmounted(() => {
               <VCol cols="12">
                 <!-- login button -->
                 <VBtn block type="submit" @click="login"> 登录 </VBtn>
-                <div v-if="errorMessage" class="text-error mt-2 text-shadow">
+                <VAlert v-if="errorMessage" type="error" variant="tonal" class="mt-3">
                   {{ errorMessage }}
-                </div>
+                </VAlert>
               </VCol>
             </VRow>
           </VForm>

src/pages/media.vue

@@ -9,13 +9,16 @@ const mediaid = route.query?.mediaid?.toString()
 
 // 类型
 const type = route.query?.type?.toString()
+
+// 标题
+const title = route.query?.title?.toString()
+
+// 年份
+const year = route.query?.year?.toString()
 </script>
 
 <template>
   <div>
-    <MediaDetailView
-      :mediaid="mediaid"
-      :type="type"
-    />
+    <MediaDetailView :mediaid="mediaid" :type="type" :title="title" :year="year" />
   </div>
 </template>

src/pages/ranking.vue

@@ -1,77 +0,0 @@
-<script setup lang="ts">
-import MediaCardSlideView from '@/views/discover/MediaCardSlideView.vue'
-
-const viewList = reactive<{ apipath: string; linkurl: string; title: string }[]>([
-  {
-    apipath: 'tmdb/trending',
-    linkurl: '/browse/tmdb/trending?title=流行趋势',
-    title: '流行趋势',
-  },
-  {
-    apipath: 'douban/showing',
-    linkurl: '/browse/douban/showing?title=正在热映',
-    title: '正在热映',
-  },
-  {
-    apipath: 'bangumi/calendar',
-    linkurl: '/browse/bangumi/calendar?title=Bangumi每日放送',
-    title: 'Bangumi每日放送',
-  },
-  {
-    apipath: 'tmdb/movies',
-    linkurl: '/browse/tmdb/movies?title=TMDB热门电影',
-    title: 'TMDB热门电影',
-  },
-  {
-    apipath: 'tmdb/tvs?with_original_language=zh|en|ja|ko',
-    linkurl: '/browse/tmdb/tvs??with_original_language=zh|en|ja|ko&title=TMDB热门电视剧',
-    title: 'TMDB热门电视剧',
-  },
-  {
-    apipath: 'douban/movie_hot',
-    linkurl: '/browse/douban/movie_hot?title=豆瓣热门电影',
-    title: '豆瓣热门电影',
-  },
-  {
-    apipath: 'douban/tv_hot',
-    linkurl: '/browse/douban/tv_hot?title=豆瓣热门电视剧',
-    title: '豆瓣热门电视剧',
-  },
-  {
-    apipath: 'douban/tv_animation',
-    linkurl: '/browse/douban/tv_animation?title=豆瓣热门动漫',
-    title: '豆瓣热门动漫',
-  },
-  {
-    apipath: 'douban/movies',
-    linkurl: '/browse/douban/movies?title=豆瓣最新电影',
-    title: '豆瓣最新电影',
-  },
-  {
-    apipath: 'douban/tvs',
-    linkurl: '/browse/douban/tvs?title=豆瓣最新电视剧',
-    title: '豆瓣最新电视剧',
-  },
-  {
-    apipath: 'douban/movie_top250',
-    linkurl: '/browse/douban/movie_top250?title=电影TOP250',
-    title: '豆瓣电影TOP250',
-  },
-  {
-    apipath: 'douban/tv_weekly_chinese',
-    linkurl: '/browse/douban/tv_weekly_chinese?title=豆瓣国产剧集榜',
-    title: '豆瓣国产剧集榜',
-  },
-  {
-    apipath: 'douban/tv_weekly_global',
-    linkurl: '/browse/douban/tv_weekly_global?title=豆瓣全球剧集榜',
-    title: '豆瓣全球剧集榜',
-  },
-])
-</script>
-
-<template>
-  <div>
-    <MediaCardSlideView v-for="(item, index) in viewList" :key="index" v-bind="item" />
-  </div>
-</template>

src/pages/recommend.vue

@@ -0,0 +1,196 @@
+<script setup lang="ts">
+import api from '@/api'
+import { RecommendSource } from '@/api/types'
+import MediaCardSlideView from '@/views/discover/MediaCardSlideView.vue'
+import { useDisplay } from 'vuetify'
+
+// APP
+const display = useDisplay()
+const appMode = inject('pwaMode') && display.mdAndDown.value
+
+const viewList = reactive<{ apipath: string; linkurl: string; title: string }[]>([
+  {
+    apipath: 'recommend/tmdb_trending',
+    linkurl: '/browse/recommend/tmdb_trending?title=流行趋势',
+    title: '流行趋势',
+  },
+  {
+    apipath: 'recommend/douban_showing',
+    linkurl: '/browse/recommend/douban_showing?title=正在热映',
+    title: '正在热映',
+  },
+  {
+    apipath: 'bangumi/calendar',
+    linkurl: '/browse/bangumi/calendar?title=Bangumi每日放送',
+    title: 'Bangumi每日放送',
+  },
+  {
+    apipath: 'recommend/tmdb_movies',
+    linkurl: '/browse/recommend/tmdb_movies?title=TMDB热门电影',
+    title: 'TMDB热门电影',
+  },
+  {
+    apipath: 'recommend/tmdb_tvs?with_original_language=zh|en|ja|ko',
+    linkurl: '/browse/recommend/tmdb_tvs??with_original_language=zh|en|ja|ko&title=TMDB热门电视剧',
+    title: 'TMDB热门电视剧',
+  },
+  {
+    apipath: 'recommend/douban_movie_hot',
+    linkurl: '/browse/recommend/douban_movie_hot?title=豆瓣热门电影',
+    title: '豆瓣热门电影',
+  },
+  {
+    apipath: 'recommend/douban_tv_hot',
+    linkurl: '/browse/recommend/douban_tv_hot?title=豆瓣热门电视剧',
+    title: '豆瓣热门电视剧',
+  },
+  {
+    apipath: 'recommend/douban_tv_animation',
+    linkurl: '/browse/recommend/douban_tv_animation?title=豆瓣热门动漫',
+    title: '豆瓣热门动漫',
+  },
+  {
+    apipath: 'recommend/douban_movies',
+    linkurl: '/browse/recommend/douban_movies?title=豆瓣最新电影',
+    title: '豆瓣最新电影',
+  },
+  {
+    apipath: 'recommend/douban_tvs',
+    linkurl: '/browse/recommend/douban_tvs?title=豆瓣最新电视剧',
+    title: '豆瓣最新电视剧',
+  },
+  {
+    apipath: 'recommend/douban_movie_top250',
+    linkurl: '/browse/recommend/douban_movie_top250?title=电影TOP250',
+    title: '豆瓣电影TOP250',
+  },
+  {
+    apipath: 'recommend/douban_tv_weekly_chinese',
+    linkurl: '/browse/recommend/douban_tv_weekly_chinese?title=豆瓣国产剧集榜',
+    title: '豆瓣国产剧集榜',
+  },
+  {
+    apipath: 'recommend/douban_tv_weekly_global',
+    linkurl: '/browse/recommend/douban_tv_weekly_global?title=豆瓣全球剧集榜',
+    title: '豆瓣全球剧集榜',
+  },
+])
+
+// 计算启用的视图
+const enabledViews = computed(() => viewList.filter(item => enableConfig.value[item.title]))
+
+// 榜单启用配置， 以title为key
+const enableConfig = ref<{ [key: string]: boolean }>({
+  ...Object.fromEntries(viewList.map(item => [item.title, true])),
+})
+
+// 弹窗
+const dialog = ref(false)
+
+// 额外的数据源
+const extraRecommendSources = ref<RecommendSource[]>([])
+
+// 加载额外的发现数据源
+async function loadExtraRecommendSources() {
+  try {
+    extraRecommendSources.value = await api.get('recommend/source')
+    if (extraRecommendSources.value.length > 0) {
+      viewList.push(
+        ...extraRecommendSources.value.map(source => ({
+          apipath: source.api_path,
+          linkurl: `/browse/recommend/${source.api_path}?title=${source.name}`,
+          title: source.name,
+        })),
+      )
+    }
+  } catch (error) {
+    console.log(error)
+  }
+}
+
+// 加载面板配置
+async function loadConfig() {
+  // 显示配置
+  const local_enable = localStorage.getItem('MP_RECOMMEND')
+  if (local_enable) {
+    enableConfig.value = JSON.parse(local_enable)
+  } else {
+    const response = await api.get('/user/config/Recommend')
+    if (response && response.data && response.data.value) {
+      enableConfig.value = response.data.value
+      localStorage.setItem('MP_RECOMMEND', JSON.stringify(response.data.value))
+    }
+  }
+}
+
+// 设置项目
+async function saveConfig() {
+  // 启用配置
+  const enableString = JSON.stringify(enableConfig.value)
+  localStorage.setItem('MP_RECOMMEND', enableString)
+
+  // 保存到服务端
+  try {
+    await api.post('/user/config/Recommend', enableConfig.value)
+  } catch (error) {
+    console.error(error)
+  }
+  dialog.value = false
+}
+
+onBeforeMount(async () => {
+  await loadConfig()
+})
+
+onMounted(async () => {
+  await loadExtraRecommendSources()
+})
+
+onActivated(async () => {
+  loadExtraRecommendSources()
+})
+</script>
+
+<template>
+  <div>
+    <MediaCardSlideView v-for="item in enabledViews" :key="item.title" v-bind="item" />
+    <!-- 弹窗，根据配置生成选项 -->
+    <VDialog v-if="dialog" v-model="dialog" max-width="35rem" scrollable>
+      <VCard>
+        <VCardItem>
+          <VCardTitle>设置推荐榜单</VCardTitle>
+        </VCardItem>
+        <VDivider />
+        <VCardText>
+          <VRow>
+            <VCol v-for="item in viewList" :key="item.title" cols="6" md="4" sm="4">
+              <VCheckbox v-model="enableConfig[item.title]" :label="item.title" />
+            </VCol>
+          </VRow>
+        </VCardText>
+        <VDivider />
+        <VCardText class="pt-5 text-end">
+          <VSpacer />
+          <VBtn variant="outlined" color="secondary" class="me-4" @click="dialog = false"> 关闭 </VBtn>
+          <VBtn @click="saveConfig">
+            <template #prepend>
+              <VIcon icon="mdi-content-save" />
+            </template>
+            保存
+          </VBtn>
+        </VCardText>
+      </VCard>
+    </VDialog>
+  </div>
+  <!-- 底部操作按钮 -->
+  <VFab
+    icon="mdi-text-box-edit"
+    location="bottom"
+    size="x-large"
+    fixed
+    app
+    appear
+    @click="dialog = true"
+    :class="{ 'mb-12': appMode }"
+  />
+</template>

src/pages/resource.vue

@@ -2,8 +2,8 @@
 import NoDataFound from '@/components/NoDataFound.vue'
 import api from '@/api'
 import type { Context } from '@/api/types'
-import TorrentCardListView from '@/views/discover/TorrentCardListView.vue'
-import TorrentRowListView from '@/views/discover/TorrentRowListView.vue'
+import TorrentCardListView from '@/views/torrent/TorrentCardListView.vue'
+import TorrentRowListView from '@/views/torrent/TorrentRowListView.vue'
 import { useDisplay } from 'vuetify'
 
 // APP
@@ -22,6 +22,12 @@ const type = route.query?.type?.toString() ?? ''
 // 搜索字段
 const area = route.query?.area?.toString() ?? ''
 
+// 搜索标题
+const title = route.query?.title?.toString() ?? ''
+
+// 搜索年份
+const year = route.query?.year
+
 // 搜索季
 const season = route.query?.season?.toString() ?? ''
 
@@ -82,12 +88,14 @@ async function fetchData() {
     } else {
       startLoadingProgress()
       let result: { [key: string]: any }
-      // 优先按TMDBID精确查询
-      if (keyword?.startsWith('tmdb:') || keyword?.startsWith('douban:') || keyword?.startsWith('bangumi:')) {
+      // 如果keyword的格式是 xxxx:xxxxx 且:前面的xxxx为字符，则按照媒体ID格式搜索
+      if (/^[a-zA-Z]+:/.test(keyword)) {
         result = await api.get(`search/media/${keyword}`, {
           params: {
             mtype: type,
             area,
+            title,
+            year,
             season,
           },
         })
@@ -139,27 +147,28 @@ onUnmounted(() => {
     <TorrentCardListView v-else :items="dataList" />
   </div>
   <!-- 视图切换 -->
-  <VFab
-    v-if="viewType === 'list'"
-    class="mb-12"
-    icon="mdi-view-grid"
-    location="bottom"
-    size="x-large"
-    absolute
-    app
-    appear
-    @click="setViewType('card')"
-    :class="{ 'mb-12': appMode }"
-  />
-  <VFab
-    v-else
-    icon="mdi-view-list"
-    location="bottom"
-    size="x-large"
-    fixed
-    app
-    appear
-    @click="setViewType('list')"
-    :class="{ 'mb-12': appMode }"
-  />
+  <div v-if="isRefreshed">
+    <VFab
+      v-if="viewType === 'list'"
+      icon="mdi-view-grid"
+      location="bottom"
+      size="x-large"
+      absolute
+      app
+      appear
+      @click="setViewType('card')"
+      :class="{ 'mb-12': appMode }"
+    />
+    <VFab
+      v-else
+      icon="mdi-view-list"
+      location="bottom"
+      size="x-large"
+      fixed
+      app
+      appear
+      @click="setViewType('list')"
+      :class="{ 'mb-12': appMode }"
+    />
+  </div>
 </template>

src/pages/setting.vue

@@ -70,7 +70,9 @@ function jumpTab(tab: string) {
       <!-- 规则 -->
       <VWindowItem value="rule">
         <transition name="fade-slide" appear>
-          <AccountSettingRule />
+          <div>
+            <AccountSettingRule />
+          </div>
         </transition>
       </VWindowItem>
 

src/pages/subscribe.vue

@@ -18,29 +18,41 @@ function jumpTab(tab: string) {
 
 <template>
   <div>
-    <VTabs v-model="activeTab">
+    <VTabs v-model="activeTab" show-arrows>
       <VTab v-if="subType == '电影'" v-for="item in SubscribeMovieTabs" :value="item.tab" @to="jumpTab(item.tab)">
-        <span class="mx-5">{{ item.title }}</span>
+        <div class="flex align-center min-w-24">
+          <VIcon size="20" start :icon="item.icon" />
+          {{ item.title }}
+        </div>
       </VTab>
       <VTab v-if="subType == '电视剧'" v-for="item in SubscribeTvTabs" :value="item.tab" @to="jumpTab(item.tab)">
-        <span class="mx-5">{{ item.title }}</span>
+        <div class="flex align-center min-w-24">
+          <VIcon size="20" start :icon="item.icon" />
+          {{ item.title }}
+        </div>
       </VTab>
     </VTabs>
 
     <VWindow v-model="activeTab" class="mt-5 disable-tab-transition" :touch="false">
       <VWindowItem value="mysub">
         <transition name="fade-slide" appear>
-          <SubscribeListView :type="subType" :subid="subId" />
+          <div>
+            <SubscribeListView :type="subType" :subid="subId" />
+          </div>
         </transition>
       </VWindowItem>
       <VWindowItem value="popular">
         <transition name="fade-slide" appear>
-          <SubscribePopularView :type="subType" />
+          <div>
+            <SubscribePopularView :type="subType" />
+          </div>
         </transition>
       </VWindowItem>
       <VWindowItem value="share">
         <transition name="fade-slide" appear>
-          <SubscribeShareView />
+          <div>
+            <SubscribeShareView />
+          </div>
         </transition>
       </VWindowItem>
     </VWindow>

src/plugins/vuetify/index.ts

@@ -6,10 +6,6 @@ import defaults from './defaults'
 import { icons } from './icons'
 import theme from './theme'
 
-// Styles
-import '@core/scss/template/libs/vuetify/index.scss'
-import 'vuetify/styles'
-
 export default createVuetify({
   aliases: {
     IconBtn: VBtn,

src/router/index.ts

@@ -8,7 +8,7 @@ configureNProgress()
 // Router
 const router = createRouter({
   history: createWebHashHistory(import.meta.env.BASE_URL),
-  scrollBehavior(to, from, savedPosition) {
+  scrollBehavior(to: any, from: any, savedPosition: any) {
     // 如果页面有缓存那么恢复其位置, 否则始终滚动到顶部
     if (to.meta.keepAlive && savedPosition) return savedPosition
     return { top: 0 }
@@ -28,8 +28,16 @@ const router = createRouter({
           },
         },
         {
-          path: '/ranking',
-          component: () => import('../pages/ranking.vue'),
+          path: '/recommend',
+          component: () => import('../pages/recommend.vue'),
+          meta: {
+            keepAlive: true,
+            requiresAuth: true,
+          },
+        },
+        {
+          path: '/discover',
+          component: () => import('../pages/discover.vue'),
           meta: {
             keepAlive: true,
             requiresAuth: true,
@@ -190,16 +198,35 @@ const router = createRouter({
   ],
 })
 
+const abortControllers = new Set<AbortController>()
+
+// 注册中止控制器
+function registerAbortController(controller: AbortController) {
+  abortControllers.add(controller)
+}
+
+// 中止所有组件的任务
+function abortAllControllers() {
+  for (const controller of abortControllers) {
+    controller.abort()
+  }
+  abortControllers.clear()
+}
+
 // 路由导航守卫
-router.beforeEach((to, from, next) => {
+router.beforeEach((to: any, from: any, next: any) => {
   // 总是记录非login路由
   if (to.fullPath != '/login') store.state.auth.originalPath = to.fullPath
   const isAuthenticated = store.state.auth.token !== null
   if (to.meta.requiresAuth && !isAuthenticated) {
     next('/login')
   } else {
+    abortAllControllers()
     next()
   }
 })
 
+// 导出默认对象
 export default router
+// 另行导出其他功能
+export { registerAbortController }

src/router/menu.ts

@@ -8,20 +8,28 @@ export const SystemNavMenus = [
     admin: false,
     footer: true,
   },
+  {
+    title: '搜索结果',
+    icon: 'mdi-magnify',
+    to: '/resource',
+    header: '开始',
+    admin: false,
+  },
   {
     title: '推荐',
     icon: 'mdi-star-outline',
-    to: '/ranking',
+    to: '/recommend',
     header: '发现',
     admin: false,
     footer: true,
   },
   {
-    title: '资源搜索',
-    icon: 'mdi-magnify',
-    to: '/resource',
+    title: '探索',
+    icon: 'mdi-apple-safari',
+    to: '/discover',
     header: '发现',
     admin: false,
+    footer: false,
   },
   {
     title: '电影',
@@ -50,15 +58,15 @@ export const SystemNavMenus = [
     admin: false,
   },
   {
-    title: '正在下载',
+    title: '下载管理',
     icon: 'mdi-download-outline',
     to: '/downloading',
     header: '整理',
     admin: false,
   },
   {
-    title: '历史记录',
-    icon: 'mdi-history',
+    title: '媒体整理',
+    icon: 'mdi-folder-play-outline',
     to: '/history',
     header: '整理',
     admin: true,
@@ -100,35 +108,6 @@ export const SystemNavMenus = [
   },
 ]
 
-// 常用菜单功能
-export const UserfulMenus = [
-  {
-    title: '搜索设置',
-    icon: 'mdi-magnify',
-    to: 'setting?tab=search',
-  },
-  {
-    title: '订阅设置',
-    icon: 'mdi-rss',
-    to: 'setting?tab=subscribe',
-  },
-  {
-    title: '服务',
-    icon: 'mdi-list-box',
-    to: 'setting?tab=service',
-  },
-  {
-    title: '词表',
-    icon: 'mdi-file-word-box',
-    to: 'setting?tab=words',
-  },
-  {
-    title: '历史记录',
-    icon: 'mdi-history',
-    to: 'history',
-  },
-]
-
 // 设定标签页
 export const SettingTabs = [
   {
@@ -198,12 +177,12 @@ export const SubscribeMovieTabs = [
   {
     title: '我的订阅',
     tab: 'mysub',
-    icon: 'mdi-movie-open-outline',
+    icon: 'mdi-heart',
   },
   {
     title: '热门订阅',
     tab: 'popular',
-    icon: 'mdi-movie-open-outline',
+    icon: 'mdi-fire',
   },
 ]
 
@@ -212,17 +191,17 @@ export const SubscribeTvTabs = [
   {
     title: '我的订阅',
     tab: 'mysub',
-    icon: 'mdi-television',
+    icon: 'mdi-heart',
   },
   {
     title: '热门订阅',
     tab: 'popular',
-    icon: 'mdi-television',
+    icon: 'mdi-fire',
   },
   {
     title: '订阅分享',
     tab: 'share',
-    icon: 'mdi-television',
+    icon: 'mdi-share-variant',
   },
 ]
 
@@ -239,3 +218,22 @@ export const PluginTabs = [
     icon: 'mdi-store',
   },
 ]
+
+// 发现标签页
+export const DiscoverTabs = [
+  {
+    title: 'TheMovieDb',
+    tab: 'themoviedb',
+    icon: 'themoviedb',
+  },
+  {
+    title: '豆瓣',
+    tab: 'douban',
+    icon: 'douban',
+  },
+  {
+    title: 'Bangumi',
+    tab: 'bangumi',
+    icon: 'bangumi',
+  },
+]

src/service-worker.ts

@@ -1,6 +1,5 @@
 import { createHandlerBoundToURL, cleanupOutdatedCaches, precacheAndRoute } from 'workbox-precaching'
 import { NavigationRoute, registerRoute } from 'workbox-routing'
-import { clientsClaim } from 'workbox-core'
 
 declare let self: ServiceWorkerGlobalScope
 

src/styles/styles.scss

@@ -3,14 +3,41 @@
 @tailwind components;
 @tailwind utilities;
 
+html.v-overlay-scroll-blocked {
+  position: fixed;
+  --v-body-scroll-y: 0px !important;
+}
+
+@media (max-width: 768px){
+  html.v-overlay-scroll-blocked {
+    position: relative;
+  }
+}
+
+@mixin hide-scrollbar {
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+  
+  &::-webkit-scrollbar {
+    display: none;
+  }
+}
+
+@media (max-width: 768px) {
+  html,body {
+    @include hide-scrollbar;
+  }
+}
+
 #nprogress .bar {
   background: rgb(var(--v-theme-primary)) !important;
   inset-block-start: env(safe-area-inset-top) !important;
 }
 
 #nprogress .peg {
+  width: 5px;
   box-shadow: 0 0 10px rgb(var(--v-theme-primary)), 0 0 5px rgb(var(--v-theme-primary)) !important;
-      transform: rotate(0deg) translate(0, -1px);
+      transform: rotate(0deg) translate(0, 0px);
 }
 
 .v-toast--bottom {
@@ -24,15 +51,15 @@
 }
 
 .v-dialog > .v-overlay__content {
-  inline-size: calc(100% - 1rem);
-  margin-block-start: calc(env(safe-area-inset-top) + 1rem);
-  max-block-size: calc(100% - env(safe-area-inset-top) - 1rem);
+  margin-block: env(safe-area-inset-top) env(safe-area-inset-bottom);
 }
 
-.v-dialog--fullscreen > .v-overlay__content{
-  inline-size: 100%;
-  margin-block-start: env(safe-area-inset-top);
-  max-block-size: calc(100% - env(safe-area-inset-top));
+.v-bottom-sheet > .v-bottom-sheet__content.v-overlay__content > .v-card {
+  padding-block-end: env(safe-area-inset-bottom);
+}
+
+.v-dialog--fullscreen > .v-overlay__content > .v-card {
+  padding-block-end: calc(env(safe-area-inset-top) + env(safe-area-inset-bottom));
 }
 
 /* router view transition fade-slide */

src/views/dashboard/AnalyticsCpu.vue

@@ -1,5 +1,4 @@
 <script setup lang="ts">
-import VueApexCharts from 'vue3-apexcharts'
 import { useTheme } from 'vuetify'
 import { hexToRgb } from '@layouts/utils'
 import api from '@/api'
@@ -24,6 +23,8 @@ const variableTheme = controlledComputed(
   () => vuetifyTheme.current.value.variables,
 )
 
+const chartKey = ref(0)
+
 // 定时器
 let refreshTimer: NodeJS.Timeout | null = null
 
@@ -130,6 +131,10 @@ onUnmounted(() => {
     refreshTimer = null
   }
 })
+
+onActivated(() => {
+  chartKey.value += 1
+})
 </script>
 
 <template>
@@ -143,8 +148,7 @@ onUnmounted(() => {
           <VCardTitle>CPU</VCardTitle>
         </VCardItem>
         <VCardText>
-          <VueApexCharts type="line" :options="chartOptions" :series="series" :height="150" />
-
+          <VApexChart :key="chartKey" type="line" :options="chartOptions" :series="series" :height="150" />
           <p class="text-center font-weight-medium mb-0">当前：{{ current }}%</p>
         </VCardText>
       </VCard>

src/views/dashboard/AnalyticsMemory.vue

@@ -1,5 +1,4 @@
 <script setup lang="ts">
-import VueApexCharts from 'vue3-apexcharts'
 import { useTheme } from 'vuetify'
 import { hexToRgb } from '@layouts/utils'
 import api from '@/api'
@@ -25,6 +24,8 @@ const variableTheme = controlledComputed(
   () => vuetifyTheme.current.value.variables,
 )
 
+const chartKey = ref(0)
+
 // 定时器
 let refreshTimer: NodeJS.Timeout | null = null
 
@@ -136,6 +137,10 @@ onUnmounted(() => {
     refreshTimer = null
   }
 })
+
+onActivated(() => {
+  chartKey.value += 1
+})
 </script>
 
 <template>
@@ -149,8 +154,7 @@ onUnmounted(() => {
           <VCardTitle>内存</VCardTitle>
         </VCardItem>
         <VCardText>
-          <VueApexCharts type="area" :options="chartOptions" :series="series" :height="150" />
-
+          <VApexChart :key="chartKey" type="area" :options="chartOptions" :series="series" :height="150" />
           <p class="text-center font-weight-medium mb-0">当前：{{ formatBytes(usedMemory) }}</p>
         </VCardText>
       </VCard>

src/views/dashboard/AnalyticsWeeklyOverview.vue

@@ -1,5 +1,4 @@
 <script setup lang="ts">
-import VueApexCharts from 'vue3-apexcharts'
 import { useTheme } from 'vuetify'
 import api from '@/api'
 import { hexToRgb } from '@layouts/utils'
@@ -127,8 +126,7 @@ onMounted(() => {
         </VCardItem>
 
         <VCardText>
-          <VueApexCharts type="bar" :options="options" :series="series" :height="160" />
-
+          <VApexChart type="bar" :options="options" :series="series" :height="160" />
           <div class="d-flex align-center mb-3">
             <h5 class="text-h5 me-4">
               {{ totalCount }}

src/views/discover/BangumiView.vue

@@ -0,0 +1,107 @@
+<script setup lang="ts">
+import MediaCardListView from '@/views/discover/MediaCardListView.vue'
+
+// 过滤参数
+const filterParams = reactive({
+  'type': 2,
+  'cat': null,
+  'sort': 'rank', // date/rank
+  'year': null,
+})
+
+// Bangumi cat字典
+/**
+ * 0 为 其他
+1 为 TV
+2 为 OVA
+3 为 Movie
+5 为 WEB
+ */
+const bangumiCatDict = {
+  '0': '其他',
+  '1': 'TV',
+  '2': 'OVA',
+  '3': 'Movie',
+  '5': 'WEB',
+}
+
+// Bangumi排序字典
+const bangumiSortDict = {
+  'rank': '排名',
+  'date': '日期',
+}
+
+// 年份字典，自动生成最近10年
+const yearDict: Record<number, number> = {}
+const currentYear = new Date().getFullYear()
+for (let i = 0; i < 10; i++) {
+  yearDict[currentYear - i] = currentYear - i
+}
+
+// 当前Key
+const currentKey = ref(0)
+
+// 类型和过滤参数变化后重新刷新列表
+watch([filterParams], () => {
+  currentKey.value++
+})
+</script>
+
+<template>
+  <div class="px-3">
+    <div class="flex justify-start align-center">
+      <div class="mr-5">
+        <VLabel>类别</VLabel>
+      </div>
+      <VChipGroup v-model="filterParams.cat">
+        <VChip
+          :color="filterParams.cat == key ? 'primary' : ''"
+          filter
+          tile
+          :value="key"
+          v-for="(value, key) in bangumiCatDict"
+          :key="key"
+        >
+          {{ value }}
+        </VChip>
+      </VChipGroup>
+    </div>
+    <div class="flex justify-start align-center">
+      <div class="mr-5">
+        <VLabel>排序</VLabel>
+      </div>
+      <VChipGroup v-model="filterParams.sort">
+        <VChip
+          :color="filterParams.sort == key ? 'primary' : ''"
+          filter
+          tile
+          :value="key"
+          v-for="(value, key) in bangumiSortDict"
+          :key="key"
+        >
+          {{ value }}
+        </VChip>
+      </VChipGroup>
+    </div>
+    <div class="flex justify-start align-center">
+      <div class="mr-5">
+        <VLabel>年份</VLabel>
+      </div>
+      <VChipGroup v-model="filterParams.year">
+        <VChip
+          :color="filterParams.year == key ? 'primary' : ''"
+          filter
+          tile
+          :value="key"
+          v-for="(value, key) in yearDict"
+          :key="key"
+        >
+          {{ value }}
+        </VChip>
+      </VChipGroup>
+    </div>
+  </div>
+  <div>
+    <MediaCardListView :key="currentKey" apipath="discover/bangumi" :params="filterParams" />
+  </div>
+</template>

src/views/discover/DoubanView.vue

@@ -0,0 +1,202 @@
+<script setup lang="ts">
+import MediaCardListView from '@/views/discover/MediaCardListView.vue'
+
+// 电影或者电视剧 movies/tvs
+const type = ref('movies')
+
+// 过滤参数
+const filterParams = reactive({
+  'sort': 'U',
+  'tags': '',
+})
+
+// 豆瓣风格类型
+const doubanCategory = ref('')
+
+// 地区
+const doubanZone = ref('')
+
+// 年代
+const doubanYear = ref('')
+
+// 豆瓣风格字典
+const categoryDict = {
+  '喜剧': '喜剧',
+  '爱情': '爱情',
+  '动作': '动作',
+  '科幻': '科幻',
+  '动画': '动画',
+  '悬疑': '悬疑',
+  '犯罪': '犯罪',
+  '惊悚': '惊悚',
+  '冒险': '冒险',
+  '音乐': '音乐',
+  '历史': '历史',
+  '奇幻': '奇幻',
+  '恐怖': '恐怖',
+  '战争': '战争',
+  '传记': '传记',
+  '歌舞': '歌舞',
+  '武侠': '武侠',
+  '情色': '情色',
+  '灾难': '灾难',
+  '西部': '西部',
+  '纪录片': '纪录片',
+  '短片': '短片',
+}
+
+// 地区字典
+const zoneDict = {
+  '华语': '华语',
+  '欧美': '欧美',
+  '韩国': '韩国',
+  '日本': '日本',
+  '中国大陆': '中国大陆',
+  '美国': '美国',
+  '中国香港': '中国香港',
+  '中国台湾': '中国台湾',
+  '英国': '英国',
+  '法国': '法国',
+  '德国': '德国',
+  '意大利': '意大利',
+  '西班牙': '西班牙',
+  '印度': '印度',
+  '泰国': '泰国',
+  '俄罗斯': '俄罗斯',
+  '加拿大': '加拿大',
+  '澳大利亚': '澳大利亚',
+  '爱尔兰': '爱尔兰',
+  '瑞典': '瑞典',
+  '巴西': '巴西',
+  '丹麦': '丹麦',
+}
+
+// 年代字典
+const yearDict: Record<string, string> = {
+  '2020年代': '2020年代',
+  '2010年代': '2010年代',
+  '2000年代': '2000年代',
+  '90年代': '90年代',
+  '80年代': '80年代',
+  '70年代': '70年代',
+  '60年代': '60年代',
+}
+
+// 往年代字典中追加当前年份及往前5年的字典
+const currentYear = new Date().getFullYear()
+for (let i = 0; i < 6; i++) {
+  yearDict[`${currentYear - i}`] = `${currentYear - i}`
+}
+
+// 豆瓣过滤参数
+const doubanSortDict = {
+  'U': '综合排序',
+  'R': '首播时间',
+  'T': '近期热度',
+  'S': '高分优先',
+}
+
+// 风格、年代、地区变化时，以,分隔拼接到tags参数
+watch([doubanCategory, doubanZone, doubanYear], () => {
+  filterParams.tags = [doubanCategory.value, doubanZone.value, doubanYear.value].filter(Boolean).join(',')
+})
+
+// 当前Key
+const currentKey = ref(0)
+
+// 类型和过滤参数变化后重新刷新列表
+watch([type, filterParams], () => {
+  if (!type.value) {
+    type.value = 'movies'
+  }
+  if (!filterParams.sort) {
+    filterParams.sort = 'U'
+  }
+  currentKey.value++
+})
+</script>
+
+<template>
+  <div class="px-3">
+    <div class="flex justify-start align-center">
+      <div class="mr-5">
+        <VLabel>类型</VLabel>
+      </div>
+      <VChipGroup v-model="type">
+        <VChip :color="type == 'movies' ? 'primary' : ''" filter tile value="movies">电影</VChip>
+        <VChip :color="type == 'tvs' ? 'primary' : ''" filter tile value="tvs">电视剧</VChip>
+      </VChipGroup>
+    </div>
+    <div class="flex justify-start align-center">
+      <div class="mr-5">
+        <VLabel>排序</VLabel>
+      </div>
+      <VChipGroup v-model="filterParams.sort">
+        <VChip
+          :color="filterParams.sort == key ? 'primary' : ''"
+          filter
+          tile
+          :value="key"
+          v-for="(value, key) in doubanSortDict"
+          :key="key"
+        >
+          {{ value }}
+        </VChip>
+      </VChipGroup>
+    </div>
+    <div class="flex justify-start align-center">
+      <div class="mr-5">
+        <VLabel>风格</VLabel>
+      </div>
+      <VChipGroup v-model="doubanCategory">
+        <VChip
+          :color="doubanCategory == key ? 'primary' : ''"
+          filter
+          tile
+          :value="key"
+          v-for="(value, key) in categoryDict"
+          :key="key"
+        >
+          {{ value }}
+        </VChip>
+      </VChipGroup>
+    </div>
+    <div class="flex justify-start align-center">
+      <div class="mr-5">
+        <VLabel>地区</VLabel>
+      </div>
+      <VChipGroup v-model="doubanZone">
+        <VChip
+          :color="doubanZone == key ? 'primary' : ''"
+          filter
+          tile
+          :value="key"
+          v-for="(value, key) in zoneDict"
+          :key="key"
+        >
+          {{ value }}
+        </VChip>
+      </VChipGroup>
+    </div>
+    <div class="flex justify-start align-center">
+      <div class="mr-5">
+        <VLabel>年代</VLabel>
+      </div>
+      <VChipGroup v-model="doubanYear">
+        <VChip
+          :color="doubanYear == key ? 'primary' : ''"
+          filter
+          tile
+          :value="key"
+          v-for="(value, key) in yearDict"
+          :key="key"
+        >
+          {{ value }}
+        </VChip>
+      </VChipGroup>
+    </div>
+  </div>
+  <div>
+    <MediaCardListView :key="currentKey" :apipath="`discover/douban_${type}`" :params="filterParams" />
+  </div>
+</template>

src/views/discover/ExtraSourceView.vue

@@ -0,0 +1,64 @@
+<script setup lang="ts">
+import { DiscoverSource } from '@/api/types'
+import MediaCardListView from '@/views/discover/MediaCardListView.vue'
+import FormRender from '@/components/render/FormRender.vue'
+import { cloneDeep, isNull } from 'lodash'
+
+// 输入参数
+const props = defineProps<{
+  source: DiscoverSource
+}>()
+
+// 默认输入参数
+const default_params = cloneDeep(props.source.filter_params)
+
+// 过滤参数
+const filterParams = reactive(props.source.filter_params)
+
+// 前一次的过滤参数
+let previousParams = cloneDeep(props.source.filter_params)
+
+// 当前Key
+const currentKey = ref(0)
+
+// 类型和过滤参数变化后重新刷新列表
+watch(filterParams, newParams => {
+  // 检查每个值
+  for (const key in newParams) {
+    // 如果没有值但有默认值时，设置为默认值
+    if (!newParams[key] && default_params[key]) {
+      filterParams[key] = default_params[key]
+    }
+    // 检查依赖关系
+    const depends = props.source?.depends
+    if (depends) {
+      if (newParams[key] !== previousParams[key]) {
+        for (const dependKey in depends) {
+          if (key != dependKey && depends[dependKey] && depends[dependKey].includes(key)) {
+            filterParams[dependKey] = null
+          }
+        }
+      }
+    }
+  }
+  // 更新 previousParams
+  previousParams = cloneDeep(newParams)
+  // 刷新界面
+  currentKey.value++
+})
+</script>
+
+<template>
+  <div class="px-3">
+    <FormRender v-for="(element, index) in source.filter_ui" :key="index" :config="element" :model="filterParams" />
+  </div>
+  <div>
+    <MediaCardListView :key="currentKey" :apipath="source.api_path" :params="filterParams" />
+  </div>
+</template>
+
+<style>
+.v-chip--selected {
+  color: rgb(var(--v-theme-primary)) !important;
+}
+</style>

src/views/discover/MediaCardListView.vue

@@ -123,7 +123,3 @@ async function fetchData({ done }: { done: any }) {
     />
   </VInfiniteScroll>
 </template>
-
-<style lang="scss">
-
-</style>

src/views/discover/MediaCardSlideView.vue

@@ -3,6 +3,7 @@ import api from '@/api'
 import type { MediaInfo } from '@/api/types'
 import MediaCard from '@/components/cards/MediaCard.vue'
 import SlideView from '@/components/slide/SlideView.vue'
+import { registerAbortController } from '@/router'
 
 // 输入参数
 const props = defineProps({
@@ -11,7 +12,8 @@ const props = defineProps({
   title: String,
 })
 
-provide('rankingPropsKey', reactive({...props}))
+// 提供给子组件的属性
+provide('rankingPropsKey', reactive({ ...props }))
 
 // 组件加载完成
 const componentLoaded = ref(false)
@@ -22,36 +24,33 @@ const dataList = ref<MediaInfo[]>([])
 // 获取订阅列表数据
 async function fetchData() {
   try {
-    if (!props.apipath)
-      return
-
-    dataList.value = await api.get(props.apipath)
-    if (dataList.value.length > 0)
-      componentLoaded.value = true
-  }
-  catch (error) {
+    if (!props.apipath) return
+    const abortController = new AbortController()
+    registerAbortController(abortController)
+    const { signal } = abortController
+    dataList.value = await api.get(props.apipath, { signal })
+    if (dataList.value.length > 0) componentLoaded.value = true
+  } catch (error) {
     console.error(error)
   }
 }
 
 // 加载时获取数据
-onMounted(fetchData)
+onMounted(() => {
+  fetchData()
+})
+onActivated(() => {
+  if (dataList.value.length == 0) {
+    fetchData()
+  }
+})
 </script>
 
 <template>
-  <SlideView
-    v-if="componentLoaded"
-  >
+  <SlideView v-if="componentLoaded">
     <template #content>
-      <template
-        v-for="data in dataList"
-        :key="data.tmdb_id || data.douban_id || data.bangumi_id"
-      >
-        <MediaCard
-          :media="data"
-          height="15rem"
-          width="10rem"
-        />
+      <template v-for="data in dataList" :key="data.tmdb_id || data.douban_id || data.bangumi_id">
+        <MediaCard :media="data" height="15rem" width="10rem" />
       </template>
     </template>
   </SlideView>

src/views/discover/MediaDetailView.vue

@@ -14,6 +14,8 @@ import { isNullOrEmptyObject } from '@/@core/utils'
 // 输入参数
 const mediaProps = defineProps({
   mediaid: String,
+  title: String,
+  year: String,
   type: String,
 })
 
@@ -57,11 +59,10 @@ const subscribeId = ref<number>()
 
 // 获得mediaid
 function getMediaId() {
-  return mediaDetail.value?.tmdb_id
-    ? `tmdb:${mediaDetail.value?.tmdb_id}`
-    : mediaDetail.value?.douban_id
-    ? `douban:${mediaDetail.value?.douban_id}`
-    : `bangumi:${mediaDetail.value?.bangumi_id}`
+  if (mediaDetail.value?.tmdb_id) return `tmdb:${mediaDetail.value?.tmdb_id}`
+  else if (mediaDetail.value?.douban_id) return `douban:${mediaDetail.value?.douban_id}`
+  else if (mediaDetail.value?.bangumi_id) return `bangumi:${mediaDetail.value?.bangumi_id}`
+  else return `${mediaDetail.value?.mediaid_prefix}:${mediaDetail.value?.media_id}`
 }
 
 // 调用API查询详情
@@ -69,6 +70,8 @@ async function getMediaDetail() {
   if (mediaProps.mediaid && mediaProps.type) {
     mediaDetail.value = await api.get(`media/${mediaProps.mediaid}`, {
       params: {
+        title: mediaProps.title,
+        year: mediaProps.year,
         type_name: mediaProps.type,
       },
     })
@@ -403,6 +406,8 @@ function handleSearch(area: string) {
       keyword,
       type: mediaDetail.value.type,
       area,
+      title: mediaDetail.value.title,
+      year: mediaDetail.value.year,
       season: mediaDetail.value.season,
     },
   })

src/views/discover/TheMovieDbView.vue

@@ -0,0 +1,219 @@
+<script setup lang="ts">
+import MediaCardListView from '@/views/discover/MediaCardListView.vue'
+
+// 电影或者电视剧 movies/tvs
+const type = ref('movies')
+
+// 过滤参数
+const filterParams = reactive({
+  sort_by: 'popularity.desc',
+  with_genres: '',
+  with_original_language: '',
+  with_keywords: '',
+  with_watch_providers: '',
+  vote_average: 0,
+  vote_count: 10,
+  release_date: '',
+})
+
+// TMDB 电影排序字典
+const tmdbSortDict: Record<string, string> = {
+  'popularity.desc': '热度降序',
+  'popularity.asc': '热度升序',
+  'release_date.desc': '上映日期降序',
+  'release_date.asc': '上映日期升序',
+  'vote_average.desc': '评分降序',
+  'vote_average.asc': '评分升序',
+}
+
+// TMDB 电视剧排序字典
+const tmdbTvSortDict: Record<string, string> = {
+  'popularity.desc': '热度降序',
+  'popularity.asc': '热度升序',
+  'first_air_date.desc': '首播日期降序',
+  'first_air_date.asc': '首播日期升序',
+  'vote_average.desc': '评分降序',
+  'vote_average.asc': '评分升序',
+}
+
+// TMDB电影风格字典
+const tmdbMovieGenreDict: Record<string, string> = {
+  '28': '动作',
+  '12': '冒险',
+  '16': '动画',
+  '35': '喜剧',
+  '80': '犯罪',
+  '99': '纪录片',
+  '18': '剧情',
+  '10751': '家庭',
+  '14': '奇幻',
+  '36': '历史',
+  '27': '恐怖',
+  '10402': '音乐',
+  '9648': '悬疑',
+  '10749': '爱情',
+  '878': '科幻',
+  '10770': '电视电影',
+  '53': '惊悚',
+  '10752': '战争',
+  '37': '西部',
+}
+
+// TMDB电视剧风格字典
+const tmdbTvGenreDict: Record<string, string> = {
+  '10759': '动作冒险',
+  '16': '动画',
+  '35': '喜剧',
+  '80': '犯罪',
+  '99': '纪录片',
+  '18': '剧情',
+  '10751': '家庭',
+  '10762': '儿童',
+  '9648': '悬疑',
+  '10763': '新闻',
+  '10764': '真人秀',
+  '10765': '科幻奇幻',
+  '10766': '肥皂剧',
+  '10767': '戏剧',
+  '10768': '战争政治',
+  '37': '西部',
+}
+
+// TMDB原始语言字典（主要语言）
+const tmdbLanguageDict = {
+  'zh': '中文',
+  'en': '英语',
+  'ja': '日语',
+  'ko': '韩语',
+  'fr': '法语',
+  'de': '德语',
+  'es': '西班牙语',
+  'it': '意大利语',
+  'ru': '俄语',
+  'pt': '葡萄牙语',
+  'ar': '阿拉伯语',
+  'hi': '印地语',
+  'th': '泰语',
+}
+
+// 当前Key
+const currentKey = ref(0)
+
+// 类型变化
+watch(type, () => {
+  if (!type.value) {
+    type.value = 'movies'
+  }
+  if (type.value === 'movies') {
+    if (!tmdbSortDict[filterParams.sort_by]) {
+      filterParams.sort_by = 'popularity.desc'
+    }
+    if (!tmdbMovieGenreDict[filterParams.with_genres]) {
+      filterParams.with_genres = ''
+    }
+  }
+  if (type.value === 'tvs') {
+    if (!tmdbTvSortDict[filterParams.sort_by]) {
+      filterParams.sort_by = 'popularity.desc'
+    }
+    if (!tmdbTvGenreDict[filterParams.with_genres]) {
+      filterParams.with_genres = ''
+    }
+  }
+  currentKey.value++
+})
+
+// 过滤参数变化
+watch(filterParams, () => {
+  if (!filterParams.sort_by) {
+    filterParams.sort_by = 'popularity.desc'
+  }
+  currentKey.value++
+})
+</script>
+
+<template>
+  <div class="px-3">
+    <div class="flex justify-start align-center">
+      <div class="mr-5">
+        <VLabel>类型</VLabel>
+      </div>
+      <VChipGroup v-model="type">
+        <VChip :color="type == 'movies' ? 'primary' : ''" filter tile value="movies">电影</VChip>
+        <VChip :color="type == 'tvs' ? 'primary' : ''" filter tile value="tvs">电视剧</VChip>
+      </VChipGroup>
+    </div>
+    <div class="flex justify-start align-center">
+      <div class="mr-5">
+        <VLabel>排序</VLabel>
+      </div>
+      <VChipGroup v-model="filterParams.sort_by">
+        <VChip
+          :color="filterParams.sort_by == key ? 'primary' : ''"
+          filter
+          tile
+          :value="key"
+          v-for="(value, key) in type == 'movies' ? tmdbSortDict : tmdbTvSortDict"
+          :key="key"
+        >
+          {{ value }}
+        </VChip>
+      </VChipGroup>
+    </div>
+    <div class="flex justify-start align-center">
+      <div class="mr-5">
+        <VLabel>风格</VLabel>
+      </div>
+      <VChipGroup v-model="filterParams.with_genres">
+        <VChip
+          :color="filterParams.with_genres == key ? 'primary' : ''"
+          filter
+          tile
+          :value="key"
+          v-for="(value, key) in type == 'movies' ? tmdbMovieGenreDict : tmdbTvGenreDict"
+          :key="key"
+        >
+          {{ value }}
+        </VChip>
+      </VChipGroup>
+    </div>
+    <div class="flex justify-start align-center">
+      <div class="mr-5">
+        <VLabel>语言</VLabel>
+      </div>
+      <VChipGroup v-model="filterParams.with_original_language">
+        <VChip
+          :color="filterParams.with_original_language == key ? 'primary' : ''"
+          filter
+          tile
+          :value="key"
+          v-for="(value, key) in tmdbLanguageDict"
+          :key="key"
+        >
+          {{ value }}
+        </VChip>
+      </VChipGroup>
+    </div>
+    <div class="flex justify-start align-center">
+      <div class="mr-5">
+        <VLabel>评分</VLabel>
+      </div>
+      <VSlider v-model="filterParams.vote_average" thumb-label max="10" min="0" class="align-center" hide-details>
+        <template v-slot:append>
+          <VTextField
+            width="5rem"
+            v-model="filterParams.vote_count"
+            density="compact"
+            type="number"
+            hide-details
+            single-line
+          />
+        </template>
+      </VSlider>
+    </div>
+  </div>
+
+  <div>
+    <MediaCardListView :key="currentKey" :apipath="`discover/tmdb_${type}`" :params="filterParams" />
+  </div>
+</template>

src/views/discover/TorrentRowListView.vue

@@ -1,391 +0,0 @@
-<script lang="ts" setup>
-import type { Context } from '@/api/types'
-import TorrentItem from '@/components/cards/TorrentItem.vue'
-import { list } from 'postcss'
-import { useDisplay } from 'vuetify'
-
-// 显示器宽度
-const display = useDisplay()
-
-// APP
-const appMode = inject('pwaMode') && display.mdAndDown.value
-
-// 定义输入参数
-const props = defineProps({
-  // 数据列表
-  items: Array as PropType<Context[]>,
-})
-
-// 过滤表单
-const filterForm = reactive({
-  // 站点
-  site: [] as string[],
-  // 季
-  season: [] as string[],
-  // 制作组
-  releaseGroup: [] as string[],
-  // 视频编码
-  videoCode: [] as string[],
-  // 促销状态
-  freeState: [] as string[],
-  // 质量
-  edition: [] as string[],
-  // 分辨率
-  resolution: [] as string[],
-})
-
-// 列表样式
-const listStyle = computed(() => {
-  return appMode
-    ? 'height: calc(100vh - 7.5rem - env(safe-area-inset-bottom) - 3.5rem)'
-    : 'height: calc(100vh - 6.5rem - env(safe-area-inset-bottom)'
-})
-
-// 排序字段
-const sortField = ref('default')
-
-// 数据列表
-const dataList = ref<Array<Context>>([])
-
-// 获取站点过滤选项
-const siteFilterOptions = ref<Array<string>>([])
-// 获取季过滤选项
-const seasonFilterOptions = ref<Array<string>>([])
-// 获取制作组过滤选项
-const releaseGroupFilterOptions = ref<Array<string>>([])
-// 获取视频编码过滤选项
-const videoCodeFilterOptions = ref<Array<string>>([])
-// 获取促销状态过滤选项
-const freeStateFilterOptions = ref<Array<string>>([])
-// 获取质量过滤选项
-const editionFilterOptions = ref<Array<string>>([])
-// 获取分辨率过滤选项
-const resolutionFilterOptions = ref<Array<string>>([])
-
-// 初始化过滤选项
-function initOptions(data: Context) {
-  const { torrent_info, meta_info } = data
-  const optionValue = (options: Array<string>, value: string | undefined) => {
-    value && !options.includes(value) && options.push(value)
-  }
-  optionValue(siteFilterOptions.value, torrent_info?.site_name)
-  optionValue(seasonFilterOptions.value, meta_info?.season_episode)
-  optionValue(releaseGroupFilterOptions.value, meta_info?.resource_team)
-  optionValue(videoCodeFilterOptions.value, meta_info?.video_encode)
-  optionValue(freeStateFilterOptions.value, torrent_info?.volume_factor)
-  optionValue(editionFilterOptions.value, meta_info?.edition)
-  optionValue(resolutionFilterOptions.value, meta_info?.resource_pix)
-}
-
-// 对季过滤选项进行排序
-const sortSeasonFilterOptions = computed(() => {
-  // 预解析所有选项
-  const parsedOptions = seasonFilterOptions.value.map((option, index) => {
-    const parseSeasonEpisode = (str: string) => {
-      const match = str.match(/^S(\d+)(?:-S(\d+))?(?:\s*E(\d+)(?:-E(\d+))?)?$/)
-
-      if (!match) {
-        // 如果字符串格式不正确，返回默认值
-        return {
-          original: str,
-          seasonStart: 0,
-          seasonEnd: 0,
-          episodeStart: 0,
-          episodeEnd: 0,
-          maxSeason: 0,
-          maxEpisode: 0,
-          index,
-        }
-      }
-
-      const seasonStart = match[1] ? parseInt(match[1], 10) : 0
-      const seasonEnd = match[2] ? parseInt(match[2], 10) : 0
-      const episodeStart = match[3] ? parseInt(match[3], 10) : 0
-      const episodeEnd = match[4] ? parseInt(match[4], 10) : 0
-      const maxSeason = seasonEnd > 0 ? seasonEnd : seasonStart
-      const maxEpisode = episodeEnd > 0 ? episodeEnd : episodeStart
-
-      return {
-        original: str,
-        seasonStart,
-        seasonEnd,
-        episodeStart,
-        episodeEnd,
-        maxSeason,
-        maxEpisode,
-        index,
-      }
-    }
-
-    return parseSeasonEpisode(option)
-  })
-
-  // 定义判断是否为整季或季范围的函数
-  const isWholeSeason = (parsed: (typeof parsedOptions)[0]) =>
-    parsed.seasonStart > 0 &&
-    (parsed.seasonEnd === 0 || parsed.seasonEnd > parsed.seasonStart) &&
-    parsed.episodeStart === 0 &&
-    parsed.episodeEnd === 0
-
-  // 定义判断是否包含集数的函数
-  const hasEpisodes = (parsed: (typeof parsedOptions)[0]) => parsed.episodeStart > 0 || parsed.episodeEnd > 0
-
-  // 排序逻辑
-  parsedOptions.sort((a, b) => {
-    const aIsWhole = isWholeSeason(a)
-    const bIsWhole = isWholeSeason(b)
-    const aHasEpisodes = hasEpisodes(a)
-    const bHasEpisodes = hasEpisodes(b)
-
-    // 优先级1：整季和季范围选项优先于带有集数的选项
-    if (aIsWhole && !bIsWhole) return -1
-    if (!aIsWhole && bIsWhole) return 1
-
-    // 优先级2：如果都是整季或季范围选项，按 maxSeason 降序排列
-    if (aIsWhole && bIsWhole) {
-      if (b.maxSeason !== a.maxSeason) {
-        return b.maxSeason - a.maxSeason
-      }
-      // 如果 maxSeason 相同，则按原始索引
-      return a.index - b.index
-    }
-
-    // 优先级3：如果都是带有集数的选项，先按 maxSeason 降序，再按 maxEpisode 降序
-    if (aHasEpisodes && bHasEpisodes) {
-      if (b.maxSeason !== a.maxSeason) {
-        return b.maxSeason - a.maxSeason
-      }
-      if (b.maxEpisode !== a.maxEpisode) {
-        return b.maxEpisode - a.maxEpisode
-      }
-      // 如果 maxSeason 和 maxEpisode 相同，则按原始索引
-      return a.index - b.index
-    }
-
-    // 优先级4：如果一个有集数，一个没有，优先有集数的选项
-    if (aHasEpisodes && !bHasEpisodes) return -1
-    if (!aHasEpisodes && bHasEpisodes) return 1
-
-    // 优先级5：对于没有集数且不是整季的选项，按 seasonStart 和 seasonEnd 降序排序
-    if (b.seasonStart !== a.seasonStart) {
-      return b.seasonStart - a.seasonStart
-    }
-    if (b.seasonEnd !== a.seasonEnd) {
-      return b.seasonEnd - a.seasonEnd
-    }
-
-    // 优先级6：按 episodeStart 和 episodeEnd 降序排序
-    if (b.episodeStart !== a.episodeStart) {
-      return b.episodeStart - a.episodeStart
-    }
-    if (b.episodeEnd !== a.episodeEnd) {
-      return b.episodeEnd - a.episodeEnd
-    }
-
-    // 优先级7：兜底按字母降序排列
-    if (a.original !== b.original) {
-      return b.original.localeCompare(a.original)
-    }
-
-    // 优先级8：如果所有条件都相同，则按原始索引
-    return a.index - b.index
-  })
-
-  // 返回排序后的原始字符串数组
-  return parsedOptions.map(option => option.original)
-})
-
-// 排序
-watchEffect(() => {
-  const list = dataList.value
-  if (sortField.value === 'default') {
-    dataList.value = list.sort((a, b) => b.torrent_info.pri_order - a.torrent_info.pri_order)
-  } else if (sortField.value === 'site') {
-    dataList.value = list.sort((a, b) => (a.torrent_info.site_name || '').localeCompare(b.torrent_info.site_name || ''))
-  } else if (sortField.value === 'size') {
-    dataList.value = list.sort((a, b) => b.torrent_info.size - a.torrent_info.size)
-  } else if (sortField.value === 'seeder') {
-    dataList.value = list.sort((a, b) => b.torrent_info.seeders - a.torrent_info.seeders)
-  }
-})
-
-// 计算过滤后的列表
-watchEffect(() => {
-  // 清空列表
-  dataList.value = []
-  // 匹配过滤函数
-  const match = (filter: Array<string>, value: string | undefined) =>
-    filter.length === 0 || (value && filter.includes(value))
-
-  props.items?.forEach(data => {
-    const { meta_info, torrent_info } = data
-    if (
-      // 站点过滤
-      match(filterForm.site, torrent_info.site_name) &&
-      // 促销状态过滤
-      match(filterForm.freeState, torrent_info.volume_factor) &&
-      // 季过滤
-      match(filterForm.season, meta_info.season_episode) &&
-      // 制作组过滤
-      match(filterForm.releaseGroup, meta_info.resource_team) &&
-      // 视频编码过滤
-      match(filterForm.videoCode, meta_info.video_encode) &&
-      // 分辨率过滤
-      match(filterForm.resolution, meta_info.resource_pix) &&
-      // 质量过滤
-      match(filterForm.edition, meta_info.edition)
-    )
-      dataList.value.push(data)
-  })
-})
-
-// 初始化过滤选项
-onMounted(() => {
-  props.items?.forEach(item => {
-    initOptions(item)
-  })
-})
-</script>
-
-<template>
-  <VRow>
-    <VCol>
-      <VList v-if="dataList.length === 0" lines="three" class="rounded p-0 shadow-lg">
-        <VListItem>
-          <VListItemTitle>没有附合当前过滤条件的资源。</VListItemTitle>
-        </VListItem>
-      </VList>
-      <VList v-if="dataList.length !== 0" lines="three" class="rounded p-0 torrent-list-vscroll shadow-lg">
-        <VVirtualScroll :items="dataList" :style="listStyle">
-          <template #default="{ item }">
-            <TorrentItem :torrent="item" :key="`${item.torrent_info.page_url}`" />
-          </template>
-        </VVirtualScroll>
-      </VList>
-    </VCol>
-    <VCol xl="2" md="3" v-if="display.mdAndUp.value">
-      <VList lines="one" class="rounded shadow-lg" :style="listStyle">
-        <VListSubheader> 排序 </VListSubheader>
-        <VListItem>
-          <VChipGroup column v-model="sortField">
-            <VChip :color="sortField == 'default' ? 'primary' : ''" filter variant="outlined" value="default">
-              默认
-            </VChip>
-            <VChip :color="sortField == 'site' ? 'primary' : ''" filter variant="outlined" value="site"> 站点 </VChip>
-            <VChip :color="sortField == 'size' ? 'primary' : ''" filter variant="outlined" value="size">
-              文件大小
-            </VChip>
-            <VChip :color="sortField == 'seeder' ? 'primary' : ''" filter variant="outlined" value="seeder">
-              做种数
-            </VChip>
-          </VChipGroup>
-        </VListItem>
-        <VListSubheader v-if="siteFilterOptions.length > 0"> 站点 </VListSubheader>
-        <VListItem>
-          <VChipGroup v-model="filterForm.site" column multiple>
-            <VChip
-              v-for="site in siteFilterOptions"
-              :key="site"
-              :color="filterForm.site.includes(site) ? 'primary' : ''"
-              filter
-              variant="outlined"
-              :value="site"
-            >
-              {{ site }}
-            </VChip>
-          </VChipGroup>
-        </VListItem>
-        <VListSubheader v-if="editionFilterOptions.length > 0"> 质量 </VListSubheader>
-        <VListItem>
-          <VChipGroup v-model="filterForm.edition" column multiple>
-            <VChip
-              v-for="edition in editionFilterOptions"
-              :key="edition"
-              :color="filterForm.edition.includes(edition) ? 'primary' : ''"
-              filter
-              variant="outlined"
-              :value="edition"
-            >
-              {{ edition }}
-            </VChip>
-          </VChipGroup>
-        </VListItem>
-        <VListSubheader v-if="resolutionFilterOptions.length > 0"> 分辨率 </VListSubheader>
-        <VListItem>
-          <VChipGroup v-model="filterForm.resolution" column multiple>
-            <VChip
-              v-for="resolution in resolutionFilterOptions"
-              :key="resolution"
-              :color="filterForm.resolution.includes(resolution) ? 'primary' : ''"
-              filter
-              variant="outlined"
-              :value="resolution"
-            >
-              {{ resolution }}
-            </VChip>
-          </VChipGroup>
-        </VListItem>
-        <VListSubheader v-if="releaseGroupFilterOptions.length > 0"> 制作组 </VListSubheader>
-        <VListItem>
-          <VChipGroup v-model="filterForm.releaseGroup" column multiple>
-            <VChip
-              v-for="releaseGroup in releaseGroupFilterOptions"
-              :key="releaseGroup"
-              :color="filterForm.releaseGroup.includes(releaseGroup) ? 'primary' : ''"
-              filter
-              variant="outlined"
-              :value="releaseGroup"
-            >
-              {{ releaseGroup }}
-            </VChip>
-          </VChipGroup>
-        </VListItem>
-        <VListSubheader v-if="videoCodeFilterOptions.length > 0"> 视频编码 </VListSubheader>
-        <VListItem>
-          <VChipGroup v-model="filterForm.videoCode" column multiple>
-            <VChip
-              v-for="videoCode in videoCodeFilterOptions"
-              :key="videoCode"
-              :color="filterForm.videoCode.includes(videoCode) ? 'primary' : ''"
-              filter
-              variant="outlined"
-              :value="videoCode"
-            >
-              {{ videoCode }}
-            </VChip>
-          </VChipGroup>
-        </VListItem>
-        <VListSubheader v-if="freeStateFilterOptions.length > 0"> 促销状态 </VListSubheader>
-        <VListItem>
-          <VChipGroup v-model="filterForm.freeState" column multiple>
-            <VChip
-              v-for="freeState in freeStateFilterOptions"
-              :key="freeState"
-              :color="filterForm.freeState.includes(freeState) ? 'primary' : ''"
-              filter
-              variant="outlined"
-              :value="freeState"
-            >
-              {{ freeState }}
-            </VChip>
-          </VChipGroup>
-        </VListItem>
-        <VListSubheader v-if="seasonFilterOptions.length > 0"> 季集 </VListSubheader>
-        <VListItem>
-          <VChipGroup v-model="filterForm.season" column multiple>
-            <VChip
-              v-for="season in sortSeasonFilterOptions"
-              :key="season"
-              :color="filterForm.season.includes(season) ? 'primary' : ''"
-              filter
-              variant="outlined"
-              :value="season"
-            >
-              {{ season }}
-            </VChip>
-          </VChipGroup>
-        </VListItem>
-      </VList>
-    </VCol>
-  </VRow>
-</template>

src/views/plugin/PluginCardListView.vue

@@ -1,4 +1,5 @@
 <script lang="ts" setup>
+import draggable from 'vuedraggable'
 import { useToast } from 'vue-toast-notification'
 import api from '@/api'
 import type { Plugin } from '@/api/types'
@@ -28,6 +29,9 @@ const pluginId = ref(route.query.id)
 // 当前排序字段
 const activeSort = ref(null)
 
+// 插件顺序配置
+const orderConfig = ref<{ id: string }[]>([])
+
 // 排序选项
 const sortOptions = [
   { title: '热门', value: 'count' },
@@ -104,6 +108,52 @@ const labelFilterOptions = ref<string[]>([])
 // 插件库过滤项
 const repoFilterOptions = ref<string[]>([])
 
+// 加载插件顺序
+async function loadPluginOrderConfig() {
+  // 顺序配置
+  const local_order = localStorage.getItem('MP_PLUGIN_ORDER')
+  if (local_order) {
+    orderConfig.value = JSON.parse(local_order)
+  } else {
+    const response2 = await api.get('/user/config/PluginOrder')
+    if (response2 && response2.data && response2.data.value) {
+      orderConfig.value = response2.data.value
+      localStorage.setItem('MP_PLUGIN_ORDER', JSON.stringify(orderConfig.value))
+    }
+  }
+}
+
+// 按order的顺序对插件进行排序
+function sortPluginOrder() {
+  if (!orderConfig.value) {
+    return
+  }
+  if (dataList.value.length === 0) {
+    return
+  }
+  dataList.value.sort((a, b) => {
+    const aIndex = orderConfig.value.findIndex((item: { id: string }) => item.id === a.id)
+    const bIndex = orderConfig.value.findIndex((item: { id: string }) => item.id === b.id)
+    return (aIndex === -1 ? 999 : aIndex) - (bIndex === -1 ? 999 : bIndex)
+  })
+}
+
+// 保存顺序设置
+async function savePluginOrder() {
+  // 顺序配置
+  const orderObj = dataList.value.map(item => ({ id: item.id || '' }))
+  orderConfig.value = orderObj
+  const orderString = JSON.stringify(orderObj)
+  localStorage.setItem('MP_PLUGIN_ORDER', orderString)
+
+  // 保存到服务端
+  try {
+    await api.post('/user/config/PluginOrder', orderObj)
+  } catch (error) {
+    console.error(error)
+  }
+}
+
 // 初始化过滤选项
 function initOptions(item: Plugin) {
   const optionValue = (options: Array<string>, value: string | undefined) => {
@@ -208,6 +258,8 @@ async function fetchInstalledPlugins() {
         state: 'installed',
       },
     })
+    // 排序
+    sortPluginOrder()
     loading.value = false
     isRefreshed.value = true
   } catch (error) {
@@ -329,8 +381,9 @@ function handleRepoUrl(url: string | undefined) {
 }
 
 // 加载时获取数据
-onBeforeMount(async () => {
-  await refreshData()
+onMounted(async () => {
+  await loadPluginOrderConfig()
+  refreshData()
   getPluginStatistics()
   if (activeTab.value != 'market' && pluginId.value) {
     // 找到这个插件
@@ -344,9 +397,12 @@ onBeforeMount(async () => {
 
 <template>
   <div>
-    <VTabs v-model="activeTab">
+    <VTabs v-model="activeTab" show-arrows>
       <VTab v-for="item in PluginTabs" :value="item.tab">
-        <span class="mx-5">{{ item.title }}</span>
+        <div class="flex align-center min-w-24">
+          <VIcon size="20" start :icon="item.icon" />
+          {{ item.title }}
+        </div>
       </VTab>
     </VTabs>
 
@@ -356,18 +412,26 @@ onBeforeMount(async () => {
         <transition name="fade-slide" appear>
           <div>
             <LoadingBanner v-if="!isRefreshed" class="mt-12" />
-            <div v-if="dataList.length > 0" class="grid gap-4 grid-plugin-card">
-              <template v-for="(data, index) in dataList" :key="`${data.id}_v${data.plugin_version}`">
+            <draggable
+              v-if="dataList.length > 0"
+              v-model="dataList"
+              @end="savePluginOrder"
+              handle=".cursor-move"
+              item-key="id"
+              tag="div"
+              :component-data="{ class: 'grid gap-4 grid-plugin-card' }"
+            >
+              <template #item="{ element }">
                 <PluginCard
-                  :count="PluginStatistics[data.id || '0']"
-                  :plugin="data"
-                  :action="pluginActions[data.id || '0']"
+                  :count="PluginStatistics[element.id || '0']"
+                  :plugin="element"
+                  :action="pluginActions[element.id || '0']"
                   @remove="refreshData"
                   @save="refreshData"
-                  @action-done="pluginActions[data.id || '0'] = false"
+                  @action-done="pluginActions[element.id || '0'] = false"
                 />
               </template>
-            </div>
+            </draggable>
             <NoDataFound
               v-if="dataList.length === 0 && isRefreshed"
               error-code="404"
@@ -446,7 +510,7 @@ onBeforeMount(async () => {
     </VWindow>
   </div>
 
-  <div>
+  <div v-if="isRefreshed">
     <!-- 插件搜索图标 -->
     <VFab
       icon="mdi-magnify"
@@ -485,7 +549,6 @@ onBeforeMount(async () => {
     v-if="SearchDialog"
     v-model="SearchDialog"
     scrollable
-    :z-index="1010"
     max-width="40rem"
     :max-height="!display.mdAndUp.value ? '' : '85vh'"
     :fullscreen="!display.mdAndUp.value"
@@ -543,7 +606,7 @@ onBeforeMount(async () => {
     </VCard>
   </VDialog>
   <!-- 安装插件进度框 -->
-  <VDialog v-model="progressDialog" :scrim="false" width="25rem">
+  <VDialog v-if="progressDialog" v-model="progressDialog" :scrim="false" width="25rem">
     <VCard color="primary">
       <VCardText class="text-center">
         {{ progressText }}

src/views/reorganize/TransferHistoryView.vue

@@ -4,6 +4,7 @@ import { useToast } from 'vue-toast-notification'
 import api from '@/api'
 import type { TransferHistory } from '@/api/types'
 import ReorganizeDialog from '@/components/dialog/ReorganizeDialog.vue'
+import TransferQueueDialog from '@/components/dialog/TransferQueueDialog.vue'
 import ProgressDialog from '@/components/dialog/ProgressDialog.vue'
 import { useRoute } from 'vue-router'
 import router from '@/router'
@@ -20,9 +21,15 @@ const $toast = useToast()
 // 路由
 const route = useRoute()
 
+// 组合式输入法状态
+const isComposing = ref(false)
+
 // 重新整理对话框
 const redoDialog = ref(false)
 
+// 整理队列对话框
+const transferQueueDialog = ref(false)
+
 // 当前操作记录
 const currentHistory = ref<TransferHistory>()
 
@@ -41,7 +48,41 @@ const headers = [
     sortable: true,
   },
   {
-    title: '目录',
+    title: '路径',
+    key: 'src',
+    sortable: true,
+  },
+  {
+    title: '转移方式',
+    key: 'mode',
+    sortable: true,
+  },
+  {
+    title: '时间',
+    key: 'date',
+    sortable: true,
+  },
+  {
+    title: '状态',
+    key: 'status',
+    sortable: true,
+  },
+  {
+    title: '',
+    key: 'actions',
+    sortable: false,
+  },
+]
+
+// 分组表头
+const groupHeaders = [
+  {
+    title: '季集/类别',
+    key: 'title',
+    sortable: true,
+  },
+  {
+    title: '路径',
     key: 'src',
     sortable: true,
   },
@@ -91,6 +132,16 @@ const loading = ref(false)
 // 总条数
 const totalItems = ref(0)
 
+// 是否要分组
+const group = ref(false)
+
+// 分组条件
+const groupBy = ref<any>([
+  {
+    key: 'title',
+  },
+])
+
 // 每页条数
 const itemsPerPage = ref<number>(ensureNumber(route.query.itemsPerPage, 50))
 
@@ -106,6 +157,9 @@ const progressText = ref('请稍候 ...')
 // 进度值
 const progressValue = ref(0)
 
+// 是否已刷新
+const isRefreshed = ref(false)
+
 // 删除确认对话框
 const deleteConfirmDialog = ref(false)
 
@@ -144,7 +198,7 @@ const totalPage = computed(() => {
   return total
 })
 
-// 切换页签和搜索词
+// 切换页签
 watch(
   [() => currentPage.value, () => itemsPerPage.value],
   debounce(async () => {
@@ -152,10 +206,14 @@ watch(
   }, 1000),
 )
 
+// 搜索监听
 watch(
-  [() => search.value],
+  [() => search.value, () => isComposing.value],
   debounce(async () => {
-    reloadPage(true)
+    if (!isComposing.value) {
+      console.log('search: ' + search.value)
+      reloadPage(true)
+    }
   }, 1000),
 )
 
@@ -171,7 +229,7 @@ async function fetchData(page = currentPage.value, count = itemsPerPage.value) {
         title: search.value,
       },
     })
-
+    isRefreshed.value = true
     dataList.value = result.data?.list
     totalItems.value = result.data?.total
     searchHintList.value = ['失败', '成功', ...new Set(dataList.value.map(item => item.title || ''))].filter(
@@ -361,15 +419,16 @@ onMounted(fetchData)
     <VCardItem>
       <VCardTitle>
         <VRow>
-          <VCol cols="4" md="6"> 历史记录 </VCol>
           <VCol cols="8" md="6" class="flex">
             <VCombobox
               key="search_navbar"
               v-model="search"
               :items="searchHintList"
+              @compositionstart="isComposing = true"
+              @compositionend="isComposing = false"
               class="text-disabled"
               density="compact"
-              label="搜索目录、状态"
+              label="搜索整理记录"
               prepend-inner-icon="mdi-magnify"
               variant="solo-filled"
               single-line
@@ -379,10 +438,120 @@ onMounted(fetchData)
               clearable
             />
           </VCol>
+          <VCol cols="4" md="6" class="text-end">
+            <VBtn
+              color="primary"
+              prepend-icon="mdi-tray-full"
+              append-icon="mdi-dots-horizontal"
+              @click="transferQueueDialog = true"
+            >
+              <span v-if="display.mdAndUp.value" class="ms-2">整理队列</span>
+            </VBtn>
+          </VCol>
         </VRow>
       </VCardTitle>
     </VCardItem>
+    <!-- 分组模式 -->
     <VDataTableVirtual
+      v-if="group"
+      v-model="selected"
+      :groupBy="groupBy"
+      :headers="groupHeaders"
+      :items="dataList"
+      :loading="loading"
+      density="compact"
+      return-object
+      fixed-header
+      show-select
+      loading-text="加载中..."
+      hover
+      :style="tableStyle"
+    >
+      <template #header.data-table-group>
+        <span>标题</span>
+      </template>
+      <template v-slot:group-header="{ item, columns, toggleGroup, isGroupOpen }">
+        <tr>
+          <td :colspan="columns.length">
+            <VBtn
+              :icon="isGroupOpen(item) ? '$expand' : '$next'"
+              size="small"
+              variant="text"
+              @click="toggleGroup(item)"
+            />
+            {{ item.value }}
+          </td>
+        </tr>
+      </template>
+      <template #item.title="{ item }">
+        <div class="d-flex align-center">
+          <VAvatar>
+            <VIcon :icon="getIcon(item.type || '')" />
+          </VAvatar>
+          <div class="d-flex flex-column ms-1">
+            <span v-if="item.type === '电视剧'" class="d-block text-high-emphasis min-w-20">
+              {{ item?.seasons }}{{ item?.episodes }}
+            </span>
+            <small>{{ item?.category }}</small>
+          </div>
+        </div>
+      </template>
+      <template #item.src="{ item }">
+        <div>
+          <span>
+            <VChip variant="tonal" size="small" label class="my-1"> {{ storageDict[item?.src_storage || ''] }}</VChip>
+            <small>{{ item?.src }}</small>
+          </span>
+          <span class="text-high-emphasis text-bold"> => </span>
+          <br />
+          <span v-if="item?.dest">
+            <VChip variant="tonal" size="small" label class="my-1"> {{ storageDict[item?.dest_storage || ''] }}</VChip>
+            <small>{{ item?.dest }}</small>
+          </span>
+        </div>
+      </template>
+      <template #item.mode="{ item }">
+        <VChip variant="outlined" color="primary" size="small">
+          {{ TransferDict[item?.mode ?? ''] || '未知' }}
+        </VChip>
+      </template>
+      <template #item.status="{ item }">
+        <VChip v-if="item?.status" color="success" size="small"> 成功 </VChip>
+        <VTooltip v-else :text="item?.errmsg">
+          <template #activator="{ props }">
+            <VChip v-bind="props" color="error" size="small"> 失败 </VChip>
+          </template>
+        </VTooltip>
+      </template>
+      <template #item.date="{ item }">
+        <small>{{ item?.date }}</small>
+      </template>
+      <template #item.actions="{ item }">
+        <IconBtn>
+          <VIcon icon="mdi-dots-vertical" />
+          <VMenu activator="parent" close-on-content-click>
+            <VList>
+              <VListItem
+                v-for="(menu, i) in dropdownItems"
+                :key="i"
+                variant="plain"
+                :base-color="menu.props.color"
+                @click="menu.props.click(item)"
+              >
+                <template #prepend>
+                  <VIcon :icon="menu.props.prependIcon" />
+                </template>
+                <VListItemTitle v-text="menu.title" />
+              </VListItem>
+            </VList>
+          </VMenu>
+        </IconBtn>
+      </template>
+      <template #no-data> 没有数据 </template>
+    </VDataTableVirtual>
+    <!-- 列表模式 -->
+    <VDataTableVirtual
+      v-else
       v-model="selected"
       :headers="headers"
       :items="dataList"
@@ -464,7 +633,7 @@ onMounted(fetchData)
       </template>
       <template #no-data> 没有数据 </template>
     </VDataTableVirtual>
-    <div class="flex items-center justify-end">
+    <div class="flex items-center justify-center">
       <div class="w-auto">
         <VSelect v-model="itemsPerPage" :items="pageRange" density="compact" variant="solo" flat />
       </div>
@@ -481,9 +650,8 @@ onMounted(fetchData)
   </VCard>
 
   <!-- 底部操作按钮 -->
-  <div>
+  <div v-if="isRefreshed && selected.length > 0">
     <VFab
-      v-if="selected.length > 0"
       icon="mdi-trash-can-outline"
       color="error"
       location="bottom"
@@ -495,7 +663,6 @@ onMounted(fetchData)
       :class="{ 'mb-12': appMode }"
     />
     <VFab
-      v-if="selected.length > 0"
       :class="appMode ? 'mb-28' : 'mb-16'"
       icon="mdi-redo-variant"
       location="bottom"
@@ -506,6 +673,19 @@ onMounted(fetchData)
       @click="retransferBatch"
     />
   </div>
+  <div v-else-if="isRefreshed">
+    <VFab
+      :icon="group ? 'mdi-format-list-bulleted' : 'mdi-format-list-group'"
+      color="primary"
+      location="bottom"
+      size="x-large"
+      fixed
+      app
+      appear
+      @click="group = !group"
+      :class="{ 'mb-12': appMode }"
+    />
+  </div>
   <!-- 底部弹窗 -->
   <VBottomSheet v-model="deleteConfirmDialog" inset>
     <VCard class="text-center rounded-t">
@@ -514,13 +694,13 @@ onMounted(fetchData)
         {{ confirmTitle }}
       </VCardTitle>
       <div class="d-flex flex-column flex-lg-row justify-center my-3">
-        <VBtn color="primary" class="mb-2 mx-2" @click="deleteConfirmHandler(false, false)"> 仅删除历史记录 </VBtn>
-        <VBtn color="warning" class="mb-2 mx-2" @click="deleteConfirmHandler(true, false)"> 删除历史记录和源文件 </VBtn>
+        <VBtn color="primary" class="mb-2 mx-2" @click="deleteConfirmHandler(false, false)"> 仅删除整理记录 </VBtn>
+        <VBtn color="warning" class="mb-2 mx-2" @click="deleteConfirmHandler(true, false)"> 删除整理记录和源文件 </VBtn>
         <VBtn color="info" class="mb-2 mx-2" @click="deleteConfirmHandler(false, true)">
-          删除历史记录和媒体库文件
+          删除整理记录和媒体库文件
         </VBtn>
         <VBtn color="error" class="mb-2 mx-2" @click="deleteConfirmHandler(true, true)">
-          删除历史记录、源文件和媒体库文件
+          删除整理记录、源文件和媒体库文件
         </VBtn>
       </div>
     </VCard>
@@ -536,6 +716,8 @@ onMounted(fetchData)
     @done="transferDone"
     @close="redoDialog = false"
   />
+  <!-- 整理队列进度弹窗 -->
+  <TransferQueueDialog v-if="transferQueueDialog" v-model="transferQueueDialog" @close="transferQueueDialog = false" />
 </template>
 
 <style lang="scss">

src/views/setting/AccountSettingAbout.vue

@@ -165,7 +165,7 @@ onMounted(() => {
               <dd class="flex text-sm sm:col-span-2 sm:mt-0">
                 <span class="flex-grow undefined">
                   <a
-                    href="https://github.com/jxxghp/MoviePilot/blob/main/README.md"
+                    href="https://wiki.movie-pilot.org"
                     target="_blank"
                     rel="noreferrer"
                     class="text-indigo-500 transition duration-300 hover:underline"
@@ -255,7 +255,7 @@ onMounted(() => {
       </div>
     </div>
   </div>
-  <VDialog v-model="releaseDialog" width="600" scrollable>
+  <VDialog v-if="releaseDialog" v-model="releaseDialog" width="600" scrollable>
     <VCard>
       <VCardItem>
         <DialogCloseBtn @click="releaseDialog = false" />

src/views/setting/AccountSettingDirectory.vue

@@ -52,6 +52,17 @@ async function loadSystemSettings() {
   }
 }
 
+// 重载系统生效配置
+async function reloadSystem() {
+  try {
+    const result: { [key: string]: any } = await api.get('system/reload')
+    if (result.success) $toast.success('系统配置已生效')
+    else $toast.error('重载系统失败！')
+  } catch (error) {
+    console.log(error)
+  }
+}
+
 // 移动结束
 function orderDirectoryCards() {
   // 更新所有目录的优先级
@@ -109,6 +120,7 @@ async function saveDirectories() {
     const result: { [key: string]: any } = await api.post('system/setting/Directories', directories.value)
     if (result.success) {
       $toast.success('目录设置保存成功')
+      await reloadSystem()
     } else $toast.error('目录设置保存失败！')
   } catch (error) {
     console.log(error)
@@ -129,6 +141,7 @@ function addDirectory() {
     monitor_type: '',
     media_type: '',
     media_category: '',
+    transfer_type: ''
   })
   orderDirectoryCards()
 }

src/views/setting/AccountSettingNotification.vue

@@ -222,6 +222,7 @@ onMounted(() => {
                 <VRadioGroup v-model="item.action" inline>
                   <VRadio value="user" label="仅操作用户" />
                   <VRadio value="admin" label="仅管理员" />
+                  <VRadio value="user,admin" label="操作用户和管理员" />
                   <VRadio value="all" label="所有用户" />
                 </VRadioGroup>
               </td>

src/views/setting/AccountSettingRule.vue

@@ -94,8 +94,6 @@ async function addCustomRule() {
   customRules.value.push({
     id: id,
     name: name,
-    include: '',
-    exclude: '',
   })
 }
 
@@ -145,14 +143,11 @@ function addFilterRuleGroup() {
   }
   filterRuleGroups.value.push({
     name: name,
-    rule_string: '',
-    media_type: '',
-    category: '',
   })
 }
 
 // 分享规则
-function shareRules(rules: CustomRule[] | FilterRuleGroup[]) {
+async function shareRules(rules: CustomRule[] | FilterRuleGroup[], type: string) {
   if (!rules || rules.length === 0) return
 
   // 将卡片规则接装为字符串
@@ -160,10 +155,13 @@ function shareRules(rules: CustomRule[] | FilterRuleGroup[]) {
 
   // 复制到剪贴板
   try {
-    copyToClipboard(value)
-    $toast.success('优先级规则已复制到剪贴板')
-  } catch (error) {
-    $toast.error('优先级规则复制失败！')
+    let success
+    success = copyToClipboard(value)
+    if (await success) $toast.success(`${type === 'custom' ? '自定义规则' : '优先级规则组'}已复制到剪贴板！`)
+    else $toast.error(`${type === 'custom' ? '自定义规则' : '优先级规则组'}复制失败：可能是浏览器不支持或被用户阻止！`)
+  } catch (e) {
+    $toast.error(`${type === 'custom' ? '自定义规则' : '优先级规则组'}复制失败！`)
+    console.error(e)
   }
 }
 
@@ -213,6 +211,9 @@ function extractCustomRules(value: any) {
         name: item.name,
         include: item.include,
         exclude: item.exclude,
+        size_range: item.size_range,
+        seeders: item.seeders,
+        publish_time: item.publish_time,
       }
     })
   } catch (e) {
@@ -262,7 +263,7 @@ function checkValueValidity(values: any, type: string): boolean {
           return false
         }
       } else {
-        console.error(`传入了不合法类型`)
+        console.error(`传入了不合法的类型！`)
         return false
       }
     }
@@ -273,6 +274,18 @@ function checkValueValidity(values: any, type: string): boolean {
   }
 }
 
+// 清空规则（组）
+function deleteAllRules(dateType: string) {
+  if (!dateType) return
+  if (dateType === 'custom') {
+    customRules.value = []
+  } else if (dateType === 'group') {
+    filterRuleGroups.value = []
+  } else {
+    console.error(`传入了不支持的类型！`)
+  }
+}
+
 // 规则变化时赋值
 function onRuleChange(rule: CustomRule, id: string) {
   const index = customRules.value.findIndex(item => item.id === id)
@@ -369,12 +382,15 @@ onMounted(() => {
                 <VBtn color="success" variant="tonal" @click="addCustomRule">
                   <VIcon icon="mdi-plus" />
                 </VBtn>
-                <VBtn color="info" variant="tonal" @click="importRules('custom')">
+                <VBtn color="primary" variant="tonal" @click="importRules('custom')">
                   <VIcon icon="mdi-import" />
                 </VBtn>
-                <VBtn color="info" variant="tonal" @click="shareRules(customRules)">
+                <VBtn color="info" variant="tonal" @click="shareRules(customRules, 'custom')">
                   <VIcon icon="mdi-share" />
                 </VBtn>
+                <VBtn color="error" variant="tonal" @click="deleteAllRules('custom')">
+                  <VIcon icon="mdi-delete" />
+                </VBtn>
               </VBtnGroup>
             </div>
           </VForm>
@@ -417,12 +433,15 @@ onMounted(() => {
                 <VBtn color="success" variant="tonal" @click="addFilterRuleGroup">
                   <VIcon icon="mdi-plus" />
                 </VBtn>
-                <VBtn color="info" variant="tonal" @click="importRules('group')">
+                <VBtn color="primary" variant="tonal" @click="importRules('group')">
                   <VIcon icon="mdi-import" />
                 </VBtn>
-                <VBtn color="info" variant="tonal" @click="shareRules(filterRuleGroups)">
+                <VBtn color="info" variant="tonal" @click="shareRules(filterRuleGroups, 'group')">
                   <VIcon icon="mdi-share" />
                 </VBtn>
+                <VBtn color="error" variant="tonal" @click="deleteAllRules('group')">
+                  <VIcon icon="mdi-delete" />
+                </VBtn>
               </VBtnGroup>
             </div>
           </VForm>
@@ -433,7 +452,7 @@ onMounted(() => {
   <ImportCodeDialog
     v-if="importCodeDialog"
     v-model="importCodeDialog"
-    :title="`导入${importCodeType === 'custom' ? '自定义规则' : '规则组'}`"
+    :title="`导入${importCodeType === 'custom' ? '自定义规则' : '优先级规则组'}`"
     :dataType="importCodeType"
     @close="importCodeDialog = false"
     @save="saveCodeString"

src/views/setting/AccountSettingSearch.vue

@@ -133,6 +133,11 @@ async function saveSearchSetting() {
       selectedMediaSource.value.join(','),
     )
 
+    if (!result1 || !result1.success) {
+      $toast.error(`媒体搜索数据源保存失败：${result1?.message}！`)
+      return
+    }
+
     const result2: { [key: string]: any } = await api.post(
       'system/setting/SearchFilterRuleGroups',
       selectedFilterGroup.value,
@@ -140,7 +145,7 @@ async function saveSearchSetting() {
 
     const result3 = await saveSystemSetting(SystemSettings.value.Basic)
 
-    if (result1.success && result2.success && result3) {
+    if (result2.success && result3) {
       $toast.success('搜索基础设置保存成功')
     } else {
       $toast.error('搜索基础设置保存失败！')

src/views/setting/AccountSettingSystem.vue

@@ -26,17 +26,16 @@ const SystemSettings = ref<any>({
     // 全局
     AUXILIARY_AUTH_ENABLE: false,
     GLOBAL_IMAGE_CACHE: false,
+    SUBSCRIBE_STATISTIC_SHARE: true,
+    PLUGIN_STATISTIC_SHARE: true,
     BIG_MEMORY_MODE: false,
     DB_WAL_ENABLE: false,
-    ENCODING_DETECTION_PERFORMANCE_MODE: true,
     // 媒体
     TMDB_API_DOMAIN: null,
     TMDB_IMAGE_DOMAIN: null,
     META_CACHE_EXPIRE: 0,
-    FANART_ENABLE: false,
     SCRAP_FOLLOW_TMDB: true,
-    SUBSCRIBE_STATISTIC_SHARE: true,
-    PLUGIN_STATISTIC_SHARE: true,
+    FANART_ENABLE: false,
     // 网络
     PROXY_HOST: null,
     GITHUB_PROXY: null,
@@ -44,9 +43,16 @@ const SystemSettings = ref<any>({
     DOH_ENABLE: false,
     DOH_RESOLVERS: null,
     DOH_DOMAINS: null,
-    // 开发
+    // 日志
     DEBUG: false,
+    LOG_LEVEL: 'INFO',
+    LOG_MAX_FILE_SIZE: '5',
+    LOG_BACKUP_COUNT: '3',
+    LOG_FILE_FORMAT: '【%(levelname)s】%(asctime)s - %(message)s',
+    // 实验室
     PLUGIN_AUTO_RELOAD: false,
+    ENCODING_DETECTION_PERFORMANCE_MODE: true,
+    TOKENIZED_SEARCH: false,
   },
 })
 
@@ -171,6 +177,9 @@ async function saveSystemSetting(value: { [key: string]: any }) {
     const result: { [key: string]: any } = await api.post('system/env', value)
     if (result.success) {
       return true
+    } else {
+      $toast.error(`设置保存失败：${result?.message}！`)
+      return false
     }
   } catch (error) {
     console.log(error)
@@ -183,27 +192,36 @@ async function saveBasicSettings() {
   if (await saveSystemSetting(SystemSettings.value.Basic)) {
     $toast.success('基础设置保存成功')
     await reloadSystem()
-  } else {
-    $toast.error('基础设置保存失败！')
   }
 }
 
-// 高级设置变化，等待保存
+// 保存高级设置
 async function saveAdvancedSettings() {
+  cleanEmptyFields(SystemSettings.value.Advanced, ['LOG_FILE_FORMAT'])
+
   if (await saveSystemSetting(SystemSettings.value.Advanced)) {
     advancedDialog.value = false
     $toast.success('高级设置保存成功')
     await reloadSystem()
-  } else {
-    $toast.error('高级设置保存失败！')
   }
 }
 
+// 当字段为空时，将其设置为 null 提交，以便后端恢复为默认值
+function cleanEmptyFields(settings: any, fields: string[]) {
+  fields.forEach(field => {
+    if (settings[field]?.trim?.() === '') {
+      settings[field] = null
+    }
+  })
+}
+
 // 快捷复制到剪贴板
-function copyValue(value: string) {
+async function copyValue(value: string) {
   try {
-    copyToClipboard(value)
-    $toast.success('已复制到剪贴板')
+    let success
+    success = copyToClipboard(value)
+    if (await success) $toast.success('已复制到剪贴板！')
+    else $toast.error(`复制失败：可能是浏览器不支持或被用户阻止！`)
   } catch (error) {
     $toast.error('复制失败！')
     console.log(error)
@@ -218,9 +236,9 @@ const wallpaperItems = [
 ]
 
 // 预设部分Github加速站
-const githubMirrorsItems = [
-  'https://mirror.ghproxy.com/', // GitHub Proxy
-  'https://ghp.ci/', // GitHub Proxy 子站
+const githubMirrorsItems: string[] = [
+  // str: 'https://mirror.ghproxy.com/', // GitHub Proxy
+  // str: 'https://ghp.ci/', // GitHub Proxy 子站
 ]
 
 // 预设部分PIP镜像站
@@ -236,6 +254,15 @@ const pipMirrorsItems = [
   'https://mirrors.bfsu.edu.cn/pypi/web/simple', // 北京外国语大学
 ]
 
+// 日志等级
+const logLevelItems = [
+  { title: 'DEBUG - 调试 ', value: 'DEBUG' },
+  { title: 'INFO - 信息 ', value: 'INFO' },
+  { title: 'WARNING - 警告 ', value: 'WARNING' },
+  { title: 'ERROR - 错误 ', value: 'ERROR' },
+  { title: 'CRITICAL - 严重 ', value: 'CRITICAL' },
+]
+
 // 创建随机字符串
 function createRandomString() {
   const charset = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ-_'
@@ -400,7 +427,14 @@ onDeactivated(() => {
             <div class="d-flex flex-wrap gap-4 mt-4">
               <VBtn type="submit" @click="saveBasicSettings"> 保存 </VBtn>
               <VSpacer />
-              <VBtn color="warning" @click="advancedDialog = true" append-icon="mdi-dots-horizontal"> 高级设置 </VBtn>
+              <VBtn
+                color="error"
+                @click="advancedDialog = true"
+                prepend-icon="mdi-cog"
+                append-icon="mdi-dots-horizontal"
+              >
+                高级设置
+              </VBtn>
             </div>
           </VForm>
         </VCardText>
@@ -526,6 +560,9 @@ onDeactivated(() => {
           <VTab value="network">
             <div>网络</div>
           </VTab>
+          <VTab value="log">
+            <div>日志</div>
+          </VTab>
           <VTab value="dev">
             <div>实验室</div>
           </VTab>
@@ -595,7 +632,7 @@ onDeactivated(() => {
                     placeholder="api.themoviedb.org"
                     hint="自定义themoviedb API域名或代理地址"
                     persistent-hint
-                    :items="['api.themoviedb.org']"
+                    :items="['api.themoviedb.org', 'api.tmdb.org']"
                     :rules="[(v: string) => !!v || '请输入TMDB API域名']"
                   />
                 </VCol>
@@ -650,7 +687,7 @@ onDeactivated(() => {
                   <VCombobox
                     v-model="SystemSettings.Advanced.GITHUB_PROXY"
                     label="Github加速代理"
-                    placeholder="https://mirror.ghproxy.com/"
+                    placeholder="http(s)://host/"
                     hint="使用代理加速Github访问速度"
                     persistent-hint
                     :items="githubMirrorsItems"
@@ -660,7 +697,7 @@ onDeactivated(() => {
                   <VCombobox
                     v-model="SystemSettings.Advanced.PIP_PROXY"
                     label="PIP加速代理"
-                    placeholder="https://pypi.tuna.tsinghua.edu.cn/simple"
+                    placeholder="http(s)://host"
                     hint="使用代理加速插件等pip库安装速度"
                     persistent-hint
                     :items="pipMirrorsItems"
@@ -697,19 +734,65 @@ onDeactivated(() => {
               </VRow>
             </div>
           </VWindowItem>
-
-          <VWindowItem value="dev">
+          <VWindowItem value="log">
             <div>
               <VRow>
-                <VCol cols="12" md="4">
+                <VCol cols="12" md="6">
                   <VSwitch
                     v-model="SystemSettings.Advanced.DEBUG"
-                    label="DEBUG日志"
-                    hint="显示DEBUG级别日志，方便排查问题"
+                    label="调试模式"
+                    hint="启用调试模式后，日志将以DEBUG级别记录，以便排查问题"
                     persistent-hint
                   />
                 </VCol>
-                <VCol cols="12" md="4">
+                <VCol cols="12" md="6">
+                  <VSelect
+                    v-if="!SystemSettings.Advanced.DEBUG"
+                    v-model="SystemSettings.Advanced.LOG_LEVEL"
+                    label="日志等级"
+                    hint="设置日志记录的级别，用于控制日志输出量"
+                    persistent-hint
+                    :items="logLevelItems"
+                  />
+                </VCol>
+                <VCol cols="12" md="6">
+                  <VTextField
+                    v-model="SystemSettings.Advanced.LOG_MAX_FILE_SIZE"
+                    label="日志文件最大容量(MB)"
+                    hint="限制单个日志文件的最大容量，超出后将自动分割日志"
+                    persistent-hint
+                    min="1"
+                    type="number"
+                    suffix="MB"
+                    :rules="[(v: any) => v === 0 || !!v || '日志文件最大大小', (v: any) => v >= 1 || '日志文件最大容量必须大于等于1']"
+                  />
+                </VCol>
+                <VCol cols="12" md="6">
+                  <VTextField
+                    v-model="SystemSettings.Advanced.LOG_BACKUP_COUNT"
+                    label="日志文件最大备份数量"
+                    hint="设置每个模块日志文件的最大备份数量，超过后将覆盖旧日志"
+                    persistent-hint
+                    min="1"
+                    type="number"
+                    :rules="[(v: any) => v === 0 || !!v || '请输入日志文件最大备份数量', (v: any) => v >= 1 || '日志文件最大备份数量必须大于等于1']"
+                  />
+                </VCol>
+                <VCol cols="12">
+                  <VTextField
+                    v-model="SystemSettings.Advanced.LOG_FILE_FORMAT"
+                    label="日志文件格式"
+                    hint="设置日志文件的输出格式，用于自定义日志的显示内容"
+                    persistent-hint
+                  />
+                </VCol>
+              </VRow>
+            </div>
+          </VWindowItem>
+          <VWindowItem value="dev">
+            <div>
+              <VRow>
+                <VCol cols="12" md="6">
                   <VSwitch
                     v-model="SystemSettings.Advanced.PLUGIN_AUTO_RELOAD"
                     label="插件热加载"
@@ -717,7 +800,7 @@ onDeactivated(() => {
                     persistent-hint
                   />
                 </VCol>
-                <VCol cols="12" md="4">
+                <VCol cols="12" md="6">
                   <VSwitch
                     v-model="SystemSettings.Advanced.ENCODING_DETECTION_PERFORMANCE_MODE"
                     label="编码探测性能模式"
@@ -725,6 +808,14 @@ onDeactivated(() => {
                     persistent-hint
                   />
                 </VCol>
+                <VCol cols="12" md="6">
+                  <VSwitch
+                    v-model="SystemSettings.Advanced.TOKENIZED_SEARCH"
+                    label="分词搜索"
+                    hint="提升整理历史记录搜索精度，但可能增加性能开销和意外结果"
+                    persistent-hint
+                  />
+                </VCol>
               </VRow>
             </div>
           </VWindowItem>