# 丰链管理系统 (Font ERP)

基于 Vue 3 + Vite 构建的现代化企业资源管理系统

## 技术栈详情

### 核心框架
- [Vue 3.x.x - 渐进式 JavaScript 框架](https://cn.vuejs.org/)
- [Vite 6.x.x - 下一代前端构建工具](https://cn.vitejs.dev/)
- JavaScript - 主要开发语言
### UI 框架和组件
- [ **Naive UI  - 项目统一使用的 UI 组件库**](https://www.naiveui.com/zh-CN/os-theme) 
- Element Plus - ***历史遗留 UI 组件库 需逐渐剔除***
- Ant Design Vue 3.2.9 - ***历史遗留 UI 组件库 需逐渐剔除***
- [vue3-print-nb - 打印功能](https://github.com/Power-kxLee/vue3-print-nb?tab=readme-ov-file#vue3-print-nb)
- [@vue-office - Office 文档预览](https://501351981.github.io/vue-office/examples/docs/)
- @kangc/v-md-editor - Markdown 编辑器
- [wangeditor 4.7.15 - 富文本编辑器](https://www.wangeditor.com/)

### 路由和请求
- [Vue Router 4 - 官方路由管理](https://router.vuejs.org/zh/)
- [Axios - HTTP 请求库](https://axios-http.com/)

### 工具库
- lodash-es - 工具函数库
- Day.js - 时间处理库
- BigNumber.js - 大数处理
- html2canvas - 页面截图
- jspdf - PDF 生成
- spark-md5 - MD5 计算
- clipboard - 剪贴板操作

### 样式和图标
- TailwindCSS - 原子化 CSS 框架
- Sass - CSS 预处理器
- @ant-design/icons-vue - Ant Design 图标
- @element-plus/icons-vue - Element Plus 图标
- @vicons/* - 多种图标集合


### 地图服务
- vue-baidu-map-3x - 百度地图 Vue 3 组件

### 开发工具
- unplugin-auto-import - 自动导入
- unplugin-vue-components - 组件自动导入
- vite-plugin-svg-icons - SVG 图标处理
- vite-plugin-compression - 构建压缩
- prettier - 代码格式化

## 项目结构

```
src/
├── api/          # API 接口规范和文档(历史遗留 接口定义请写在api-norm)
├── api-norm/     # API 接口规范和文档
├── assets/       # 静态资源（图片、字体等）
│   ├── css/     # 全局样式
│   └── images/  # 图片资源
├── components/   # 全局公共组件
├── config/       # 全局配置文件
├── hooks/        # Vue Composition API 钩子函数
├── icons/        # 图标资源和 iconfont
├── router/       # 路由配置和路由守卫
├── service/      # 业务服务层
├── store/        # Pinia 状态管理
├── styles/       # 样式文件
│   ├── index.css   # 主样式入口
│   └── variables/  # 样式变量
├── types/        # 类型定义文件
├── utils/        # 工具函数
│   ├── directive/  # 自定义指令
│   ├── storage/    # 存储相关
│   └── request/    # 请求封装
├── views/        # 页面视图组件
├── vuex          # 历史遗留 需逐渐剔除
├── App.vue       # 根组件
└── main.js       # 应用入口文件
```

## 环境要求

- Node.js >= 20
- pnpm 7.x 包管理器
- 现代浏览器（支持 ES6+）

## 开发环境设置

1. 安装依赖
```bash
pnpm install
```

2. 启动开发服务器
```bash
# 开发环境 (.env.dev)
pnpm dev

# 生产环境 (.env.prod)
pnpm prod

# 主要环境 (.env.main)
pnpm main
```

3. 构建项目
```bash
# 测试环境构建
pnpm build-test

# 主要环境构建
pnpm build-main

# 生产环境构建
pnpm build-prod
```


## 环境变量配置

项目支持多环境配置：
- `.env.dev` - 开发环境配置
  - API 地址
  - 调试工具
  - 日志级别
- `.env.test` - 测试环境配置
  - 测试服务器地址
  - 测试账号配置
- `.env.prod` - 体制内生产环境配置
  - 生产 API 地址
  - 错误监控
  - 性能优化
- `.env.main` - 体制外生产环境配置
  - 特定功能开关
  - 自定义配置