zhangjiawen-car/yudao-ui-admin-vue3

Fork 0

Files

ouhaolan 78410c1aae 修改bug2.0

2026-03-02 08:25:24 +08:00

11 KiB

Raw Permalink Blame History

项目分析报告

📋 项目概述

当前工作目录包含两个主要项目：

yudao-ui-admin-vue3 - PC端管理后台系统
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 - 仪表盘

续保订单数据结构：

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 系统

开发命令

# 安装依赖
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

项目特性

约定式路由 - 基于文件系统自动生成路由
Layout 布局 - 内置多种布局方案
请求封装 - 基于 uni.request 封装，支持拦截器
登录拦截 - 完善的登录态管理与页面拦截
UnoCSS - 原子化 CSS，按需生成
i18n 多语言 - 内置国际化方案
TypeScript - 全面的 TypeScript 支持
多端适配 - 一套代码，多端运行

开发命令

# 进入项目目录
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/

功能特性：

✅ 列表查询（支持分页、筛选）
✅ 表单录入（包含 4 个选项卡）：
- 车辆信息
- 购买方信息
- 产品信息
- 其他信息
✅ 文件上传（发票图片）
✅ 数据导出
✅ 编辑/删除功能

相关 API：

src/api/car/renewalorder/index.ts - 续保订单 API
src/api/car/renewalproduct/index.ts - 续保产品 API
src/api/tire/store/index.ts - 门店 API

🎯 总结与建议

当前状态

PC端项目（yudao-ui-admin-vue3）
- ✅ 功能完善，包含完整的业务模块
- ✅ 续保订单模块已实现
- ✅ 技术栈现代化（Vue3 + TypeScript + Vite）
移动端项目（yudao-ui-admin-uniapp）
- ✅ 基于 unibest 框架，架构完善
- ✅ 支持多端运行
- ⚠️ 可能缺少部分业务模块（如续保订单）

建议

如果需要移动端也支持续保订单：
- 可以在 yudao-ui-admin-uniapp/src/pages/ 下创建对应的页面
- 参考 PC 端的实现逻辑
- 适配移动端的 UI 组件（使用 wot-design-uni）
项目维护：
- 两个项目共享 API，建议统一 API 接口规范
- 业务逻辑可以在后端统一处理
- 前端主要关注 UI 和交互
开发流程：
- 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

11 KiB Raw Permalink Blame History Unescape Escape

项目分析报告

📋 项目概述

1️⃣ yudao-ui-admin-vue3（PC端管理后台）

项目基本信息

技术栈

项目结构

核心功能模块

1. 系统功能

2. 车辆续保订单模块（业务相关）

3. 其他业务模块

开发命令

2️⃣ yudao-ui-admin-uniapp（移动端应用）

项目基本信息

技术栈

平台兼容性

项目结构

项目特性

开发命令

🔗 项目关系

1. 项目位置关系

2. 项目关系说明

3. 业务模块对应关系

📝 业务模块分析

车辆续保订单模块（PC端）

🎯 总结与建议

当前状态

建议

📚 相关文档

11 KiB

Raw Permalink Blame History