+
+ {{
+ item.media_type === 'movie'
+ ? t('setting.cache.mediaType.movie')
+ : item.media_type === 'tv'
+ ? t('setting.cache.mediaType.tv')
+ : item.media_type
+ }}
+
{
{{ getMobileMediaMeta(item) }}
-
-
- {{
- item.media_type === 'movie'
- ? t('setting.cache.mediaType.movie')
- : item.media_type === 'tv'
- ? t('setting.cache.mediaType.tv')
- : item.media_type
- }}
-
-
-
{{ getMobileResourceMeta(item) }}
{{ formatFileSize(item.size) }}
@@ -714,7 +731,7 @@ watch([titleFilter, siteFilter], () => {
block-size: 100%;
inline-size: 100%;
min-block-size: 0;
- padding: calc(18px + env(safe-area-inset-top)) 16px calc(18px + env(safe-area-inset-bottom));
+ padding: calc(8px + env(safe-area-inset-top)) 16px calc(18px + env(safe-area-inset-bottom));
background: var(--cache-mobile-page-bg);
gap: 16px;
}
@@ -820,12 +837,13 @@ watch([titleFilter, siteFilter], () => {
background: var(--cache-mobile-surface-bg);
box-shadow: 0 10px 30px rgba(var(--v-theme-on-surface), 0.07);
gap: 14px;
- grid-template-columns: 72px minmax(0, 1fr) 32px;
+ grid-template-columns: 72px minmax(0, 1fr);
margin-block-end: 12px;
padding: 14px;
}
.cache-mobile-card__poster {
+ position: relative;
display: flex;
overflow: hidden;
align-items: center;
@@ -837,6 +855,14 @@ watch([titleFilter, siteFilter], () => {
inline-size: 72px;
}
+.cache-mobile-card__type {
+ position: absolute;
+ z-index: 1;
+ inset-block-end: 5px;
+ inset-inline-start: 50%;
+ transform: translateX(-50%);
+}
+
.cache-mobile-card__content {
min-inline-size: 0;
}
@@ -847,6 +873,7 @@ watch([titleFilter, siteFilter], () => {
font-weight: 700;
line-height: 1.35;
overflow-wrap: anywhere;
+ padding-inline-end: 34px;
white-space: normal;
word-break: break-word;
}
@@ -854,8 +881,8 @@ watch([titleFilter, siteFilter], () => {
.cache-mobile-card__main {
margin-block-start: 6px;
color: rgba(var(--v-theme-on-surface), 0.88);
- font-size: 18px;
- font-weight: 800;
+ font-size: 15px;
+ font-weight: 700;
line-height: 1.32;
overflow-wrap: anywhere;
white-space: normal;
@@ -865,25 +892,14 @@ watch([titleFilter, siteFilter], () => {
.cache-mobile-card__main span {
margin-inline-start: 6px;
color: rgba(var(--v-theme-on-surface), 0.58);
- font-size: 16px;
- font-weight: 600;
-}
-
-.cache-mobile-card__chips {
- display: flex;
- align-items: center;
- flex-wrap: wrap;
- margin-block-start: 8px;
- color: rgba(var(--v-theme-on-surface), 0.62);
font-size: 14px;
- font-weight: 600;
- gap: 8px;
+ font-weight: 500;
}
.cache-mobile-card__meta {
- display: flex;
- align-items: flex-end;
- justify-content: space-between;
+ display: grid;
+ align-items: end;
+ grid-template-columns: minmax(0, 1fr) auto;
margin-block-start: 8px;
color: rgba(var(--v-theme-on-surface), 0.62);
font-size: 14px;
@@ -898,17 +914,18 @@ watch([titleFilter, siteFilter], () => {
}
.cache-mobile-card__meta strong {
- flex: 0 0 auto;
color: rgba(var(--v-theme-on-surface), 0.62);
font-size: 14px;
font-weight: 700;
+ text-align: end;
white-space: nowrap;
}
.cache-mobile-card__menu {
- align-self: center;
+ position: absolute;
color: rgba(var(--v-theme-on-surface), 0.5);
- justify-self: end;
+ inset-block-start: 8px;
+ inset-inline-end: 8px;
}
.cache-mobile-load-state,
@@ -960,7 +977,7 @@ html[data-theme='transparent'] .cache-mobile-page,
}
.cache-mobile-card {
- grid-template-columns: 64px minmax(0, 1fr) 28px;
+ grid-template-columns: 64px minmax(0, 1fr);
padding: 12px;
}
diff --git a/src/views/system/ServiceView.vue b/src/views/system/ServiceView.vue
index 375c4fcd..7596ca3a 100644
--- a/src/views/system/ServiceView.vue
+++ b/src/views/system/ServiceView.vue
@@ -4,7 +4,6 @@ import api from '@/api'
import type { ScheduleInfo } from '@/api/types'
import { useI18n } from 'vue-i18n'
import { useBackground } from '@/composables/useBackground'
-import { useTheme } from 'vuetify'
// 移动端任务卡片视觉配置。
type SchedulerMobileVisual = {
@@ -23,7 +22,6 @@ type SchedulerMobileVisualRule = SchedulerMobileVisual & {
// 国际化
const { t } = useI18n()
const { useDataRefresh } = useBackground()
-const theme = useTheme()
// 提示框
const $toast = useToast()
@@ -31,10 +29,6 @@ const $toast = useToast()
// 定时服务列表
const schedulerList = ref([])
-// 当前是否为透明主题,用于限制透明适配只作用于本组件内部节点。
-const isTransparentTheme = computed(() => theme.name.value === 'transparent')
-const isDarkTheme = computed(() => theme.current.value.dark && !isTransparentTheme.value)
-
// 移动端任务图标按后端 job id 优先匹配,避免列表顺序变化导致图标看起来随机。
const schedulerMobileVisualRules: SchedulerMobileVisualRule[] = [
{ ids: ['cookiecloud'], names: ['CookieCloud'], icon: 'mdi-cloud-sync-outline', color: '#3f8cff', rgb: '63, 140, 255' },
@@ -229,32 +223,18 @@ const { loading: schedulerLoading } = useDataRefresh(
-
+
-
{{ t('setting.scheduler.noService') }}
+
-
{{ t('common.loadingText') }}
+
-
+
@@ -325,18 +301,10 @@ const { loading: schedulerLoading } = useDataRefresh(
font-size: 15px;
}
-.scheduler-empty--transparent {
- background: transparent;
-}
-
.mobile-scheduler-view {
- --scheduler-mobile-card-bg: rgba(var(--v-theme-surface), 0.94);
- --scheduler-mobile-card-shadow: none;
- --scheduler-mobile-view-bg: transparent;
-
min-block-size: 100%;
padding: 12px 18px calc(22px + env(safe-area-inset-bottom));
- background: var(--scheduler-mobile-view-bg);
+ background: transparent;
}
.mobile-scheduler-list {
@@ -351,8 +319,9 @@ const { loading: schedulerLoading } = useDataRefresh(
padding: 18px;
border: 0;
border-radius: var(--app-surface-radius);
- background: var(--scheduler-mobile-card-bg);
- box-shadow: var(--scheduler-mobile-card-shadow);
+ background: rgb(var(--v-theme-surface));
+ backdrop-filter: none;
+ box-shadow: none;
column-gap: 14px;
grid-template-columns: 62px minmax(0, 1fr) auto;
}
@@ -405,11 +374,11 @@ const { loading: schedulerLoading } = useDataRefresh(
display: inline-flex;
align-items: center;
justify-content: center;
- padding: 6px 14px;
+ padding: 5px 10px;
border-radius: 999px;
background: rgba(var(--v-theme-on-surface), 0.06);
color: rgba(var(--v-theme-on-surface), 0.62);
- font-size: 14px;
+ font-size: 12px;
font-weight: 600;
line-height: 1;
white-space: nowrap;
@@ -475,19 +444,10 @@ const { loading: schedulerLoading } = useDataRefresh(
gap: 10px;
}
-.mobile-scheduler-view--transparent {
- --scheduler-mobile-card-bg: rgba(var(--v-theme-surface), var(--transparent-opacity-light, 0.2));
- --scheduler-mobile-card-shadow: none;
- --scheduler-mobile-view-bg: transparent;
-}
-
-.mobile-scheduler-view--transparent .mobile-scheduler-card {
+html[data-theme='transparent'] .mobile-scheduler-card,
+.v-theme--transparent .mobile-scheduler-card {
+ background: rgba(var(--v-theme-surface), var(--transparent-opacity-light, 0.2));
backdrop-filter: blur(var(--transparent-blur, 10px));
- box-shadow: none;
-}
-
-.mobile-scheduler-view--dark {
- --scheduler-mobile-card-bg: rgba(var(--v-theme-surface), 0.82);
}
@media (max-width: 480px) {
@@ -519,8 +479,8 @@ const { loading: schedulerLoading } = useDataRefresh(
}
.mobile-scheduler-status {
- padding: 6px 11px;
- font-size: 13px;
+ padding: 5px 9px;
+ font-size: 12px;
}
.mobile-scheduler-run-btn {
{{ t('setting.scheduler.noService') }}