# 项目功能总览（表格版）

> 本文档基于现有代码结构与实现，整理平台项目的核心模块、路由、权限、地图配置、API 与全局状态。便于快速理解与维护。

## 项目概览

| 项目项 | 值/位置 | 说明 |
|---|---|---|
| 技术栈 | Vue 3、Vite、Pinia、Vue Router、Element Plus、OpenLayers、SuperMap iClient OL | 前端与地图可视化基础 |
| 运行时配置入口 | `public/config.js` | 运行时覆盖接口与 WebSocket 地址 |
| `VITE_BASE_URL` | `http://10.0.0.58:8080` | Axios `baseURL` 优先读取 `window.APP_CONFIG` |
| `WS_BASE_URL` | `ws://10.0.0.58:8080/collision` | 平台概览页使用的告警/碰撞推送 |

## 启动流程

| 步骤 | 文件 | 关键点 |
|---|---|---|
| 应用入口 | `src/main.js` | 创建应用、注册 `router`、`store(Pinia)`、`plugins`、`ElementPlus`、全局组件与工具 |
| 权限拦截 | `src/permission.js` | 路由守卫：鉴权、动态路由、Tab 切换、首屏重定向 `/platform`、NProgress |
| 路由前缀 | `src/router/index.js` | `createWebHashHistory('/airport')`，路由以 `#/airport` 开头 |

## 路由概览（常量路由）

| 路径 | 名称 | 组件 | 标题 | 备注 |
|---|---|---|---|---|
| `/platform` | PlatformIndex | `@/views/platform/index.vue` | 平台概览 | `affix: true` |
| `/car/index` | CarIndex | `@/views/index.vue` | 车辆管理 | 菜单“车辆管理” |
| `/car/monitor` | CarMonitorIndex | `@/views/car/monitor/index.vue` | 车辆监控 | 一级路由 |
| `/system/index` | SystemIndex | `@/views/index.vue` | 系统管理 | 菜单“系统管理” |
| `/system/user` | User | `@/views/system/user/index.vue` | 用户管理 | 一级路由（人员管理以后台 meta.title 为准） |
| `/system/role` | SystemRoleIndex | `@/views/system/role/index.vue` | 角色管理 | 一级路由 |
| `/system/operlog` | SystemOperlogIndex | `@/views/system/operlog/index.vue` | 操作日志 | 一级路由 |
| `/road/intersection` | Intersection | `@/views/road/intersection/index.vue` | 路口管理 | 路况管理 |
| `/road/intersection/detail/:id` | IntersectionDetail | `@/views/road/intersection/detail.vue` | 路口详情 | 隐藏子路由（详情） |
| `/road/traffic-light` | TrafficLight | `@/views/road/traffic-light/index.vue` | 信号灯管理 | 路况管理 |

## 动态路由（权限驱动）

| 路径 | 权限/角色 | 组件 | 说明 |
|---|---|---|---|
| `/system/user-auth/role/:userId` | `permissions: ['system:user:edit']` | `@/views/system/user/authRole.vue` | 分配角色 |
| `/system/role-auth/user/:roleId` | `permissions: ['system:role:edit']` | `@/views/system/role/authUser.vue` | 分配用户 |
| `/system/dict-data/index/:dictId` | `permissions: ['system:dict:list']` | `@/views/system/dict/data.vue` | 字典数据 |
| `/tool/gen-edit/index/:tableId` | `permissions: ['tool:gen:edit']` | `@/views/tool/gen/editTable.vue` | 生成配置 |

> 注：`src/store/modules/permission.js` 会拉取后端菜单并将字符串组件映射为真实组件，同时在前端兜底注入“路况管理”路由。

## Tab 菜单与侧边栏

| Tab | 展示菜单（以后台 `meta.title` 为准） | 侧边栏 |
|---|---|---|
| `platform` | 无 | 隐藏侧边栏（`useAppStore().toggleSideBarHide(true)`） |
| `car` | 车辆监控、车辆管理 | 只展示对应菜单 |
| `system` | 角色管理、人员管理、操作日志 | 只展示对应菜单 |
| `road` | 路况管理（含子菜单） | 保留“路况管理”及子菜单 |

## 视图模块

| 模块 | 页面 | 主要组件 | 关键功能 |
|---|---|---|---|
| 平台概览 | `@/views/platform/index.vue` | OpenLayersMap、CarAlarm、Eventlist、AlarmNotification、WeatherStationPopup | 告警统计、车辆列表、路口/信号灯图层、气象弹窗、地图交互 |
| 车辆监控 | `@/views/car/monitor/index.vue` | VehicleTable、VehicleCards、VehicleDetail、VehicleMovementControlRefactored | 列表/卡片切换、搜索过滤、详情、远程控制、轨迹回放 |
| 路况管理 | 路口管理/详情/信号灯 | Intersection、IntersectionDetail、TrafficLight | 路口与信号灯的增删改查与统计 |
| 系统管理 | 用户/角色/日志等 | System 子页面 | 完整后台管理套件 |

## 地图配置（OpenLayers + SuperMap）

| 参数 | 值 | 位置 | 说明 |
|---|---|---|---|
| 投影 | `EPSG:4528` | `src/components/map/OpenLayersMap.vue` | `proj4.register` 注册，平面坐标 |
| 底图源 | `TileSuperMapRest` | 同上 | 指向 `http://10.96.3.10:8090/.../QDJC2DZT` |
| `bounds` | `[40502704.7458807, 4019271.0092735, 40514081.829214096, 4030939.1342735]` | 同上 | 地图适配范围 |
| `center` | `[40512494.329214066, 4026228.757190162]` | 同上 | 初始中心点 |
| `rotation` | `-1.26` | 同上 | 约 72° 逆时针 |
| `resolutions` | 自定义数组 | 同上 | 与 `zoom` 索引对应 |
| `minZoom` | `7` | 同上 | 最小缩放索引 |
| `initialZoom` | `8` | 同上 | 初始缩放索引（源码常量定义） |
| `maxZoom` | `resolutions.length - 1` | 同上 | 最大缩放索引 |
| `tileGrid.origin` | `[bounds[0], bounds[3]]` | 同上 | 使用左上角为原点 |
| 视图持久化 | `localStorage.defaultMapView` | 同上 | 支持保存/恢复 `center`/`zoom`/`rotation` |

### 地图控件与能力

| 组件/控件 | 文件 | 功能 |
|---|---|---|
| 缩放/指南针 | `controls/OpenLayersZoomControl.vue` | 缩放、旋转事件响应、重置视图 |
| 地图信息 | `controls/OpenLayersMapInfo.vue` | 显示 XY 与 WGS84 坐标 |
| 比例尺 | `controls/OpenLayersScaleControl.vue` | 动态计算并展示比例尺（米/公里），监听 `moveend` |
| 鹰眼 | 集成 OpenLayers `OverviewMap` | 自定义样式与内部视图，`160×160` |
| 绘制 | `controls/RouteDrawControl.vue` | 点线面/路线绘制、统计面板、清除、导出/导入 `GeoJSON` |

### 告警与统计组件

| 组件 | 文件 | 功能 | 暴露方法 |
|---|---|---|---|
| 告警通知 | `info/AlarmNotification.vue` | 标签页“全部/车辆冲突/越界/超速”，过滤展示告警列表 | `updateAlarmList`、`show`、`hide`、`toggle`、`isVisible` |
| 车辆告警统计 | `info/carClarm.vue` | 在线/离线/故障数量展示 | `updateCounts(online, offline, fault)` |

## API（路况模块）

### 路口（`src/api/road/intersection.js`）

| 名称 | 方法 | URL | 说明 |
|---|---|---|---|
| 列表 | GET | `/traffic-light/intersections/list` | 查询路口列表 |
| 搜索 | GET | `/traffic-light/intersections/search` | 关键字查询 |
| 详情 | GET | `/traffic-light/intersections/{id}` | 获取路口详情 |
| 新增 | POST | `/traffic-light/intersections` | 创建路口 |
| 修改 | PUT | `/traffic-light/intersections/{id}` | 更新路口 |
| 统计 | GET | `/traffic-light/intersections/statistics` | 路口统计数据 |

### 信号灯（`src/api/road/trafficLight.js`）

| 名称 | 方法 | URL | 说明 |
|---|---|---|---|
| 列表 | GET | `/traffic-light/devices/list` | 查询设备列表 |
| 详情 | GET | `/traffic-light/devices/{deviceId}` | 获取设备详情 |
| 新增 | POST | `/traffic-light/devices` | 创建设备 |
| 修改 | PUT | `/traffic-light/devices/{deviceId}` | 更新设备 |
| 删除 | DELETE | `/road/trafficLight/{trafficLightId}` | 删除设备（旧路径，谨慎使用） |
| 状态 | PATCH | `/traffic-light/devices/{deviceId}/status` | 设置设备状态 |
| 可用性 | GET | `/traffic-light/devices/{deviceId}/availability` | 检查设备可用性 |
| 统计 | GET | `/traffic-light/devices/statistics` | 设备统计数据 |
| 搜索 | GET | `/traffic-light/devices/search` | 关键字搜索 |
| 在线列表 | GET | `/traffic-light/devices/online` | 在线设备 |
| 按制造商 | GET | `/traffic-light/devices/manufacturer/{manufacturer}` | 制造商筛选 |
| 按路口 | GET | `/traffic-light/devices/intersection/{intersectionId}` | 路口设备 |
| 路口激活 | GET | `/traffic-light/devices/intersection/{intersectionId}/active` | 路口激活设备 |
| 激活且在线 | GET | `/traffic-light/devices/active-online` | 激活并在线设备 |

## API（系统模块摘要）

| 模块 | 文件 | 能力摘要 |
|---|---|---|
| 用户 | `src/api/system/user.js` | 增删改查、状态/重置密码、头像上传、个人信息、授权角色、部门树、初始密码 |
| 角色 | `src/api/system/role.js` | 增删改查、数据权限、授权/取消授权用户、部门树 |
| 菜单 | `src/api/system/menu.js` | 增删改查、菜单下拉树、角色菜单树 |

## Store（Pinia）

| 模块 | 文件 | 状态 | 关键动作 |
|---|---|---|---|
| `settings` | `src/store/modules/settings.js` | 主题、侧边主题、顶部导航、标签页、固定头、LOGO、动态标题 | `changeSetting`、`setTitle`（调用 `useDynamicTitle`） |
| `permission` | `src/store/modules/permission.js` | 路由/菜单、Tab、侧边栏菜单 | `generateRoutes`、`updateSidebarByTab`、`setAllMenus` |
| `user` | `src/store/modules/user.js` | `token`、`name`、`avatar`、`roles`、`permissions` | `login`、`getInfo`、`logOut` |
| `app` | `src/store/modules/app.js` | 侧边栏开关/隐藏、设备、尺寸 | `toggleSideBar`、`closeSideBar`、`toggleSideBarHide` |

## WebSocket

| 项 | 值/方法 | 说明 |
|---|---|---|
| 运行时地址 | `window.APP_CONFIG.WS_BASE_URL` | `ws://10.0.0.58:8080/collision` |
| 创建 | `createWebSocket(url, options)` | 单例、自动重连（默认 3s 间隔，最多 10 次） |
| 事件 | `on(event, cb)` / `emit(event, ...)` | 订阅与分发消息（`open`/`message`/`error`/`close` 等） |
| 发送 | `send(data)` | 字符串或 JSON 自动处理 |
| 重置 | `resetWebSocketInstance()` | 关闭并清空实例，强制重建 |

---

如需将本表格扩展到更细的字段（例如系统所有菜单、各视图的交互时序与数据字典），请告知范围，我可以继续完善并补充到本文件。