diff --git a/src/modules/scheduling/SchedulingModule.tsx b/src/modules/scheduling/SchedulingModule.tsx index 89c81e9..d2e506d 100644 --- a/src/modules/scheduling/SchedulingModule.tsx +++ b/src/modules/scheduling/SchedulingModule.tsx @@ -83,6 +83,66 @@ function FilterSelect({ label, options, value, onChange, placeholder }: { ); } +/** Skeleton pulse block */ +function Sk({ className }: { className?: string }) { + return
; +} + +function SkeletonPage() { + return ( +
+
+ {/* Cards skeleton */} +
+ {[0, 1, 2].map(i => ( +
+ + + +
+ ))} +
+ + {/* List card skeleton */} +
+ {/* Header */} +
+
+ +
+
+
+ {[0, 1, 2, 3].map(i => )} +
+
+ + {/* Rows */} +
+ {Array.from({ length: 8 }).map((_, i) => ( +
+ +
+
+ + + +
+
+ + + +
+
+ +
+ ))} +
+
+
+
+ ); +} + export default function SchedulingModule() { const [data, setData] = useState(null); const [loading, setLoading] = useState(false); @@ -132,6 +192,9 @@ export default function SchedulingModule() { const summary = data?.summary; const activeFilterCount = [filters.plateSearch, filters.region, filters.vehicleType, filters.customer, filters.department, filters.manager].filter(Boolean).length; + // Initial load — full page skeleton + if (loading && !data) return ; + return (
@@ -305,9 +368,27 @@ export default function SchedulingModule() {
共 {filteredSuggestions.length} 条结果
)} - {loading && !data ? ( -
-
+ {loading ? ( + /* List skeleton while refreshing */ +
+ {Array.from({ length: 6 }).map((_, i) => ( +
+ +
+
+ + + +
+
+ + + +
+
+ +
+ ))}
) : (