docs/00-overview.md

docs/10-frontend.md

@@ -0,0 +1,105 @@
+# 10 前端
+
+## 技术栈
+
+Vue 3 + TypeScript + Vite + Element Plus + Pinia + Vue Router + VueUse + ECharts + Axios + ESLint + Prettier。
+
+## Admin 框架
+
+前端 Admin 采用 [pure-admin-thin（i18n 分支）](https://github.com/pure-admin/pure-admin-thin/tree/i18n)，代码位于 `frontend/`。pure-admin 原生基于 Element Plus，并内置国际化。
+
+- 使用 pure-admin 提供的 Layout / Router / 权限 / 标签页 / i18n 等基础能力
+- Element Plus 作为唯一业务 UI 组件库，不引入 Naive UI 等第二套 UI 库
+- 不要重复实现 pure-admin 已有的 Admin 基础设施
+
+## 目录结构
+
+```
+src/
+├── api/
+├── assets/
+├── components/
+├── constants/
+├── layouts/
+├── router/
+├── stores/
+├── styles/
+├── types/
+├── utils/
+├── views/
+│   ├── dashboard/
+│   ├── warehouse/
+│   ├── product/
+│   ├── inventory/
+│   ├── inbound/
+│   ├── outbound/
+│   ├── picking/
+│   ├── packing/
+│   ├── shipping/
+│   ├── customer/
+│   ├── supplier/
+│   ├── reports/
+│   └── system/
+└── App.vue
+```
+
+页面必须按照业务领域组织。若所选 Admin 框架已有约定目录，以框架约定为准，在其中按业务领域组织。
+
+## Element Plus 使用规范
+
+统一使用 Element Plus，重点组件：
+
+- ElTable
+- ElForm
+- ElDialog
+- ElDrawer
+- ElSelect
+- ElCascader
+- ElDatePicker
+- ElPagination
+- ElTabs
+- ElSteps
+- ElUpload
+- ElTree
+- ElDescriptions
+
+所有列表页尽量统一布局：
+
+```
+查询区
+ ↓
+Toolbar
+ ↓
+Table
+ ↓
+Pagination
+```
+
+不要每个页面设计一套完全不同的交互，不要重复实现 Element Plus 已提供的组件。
+
+## 前端权限
+
+支持：
+
+- 菜单权限
+- 页面权限
+- Button / API 权限
+- Role
+- Tenant
+
+权限码格式 `模块:动作`，例如：
+
+```
+inventory:view
+inventory:adjust
+inventory:export
+inbound:view
+inbound:create
+inbound:receive
+outbound:view
+outbound:allocate
+outbound:pick
+outbound:ship
+```
+
+前端权限仅用于展示控制，最终授权以后端 Policies / Gates 为准。