2026-03-17 13:17:02 +08:00

66 lines
2.5 KiB
TypeScript

import { Skeleton } from "@/components/ui/skeleton"
import { DashboardShell } from "@/components/dashboard-shell"
import { DashboardHeader } from "@/components/dashboard-header"
import { Button } from "@/components/ui/button"
import { Card, CardContent, CardHeader } from "@/components/ui/card"
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs"
export default function HomeDecorDetailLoading() {
return (
<DashboardShell>
<div className="flex items-center mb-6">
<Button variant="ghost" size="sm" className="mr-4" disabled>
<Skeleton className="h-4 w-4 mr-2" />
<Skeleton className="h-4 w-16" />
</Button>
<DashboardHeader heading={<Skeleton className="h-8 w-48" />} text={<Skeleton className="h-5 w-32" />}>
<div className="flex space-x-2">
<Skeleton className="h-10 w-32" />
</div>
</DashboardHeader>
</div>
<Tabs defaultValue="details" className="space-y-4">
<TabsList>
<TabsTrigger value="details"></TabsTrigger>
<TabsTrigger value="batches"></TabsTrigger>
<TabsTrigger value="analytics"></TabsTrigger>
</TabsList>
<TabsContent value="details" className="space-y-4">
<div className="grid gap-6 md:grid-cols-3">
<Card className="md:col-span-1">
<CardHeader>
<Skeleton className="h-6 w-32" />
</CardHeader>
<CardContent className="flex justify-center">
<Skeleton className="w-full aspect-square max-w-[300px] rounded-lg" />
</CardContent>
</Card>
<Card className="md:col-span-2">
<CardHeader>
<Skeleton className="h-6 w-32" />
</CardHeader>
<CardContent>
<div className="grid grid-cols-2 gap-4">
{Array.from({ length: 6 }).map((_, i) => (
<div key={i} className="space-y-2">
<Skeleton className="h-4 w-20" />
<Skeleton className="h-6 w-32" />
</div>
))}
<div className="col-span-2 space-y-2">
<Skeleton className="h-4 w-20" />
<Skeleton className="h-24 w-full" />
</div>
</div>
</CardContent>
</Card>
</div>
</TabsContent>
</Tabs>
</DashboardShell>
)
}