- 新增本地依赖 @stash/ui(file:../../stash-ui),引入其 style.css 与设计令牌 - 页面骨架改用 Layout(contained + header/sider),搜索框改为吸顶 - 卡片/菜单/按钮/标签/头像/分页/空态/提示全部换成组件库组件 - 删除本地 iconfont 与 1400 行手写组件样式,App.css 只保留页面级样式 - 数据层、路由、过滤逻辑未改动;33 个 Rust 测试通过
23 lines
716 B
TypeScript
23 lines
716 B
TypeScript
import { Grid } from '@stash/ui'
|
|
import type { AppItem } from '../../data/types'
|
|
import { AppCard } from './AppCard'
|
|
|
|
/** 应用网格:默认 4 列,平板 2 列,手机 2 列(组件库 Grid 负责断点) */
|
|
type AppGridProps = {
|
|
items: AppItem[]
|
|
/** 明细页使用更宽松的间距 */
|
|
variant?: 'home' | 'detail'
|
|
/** 点击卡片打开条目详情 */
|
|
onOpen?: (itemId: string) => void
|
|
}
|
|
|
|
export function AppGrid({ items, variant = 'home', onOpen }: AppGridProps) {
|
|
return (
|
|
<Grid columns={4} tabletColumns={2} mobileColumns={2} gap={variant === 'detail' ? 'md' : 'sm'}>
|
|
{items.map((item) => (
|
|
<AppCard key={item.id} item={item} onOpen={onOpen} />
|
|
))}
|
|
</Grid>
|
|
)
|
|
}
|