| | |
|---|
| | | |
|---|
| | | 本项目基于 **Vue 3** 开发，依赖 **Node.js 18 以上** 版本，并集成 **Cesium** 进行三维地图渲染。项目采用 **企业版 Blandx 前端框架** 进行二次开发，并使用 **rem** 进行响应式适配，以确保在不同设备上的良好体验。 |
|---|
| | | |
|---|
| | | ## 环境要求 |
|---|
| | | |
|---|
| | | - **Node.js**：18 及以上 |
|---|
| | | - **Vue 版本**：Vue 3 |
|---|
| | | - **依赖管理**： pnpm |
|---|
| | | - **Cesium**：用于三维地图可视化 |
|---|
| | | |
|---|
| | | ## 项目启动 |
|---|
| | | |
|---|
| | | ### 1. 克隆仓库 |
|---|
| | | |
|---|
| | | ```sh |
|---|
| | | git clone git://139.196.74.78/drone/command-center-dashboard.git |
|---|
| | | cd command-center-dashboard |
|---|
| | | ``` |
|---|
| | | |
|---|
| | | ### 2. 安装依赖 |
|---|
| | | |
|---|
| | | ```sh |
|---|
| | | pnpm install |
|---|
| | | ``` |
|---|
| | | |
|---|
| | | ### 3. 运行开发环境 |
|---|
| | | |
|---|
| | | ```sh |
|---|
| | | pnpm dev |
|---|
| | | ``` |
|---|
| | | |
|---|
| | | ### 4. 构建项目 |
|---|
| | | |
|---|
| | | ```sh |
|---|
| | | pnpm build |
|---|
| | | ``` |
|---|
| | | |
|---|
| | | ## 目录结构 |
|---|
| | | |
|---|
| | | ```bash |
|---|
| | | ├── public # 静态资源目录 |
|---|
| | | ├── src # 源代码目录 |
|---|
| | | │ ├── assets # 资源文件 |
|---|
| | | │ ├── components # 组件 |
|---|
| | | │ ├── views # 视图页面 |
|---|
| | | │ ├── router # 路由配置 |
|---|
| | | │ ├── store # Vuex 状态管理 |
|---|
| | | │ ├── main.js # 入口文件 |
|---|
| | | │ ├── App.vue # 根组件 |
|---|
| | | ├── package.json # 依赖管理 |
|---|
| | | ├── vite.config.mjs # Vue 配置文件 |
|---|
| | | ├── README.md # 项目说明 |
|---|
| | | ``` |
|---|
| | | |
|---|
| | | ## 主要技术栈 |
|---|
| | | |
|---|
| | | - **Vue 3**：前端框架 |
|---|
| | |
|---|
| | | - **Axios**：HTTP 请求库 |
|---|
| | | - **Element UI Plus**：UI 组件库 |
|---|
| | | |
|---|
| | | ## 项目启动 |
|---|
| | | |
|---|
| | | 1. 克隆仓库 |
|---|
| | | git clone git://139.196.74.78/drone/command-center-dashboard.git |
|---|
| | | cd command-center-dashboard |
|---|
| | | |
|---|
| | | 2. 安装依赖 |
|---|
| | | pnpm install |
|---|
| | | |
|---|
| | | 3. 运行开发环境 |
|---|
| | | |
|---|
| | | pnpm dev |
|---|
| | | |
|---|
| | | 4. 构建项目 |
|---|
| | | |
|---|
| | | pnpm build:dev 或 pnpm build:prod |
|---|
| | | |
|---|
| | | ## Git提交前缀 |
|---|
| | | |
|---|
| | | feat+英文冒号+空格+xxxxx |
|---|
| | | **feat+英文冒号+空格+xxxxx** |
|---|
| | | |
|---|
| | | | 类型 | 说明 | 示例 | |
|---|
| | | | -------- | ---------------------------- | -------------------------- | |
|---|
| | |
|---|
| | | | docs | 文档更新 | docs: 更新 README 文件 | |
|---|
| | | | style | 代码格式化（不影响代码逻辑） | style: 格式化代码 | |
|---|
| | | | refactor | 代码重构（不影响代码功能） | refactor: 重构用户管理模块 | |
|---|
| | | | revert | 撤销之前的提交 | revert: 撤销上次提交 | |
|---|
| | | | chore | 构建过程或辅助工具的变动 | chore: 更新依赖包 | |
|---|
| | | | perf | 性能优化 | perf: 优化数据加载速度 | |
|---|
| | | | test | 添加或修改测试 | test: 添加单元测试 | |
|---|
| | | | chore | 构建过程或辅助工具的变动 | chore: 更新依赖包 | |
|---|
| | | | ci | 持续集成相关配置更改 | ci: 配置 GitHub Actions | |
|---|
| | | | revert | 撤销之前的提交 | revert: 撤销上次提交 | |
|---|
| | | |
|---|
| | | ## 目录结构与命名规则 |
|---|
| | | |
|---|
| | | 项目采用 **大写开头的驼峰命名（PascalCase）** 方式，以保持统一性和可读性。 |
|---|
| | | |
|---|
| | | #### **1️⃣ 公共组件**（`components/`） |
|---|
| | | #### **📌 公共组件**（`components/`） |
|---|
| | | |
|---|
| | | - **存放全局复用的组件** |
|---|
| | | |
|---|
| | |
|---|
| | | ├── Table.vue |
|---|
| | | ``` |
|---|
| | | |
|---|
| | | #### **2️⃣ 页面组件**（按页面分类存放） |
|---|
| | | #### **📌 页面组件**（按页面分类存放） |
|---|
| | | |
|---|
| | | - **每个页面独立文件夹，内部组件放在子文件夹** |
|---|
| | | |
|---|
| | |
|---|
| | | |
|---|
| | | 🔹 `size`：可选，设置图标大小，单位 `px`。 |
|---|
| | | |
|---|
| | | 🔹 `size`：可选，设置图标类名。 |
|---|
| | | 🔹 `className`：可选，设置图标类名。 |
|---|
