签入版本

This commit is contained in:
小蚂蚁云
2026-10-25 17:24:27 +08:00
parent 48911cc08f
commit fdbeae092a
1010 changed files with 30682 additions and 95274 deletions
@@ -52,7 +52,7 @@ ui/src/
│ │ ├── designSetting.ts projectSetting.ts lockscreen.ts ossConfig.ts
│ ├── mutation-types.ts # ACCESS_TOKEN 等存储键常量
│ ├── index.ts types.ts plugins/
├── styles/ # 全局样式与主题变量(Element Plus 变量覆盖)
├── styles/ # 全局样式与主题变量(ElementPlus 变量覆盖)
├── utils/
│ ├── http/axios/ # HTTP 封装(VAxios/transform/checkStatus…)
│ ├── auth.ts Storage.ts # 路径工具 / 本地存储封装
@@ -72,7 +72,7 @@ columns ← views/{域}/{模块}/columns.ts
## 开发规约
+ 列表列用 columns.ts 声明式配置(勿在模板里手写 el-table-column)
+ 复杂列用 render 函数(h + Element Plus 组件)
+ 复杂列用 render 函数(h + ElementPlus 组件)
+ 图片列 src 用后端 GetFileUrl 已补域名的字段(勿手拼)
+ 枚举列展示 {field}Text(勿硬编码映射)
+ 操作列按钮逐个加 v-permission(对齐 gmeta permission)
@@ -1,7 +1,7 @@
# 9.1 前端工程概述
:::tip 概述
前端为 Vue3 + TypeScript + Vite + Element Plus + Pinia 的标准工程化项目(ui/ 目录),采用 Composition API,核心机制为:动态菜单路由、指令级权限、三件套页面规范(api/columns/querySchemas)、统一封装的 axios。
前端为 Vue3 + TypeScript + Vite + ElementPlus + Pinia 的标准工程化项目(ui/ 目录),采用 Composition API,核心机制为:动态菜单路由、指令级权限、三件套页面规范(api/columns/querySchemas)、统一封装的 axios。
:::
## 技术栈
@@ -11,7 +11,7 @@
| Vue | ^3.4.27 | 核心框架(Composition API) |
| TypeScript | ^5.x | 类型系统 |
| Vite | ^5.x | 构建(多环境模式 dev/test/uat/prod) |
| Element Plus | ^2.7.4 | UI 组件库 |
| ElementPlus | ^2.7.4 | UI 组件库 |
| Pinia | ^2.1.7 | 状态管理 |
| Vue Router | ^4.3.2 | 路由(常量路由 + 动态菜单路由) |
| axios | ^0.27.2 | HTTP(封装于 utils/http/axios,VAxios 类) |
@@ -1,7 +1,7 @@
# 9.14 样式与主题定制
:::tip 概述
样式体系基于 Element Plus CSS 变量 + styles/ 全局覆盖:主题色、暗黑模式、水印、动画等经 designSetting/projectSetting 在线配置。定制优先走变量覆盖而非逐组件覆盖。
样式体系基于 ElementPlus CSS 变量 + styles/ 全局覆盖:主题色、暗黑模式、水印、动画等经 designSetting/projectSetting 在线配置。定制优先走变量覆盖而非逐组件覆盖。
:::
## 样式目录(src/styles/)
@@ -10,22 +10,22 @@
styles/
├── index.less / index.scss 入口样式
├── variables.* SCSS/Less 变量
├── element/ Element Plus 变量覆盖
├── element/ ElementPlus 变量覆盖
├── public/ 公共样式
└── ...
```
main.ts 引入顺序:Element Plus 样式 → 变量覆盖 → 全局样式(覆盖生效)。
main.ts 引入顺序:ElementPlus 样式 → 变量覆盖 → 全局样式(覆盖生效)。
## 主题定制机制
```text
Element Plus 暴露 CSS 变量(--el-color-primary 等):
ElementPlus 暴露 CSS 变量(--el-color-primary 等):
styles/ 覆盖变量根值 → 全组件生效
运行时主题切换(designSetting store):
主题色在线更换 → 动态更新 CSS 变量 / 主题类名
暗黑模式:html 挂 dark 类 → Element Plus dark 变量集
暗黑模式:html 挂 dark 类 → ElementPlus dark 变量集
灰度/色弱:filter 类名
```
@@ -50,7 +50,7 @@ designSetting 开关 + 文案 → 布局层渲染水印(canvas/css)
## 页面样式规约
```text
1. 优先用 Element Plus 组件与 CSS 变量(勿直接写死颜色值)
1. 优先用 ElementPlus 组件与 CSS 变量(勿直接写死颜色值)
2. 页面 scoped 样式(<style scoped>);跨页公共样式进 styles/public
3. 主题相关颜色用 var(--el-color-*)(随主题切换自动适配)
4. 少用 deep 选择器覆盖(Element 升级易碎);确需覆盖集中在 element/ 目录