# 部署检查清单

## 🔧 修复完成的问题

### ✅ 1. 聊天页面底部导航栏
- **问题**: 聊天页面缺少底部导航栏
- **修复**: 在 `src/views/Chat/index.vue` 中添加了 `<BottomNavigation />` 组件
- **验证**: 访问 `/emotion-museum/chat` 应该能看到底部导航栏

### ✅ 2. 底部导航栏遮挡输入框
- **问题**: 底部导航栏遮挡聊天输入框
- **修复**: 调整了CSS布局，输入框位于导航栏上方70px
- **验证**: 聊天页面的输入框应该完全可见且可操作

### ✅ 3. 静态资源404错误
- **问题**: 静态资源路径错误，返回404
- **修复**: 
  - 在 `vite.config.ts` 中添加 `base: '/emotion-museum/'`
  - 在 `src/router/index.ts` 中设置 `createWebHistory('/emotion-museum/')`
- **验证**: 所有CSS和JS文件应该正确加载

### ✅ 4. 登录成功后跳转错误
- **问题**: 登录成功后跳转到根目录 `/` 而不是 `/emotion-museum/`
- **修复**: 将 `window.location.href = redirect` 改为 `await router.push(redirect)`
- **验证**: 登录成功后应该正确跳转到应用内页面

## 📋 部署前检查

### 1. 构建检查
```bash
# 确保构建成功
npm run build

# 检查dist目录
ls -la dist/
```

### 2. 文件检查
- [ ] `dist/index.html` 中的资源路径包含 `/emotion-museum/assets/`
- [ ] `dist/assets/` 目录存在且包含所有资源文件
- [ ] 测试文件 `test-*.html` 已生成

### 3. 配置检查
- [ ] `vite.config.ts` 包含 `base: '/emotion-museum/'`
- [ ] `src/router/index.ts` 包含 `createWebHistory('/emotion-museum/')`
- [ ] NGINX配置正确设置 `/emotion-museum/` location

## 🚀 部署步骤

### 方法一：使用部署脚本
```bash
# Windows
.\deploy.ps1

# Linux/Mac
./deploy.sh
```

### 方法二：手动部署
```bash
# 1. 上传index.html
scp dist/index.html root@101.200.208.45:/data/www/emotion-museum/

# 2. 上传assets目录
scp -r dist/assets root@101.200.208.45:/data/www/emotion-museum/

# 3. 上传测试文件
scp dist/test-*.html root@101.200.208.45:/data/www/emotion-museum/
```

## ✅ 部署后验证

### 1. 基础功能验证
- [ ] 访问 http://101.200.208.45/emotion-museum/ 正常加载
- [ ] 静态资源（CSS/JS）正常加载，无404错误
- [ ] 页面样式正常显示

### 2. 路由验证
- [ ] 访问 http://101.200.208.45/emotion-museum/chat 正常
- [ ] 访问 http://101.200.208.45/emotion-museum/diary 正常
- [ ] 刷新页面不会出现404错误

### 3. 登录流程验证
- [ ] 访问需要登录的页面会跳转到登录页
- [ ] 登录成功后正确跳转到目标页面（不是根目录）
- [ ] 登录状态在页面刷新后保持

### 4. 聊天页面验证
- [ ] 聊天页面显示底部导航栏
- [ ] 输入框不被导航栏遮挡
- [ ] 可以正常发送消息
- [ ] 底部导航栏可以正常点击跳转

## 🐛 故障排除

### 如果仍然出现404错误：
1. 检查服务器文件是否正确上传
2. 检查文件权限：`chmod -R 755 /data/www/emotion-museum/`
3. 重新加载NGINX配置：`nginx -s reload`
4. 清理浏览器缓存

### 如果登录后仍跳转到根目录：
1. 确认前端代码已更新并重新构建
2. 检查浏览器开发者工具的Network标签
3. 确认新的JS文件已正确加载

### 如果底部导航栏有问题：
1. 检查CSS文件是否正确加载
2. 确认BottomNavigation组件已正确引入
3. 检查z-index层级是否正确

## 📞 联系信息

如果遇到问题，请提供：
1. 具体的错误信息
2. 浏览器开发者工具的截图
3. 访问的具体URL
4. 操作步骤
