面向独立画师的约稿展示与管理平台。客户可在移动端风格的主页浏览作品、查看价目并提交约稿；画师在后台通过看板管理订单，并借助本地 AI 优化需求描述与生成回复建议。
| 页面 | 路径 | 说明 |
|---|---|---|
| 画师主页 | /1 |
头像、简介、社交链接、作品/价目统计、接单状态 |
| 作品橱窗 | /1/gallery |
瀑布流作品展示，支持灯箱大图预览 |
| 价目表 | /1/pricing |
约稿类型与价格说明 |
| 提交约稿 | /1/order |
三步表单（类型 → 联系方式 → 确认），支持 AI 优化需求描述 |
| 页面 | 路径 | 说明 |
|---|---|---|
| 登录 | /admin/login |
管理员身份验证 |
| 订单看板 | /admin/dashboard |
五列 Kanban 看板，支持拖拽变更订单状态 |
| 基础设置 | /admin/settings |
编辑画师资料、价目表、作品集；支持本地图片上传 |
看板列： 待审核 → 草稿 → 上色 → 完成 / 不通过
AI 能力（需 Ollama）：
- 客户提交约稿时，一键优化需求描述
- 画师在看板卡片上，一键生成回复建议并复制
- 前端： Vue 3、Vite 5、Vue Router、Pinia
- UI： Element Plus、Tailwind CSS
- 后端： Node.js + json-server（Mock API）
- 其他： vuedraggable（看板拖拽）、multer（图片上传）、Ollama（本地大模型）
- Node.js 18+
- npm 或 pnpm
- （可选）Ollama，用于 AI 功能；默认模型
qwen2.5:7b
# 克隆项目
git clone https://github.com/<your-username>/DrawersHomes.git
cd DrawersHomes
# 安装依赖
npm install
# 启动开发环境（前端 + 后端同时启动）
npm run dev启动后访问：
默认管理员账号：
| 用户名 | 密码 |
|---|---|
admin |
admin123 |
| 命令 | 说明 |
|---|---|
npm run dev |
同时启动 Vite（5173）与 API 服务（3000） |
npm run dev:client |
仅启动前端 |
npm run dev:server |
仅启动后端 API |
npm run build |
构建生产版本到 dist/ |
npm run preview |
预览构建结果 |
AI 通过 Ollama 的 OpenAI 兼容接口调用，可在启动前设置环境变量：
# Windows PowerShell
$env:AI_MODEL = "qwen2.5:7b"
$env:AI_BASE_URL = "http://127.0.0.1:11434/v1/chat/completions"
npm run dev:server# macOS / Linux
export AI_MODEL=qwen2.5:7b
export AI_BASE_URL=http://127.0.0.1:11434/v1/chat/completions
npm run dev:server确保 Ollama 已运行且已拉取对应模型：
ollama pull qwen2.5:7b
ollama serve未配置 Ollama 时，其余功能仍可正常使用，仅 AI 优化与回复建议会失败。
DrawersHomes/
├── src/
│ ├── api/ # Axios 接口封装（订单、画师、AI）
│ ├── components/ # 公共与业务组件
│ ├── composables/ # 组合式函数（如看板拖拽）
│ ├── layouts/ # ClientLayout / AdminLayout
│ ├── router/ # 路由与鉴权守卫
│ ├── stores/ # Pinia 状态（auth / artist / order）
│ └── views/
│ ├── client/ # 客户端页面
│ └── admin/ # 管理后台页面
├── server.js # API 服务（json-server + 上传 + AI）
├── db.json # Mock 数据库（画师、订单、作品、价目）
├── uploads/ # 本地上传图片（运行时生成，已 gitignore）
├── vite.config.js # Vite 配置与 API 代理
└── package.json
前端通过 Vite 代理访问后端，开发时统一使用 /api 前缀：
| 端点 | 说明 |
|---|---|
GET/POST /api/artists |
画师信息 |
GET/POST /api/orders |
订单 CRUD |
GET/POST /api/gallery |
作品集 |
GET/POST /api/pricing |
价目表 |
POST /api/upload |
图片上传（最大 10MB，jpg/png/gif/webp） |
POST /api/ai/optimize-description |
AI 优化约稿描述 |
POST /api/ai/reply-suggestion |
AI 生成回复建议 |
上传的图片通过 /uploads/<filename> 访问。
db.json 为 json-server 的数据源，修改后会自动热重载。生产环境请替换为真实数据库与鉴权方案。
当前为演示项目，管理员登录为前端硬编码校验，请勿直接用于生产环境。
MIT