36 lines
1.1 KiB
TypeScript
36 lines
1.1 KiB
TypeScript
import { MoreHorizontal, Search } from 'lucide-react';
|
|
import {
|
|
Badge,
|
|
Button,
|
|
Input,
|
|
PageShell,
|
|
} from '@/ui';
|
|
|
|
export function MediaLibraryPageTemplate() {
|
|
return (
|
|
<PageShell
|
|
title="素材管理"
|
|
description="媒体优先展示，操作在悬停或更多菜单中出现。"
|
|
actions={<Input aria-label="搜索素材" placeholder="搜索素材" leading={<Search />} />}
|
|
>
|
|
<section className="tg-golden-library">
|
|
{Array.from({ length: 8 }).map((_, index) => (
|
|
<article className="tg-golden-library__item" key={index}>
|
|
<div className="tg-golden-library__media">
|
|
<div className="tg-golden-library__hover">
|
|
<Button variant="secondary" size="icon" aria-label="更多操作">
|
|
<MoreHorizontal size={16} />
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
<footer className="tg-golden-library__meta">
|
|
<span>品牌主视觉 {index + 1}</span>
|
|
<Badge tone="neutral">图片</Badge>
|
|
</footer>
|
|
</article>
|
|
))}
|
|
</section>
|
|
</PageShell>
|
|
);
|
|
}
|