401 lines
8.7 KiB
Markdown
401 lines
8.7 KiB
Markdown
# 功能更新说明 v2.0
|
||
|
||
## 📅 更新日期：2025-10-16
|
||
|
||
---
|
||
|
||
## ✨ 新功能总览
|
||
|
||
### 1. ✅ 浏览器黑暗模式支持
|
||
- **自动跟随系统**：自动识别系统黑暗模式设置
|
||
- **全局适配**：所有页面和组件都支持黑暗模式
|
||
- **流畅过渡**：主题切换平滑过渡
|
||
|
||
**使用方法**：
|
||
- 在系统设置中启用黑暗模式，应用会自动切换
|
||
- macOS: 系统偏好设置 → 通用 → 外观 → 深色
|
||
- Windows: 设置 → 个性化 → 颜色 → 深色
|
||
|
||
---
|
||
|
||
### 2. ✅ 上传进度条和网络速度显示
|
||
- **实时进度**：显示上传百分比
|
||
- **速度显示**：实时显示上传速度（KB/s, MB/s）
|
||
- **文件大小**：显示上传文件大小
|
||
|
||
**界面改进**：
|
||
- 蓝色进度条动画
|
||
- 上传速度实时更新
|
||
- 上传中禁用取消和上传按钮
|
||
|
||
---
|
||
|
||
### 3. ✅ 支持7Z压缩格式
|
||
- **新增格式**：除了ZIP、RAR，现在还支持7Z格式
|
||
- **智能识别**：上传时自动验证文件格式
|
||
- **友好提示**：不支持的格式会给出清晰的错误提示
|
||
|
||
**支持的压缩格式**：
|
||
- ✅ .zip
|
||
- ✅ .rar
|
||
- ✅ .7z
|
||
|
||
---
|
||
|
||
### 4. ✅ 取消上传大小限制
|
||
- **之前限制**：100MB
|
||
- **现在限制**：10GB（基本无限制）
|
||
- **适用场景**：支持大型3D模型文件上传
|
||
|
||
**注意事项**：
|
||
- 上传大文件时建议使用内网模式
|
||
- 公网上传速度取决于您的网络带宽
|
||
|
||
---
|
||
|
||
### 5. ✅ 内外网模式识别和提示
|
||
- **自动识别**：系统根据访问地址自动识别当前访问模式
|
||
- **智能提示**：首页顶部显示当前模式和替代访问地址
|
||
- **模式说明**：
|
||
- 🏠 **内网模式**：`http://192.168.58.20:4320` (绿色标识)
|
||
- 局域网内访问
|
||
- 速度更快，延迟更低
|
||
- 适合上传大文件（可达3GB）
|
||
- 显示外网地址供参考
|
||
- 🌍 **公网模式**：`http://180.97.221.140:2320` (蓝色标识)
|
||
- 互联网访问
|
||
- 随时随地可访问
|
||
- 适合外出使用
|
||
- 提示内网地址供参考
|
||
|
||
**智能提示功能**：
|
||
- 公网访问时，提示内网地址更快
|
||
- 内网访问时，显示公网地址供外出使用
|
||
- 自动检测当前网络环境
|
||
|
||
---
|
||
|
||
### 6. ✅ 一级分类功能
|
||
这是本次最大的功能更新！
|
||
|
||
#### 6.1 数据库架构调整
|
||
- **新增**：Category（一级分类）模型
|
||
- **更新**：Material模型新增`categoryName`字段
|
||
- **优化**：添加索引提升查询性能
|
||
|
||
#### 6.2 上传界面改进
|
||
**新的上传流程**：
|
||
1. 选择预览图片
|
||
2. 输入商品型号
|
||
3. **选择/新建一级分类** ⭐
|
||
4. **选择/新建二级分类/场景** ⭐
|
||
5. 选择压缩包
|
||
6. 上传
|
||
|
||
**一级分类管理**：
|
||
- 下拉选择现有分类
|
||
- 快速新建分类（输入即保存）
|
||
- 自动记忆，下次直接选择
|
||
|
||
**二级分类管理**：
|
||
- 下拉选择现有场景
|
||
- 快速新建场景
|
||
- 支持快速切换
|
||
|
||
#### 6.3 首页筛选增强
|
||
**新的筛选方式**：
|
||
1. **搜索框**：搜索商品型号、一级分类、二级分类、作者
|
||
2. **一级分类**：按钮式快速筛选
|
||
3. **二级分类/场景**：按钮式快速筛选
|
||
4. **组合筛选**：可同时使用多个筛选条件
|
||
|
||
**筛选状态显示**：
|
||
- 当前筛选条件标签显示
|
||
- 单独移除某个筛选条件
|
||
- 一键清除所有筛选
|
||
|
||
#### 6.4 卡片信息展示
|
||
每个素材卡片显示：
|
||
- 预览图
|
||
- 商品型号
|
||
- **一级分类** ⭐
|
||
- **二级分类** ⭐
|
||
- 作者
|
||
- 创建时间
|
||
- 下载按钮
|
||
|
||
---
|
||
|
||
## 🗄️ 数据库更新
|
||
|
||
### 需要执行的迁移
|
||
|
||
连接到NAS并运行数据库迁移：
|
||
|
||
\`\`\`bash
|
||
# 1. SSH到NAS
|
||
ssh root@192.168.58.20
|
||
# 密码：jsjj8888
|
||
|
||
# 2. 进入项目目录
|
||
cd /mnt/tank/apps/youyidian-3d
|
||
|
||
# 3. 停止容器
|
||
docker compose down
|
||
|
||
# 4. 更新代码（如果通过Git或上传）
|
||
# 确保所有更新的文件都已上传
|
||
|
||
# 5. 重新构建并启动
|
||
docker compose up -d --build
|
||
|
||
# 6. 运行数据库迁移
|
||
docker compose exec app npx prisma db push
|
||
|
||
# 7. 初始化一级分类数据（可选）
|
||
docker compose exec -T app npx prisma db execute --schema=/app/prisma/schema.prisma --stdin <<< "
|
||
INSERT INTO categories (id, name, \"createdAt\") VALUES
|
||
(gen_random_uuid(), '家居', NOW()),
|
||
(gen_random_uuid(), '办公', NOW()),
|
||
(gen_random_uuid(), '商业', NOW()),
|
||
(gen_random_uuid(), '户外', NOW()),
|
||
(gen_random_uuid(), '其他', NOW())
|
||
ON CONFLICT (name) DO NOTHING;
|
||
"
|
||
|
||
# 8. 验证部署
|
||
docker compose ps
|
||
docker compose logs --tail=50 app
|
||
\`\`\`
|
||
|
||
---
|
||
|
||
## 🎨 界面改进
|
||
|
||
### 配色方案
|
||
**亮色模式**：
|
||
- 主色调：灰色系 (#F9FAFB, #FFFFFF)
|
||
- 强调色：深灰 (#111827, #1F2937)
|
||
- 边框：浅灰 (#E5E7EB)
|
||
|
||
**暗色模式**：
|
||
- 主色调：深灰系 (#111827, #1F2937)
|
||
- 强调色：中灰 (#374151, #4B5563)
|
||
- 边框：深灰 (#374151)
|
||
|
||
### 组件样式
|
||
- 圆角统一为12px（Apple风格）
|
||
- 按钮添加hover和active动画
|
||
- 卡片添加阴影提升层次感
|
||
- 输入框focus状态优化
|
||
|
||
---
|
||
|
||
## 📊 性能优化
|
||
|
||
1. **数据库索引**
|
||
- 添加categoryName索引
|
||
- 添加sceneName索引
|
||
- 优化查询性能
|
||
|
||
2. **前端优化**
|
||
- 使用XMLHttpRequest实现上传进度
|
||
- 实时计算上传速度
|
||
- 减少不必要的重渲染
|
||
|
||
3. **用户体验**
|
||
- 自动保存常用分类和场景
|
||
- 快速筛选和搜索
|
||
- 一键清除所有筛选
|
||
|
||
---
|
||
|
||
## 🐛 Bug修复
|
||
|
||
1. ✅ 修复了下载文件路径问题
|
||
2. ✅ 修复了Next.js API配置警告
|
||
3. ✅ 修复了Prisma二进制目标问题
|
||
4. ✅ 优化了文件名中文编码问题
|
||
|
||
---
|
||
|
||
## 📖 使用指南
|
||
|
||
### 上传素材（新流程）
|
||
|
||
1. **登录系统**
|
||
- 使用您的账号登录
|
||
|
||
2. **点击"上传素材"按钮**
|
||
|
||
3. **填写信息**：
|
||
- 选择预览图（支持JPG、PNG、WebP等）
|
||
- 输入商品型号（如：XY-2024-001）
|
||
- **选择一级分类**（如：家居、办公等）
|
||
- 如果没有合适的，点击"新建分类"
|
||
- **选择二级分类**（如：客厅、卧室等）
|
||
- 如果没有合适的，点击"新建场景"
|
||
- 选择压缩包（支持ZIP、RAR、7Z，最大10GB）
|
||
|
||
4. **开始上传**
|
||
- 实时查看上传进度
|
||
- 查看上传速度
|
||
- 等待上传完成
|
||
|
||
5. **完成**
|
||
- 上传成功后自动返回首页
|
||
- 新上传的素材会出现在列表顶部
|
||
|
||
### 筛选和查找素材
|
||
|
||
1. **使用搜索框**
|
||
- 输入关键词搜索
|
||
- 支持搜索商品型号、分类、场景、作者
|
||
|
||
2. **使用一级分类筛选**
|
||
- 点击分类按钮快速筛选
|
||
- 再次点击取消筛选
|
||
|
||
3. **使用二级分类筛选**
|
||
- 点击场景按钮筛选
|
||
- 可与一级分类组合使用
|
||
|
||
4. **组合筛选**
|
||
- 同时使用搜索、一级分类、二级分类
|
||
- 查看当前筛选条件标签
|
||
- 单独移除某个条件或一键清除
|
||
|
||
### 下载素材
|
||
|
||
1. 找到需要的素材卡片
|
||
2. 点击"下载"按钮
|
||
3. 浏览器会自动下载压缩包
|
||
|
||
---
|
||
|
||
## 🔧 技术栈
|
||
|
||
### 前端
|
||
- Next.js 14.2.33
|
||
- React 18
|
||
- TypeScript
|
||
- Tailwind CSS（支持黑暗模式）
|
||
- NextAuth.js
|
||
|
||
### 后端
|
||
- Next.js API Routes
|
||
- Prisma ORM
|
||
- PostgreSQL
|
||
- S3对象存储（MinIO）
|
||
|
||
### 部署
|
||
- Docker + Docker Compose
|
||
- FRP内网穿透
|
||
- TrueNAS（NAS服务器）
|
||
|
||
---
|
||
|
||
## 📝 API更新
|
||
|
||
### 新增API
|
||
|
||
**GET /api/categories**
|
||
- 获取所有一级分类
|
||
- 返回：`{ id, name, createdAt }[]`
|
||
|
||
**POST /api/categories**
|
||
- 创建新的一级分类
|
||
- 参数：`{ name: string }`
|
||
- 返回：`{ id, name, createdAt }`
|
||
|
||
### 更新API
|
||
|
||
**POST /api/materials/upload**
|
||
- 新增参数：`categoryName` (必填)
|
||
- 其他参数保持不变
|
||
|
||
**GET /api/materials**
|
||
- 新增查询参数：`?category=分类名`
|
||
- 支持组合查询：`?category=家居&scene=客厅&search=关键词`
|
||
|
||
---
|
||
|
||
## 🚀 部署更新
|
||
|
||
### 本地开发
|
||
|
||
\`\`\`bash
|
||
# 1. 拉取最新代码
|
||
cd /Users/lanmu/Desktop/gongxiangp2
|
||
|
||
# 2. 安装依赖（如有新增）
|
||
npm install
|
||
|
||
# 3. 生成Prisma Client
|
||
npx prisma generate
|
||
|
||
# 4. 运行数据库迁移
|
||
npx prisma db push
|
||
|
||
# 5. 启动开发服务器
|
||
npm run dev
|
||
\`\`\`
|
||
|
||
### NAS生产环境
|
||
|
||
\`\`\`bash
|
||
# 1. 上传新代码到NAS
|
||
sshpass -p 'jsjj8888' scp -r . root@192.168.58.20:/mnt/tank/apps/youyidian-3d/
|
||
|
||
# 2. SSH到NAS
|
||
ssh root@192.168.58.20
|
||
|
||
# 3. 进入项目目录
|
||
cd /mnt/tank/apps/youyidian-3d
|
||
|
||
# 4. 重新构建并启动
|
||
docker compose down
|
||
docker compose up -d --build
|
||
|
||
# 5. 运行数据库迁移
|
||
docker compose exec app npx prisma db push
|
||
|
||
# 6. 检查状态
|
||
docker compose ps
|
||
docker compose logs --tail=50 app
|
||
\`\`\`
|
||
|
||
---
|
||
|
||
## 🎯 未来规划
|
||
|
||
### 短期（1-2周）
|
||
- [ ] 添加批量下载功能
|
||
- [ ] 添加素材收藏功能
|
||
- [ ] 优化移动端体验
|
||
|
||
### 中期（1个月）
|
||
- [ ] 添加素材评论功能
|
||
- [ ] 添加素材标签系统
|
||
- [ ] 实现高级搜索（多条件组合）
|
||
|
||
### 长期（3个月）
|
||
- [ ] AI智能分类
|
||
- [ ] 素材推荐系统
|
||
- [ ] 数据统计和分析
|
||
|
||
---
|
||
|
||
## 📞 技术支持
|
||
|
||
如有问题，请联系：
|
||
- **开发者**：系统管理员
|
||
- **更新时间**：2025-10-16
|
||
- **版本**：v2.0.0
|
||
|
||
---
|
||
|
||
**感谢使用FLNXI素材库管理系统！** 🎉
|
||
|
||
|