From 890ff1d89f74ca81f16511c0e14a9524492a553a Mon Sep 17 00:00:00 2001 From: VirtualTests1 Date: Sat, 18 Apr 2026 13:19:22 +0800 Subject: [PATCH 1/4] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E6=AC=A2?= =?UTF-8?q?=E8=BF=8E=E9=A1=B5=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 2 + src/pages/index.tsx | 228 ++++++++++++++++++++++++++++++++++++++++++-- 2 files changed, 223 insertions(+), 7 deletions(-) diff --git a/.gitignore b/.gitignore index e988efe..ae781fe 100644 --- a/.gitignore +++ b/.gitignore @@ -27,3 +27,5 @@ tsconfig.tsbuildinfo # AI .clinerules + +.pnpm-store \ No newline at end of file diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 3f6b5c4..b2ad8d4 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -4,17 +4,231 @@ * } */ -import { Navigate } from 'react-router-dom'; +import { Button, Card, Col, Divider, Row, Space, Tag, Typography } from 'antd'; +import AppLogo from '@/components/AppLogo'; import { globalConfig } from '@/config'; +import { getIsLogin } from '@/stores/modules'; + +const { Title, Text, Paragraph } = Typography; + +const techStacks = [ + { name: 'React', version: '19', color: '#61dafb' }, + { name: 'TypeScript', version: '5.7', color: '#3178c6' }, + { name: 'Vite', version: '7.0', color: '#646cff' }, + { name: 'Ant Design', version: '5.26', color: '#1890ff' }, + { name: 'React Router', version: '7.7', color: '#ca4245' }, + { name: 'Redux Toolkit', version: '2.8', color: '#764abc' }, + { name: 'UnoCSS', version: '66.3', color: '#333333' }, + { name: 'ECharts', version: '5.6', color: '#e43961' } +]; + +const features = [ + { + title: '现代化技术栈', + description: 'React 19 + TypeScript + Vite + Ant Design，采用最新的前端技术和最佳实践' + }, + { + title: '优雅的 UI 设计', + description: '基于 Ant Design 5.x，支持暗色模式，提供清新优雅的视觉体验' + }, + { + title: '约定式路由', + description: '基于文件系统的自动路由生成，简单直观，易于维护' + }, + { + title: '响应式布局', + description: '完美适配桌面端和移动端，提供一致的用户体验' + }, + { + title: '国际化支持', + description: '内置中英文语言切换，轻松扩展多语言支持' + }, + { + title: '权限管理', + description: '完整的路由权限和菜单权限控制，灵活满足各种业务场景' + }, + { + title: '数据可视化', + description: '集成 ECharts 图表库，提供丰富的数据展示能力' + }, + { + title: '高性能', + description: '基于 Vite 的快速构建和热更新，提升开发体验' + }, + { + title: '主题定制', + description: '支持主题色和布局模式自定义，打造专属的管理系统' + } +]; + +const WelcomePage = () => { + const isLogin = useAppSelector(getIsLogin); + const navigate = useNavigate(); + + const handleEnter = () => { + if (isLogin) { + navigate(globalConfig.homePath); + } else { + navigate('/login'); + } + }; + + const handleViewDocs = () => { + window.open('https://admin-docs.chiko.store', '_blank'); + }; -const Index = () => { return ( - +
+
+
+
+ + + ChikoAdmin + +
+ + 一个基于 React 19、Vite、TypeScript、Ant Design 和 UnoCSS 的清新优雅的中后台模版 + +
+ +
+ + +
+ + + + 项目简介 + + + ChikoAdmin 是一个现代化的中后台管理系统模板，采用最新的技术栈和最佳实践构建。项目使用 Monorepo 架构， + 提供了完整的开发工具链和丰富的功能组件。采用 MSW (Mock Service Worker) 提供强大的 Mock 数据方案， + 让前端开发不再依赖后端接口。 + + + + + + 技术栈 + + + {techStacks.map(tech => ( + + {tech.name} + {tech.version} + + ))} + + + + + + 主要特性 + + + {features.map((feature, index) => ( + + + + {feature.title} + + + {feature.description} + + + + ))} + + + + + + 环境要求 + + + +
+
+ 📦 +
+
+ + Node.js + + >= 18.0.0 +
+
+ + +
+
+ 🚀 +
+
+ + pnpm + + >= 8.0.0 +
+
+ + + + + + +
+ + + 如果 ChikoAdmin 对您有帮助，请给我一个 ⭐️ 支持！ + + + + + + + + + 基于 MIT 许可证开源 + +
+
+
); }; -export default Index; +export default WelcomePage; From a6eaeffb5ad1d51c444cdd2f5332dc4814ca576b Mon Sep 17 00:00:00 2001 From: VirtualTests1 Date: Sat, 18 Apr 2026 13:47:57 +0800 Subject: [PATCH 2/4] =?UTF-8?q?refactor(=E9=A6=96=E9=A1=B5=E7=BB=84?= =?UTF-8?q?=E4=BB=B6):=20=E8=BF=81=E7=A7=BBAntd=E7=BB=84=E4=BB=B6=E5=88=B0?= =?UTF-8?q?=E6=8C=89=E9=9C=80=E5=BC=95=E5=85=A5=E6=96=B9=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 将首页中直接导入的Antd组件改为按需引入方式，使用A前缀命名 移除未使用的Typography组件解构，优化组件导入结构 --- src/pages/index.tsx | 173 ++++++++++++++++++++++---------------------- 1 file changed, 86 insertions(+), 87 deletions(-) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index b2ad8d4..99e9c96 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -4,14 +4,10 @@ * } */ -import { Button, Card, Col, Divider, Row, Space, Tag, Typography } from 'antd'; - import AppLogo from '@/components/AppLogo'; import { globalConfig } from '@/config'; import { getIsLogin } from '@/stores/modules'; -const { Title, Text, Paragraph } = Typography; - const techStacks = [ { name: 'React', version: '19', color: '#61dafb' }, { name: 'TypeScript', version: '5.7', color: '#3178c6' }, @@ -79,58 +75,61 @@ const WelcomePage = () => { }; return ( -
-
-
-
- - + <div className="min-h-screen from-blue-50 via-white to-purple-50 bg-gradient-to-br dark:from-gray-900 dark:via-gray-800 dark:to-gray-900"> + <div className="mx-auto max-w-7xl px-4 py-8 lg:px-8 sm:px-6"> + <header className="mb-12 text-center"> + <div className="mb-6 flex items-center justify-center gap-4"> + <AppLogo className="h-16 w-16" /> + <ATypography.Title + level={1} + className="from-blue-600 to-purple-600 bg-gradient-to-r bg-clip-text text-transparent font-bold !mb-0 !text-4xl" + > ChikoAdmin - +
- + 一个基于 React 19、Vite、TypeScript、Ant Design 和 UnoCSS 的清新优雅的中后台模版 - +
-
- - +
- - + <ACard className="mb-8 shadow-lg" bordered={false}> + <ATypography.Title level={3} className="!mb-4"> 项目简介 - - + + ChikoAdmin 是一个现代化的中后台管理系统模板，采用最新的技术栈和最佳实践构建。项目使用 Monorepo 架构， 提供了完整的开发工具链和丰富的功能组件。采用 MSW (Mock Service Worker) 提供强大的 Mock 数据方案， 让前端开发不再依赖后端接口。 - - + + - - + <ACard className="mb-8 shadow-lg" bordered={false}> + <ATypography.Title level={3} className="!mb-6"> 技术栈 - - + + {techStacks.map(tech => ( - { > {tech.name} {tech.version} - + ))} - - + + - - + <ACard className="mb-8 shadow-lg" bordered={false}> + <ATypography.Title level={3} className="!mb-6"> 主要特性 - - + + {features.map((feature, index) => ( - - + - + <ATypography.Title level={5} className="!mb-2"> {feature.title} - - + + {feature.description} - - - + + + ))} - - + + - - + <ACard className="mb-8 shadow-lg" bordered={false}> + <ATypography.Title level={3} className="!mb-6"> 环境要求 - - - -
-
+ + + +
+
📦
- + Node.js - - >= 18.0.0 + + {'>= 18.0.0'}
- - -
-
+ + +
+
🚀
- + pnpm - - >= 8.0.0 + + {'>= 8.0.0'}
- - - + + + - +
- - - 如果 ChikoAdmin 对您有帮助，请给我一个 ⭐️ 支持！ - - - - - - - - - 基于 MIT 许可证开源 - + + + + 基于 MIT 许可证开源 +
From 6616e979b08041fd55ee0c26653e4b763f7f7d9d Mon Sep 17 00:00:00 2001 From: VirtualTests1 Date: Sat, 18 Apr 2026 16:48:59 +0800 Subject: [PATCH 3/4] =?UTF-8?q?style(=E9=A1=B5=E9=9D=A2=E5=B8=83=E5=B1=80)?= =?UTF-8?q?:=20=E8=B0=83=E6=95=B4=E6=AC=A2=E8=BF=8E=E9=A1=B5=E9=AB=98?= =?UTF-8?q?=E5=BA=A6=E5=92=8C=E6=BB=9A=E5=8A=A8=E8=A1=8C=E4=B8=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 修改容器高度为全屏并启用垂直滚动，优化移动端显示体验 --- src/pages/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 99e9c96..8e05559 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -75,8 +75,8 @@ const WelcomePage = () => { }; return ( -
-
+
+
From 7688f167695180906a4ad9ebcd59c065d555d5c8 Mon Sep 17 00:00:00 2001 From: VirtualTests1 Date: Sat, 18 Apr 2026 18:19:35 +0800 Subject: [PATCH 4/4] =?UTF-8?q?feat(=E7=94=A8=E6=88=B7=E7=95=8C=E9=9D=A2):?= =?UTF-8?q?=20=E5=9C=A8=E7=94=A8=E6=88=B7=E5=A4=B4=E5=83=8F=E8=8F=9C?= =?UTF-8?q?=E5=8D=95=E5=92=8C=E7=99=BB=E5=BD=95=E9=A1=B5=E6=B7=BB=E5=8A=A0?= =?UTF-8?q?=E8=BF=94=E5=9B=9E=E9=A6=96=E9=A1=B5=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 为提升用户体验，在用户头像下拉菜单中新增返回首页选项，并在登录页头部添加返回首页按钮。修改包括： - 在UserAvatar组件中添加菜单项处理返回首页逻辑 - 在登录页Header组件中替换Logo为返回按钮并调整布局 --- .../modules/header/components/UserAvatar.tsx | 14 +++++++++++ src/pages/(blank)/login/modules/Header.tsx | 25 +++++++++++++++---- 2 files changed, 34 insertions(+), 5 deletions(-) diff --git a/src/layouts/modules/header/components/UserAvatar.tsx b/src/layouts/modules/header/components/UserAvatar.tsx index 2a203e2..baac0b1 100644 --- a/src/layouts/modules/header/components/UserAvatar.tsx +++ b/src/layouts/modules/header/components/UserAvatar.tsx @@ -28,6 +28,8 @@ const UserAvatar = memo(() => { function onClick({ key }: { key: string }) { if (key === '1') { logout(); + } else if (key === '2') { + navigate('/'); } else { navigate('/user-center'); } @@ -50,6 +52,18 @@ const UserAvatar = memo(() => {
) }, + { + key: '2', + label: ( +
+ + 返回首页 +
+ ) + }, { type: 'divider' }, diff --git a/src/pages/(blank)/login/modules/Header.tsx b/src/pages/(blank)/login/modules/Header.tsx index d22bb30..631e661 100644 --- a/src/pages/(blank)/login/modules/Header.tsx +++ b/src/pages/(blank)/login/modules/Header.tsx @@ -5,15 +5,30 @@ import { ThemeSchemaSwitch } from '@/features/theme'; const Header = memo(() => { const { t } = useTranslation(); + const navigate = useNavigate(); + + const handleBackToWelcome = () => { + navigate('/'); + }; return (
- + + ← 返回首页 + + +
+ - + +