chenpei 6377ce6d24 feat: Change preview card dimensions from 300x500 to 300x400
- Update card height from 500px to 400px in homepage
- Adjust maxHeight in image processor from 1000px to 800px
- Update all processImage calls to use maxHeight: 800
- Optimized for better display ratio on homepage
2025-10-26 17:45:46 +08:00
2025-10-26 09:11:04 +08:00
2025-10-26 09:11:04 +08:00
2025-10-26 09:11:04 +08:00
2025-10-26 09:11:04 +08:00
2025-10-26 09:11:04 +08:00
2025-10-26 09:11:04 +08:00
2025-10-26 09:11:04 +08:00
2025-10-26 09:11:04 +08:00
2025-10-26 09:11:04 +08:00

由壹点3D素材

一个现代化的3D素材分享平台,采用苹果官方UI设计规范。

技术栈

  • 前端: Next.js 14 + React 18 + TypeScript + TailwindCSS
  • 认证: NextAuth.js
  • 数据库: PostgreSQL + Prisma ORM
  • 存储: MinIO S3 (预览图) + 本地存储 (压缩包)

功能特性

  • ✅ 用户注册/登录系统
  • ✅ 素材上传(预览图 + 压缩包)
  • ✅ 素材浏览与下载
  • ✅ 管理员后台管理
  • ✅ 用户管理
  • ✅ 苹果风格UI设计

快速开始

1. 安装依赖

npm install

2. 配置环境变量

复制 .env.local 文件并填入你的配置:

# Database
DATABASE_URL=your_postgresql_url

# NextAuth
NEXTAUTH_SECRET=your_secret_key
NEXTAUTH_URL=http://localhost:3000

# MinIO S3 Storage
S3_ENDPOINT=your_s3_endpoint
S3_BUCKET=your_bucket_name
S3_ACCESS_KEY_ID=your_access_key
S3_SECRET_ACCESS_KEY=your_secret_key
S3_REGION=us-east-1
S3_PUBLIC_DOMAIN=your_public_domain
S3_FILE_PATH=your_file_path/

# Local storage
UPLOAD_DIR=./uploads

3. 初始化数据库

# 生成 Prisma Client
npm run prisma:generate

# 推送数据库模式
npm run prisma:push

4. 创建管理员账号

首次运行后,注册一个账号,然后在数据库中手动将该用户的 role 字段设置为 ADMIN。

UPDATE users SET role = 'ADMIN' WHERE email = 'your@email.com';

5. 启动开发服务器

npm run dev

访问 http://localhost:3000

项目结构

gongxiangp2/
├── app/                    # Next.js App Router
│   ├── api/               # API 路由
│   │   ├── auth/         # 认证相关
│   │   ├── materials/    # 素材相关
│   │   └── admin/        # 管理员相关
│   ├── login/            # 登录页面
│   ├── register/         # 注册页面
│   ├── admin/            # 管理员页面
│   └── page.tsx          # 首页
├── components/            # React 组件
│   ├── Header.tsx
│   └── UploadModal.tsx
├── lib/                   # 工具库
│   ├── prisma.ts         # Prisma 客户端
│   ├── auth.ts           # NextAuth 配置
│   └── s3.ts             # S3 存储服务
├── prisma/               # Prisma 配置
│   └── schema.prisma     # 数据库模式
└── uploads/              # 本地上传文件存储

数据库模型

User (用户)

  • id: UUID
  • email: 邮箱
  • username: 用户名
  • password: 密码 (加密)
  • role: 角色 (USER/ADMIN)

Material (素材)

  • id: UUID
  • previewUrl: 预览图URL (S3)
  • productModel: 商品型号
  • sceneName: 场景名称
  • authorName: 作者花名
  • zipFileName: 压缩包文件名
  • zipFilePath: 压缩包本地路径
  • userId: 用户ID (外键)

部署

生产环境构建

npm run build
npm start

环境变量

确保在生产环境中设置所有必要的环境变量,特别是:

  • NEXTAUTH_SECRET: 使用强随机字符串
  • NEXTAUTH_URL: 设置为生产域名

License

MIT

Description
共享平台项目 - 素材共享管理系统
Readme 254 MiB
Languages
TypeScript 91.4%
JavaScript 3.8%
PowerShell 2.9%
Python 1.2%
PLpgSQL 0.3%
Other 0.4%