462498660e
- Updated styles in src/styles.css for better responsiveness and layout adjustments. - Added new CSS classes for edit drawer and item rail components. - Introduced animations for drawer transitions. - Created new types in src/types/admin.ts for better type safety in admin features. - Modified vite.config.ts to change server port and enable strict port settings for development.
41 lines
1.6 KiB
Markdown
41 lines
1.6 KiB
Markdown
# WonderQ-Admin-UI
|
||
|
||
独立的 WonderQ 后台管理前端，基于 Vite、React、TypeScript、Tailwind CSS 4 和 shadcn/ui 风格组件。
|
||
|
||
## 本地启动
|
||
|
||
1. 安装依赖：
|
||
|
||
```bash
|
||
yarn install
|
||
```
|
||
|
||
本项目使用 Yarn 1 锁文件。Windows 环境下，Vite 8、Tailwind CSS 4、lightningcss 依赖 native binding，`package.json` 中已固定对应的 Windows 构建包，避免 Yarn 1 漏装 optional dependency 导致构建失败。
|
||
|
||
2. 确认后端 API 运行在 `http://localhost:4000`。
|
||
|
||
3. 启动后台 UI：
|
||
|
||
```bash
|
||
yarn dev
|
||
```
|
||
|
||
访问：http://localhost:5602
|
||
|
||
局域网访问可使用本机 IP，例如 `http://192.168.1.23:5602/`。该地址由 Vite dev server 提供，支持样式和组件热更新。
|
||
|
||
默认后台账号由 `WonderQ-Admin` 提供：`admin@example.com / ChangeMe123!`。
|
||
|
||
## 目录说明
|
||
|
||
- `src/App.tsx`：后台管理主界面和业务交互。
|
||
- `src/api.ts`：Admin API 类型、Token 管理和请求封装。
|
||
- `src/components/ui/`：本地 shadcn/ui 风格基础组件，包括 Button、Card、Input、Textarea、Badge、Alert、Switch 等。
|
||
- `src/lib/utils.ts`：组件 className 合并工具。
|
||
- `src/styles.css`：Tailwind 入口、设计变量、后台布局和响应式样式。
|
||
- `public/assets/`：后台预览所需静态资源，保留 `/assets/...` 引用方式。
|
||
- `components.json`：shadcn/ui 组件配置。
|
||
- `vite.config.ts`：开发环境将 `/api` 代理到 `http://localhost:4000`，dev server 固定运行在 `5602` 并支持 HMR；生产构建预览运行在 `5603`。
|
||
|
||
本仓库已经独立，不再依赖 `WonderQ-MiniAPP` 的相对路径。
|