---
description: Vue 2 前端代码、样式、请求、路由、状态和图表规范
alwaysApply: true
---

# Frontend Rules

- 前端使用 Vue 2.6、Vue Router 3、Vuex 3、Vue CLI 5、Element UI、SCSS；新增代码保持 Options API 写法。
- `.vue` 文件保持现有 `template/script/style` 结构；字符串和 import 风格跟随当前文件，不进行无关格式化。
- API 调用优先放入 `src/api/*.js` 并通过 `@/utils/request`；若所在旧模块已直接使用 `axios`，只做局部兼容修改。
- 请求必须兼容 `src/utils/request.js` 的 token、`code === 200`、文件流和错误提示处理方式。
- 路由遵循 `src/router/index.js` 的动态导入和环境变量切换方式；不要破坏 `/home` 子路由和 `resetRouter`。
- Vuex 修改应放在 `src/store/` 对应模块，保持 sessionStorage 持久化路径和已有命名空间约定。
- 样式优先使用 SCSS、已有主题变量和 `html[data-theme="..."]`；不要随意引入新的 UI 库或全局 CSS 框架。
- 新增主题须遵守 `.cursor/rules/theme-rules.mdc`：只增新主题文件与对应选择器，不得改动已有主题（尤其 `tech-blue`）样式。
- 驾驶舱相关样式集中维护 `src/views/admin/cockpitManage/cockpit-dashboard.scss`，该文件为全局主题样式，不能改为 scoped。
- ECharts、Plotly、OpenLayers 功能应复用已有组件、mixin 和配置文件；组件销毁/路由返回时注意清理实例、监听器和定时器。
- 新增交互必须保持 Element UI 体验一致，并兼容现有权限指令 `v-hasPermi`、主题和环境变量。