指挥调度平台（大屏）

项目简介

本项目基于 Vue 3 开发，依赖 Node.js 18 以上 版本，并集成 Cesium 进行三维地图渲染。项目采用 企业版 Blandx 前端框架 进行二次开发，并使用 rem 进行响应式适配，以确保在不同设备上的良好体验。

环境要求

Node.js：18 及以上
Vue 版本：Vue 3
依赖管理： yarn
Cesium：用于三维地图可视化

项目启动

1. 克隆仓库

git clone git://139.196.74.78/drone/command-center-dashboard.git
cd command-center-dashboard

2. 安装依赖

yarn install

3. 运行开发环境

yarn dev

4. 构建项目

yarn build

目录结构

├── public             # 静态资源目录
├── src                # 源代码目录
│   ├── assets        # 资源文件
│   ├── components    # 组件
│   ├── views         # 视图页面
│   ├── router        # 路由配置
│   ├── store         # Vuex 状态管理
│   ├── main.js       # 入口文件
│   ├── App.vue       # 根组件
├── package.json       # 依赖管理
├── vite.config.mjs      # Vue 配置文件
├── README.md          # 项目说明

主要技术栈

Vue 3：前端框架
Vue Router：前端路由管理
Vuex：状态管理
Cesium：三维地图可视化
Axios：HTTP 请求库
Element UI Plus：UI 组件库

Git提交前缀

feat+英文冒号+空格+xxxxx

类型	说明	示例
feat	新增功能	feat: 添加用户登录功能
fix	修复 bug	fix: 修复登录页面样式问题
docs	文档更新	docs: 更新 README 文件
style	代码格式化（不影响代码逻辑）	style: 格式化代码
refactor	代码重构（不影响代码功能）	refactor: 重构用户管理模块
perf	性能优化	perf: 优化数据加载速度
test	添加或修改测试	test: 添加单元测试
chore	构建过程或辅助工具的变动	chore: 更新依赖包
ci	持续集成相关配置更改	ci: 配置 GitHub Actions
revert	撤销之前的提交	revert: 撤销上次提交

目录结构与命名规则

项目采用 大写开头的驼峰命名（PascalCase） 方式，以保持统一性和可读性。

1️⃣ 公共组件（`components/`）

存放全局复用的组件
命名方式：PascalCase.vue
示例：

components/ ├── Button.vue ├── Modal.vue ├── Table.vue

2️⃣ 页面组件（按页面分类存放）

每个页面独立文件夹，内部组件放在子文件夹
页面文件夹名：PascalCase
页面组件命名：与文件夹名一致
子组件按作用命名，保持层级清晰
示例：

bash复制编辑pages/ ├── Home/ │ ├── Home.vue # 首页主组件 │ ├── HomeTop.vue # 首页顶部组件 │ ├── HomeBottom/ │ │ ├── HomeBottom.vue # 首页底部主组件 │ │ ├── HomeBottomLink.vue # 首页底部链接组件