|
|
|
|
@ -4,7 +4,7 @@
|
|
|
|
|
本文件聚焦“写代码时需要的架构与模块提示信息”,不包含 Git 流程、编译或测试命令。
|
|
|
|
|
|
|
|
|
|
## 系统架构总览
|
|
|
|
|
- 工程形态:Maven 多模块单体应用,前后端分离(`ruoyi-ui` + Spring Boot 后端)。
|
|
|
|
|
- 工程形态:Maven 多模块单体应用,前后端分离(管理端 `ruoyi-ui` + 官网前端 `portal_website` + Spring Boot 后端)。
|
|
|
|
|
- 模块分层:
|
|
|
|
|
- `ruoyi-admin`:应用入口、Controller 暴露层。
|
|
|
|
|
- `ruoyi-framework`:安全认证、AOP、拦截器、数据权限与限流实现层。
|
|
|
|
|
@ -12,8 +12,125 @@
|
|
|
|
|
- `ruoyi-common`:跨模块基础设施与通用契约层。
|
|
|
|
|
- `ruoyi-quartz`:任务调度能力层。
|
|
|
|
|
- `ruoyi-generator`:代码生成能力层。
|
|
|
|
|
- `ruoyi-portal`:官网内容与菜单相关后端业务模块(`/portal/**`)。
|
|
|
|
|
- `portal_website`:官网展示前端(Vue2 + Element UI + 菜单/JSON 驱动页面引擎)。
|
|
|
|
|
- 关键依赖方向:`admin -> framework -> system -> common`,`quartz/generator -> common`。
|
|
|
|
|
|
|
|
|
|
## 官网前端 `portal_website` 深度分析(2026-02-28)
|
|
|
|
|
|
|
|
|
|
### 模块定位与边界
|
|
|
|
|
- `portal_website` 是独立官网展示前端,不复用 `ruoyi-ui` 的后台管理逻辑。
|
|
|
|
|
- 主要职责:官网内容展示、产品/方案详情渲染、资料下载、联系信息提交、导航与客服浮窗。
|
|
|
|
|
- 数据来源:后端 `/portal/**` 系列接口(重点是 `hwWebMenu` 菜单树 + `hwWeb/hwWeb1` JSON 页面数据)。
|
|
|
|
|
|
|
|
|
|
### 前端技术栈(来自 `portal_website/package.json`)
|
|
|
|
|
|
|
|
|
|
| 技术 | 版本 | 说明 |
|
|
|
|
|
|---|---:|---|
|
|
|
|
|
| Vue | 2.5.2 | 官网框架基线 |
|
|
|
|
|
| Vue Router | 3.0.1 | 路由管理(history 未开启,默认 hash 模式) |
|
|
|
|
|
| Element UI | 2.15.14 | UI 组件库 |
|
|
|
|
|
| Axios | 1.7.9 | HTTP 请求 |
|
|
|
|
|
| Less | 4.2.0 | 样式预处理 |
|
|
|
|
|
| Swiper | 11.1.15 | 轮播/滑动 |
|
|
|
|
|
| Quill | 2.0.3 | 富文本样式依赖 |
|
|
|
|
|
| AMap JS API Loader | 1.0.1 | 地图加载 |
|
|
|
|
|
| ECharts | 6.0.0 | 图表能力(当前业务页使用较少) |
|
|
|
|
|
| Vue CLI Service | ~5.0.0 | 主构建工具 |
|
|
|
|
|
| Webpack | 3.6.0 | 遗留构建依赖(用于 `dev/dev1` 脚本链路) |
|
|
|
|
|
|
|
|
|
|
### 规模与目录画像(快照统计)
|
|
|
|
|
- 代码规模(`src`):
|
|
|
|
|
- `views`:`32` 文件,约 `4509` 行。
|
|
|
|
|
- `components`:`23` 文件,约 `3093` 行。
|
|
|
|
|
- `api`:`8` 文件,约 `257` 行。
|
|
|
|
|
- `router/utils`:`2` 文件,约 `88` 行。
|
|
|
|
|
- `views` 分域:
|
|
|
|
|
- `index`(首页)`7` 文件。
|
|
|
|
|
- `contactUs`(关于海威)`8` 文件。
|
|
|
|
|
- `serviceSupport`(服务支持)`6` 文件。
|
|
|
|
|
- `productCenter`(产品中心)`3` 文件。
|
|
|
|
|
- `industrySolutions`(行业方案)`1` 文件。
|
|
|
|
|
- `page`(菜单驱动 JSON 页面)`1` 文件。
|
|
|
|
|
- `a`(实验/演示页面)`6` 文件。
|
|
|
|
|
- `components` 分域:
|
|
|
|
|
- `el`(动态区块引擎)`17` 文件(含 `carousel` 与 `el1`~`el16`)。
|
|
|
|
|
- `menu` `2` 文件(当前主要使用 `index.vue`)。
|
|
|
|
|
- `chat` `1` 文件(全局浮窗客服)。
|
|
|
|
|
|
|
|
|
|
### 运行与构建链路
|
|
|
|
|
- 入口:`src/main.js`,注册 `ElementUI`、全局样式,并加载高德地图 SDK。
|
|
|
|
|
- 壳层:`src/layout/index.vue`,包含顶栏菜单、固定浮窗、`<router-view>` 与全局 `Chat`。
|
|
|
|
|
- 路由:`src/router/index.js`,主入口 `/` 下挂各业务页面,另有 `/a` 调试页。
|
|
|
|
|
- 请求层:`src/utils/request.js` 对 Axios 二次封装,统一返回 `res.data`。
|
|
|
|
|
- API 层:`src/api/*.js` 以业务域拆分,统一走 `request`。
|
|
|
|
|
|
|
|
|
|
### 路由与页面职责(当前实现)
|
|
|
|
|
- `/index`:首页聚合(轮播、典型案例、产品中心、联系区块)。
|
|
|
|
|
- `/productCenter`:产品聚合页(顶部 banner + 一级产品 tab)。
|
|
|
|
|
- `/productCenter/detail`:基于 JSON 区块(`el1`~`el16`)动态渲染产品详情。
|
|
|
|
|
- `/industrySolutions`:方案列表卡片页(跳转 `/test?id=xx`)。
|
|
|
|
|
- `/contactUs`:关于海威聚合页(公司概况/合作伙伴/媒体中心/资质)。
|
|
|
|
|
- `/contactUs/MediaCenterDetail`:媒体详情静态内容页。
|
|
|
|
|
- `/serviceSupport`:服务支持聚合(售前/问答/下载等模块,当前启用较少)。
|
|
|
|
|
- `/test`:菜单驱动动态页渲染(`getHwWeb(id)`)。
|
|
|
|
|
- `/a`:实验性质页面,不属于官网核心链路。
|
|
|
|
|
|
|
|
|
|
### 核心机制:菜单树 + JSON 区块渲染
|
|
|
|
|
- 顶部导航来源:`selectMenuTree()`,`webMenuId` 驱动路由跳转。
|
|
|
|
|
- 动态页面来源:
|
|
|
|
|
- `/test` 页面:`getHwWeb(id)` 读取 `webJsonString`,按 `type` 映射到 `components/el/*`。
|
|
|
|
|
- 产品详情页:`listHwWeb1({ webCode, typeId, deviceId })` 读取 JSON 同样映射区块。
|
|
|
|
|
- 区块映射:`type === 1..16` -> `el1..el16`;`type === 'carousel'` -> `components/el/carousel.vue`。
|
|
|
|
|
|
|
|
|
|
### `components/el` 数据契约(高频)
|
|
|
|
|
- 通用字段:大量区块约定 `title/subTitle/list/icon/value`。
|
|
|
|
|
- 典型结构:
|
|
|
|
|
- `el1/el3/el7/el11`:图标 + 文本列表。
|
|
|
|
|
- `el2/el4`:左右分栏图文。
|
|
|
|
|
- `el5/el6/el10`:大图/图集展示。
|
|
|
|
|
- `el8`:Tab + 左侧主图 + 右侧参数列表。
|
|
|
|
|
- `el12`:产品图册 + 特点列表。
|
|
|
|
|
- `el13/el16`:参数表(支持 `columns/rows`,含合并行策略)。
|
|
|
|
|
- `el14`:资料下载(含密钥弹窗与 `getSecureDocumentAddress`)。
|
|
|
|
|
- `el15`:Banner 双图文。
|
|
|
|
|
- 新增区块类型时,需同步修改:
|
|
|
|
|
- `src/views/page/index.vue`
|
|
|
|
|
- `src/views/productCenter/detail.vue`
|
|
|
|
|
- `src/components/el/` 新增实现文件
|
|
|
|
|
|
|
|
|
|
### API 域与后端契约
|
|
|
|
|
- 门户聚合接口:`/portal/portal/*`(首页、案例、联系、关于等)。
|
|
|
|
|
- 菜单接口:`/portal/hwWebMenu/*`(导航树与菜单管理)。
|
|
|
|
|
- JSON 页面接口:`/portal/hwWeb*`(页面区块 JSON 存储与查询)。
|
|
|
|
|
- 资料接口:`/portal/hwWebDocument/*`(文档列表、密钥校验、下载地址)。
|
|
|
|
|
- 当前前端调用以 `request.js` 为唯一入口,业务层不要直接使用裸 `axios`。
|
|
|
|
|
|
|
|
|
|
### 样式与组件组织约定
|
|
|
|
|
- 全局变量:`src/style.less`(当前维护 `@top-height/@standard-color`)。
|
|
|
|
|
- 页面样式单位以 `vw` 为主,倾向 PC 大屏视觉;`scoped + /deep/` 覆盖 Element UI。
|
|
|
|
|
- 复用组件优先放 `src/components`;业务拼装放 `src/views/<domain>`。
|
|
|
|
|
- 图片资源优先走接口返回 URL;本地 `assets` 用于 logo、兜底图、静态素材。
|
|
|
|
|
|
|
|
|
|
### 已识别实现特征与风险(修改前先知晓)
|
|
|
|
|
- 环境变量与请求基址存在双轨:
|
|
|
|
|
- `.env.development` 配置 `VUE_APP_BASE_API=/dev-api`,但 `request.js` 固定 `baseURL='/prod-api'`。
|
|
|
|
|
- `vue.config.js` 仅代理 `/dev-api`,本地联调时需先确认实际代理链路。
|
|
|
|
|
- 路由中 `index` 子路由定义重复一次;修改路由时需先清理重复配置再扩展。
|
|
|
|
|
- 菜单跳转强依赖硬编码 `webMenuId`(如 `1/2/4/7/24`);后台菜单 ID 变化会影响导航。
|
|
|
|
|
- 页面中存在较多静态兜底数据与占位实现(特别是 `serviceSupport` 与部分 `contactUs` 子页),新增接口时优先替换静态块而非叠加分支。
|
|
|
|
|
- `main.js` 中高德 `key/securityJsCode` 为明文硬编码,后续建议迁移到环境变量。
|
|
|
|
|
|
|
|
|
|
### 写官网前端代码时的实用提示(聚焦 `portal_website`)
|
|
|
|
|
- 新增官网内容优先走“菜单树 + JSON 区块”机制,避免继续堆叠 hardcode 页面。
|
|
|
|
|
- 需要可复用展示块时,优先扩展 `components/el`,并保持 `data` 契约稳定。
|
|
|
|
|
- API 返回统一按 `res.code/res.data/res.rows` 结构处理,避免页面层自行兼容多形态。
|
|
|
|
|
- 处理路由参数时复用既有约定:`id`(菜单/设备)、`type`(产品线)、`typeId`(子分类)。
|
|
|
|
|
- 导航相关改造需同时验证:
|
|
|
|
|
- `components/menu/index.vue` 的 `toLink` 映射。
|
|
|
|
|
- `views/productCenter/index.vue` 与 `views/contactUs/index.vue` 的 query 解析。
|
|
|
|
|
- 动态页 `views/page/index.vue` 与详情页 `views/productCenter/detail.vue` 的 JSON 加载逻辑。
|
|
|
|
|
|
|
|
|
|
## Backend Tech Stack (With Versions)
|
|
|
|
|
版本来源:根 `pom.xml` 的 `properties` 与 `dependencyManagement`。
|
|
|
|
|
|
|
|
|
|
|