From 533d25a1884835dc3ba0611dc602a2fc64155757 Mon Sep 17 00:00:00 2001 From: LGH <guanghui.luo@foxmail.com> Date: Wed, 26 Mar 2025 15:13:17 +0800 Subject: [PATCH] docs: 规范更新 --- README.md | 134 ++++++++++++++++++++++++++++++++++++++++++-- 1 files changed, 128 insertions(+), 6 deletions(-) diff --git a/README.md b/README.md index 501c828..cc5cbf3 100644 --- a/README.md +++ b/README.md @@ -1,7 +1,129 @@ -### node 18.0.0 以上 -### 安装依赖 npm install -### 启动 npm run dev -### 打包 npm run build -### 打包正式 npm run build:prod -### 组件或页面全部大写开头驼峰命名 + + + +# 指挥调度平台（大屏） + +## 项目简介 + +本项目基于 **Vue 3** 开发，依赖 **Node.js 18 以上** 版本，并集成 **Cesium** 进行三维地图渲染。项目采用 **企业版 Blandx 前端框架** 进行二次开发，并使用 **rem** 进行响应式适配，以确保在不同设备上的良好体验。 + +## 环境要求 + +- **Node.js**：18 及以上 +- **Vue 版本**：Vue 3 +- **依赖管理**： `yarn` +- **Cesium**：用于三维地图可视化 + +## 项目启动 + +### 1. 克隆仓库 + +```sh +git clone git://139.196.74.78/drone/command-center-dashboard.git +cd command-center-dashboard +``` + +### 2. 安装依赖 + +```sh +yarn install +``` + +### 3. 运行开发环境 + +```sh +yarn dev +``` + +### 4. 构建项目 + +```sh +yarn build +``` + +## 目录结构 + +```bash +├── 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 # 首页底部链接组件 + ``` \ No newline at end of file -- Gitblit v1.9.3