zhangjiawen-car/yudao-ui-admin-vue3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
5e3ab5b9013f98fa1957c9fca6d3c750b1579629
yudao-ui-admin-vue3/项目分析报告.md

360 lines
11 KiB
Markdown
Raw Normal View History

修改bug2.0
2026-03-02 08:25:24 +08:00
# 项目分析报告
## 📋 项目概述
当前工作目录包含两个主要项目：
1. **yudao-ui-admin-vue3** - PC端管理后台系统
2. **yudao-ui-admin-uniapp** - 移动端应用（位于 yudao-ui-admin-vue3 目录下）
---
## 1️⃣ yudao-ui-admin-vue3（PC端管理后台）
### 项目基本信息
- **项目名称**: yudao-ui-admin-vue3
- **版本**: 2.2.0-snapshot
- **描述**: 基于 Vue3、Vite4、Element Plus、TypeScript 的管理后台系统
- **作者**: xingyu
- **开源协议**: MIT
### 技术栈
| 框架/工具 | 说明 | 版本 |
|---------|------|------|
| Vue | Vue 框架 | 3.4.21 |
| Vite | 开发与构建工具 | 5.1.4 |
| Element Plus | UI 组件库 | 2.8.0 |
| TypeScript | JavaScript 的超集 | 5.3.3 |
| Pinia | Vue 状态管理库 | 2.1.7 |
| vue-router | Vue 路由 | 4.3.0 |
| UnoCSS | 原子 CSS 引擎 | 0.58.5 |
| vue-i18n | 国际化 | 9.10.2 |
| axios | HTTP 客户端 | 1.6.8 |
### 项目结构
```
yudao-ui-admin-vue3/
├── src/
│ ├── api/ # API 接口定义
│ │ ├── car/ # 车辆相关（续保订单等）
│ │ ├── tire/ # 轮胎相关
│ │ ├── system/ # 系统管理
│ │ ├── infra/ # 基础设施
│ │ ├── bpm/ # 工作流程
│ │ ├── erp/ # ERP 系统
│ │ ├── crm/ # CRM 系统
│ │ ├── mall/ # 商城系统
│ │ └── ...
│ ├── views/ # 页面视图
│ │ ├── car/ # 车辆管理（包含续保订单）
│ │ ├── tire/ # 轮胎管理
│ │ └── ...
│ ├── components/ # 公共组件
│ ├── store/ # 状态管理
│ ├── router/ # 路由配置
│ ├── utils/ # 工具函数
│ └── config/ # 配置文件
├── package.json
├── vite.config.ts
└── tsconfig.json
```
### 核心功能模块
#### 1. 系统功能
- 用户管理、角色管理、菜单管理
- 部门管理、岗位管理
- 租户管理（SaaS 多租户）
- 字典管理、通知公告
- 操作日志、登录日志
#### 2. 车辆续保订单模块（业务相关）
- **API**: `src/api/car/renewalorder/index.ts`
- **页面**: `src/views/car/renewalorder/`
- `index.vue` - 列表页面
- `RenewalOrderForm.vue` - 表单页面
- `dashboard.vue` - 仪表盘
**续保订单数据结构**：
```typescript
interface RenewalOrderVO {
// 车辆信息
carBrand: string // 汽车品牌
carModel: string // 车型
licensePlate: string // 车牌号
factoryModel: string // 厂牌型号
vin: string // 车架号
engineNo: string // 发动机号
invoiceDate: Date // 发票日期
invoiceAmount: number // 发票金额
purchaseMileage: number // 购买时公里数
invoiceUrl: string // 发票图片地址
// 购买方信息
serviceBuyer: string // 服务购买方
carBuyer: string // 车辆购买方
certType: string // 证件类型
certNo: string // 证件号码
mobile: string // 联系电话
memberEmail: string // 会员邮箱
contactAddress: string // 联系地址
storeId: number // 门店ID
storeName?: string // 门店名称
// 产品信息
productId: number // 续保产品ID
serviceProduct: string // 服务产品
productValidity: string // 产品时效
originalWarrantyYears: string // 原厂质保时长
originalWarrantyMileage: string // 原厂质保里程
productFee: number // 产品费用
// 其他信息
settlementMethod: string // 结算方式
inputUser: string // 录单人
remark: string // 备注
contractRemark: string // 合同备注
}
```
#### 3. 其他业务模块
- 工作流程（BPM）
- 支付系统
- 基础设施（代码生成、文件服务、定时任务等）
- 数据报表
- 微信公众号
- 商城系统
- ERP 系统
- CRM 系统
### 开发命令
```bash
# 安装依赖
pnpm i
# 开发环境
pnpm dev
# 构建
pnpm build:prod
# 代码检查
pnpm lint:eslint
pnpm lint:format
pnpm lint:style
```
---
## 2️⃣ yudao-ui-admin-uniapp（移动端应用）
### 项目基本信息
- **项目名称**: unibest（基于 unibest 框架）
- **版本**: 4.1.0
- **yudao 版本**: 2025.12.0-snapshot
- **描述**: 芋道管理后台的移动端
- **框架**: 基于 unibest - 最好的 uniapp 开发模板
- **位置**: `yudao-ui-admin-vue3/yudao-ui-admin-uniapp/`
### 技术栈
| 框架/工具 | 说明 | 版本 |
|---------|------|------|
| Vue | Vue 框架 | 3.4.21 |
| uni-app | 跨平台应用开发框架 | 3.0.x |
| TypeScript | JavaScript 的超集 | 5.8.x |
| Vite | 构建工具 | 5.2.8 |
| Pinia | Vue 状态管理库 | 2.0.36 |
| UnoCSS | 原子化 CSS 引擎 | 66.x |
| wot-design-uni | UI 组件库 | 1.13.x |
| z-paging | 分页组件 | 2.8.7 |
| vue-i18n | 国际化 | 9.x |
### 平台兼容性
| H5 | iOS | Android | 微信小程序 | 支付宝小程序 | 字节小程序 | 百度小程序 | 钉钉小程序 | 快手小程序 | QQ 小程序 |
|:--:|:---:|:-------:|:-----:|:------:|:-----:|:-----:|:-----:|:-----:|:------:|
| ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ | ✅ |
### 项目结构
```
yudao-ui-admin-uniapp/
├── src/
│ ├── api/ # API 接口定义
│ │ ├── bpm/ # 工作流程
│ │ ├── infra/ # 基础设施
│ │ └── system/ # 系统管理
│ ├── pages/ # 主包页面
│ │ ├── index/ # 首页/工作台
│ │ ├── bpm/ # 工作流程
│ │ ├── user/ # 用户相关
│ │ └── ...
│ ├── pages-core/ # 核心页面（分包）
│ │ ├── auth/ # 登录/注册
│ │ ├── error/ # 错误页
│ │ └── user/ # 用户中心
│ ├── pages-system/ # 系统管理（分包）
│ │ ├── user/ # 用户管理
│ │ ├── dept/ # 部门管理
│ │ ├── role/ # 角色管理
│ │ └── ...
│ ├── pages-infra/ # 基础设施（分包）
│ │ ├── file/ # 文件管理
│ │ ├── job/ # 定时任务
│ │ └── ...
│ ├── pages-bpm/ # 工作流程（分包）
│ │ ├── task/ # 任务管理
│ │ ├── processInstance/ # 流程实例
│ │ └── ...
│ ├── components/ # 公共组件
│ ├── store/ # 状态管理
│ ├── http/ # HTTP 请求封装
│ ├── hooks/ # 自定义 Hooks
│ ├── layouts/ # 布局组件
│ ├── router/ # 路由配置
│ ├── utils/ # 工具函数
│ └── tabbar/ # TabBar 配置
├── package.json
├── vite.config.ts
└── pages.config.ts
```
### 项目特性
1. **约定式路由** - 基于文件系统自动生成路由
2. **Layout 布局** - 内置多种布局方案
3. **请求封装** - 基于 uni.request 封装，支持拦截器
4. **登录拦截** - 完善的登录态管理与页面拦截
5. **UnoCSS** - 原子化 CSS，按需生成
6. **i18n 多语言** - 内置国际化方案
7. **TypeScript** - 全面的 TypeScript 支持
8. **多端适配** - 一套代码，多端运行
### 开发命令
```bash
# 进入项目目录
cd yudao-ui-admin-uniapp
# 安装依赖
pnpm install
# 开发环境（H5）
pnpm dev
# 开发环境（微信小程序）
pnpm dev:mp
# 构建（H5）
pnpm build
# 构建（微信小程序）
pnpm build:mp
```
---
## 🔗 项目关系
### 1. 项目位置关系
```
蓝智科技/蓝鲸-轮胎/
├── yudao-ui-admin-vue3/ # PC端管理后台（主项目）
│ ├── src/ # PC端源代码
│ └── yudao-ui-admin-uniapp/ # 移动端应用（子项目）
│ └── src/ # 移动端源代码
├── ruoyi-vue-pro/ # 后端项目（Spring Boot）
└── tire-app-doc/ # 文档
```
### 2. 项目关系说明
- **yudao-ui-admin-vue3** 和 **yudao-ui-admin-uniapp** 都是前端项目
- 它们共享同一个后端 API（ruoyi-vue-pro）
- **yudao-ui-admin-vue3** 是 PC 端管理后台
- **yudao-ui-admin-uniapp** 是移动端应用（小程序/H5/App）
- 两个项目在业务功能上是对应的，但 UI 和交互方式不同
### 3. 业务模块对应关系
| PC端（yudao-ui-admin-vue3） | 移动端（yudao-ui-admin-uniapp） |
|---------------------------|------------------------------|
| src/views/car/renewalorder/ | （移动端可能没有对应的续保订单模块） |
| src/views/system/ | src/pages-system/ |
| src/views/infra/ | src/pages-infra/ |
| src/views/bpm/ | src/pages-bpm/ |
---
## 📝 业务模块分析
### 车辆续保订单模块（PC端）
**位置**: `src/views/car/renewalorder/`
**功能特性**：
1. ✅ 列表查询（支持分页、筛选）
2. ✅ 表单录入（包含 4 个选项卡）：
- 车辆信息
- 购买方信息
- 产品信息
- 其他信息
3. ✅ 文件上传（发票图片）
4. ✅ 数据导出
5. ✅ 编辑/删除功能
**相关 API**：
- `src/api/car/renewalorder/index.ts` - 续保订单 API
- `src/api/car/renewalproduct/index.ts` - 续保产品 API
- `src/api/tire/store/index.ts` - 门店 API
---
## 🎯 总结与建议
### 当前状态
1. **PC端项目**（yudao-ui-admin-vue3）
- ✅ 功能完善，包含完整的业务模块
- ✅ 续保订单模块已实现
- ✅ 技术栈现代化（Vue3 + TypeScript + Vite）
2. **移动端项目**（yudao-ui-admin-uniapp）
- ✅ 基于 unibest 框架，架构完善
- ✅ 支持多端运行
- ⚠️ 可能缺少部分业务模块（如续保订单）
### 建议
1. **如果需要移动端也支持续保订单**：
- 可以在 `yudao-ui-admin-uniapp/src/pages/` 下创建对应的页面
- 参考 PC 端的实现逻辑
- 适配移动端的 UI 组件（使用 wot-design-uni）
2. **项目维护**：
- 两个项目共享 API，建议统一 API 接口规范
- 业务逻辑可以在后端统一处理
- 前端主要关注 UI 和交互
3. **开发流程**：
- PC 端和移动端可以并行开发
- 建议先完善 PC 端功能，再移植到移动端
- 或者根据实际业务需求决定开发优先级
---
## 📚 相关文档
- **芋道框架文档**: https://doc.iocoder.cn
- **unibest 文档**: https://unibest.tech
- **Element Plus**: https://element-plus.org
- **uni-app**: https://uniapp.dcloud.io
- **wot-design-uni**: https://wot-design-uni.pages.dev
Reference in New Issue Copy Permalink