You've already forked DataMate
feat(home): 添加外部链接支持并优化网格布局
- 实现外部链接功能,支持在新标签页打开外部URL - 将网格布局改为弹性布局,提升响应式显示效果 - 为卡片组件添加固定宽度,优化不同屏幕尺寸下的显示 - 重构导航逻辑,区分内部路由和外部链接跳转方式
This commit is contained in:
@@ -130,12 +130,18 @@ export default function WelcomePage() {
|
||||
<h2 className="text-3xl font-bold text-center text-gray-900 mb-12">
|
||||
功能模块
|
||||
</h2>
|
||||
<div className="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
|
||||
<div className="flex flex-wrap justify-center gap-6">
|
||||
{menuItems.map((item) => (
|
||||
<Card
|
||||
key={item.id}
|
||||
onClick={() => navigate(item.children ? `/data/${item.children[0].id}`: `/data/${item.id}`)}
|
||||
className="cursor-pointer hover:shadow-lg transition-all duration-200 border-0 shadow-md relative overflow-hidden group"
|
||||
onClick={() => {
|
||||
if (item.externalLink) {
|
||||
window.open(item.externalLink, "_blank");
|
||||
return;
|
||||
}
|
||||
navigate(item.children ? `/data/${item.children[0].id}`: `/data/${item.id}`);
|
||||
}}
|
||||
className="cursor-pointer hover:shadow-lg transition-all duration-200 border-0 shadow-md relative overflow-hidden group w-full md:w-[calc(50%-12px)] lg:w-[280px]"
|
||||
>
|
||||
<div className="text-center relative">
|
||||
<div
|
||||
|
||||
Reference in New Issue
Block a user