# 用户个人主页功能更新

## 改动概述

为用户社区添加了完整的个人主页系统，包括用户信息展示、文章管理、个人简介编辑等功能。

## 新增文件

### 1. `profile.php` - 用户个人主页
**功能：**
- 显示用户头像、用户名、角色徽章
- 显示用户个人简介（bio）
- 显示注册时间和邮箱（仅本人可见）
- 统计数据卡片：文章数、回复数、总浏览、总点赞
- 最近发表的文章列表（最新 10 篇）
- 最近的回复列表（最新 5 条）
- 支持查看其他用户的主页（通过 `?id=用户ID` 参数）
- 本人访问时显示"编辑资料"按钮

**访问方式：**
- `profile.php` - 查看当前登录用户的个人主页
- `profile.php?id=123` - 查看指定用户的个人主页

### 2. `edit-profile.php` - 编辑个人资料
**功能：**
- 编辑个人简介（bio）
- 实时预览功能
- 显示用户名和邮箱（只读）
- 保存成功后显示提示信息

**访问方式：**
- 从个人主页点击"编辑资料"按钮进入

### 3. `my-posts.php` - 我的文章（已更新）
**更新内容：**
- 支持查看其他用户的文章（通过 `?id=用户ID` 参数）
- 只有文章作者才能看到"编辑"和"删除"按钮
- 页面标题动态显示用户名

### 4. `migrate-add-bio.php` - 数据库迁移脚本
**用途：**
- 为现有的 `users` 表添加 `bio` 字段
- 检查字段是否已存在，避免重复添加

**运行方式：**
```bash
php website/community/migrate-add-bio.php
```

## 修改的文件

### 1. `includes/dock.php`
**改动：**
- 用户头像链接从 `#` 改为 `profile.php`，点击跳转到个人主页
- 用户面板新增"个人主页"菜单项
- 保留"我的文章"菜单项，并显示文章数量徽章

### 2. `api/auth.php`
**改动：**
- 新增 `my-post-count` API 端点
- 用于获取当前登录用户的文章数量
- 在用户面板中实时显示文章数徽章

### 3. `css/dock.css`
**改动：**
- 新增 `.dock-user-avatar` 样式
- 用户头像图标显示为青色高亮
- 鼠标悬停时有缩放和背景效果

### 4. `assets/css/dock-popover.css`
**改动：**
- 新增 `.popover-menu` 菜单区域样式
- 新增 `.menu-item` 菜单项样式（带图标、文字、徽章）
- 新增 `.menu-badge` 徽章样式

### 5. `assets/js/dock-popover.js`
**改动：**
- 新增 `fetchMyPostCount()` 函数
- 页面加载时自动获取并显示用户文章数量
- 保留原有的退登和注销功能

### 6. `schema.sql`
**改动：**
- `users` 表新增 `bio TEXT` 字段
- 用于存储用户的个人简介

## 使用方法

### 1. 运行数据库迁移
首次部署需要运行迁移脚本添加 bio 字段：
```bash
cd website/community
php migrate-add-bio.php
```

### 2. 访问个人主页
- 点击左侧 Dock 栏的用户头像图标
- 或访问 `community/profile.php`

### 3. 编辑个人简介
- 在个人主页点击"编辑资料"按钮
- 或访问 `community/edit-profile.php`

### 4. 查看我的文章
- 在用户面板中点击"我的文章"
- 或访问 `community/my-posts.php`

### 5. 查看其他用户的主页
- 访问 `community/profile.php?id=用户ID`

## 技术细节

### 数据库查询优化
- 使用子查询统计回复数，避免 JOIN 导致的性能问题
- 使用 SUM 聚合函数统计总浏览和总点赞
- 所有查询都使用参数化查询防止 SQL 注入

### 安全性
- 所有用户输入都经过 `htmlspecialchars()` 转义
- 只有本人才能编辑和删除自己的文章
- Session 验证确保用户只能访问自己的数据

### 响应式设计
- 适配桌面端和移动端
- 小屏幕时自动调整布局和字体大小
- Dock 栏在移动端自动移到底部

## 后续可扩展功能

1. **头像上传** - 支持用户上传自定义头像
2. **关注系统** - 用户可以互相关注
3. **成就徽章** - 根据用户活跃度颁发徽章
4. **社交链接** - 添加 GitHub、Twitter 等社交链接
5. **活动日志** - 记录用户的登录、发帖等活动