From 2800fa4f32f3900509cb4d6eefaf2bfaf54efdd7 Mon Sep 17 00:00:00 2001
From: 罗广辉 <guanghui.luo@foxmail.com>
Date: Mon, 21 Apr 2025 18:29:09 +0800
Subject: [PATCH] fix: 天气显示
---
README.md | 146 ++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 145 insertions(+), 1 deletions(-)
diff --git a/README.md b/README.md
index 4e672f6..aeb8b24 100644
--- a/README.md
+++ b/README.md
@@ -1 +1,145 @@
-### node 18.0.0 以上
\ No newline at end of file
+# 指挥调度平台(大屏)
+
+## 项目简介
+
+本项目基于 **Vue 3** 开发,依赖 **Node.js 18 以上** 版本,并集成 **Cesium** 进行三维地图渲染。项目采用 **企业版 Blandx 前端框架** 进行二次开发,并使用 **rem** 进行响应式适配,以确保在不同设备上的良好体验。
+
+## 主要技术栈
+
+- **Vue 3**:前端框架
+- **Vue Router**:前端路由管理
+- **Vuex**:状态管理
+- **Cesium**:三维地图可视化
+- **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 | 新增功能 | feat: 添加用户登录功能 |
+| fix | 修复 bug | fix: 修复登录页面样式问题 |
+| docs | 文档更新 | docs: 更新 README 文件 |
+| style | 代码格式化(不影响代码逻辑) | style: 格式化代码 |
+| refactor | 代码重构(不影响代码功能) | refactor: 重构用户管理模块 |
+| revert | 撤销之前的提交 | revert: 撤销上次提交 |
+| chore | 构建过程或辅助工具的变动 | chore: 更新依赖包 |
+| perf | 性能优化 | perf: 优化数据加载速度 |
+| test | 添加或修改测试 | test: 添加单元测试 |
+| ci | 持续集成相关配置更改 | ci: 配置 GitHub Actions |
+
+## 目录结构与命名规则
+
+项目采用 **大写开头的驼峰命名(PascalCase)** 方式,以保持统一性和可读性。
+
+#### **📌 公共组件**(`components/`)
+
+- **存放全局复用的组件**
+
+- 命名方式:`PascalCase.vue`
+
+- **示例**:
+
+ ```
+ components/
+ ├── Button.vue
+ ├── Modal.vue
+ ├── Table.vue
+ ```
+
+#### **📌 页面组件**(按页面分类存放)
+
+- **每个页面独立文件夹,内部组件放在子文件夹**
+
+- **页面文件夹名:PascalCase**
+
+- **页面组件命名:与文件夹名一致**
+
+- **子组件按作用命名,保持层级清晰**
+
+- **示例**:
+
+ ```
+ pages/
+ ├── Home/
+ │ ├── Home.vue # 首页主组件
+ │ ├── HomeTop.vue # 首页顶部组件
+ │ ├── HomeBottom/
+ │ │ ├── HomeBottom.vue # 首页底部主组件
+ │ │ ├── HomeBottomLink.vue # 首页底部链接组件
+ ```
+
+## **屏幕适配说明**
+
+本项目的适配策略如下:采用 `rem`,使用 `postcss-pxtorem` 插件自动转换。
+
+示例:
+
+```
+<div :style="{ height: pxToRem(50), width: pxToRem(50) }">test</div>
+
+<script>
+import { pxToRem } from '@/utils/rem';
+export default {
+ mounted() {
+ this.style = { height: pxToRem(50), width: pxToRem(50) };
+ },
+};
+</script>
+
+<style scoped lang="scss">
+ height: 100px; // 自动转换为 10rem
+ width: 100px; // 自动转换为10rem
+</style>
+```
+
+
+
+## **SVG 图标使用指南**
+
+本项目使用 **`vite-plugin-svg-icons`** 插件进行 SVG 图标管理,支持按需加载,减少体积,提高渲染效率。
+
+------
+
+### **📌 1. 添加 SVG 图标**
+
+将 **SVG 文件** 拷贝到以下目录:
+
+```
+/src/assets/svg/
+```
+
+例如,将 `user.svg` 放入该目录。
+
+------
+
+### **📌 2. 在组件中使用 SVG 图标**
+
+使用 `SvgIcon` 组件加载 SVG 图标,并支持**自定义颜色和尺寸**:
+
+```
+<SvgIcon name="user" class="userClass" />
+```
+
+ 🔹 `name`:对应 `/src/assets/svg/` 目录下的 SVG 文件名(无需后缀 `.svg`)。
+
+ 🔹 `class`:可选,设置图标类名。
--
Gitblit v1.9.3