前端vue转后端java学习路径

1.1 前端模块(按业务域)

复制代码
service-front/src/
├── apis/                    ← 9 个 API 文件,按模块划分
│   ├── manage.ts            ← 最大:登录、计划、故障、咨询、组织、统计...
│   ├── inspection.ts        ← 巡检(你正在做的)
│   ├── serviceOrder.ts      ← 电子服务单
│   ├── weeklyReport.ts      ← 工作报告
│   ├── resource.ts          ← 资源/文章
│   ├── doc.ts               ← 文档
│   ├── common.ts            ← 公共接口
│   └── ai.ts                ← AI 聊天
│
└── views/
    ├── sr/                  ← 【核心】服务台:计划、故障、咨询
    ├── manage/              ← 【核心】管理:统计、工时、团队、字典、服务单
    ├── organization/        ← 【核心】组织:合同、成员、资产、实施计划
    ├── inspection/          ← 巡检(11 页)
    ├── permission/          ← 权限:角色、用户
    ├── resource/            ← 资源管理
    ├── knowledge/           ← 知识库/文档
    ├── message/             ← 消息通知
    ├── pages/               ← 门户:搜索、文章、下载
    └── ai/                  ← AI 助手

1.2 后端模块(14 个包)

复制代码
enmo_support/src/main/java/.../
├── workbench/     ← 【最大】计划、故障、咨询、统计、服务单、资产、消息
├── user/          ← 用户、公司、合同、服务团队
├── content/       ← 知识库、文档、资源、周报、字典
├── perm/          ← 角色、权限
├── security/      ← 登录、OAuth、JWT
├── search/        ← 全文搜索
├── chat/          ← AI 聊天
├── aliyun/        ← 阿里云 OSS
├── fileHandle/    ← 文件处理
├── bethune/       ← 巡检(网关 + Feign 调 Python)
├── common/        ← 公共:异常、注解、定时任务、常量
└── thirdparty/    ← 第三方集成

1.3 前端 apis ↔ 后端包 对照

前端 apis 文件 主要后端包 典型页面
manage.ts(1300+ 行) workbench + user + perm Plan.vue、Break.vue、TaskStatistics.vue
inspection.ts bethune + Python reportGroup.vue
serviceOrder.ts workbench ServiceOrderList.vue
weeklyReport.ts content WeeklyReport.vue
resource.ts content Resource.vue
doc.ts content Doc.vue
ai.ts chat AiChat.vue
common.ts common + search Search.vue

按完整项目安排的学习路径

原则:先学通用模式(模式 A),再学特殊模块(巡检模式 B)

总览:6 个阶段,约 14~16 周

阶段 名称 周期 覆盖范围
0 项目全景 + 公共基础 1 周 全部模块地图、登录、ajax 封装
1 Java 通用三层(模式 A) 3 周 Controller / Service / Dao / MyBatis
2 核心业务模块 4 周 服务台 → 组织合同 → 统计报表
3 扩展业务模块 2 周 内容、权限、服务单、消息
4 巡检模块(模式 B) 2~3 周 Java 网关 + Python Flask
5 联调 + 独立交付 2 周 完整需求从 Vue 写到后端

阶段 0:项目全景(第 1 周)

目标: 建立完整地图,跟通 2 条链路(1 条 Java 纯后端 + 1 条了解巡检)。

主题 内容
Day 1 项目全景 前后端目录、14 个后端包、9 个 apis 文件
Day 2 公共基础 登录流程、ajax 封装、统一返回格式、权限
Day 3 模式 A 链路 跟完「计划列表」:Plan.vue → PlanController → PlanDao
Day 4 模式 A 链路 跟完「故障列表」:Break.vue → FaultController
Day 5 模式 B 了解 了解巡检调用链,不深究 Python
Day 6~7 整理 绘制个人项目地图笔记、模块对照表

阶段 1:Java 通用能力(第 2~4 周)

目标: 掌握模式 A,能改任意 Java 纯后端接口。

主题 参考模块 实践
2 注解 + 三层 PlanController 读懂 CRUD 全流程
3 MyBatis + 分页 PlanDao、FaultDao 加一个查询条件
4 权限 + 文件 + 定时 @PreAuthorize、OSS、Cron 理解权限注解

这一阶段完全不碰 Python。


阶段 2:核心业务模块(第 5~8 周)

按业务域逐个突破,每个模块:前端 pages → apis → Controller → Service → Dao

业务域 前端目录 后端包 关键 Controller
5 服务台 SR views/sr/ workbench PlanController、FaultController、ConsultController
6 组织与合同 views/organization/ user + workbench ServiceContractController、CompanyController
7 统计与报表 views/manage/(统计类) workbench StatisticsController、TaskStatistics
8 工时与服务团队 views/manage/(工时类) workbench + user ManHour 相关、ServiceTeamController

阶段 3:扩展模块(第 9~10 周)

业务域 前端 后端
9 内容 + 资源 knowledge/、resource/ content/*Controller
10 权限 + 服务单 + 消息 permission/、ServiceOrder* perm/、ServiceOrderController、MessageController

阶段 4:巡检模块(第 11~13 周)

放到这里学,此时 Java 基础已扎实,Feign 只是多一层转发。

内容
11 巡检 Java 层:上传、报告 CRUD、BethuneAnalysisController
12 Python Flask:group_preview、overview、view 模块
13 前后端联调:reportGroup.vue 完整链路 + 改一个 view

阶段 5:独立交付(第 14~16 周)

选 2~3 个真实需求,从 Vue 写到 Java(必要时 Python),独立交付。

相关推荐
南一Nanyi1 小时前
性能优化的方法论
前端·性能优化
KWTXX1 小时前
vibe coding-提示词
java·前端·算法
零度晚风1 小时前
前端代码:Monorepo × Harness Engineering
前端
rime_neko1 小时前
js学习笔记
开发语言·前端·javascript
我是小趴菜1 小时前
纯前端生成海报下载方案
前端·vue.js
丑过三八线1 小时前
npm 私有仓库找不到包的解决方案
前端·npm·node.js
lichenyang4532 小时前
鸿蒙 ArkTS 电商 Demo 闭环复盘:商品列表 → 详情加购 → 全局购物车持久化
前端
甲维斯2 小时前
Opus4.8 才是真的夯爆了!实测 9个例子表现出众!
前端·人工智能