feat: 优化导航和首页用户体验

- 在App.tsx中添加'我的Profile'导航菜单
- 配置Profile管理页面路由
- 在Home.tsx中添加社区交流区域
- 将关于页面的加群信息复制到首页
- 提高社区信息的可见性和用户参与度
- 保持一致的设计风格和响应式布局

Author: CC11001100

src/App.tsx

@@ -4,6 +4,7 @@ import { ThemeProvider, createTheme, AppBar, Toolbar, Container, styled } from '
 import Home from './pages/Home';
 import PromptTemplate from './pages/PromptTemplate';
 import About from './pages/About';
+import ProfilesPage from './pages/ProfilesPage';
 
 // 创建自定义主题
 const theme = createTheme({
@@ -86,6 +87,9 @@ function NavLinks() {
             <StyledLink to="/prompt" className={isActive('/prompt') ? 'active' : ''}>
                 提示词构建
             </StyledLink>
+            <StyledLink to="/profiles" className={isActive('/profiles') ? 'active' : ''}>
+                我的Profile
+            </StyledLink>
             <StyledLink to="/about" className={isActive('/about') ? 'active' : ''}>
                 关于我们
             </StyledLink>
@@ -117,6 +121,7 @@ function MainApp() {
                 <Routes>
                     <Route path="/" element={<Home />} />
                     <Route path="/prompt" element={<PromptTemplate />} />
+                    <Route path="/profiles" element={<ProfilesPage />} />
                     <Route path="/about" element={<About />} />
                 </Routes>
 

src/pages/Home.tsx

@@ -3,8 +3,12 @@ import { Container, Grid, Card, CardContent, Typography, Button, Box, useTheme }
 import { Link } from 'react-router-dom';
 import RocketLaunchIcon from '@mui/icons-material/RocketLaunch';
 import TrackChangesIcon from '@mui/icons-material/TrackChanges';
+import MessageIcon from '@mui/icons-material/Message';
+import QQIcon from '@mui/icons-material/QuestionAnswer';
 import { styled } from '@mui/system';
 import './Home.css';
+import wechatQR from '../assets/cc11001100-weixin.png';
+import qqQR from '../assets/qq-group-qrcode.jpg';
 
 // 修复后的FeatureCard样式组件
 const FeatureCard = styled(Card)(({ theme }) => ({
@@ -193,6 +197,113 @@ export default function Home() {
                 </Grid>
             </Grid>
 
+            {/* 社区交流区域 */}
+            <Box sx={{
+                mb: 8,
+                p: 4,
+                backgroundColor: 'background.paper',
+                borderRadius: 4,
+                boxShadow: 1
+            }}>
+                <Typography variant="h4" gutterBottom sx={{
+                    fontWeight: 700,
+                    color: 'primary.main',
+                    textAlign: 'center',
+                    mb: 4
+                }}>
+                    🤖 加入AI社区
+                </Typography>
+                <Typography variant="body1" sx={{
+                    textAlign: 'center',
+                    color: 'text.secondary',
+                    mb: 4,
+                    fontSize: '1.1rem'
+                }}>
+                    与更多AI开发者交流经验，获取最新技术动态和使用技巧
+                </Typography>
+
+                <Grid container spacing={4} justifyContent="center">
+                    <Grid item xs={12} sm={6} md={4}>
+                        <Box sx={{
+                            p: 3,
+                            border: '1px solid',
+                            borderColor: 'divider',
+                            borderRadius: 2,
+                            textAlign: 'center',
+                            transition: 'all 0.3s',
+                            '&:hover': {
+                                transform: 'translateY(-4px)',
+                                boxShadow: 3
+                            }
+                        }}>
+                            <MessageIcon sx={{fontSize: 40, color: '#09b83e', mb: 2}}/>
+                            <Typography variant="h6" gutterBottom>
+                                微信交流群
+                            </Typography>
+                            <img
+                                src={wechatQR}
+                                alt="微信二维码"
+                                style={{
+                                    width: 150,
+                                    height: 210,
+                                    margin: '0 auto 16px',
+                                    display: 'block',
+                                    borderRadius: 8
+                                }}
+                            />
+                            <Typography variant="body2" color="text.secondary">
+                                扫码添加好友，备注"大模型"申请入群
+                            </Typography>
+                        </Box>
+                    </Grid>
+
+                    <Grid item xs={12} sm={6} md={4}>
+                        <Box sx={{
+                            p: 3,
+                            border: '1px solid',
+                            borderColor: 'divider',
+                            borderRadius: 2,
+                            textAlign: 'center',
+                            transition: 'all 0.3s',
+                            '&:hover': {
+                                transform: 'translateY(-4px)',
+                                boxShadow: 3
+                            }
+                        }}>
+                            <QQIcon sx={{fontSize: 40, color: '#12b7f5', mb: 2}}/>
+                            <Typography variant="h6" gutterBottom>
+                                QQ交流群
+                            </Typography>
+                            <img
+                                src={qqQR}
+                                alt="QQ群二维码"
+                                style={{
+                                    width: 150,
+                                    height: 200,
+                                    margin: '0 auto 16px',
+                                    display: 'block',
+                                    borderRadius: 8
+                                }}
+                            />
+                            <Button
+                                variant="contained"
+                                href="https://qm.qq.com/q/pYBa99j1e2"
+                                target="_blank"
+                                sx={{
+                                    mt: 1,
+                                    borderRadius: 20,
+                                    px: 4,
+                                    bgcolor: '#12b7f5',
+                                    '&:hover': {bgcolor: '#0f9cd3'}
+                                }}
+                            >
+                                一键加群
+                            </Button>
+                        </Box>
+                    </Grid>
+                </Grid>
+            </Box>
+
             {/* CTA区域 */}
             <Box sx={{
                 textAlign: 'center',