mirror of
https://github.com/jxxghp/MoviePilot-Frontend.git
synced 2026-09-07 00:36:41 +08:00
refactor: remove unnecessary dashboard reveal state and simplify reveal logic
This commit is contained in:
+3
-28
@@ -66,9 +66,6 @@ const dashboardGrid = shallowRef<GridStack | null>(null)
|
|||||||
// 仪表板配置是否已完成首次加载,包含插件仪表板配置。
|
// 仪表板配置是否已完成首次加载,包含插件仪表板配置。
|
||||||
const isDashboardConfigLoaded = ref(false)
|
const isDashboardConfigLoaded = ref(false)
|
||||||
|
|
||||||
// 仪表板是否已完成首次整体渐现。
|
|
||||||
const isDashboardRevealed = ref(false)
|
|
||||||
|
|
||||||
// 已完成组件模块加载的仪表板项目 ID。
|
// 已完成组件模块加载的仪表板项目 ID。
|
||||||
const loadedDashboardGridItemIds = ref<Set<string>>(new Set())
|
const loadedDashboardGridItemIds = ref<Set<string>>(new Set())
|
||||||
|
|
||||||
@@ -267,7 +264,6 @@ function isDashboardGridReadyForReveal() {
|
|||||||
// 在配置、组件和 GridStack 都就绪后安排仪表板整体渐现。
|
// 在配置、组件和 GridStack 都就绪后安排仪表板整体渐现。
|
||||||
function scheduleDashboardReveal() {
|
function scheduleDashboardReveal() {
|
||||||
if (
|
if (
|
||||||
isDashboardRevealed.value ||
|
|
||||||
isDashboardRevealPending ||
|
isDashboardRevealPending ||
|
||||||
dashboardRevealFrame !== null ||
|
dashboardRevealFrame !== null ||
|
||||||
!isDashboardConfigLoaded.value ||
|
!isDashboardConfigLoaded.value ||
|
||||||
@@ -280,25 +276,18 @@ function scheduleDashboardReveal() {
|
|||||||
isDashboardRevealPending = true
|
isDashboardRevealPending = true
|
||||||
void nextTick(() => {
|
void nextTick(() => {
|
||||||
isDashboardRevealPending = false
|
isDashboardRevealPending = false
|
||||||
if (
|
if (!isDashboardConfigLoaded.value || !isDashboardGridReadyForReveal() || !areDashboardGridItemsLoaded()) {
|
||||||
isDashboardRevealed.value ||
|
|
||||||
!isDashboardConfigLoaded.value ||
|
|
||||||
!isDashboardGridReadyForReveal() ||
|
|
||||||
!areDashboardGridItemsLoaded()
|
|
||||||
) {
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
resizeAutoDashboardItemsToContent()
|
resizeAutoDashboardItemsToContent()
|
||||||
|
|
||||||
if (typeof window === 'undefined') {
|
if (typeof window === 'undefined') {
|
||||||
isDashboardRevealed.value = true
|
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
dashboardRevealFrame = window.requestAnimationFrame(() => {
|
dashboardRevealFrame = window.requestAnimationFrame(() => {
|
||||||
dashboardRevealFrame = null
|
dashboardRevealFrame = null
|
||||||
isDashboardRevealed.value = true
|
|
||||||
notifyDashboardContentResize()
|
notifyDashboardContentResize()
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
@@ -1010,14 +999,8 @@ onBeforeUnmount(() => {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<LoadingBanner v-if="!isDashboardRevealed" class="mt-12" />
|
|
||||||
|
|
||||||
<!-- 仪表板 -->
|
<!-- 仪表板 -->
|
||||||
<div
|
<div ref="dashboardGridRef" class="grid-stack dashboard-grid" :class="{ 'is-editing': isLayoutEditing }">
|
||||||
ref="dashboardGridRef"
|
|
||||||
class="grid-stack dashboard-grid"
|
|
||||||
:class="{ 'is-editing': isLayoutEditing, 'is-ready': isDashboardRevealed }"
|
|
||||||
>
|
|
||||||
<div
|
<div
|
||||||
v-for="gridItem in dashboardGridItems"
|
v-for="gridItem in dashboardGridItems"
|
||||||
:key="gridItem.id"
|
:key="gridItem.id"
|
||||||
@@ -1084,21 +1067,13 @@ onBeforeUnmount(() => {
|
|||||||
/* stylelint-disable selector-pseudo-class-no-unknown */
|
/* stylelint-disable selector-pseudo-class-no-unknown */
|
||||||
|
|
||||||
.dashboard-grid {
|
.dashboard-grid {
|
||||||
opacity: 0;
|
pointer-events: auto;
|
||||||
pointer-events: none;
|
|
||||||
transform: translateY(8px);
|
|
||||||
transition:
|
transition:
|
||||||
opacity 0.45s cubic-bezier(0.25, 1, 0.5, 1),
|
opacity 0.45s cubic-bezier(0.25, 1, 0.5, 1),
|
||||||
transform 0.45s cubic-bezier(0.25, 1, 0.5, 1);
|
transform 0.45s cubic-bezier(0.25, 1, 0.5, 1);
|
||||||
will-change: opacity, transform;
|
will-change: opacity, transform;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dashboard-grid.is-ready {
|
|
||||||
opacity: 1;
|
|
||||||
pointer-events: auto;
|
|
||||||
transform: translateY(0);
|
|
||||||
}
|
|
||||||
|
|
||||||
.dashboard-grid-item.is-manual-height :deep(.v-card) {
|
.dashboard-grid-item.is-manual-height :deep(.v-card) {
|
||||||
block-size: 100%;
|
block-size: 100%;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user