# 仓库管理操作端

## 项目简介
仓库管理操作端是一个基于Vue 3构建的现代化仓库管理系统前端界面，提供钥匙管理、巡检管理、车辆管理、环境监控等多项功能，采用空军蓝主题设计，结合3D地图展示，实现直观高效的仓库管理体验。

## 项目更新记录
请查看[项目更新日志](UpdateLog.md)了解详细的项目更新历史。

## 技术栈
- **前端框架**: Vue 3.4.21
- **构建工具**: Vite 5.2.0
- **UI组件库**: Element Plus 2.7.0
- **路由管理**: Vue Router 4.3.0
- **状态管理**: Pinia 2.1.7
- **样式框架**: Tailwind CSS 3.4.3
- **HTTP客户端**: Axios 1.6.8
- **图标库**: Element Plus Icons Vue 2.3.2

## 项目结构
```
├── src/
│   ├── App.vue                 # 应用入口组件
│   ├── assets/                 # 静态资源
│   ├── components/             # 公共组件
│   ├── config/                 # 配置文件
│   ├── hooks/                  # 自定义hooks
│   ├── main.js                 # 应用入口文件
│   ├── router/                 # 路由配置
│   ├── stores/                 # 状态管理
│   └── views/                  # 页面组件
├── public/                     # 静态资源
├── vite.config.js              # Vite配置
├── tailwind.config.js          # Tailwind CSS配置
└── package.json                # 项目依赖
```

## 已实现功能
- **项目基础框架**: 搭建完整的Vue 3应用结构
- **登录模块**: 实现用户登录功能
- **钥匙管理**: 开发钥匙柜及钥匙状态展示功能
- **地图功能**: 集成地图展示和监控组件
- **布局组件**: 创建统一的应用布局框架，包含侧边栏、顶栏和内容区域
- **配置管理**: 完成项目配置文件设置

## 未来规划功能
在第一个大版本中计划实现以下功能模块：

### 1. 钥匙管理
- **钥匙信息管理**: 管理仓库内所有钥匙的详细信息（已部分实现）
- **钥匙使用申请**: 提供钥匙使用申请流程和审批功能
- **钥匙取用记录**: 记录钥匙的取用和归还历史

### 2. 巡检管理
- **巡检路径管理**: 配置和管理仓库巡检路线
- **巡检排班管理**: 安排巡检人员和巡检时间
- **巡检记录**: 记录和查询巡检结果

### 3. 车辆管理
- **车辆信息管理**: 管理仓库内所有车辆的基本信息
- **车辆使用申请**: 提供车辆使用申请和审批流程
- **车辆出入库记录**: 记录车辆出入库情况
- **车辆出入营区记录**: 记录车辆出入营区的详细信息

### 4. 环境监控
- **环境变量管理**: 监控和管理仓库环境参数（温度、湿度、门禁等）

### 5. 信息管理
- **特情处置预案**: 管理和展示各种特殊情况的处置预案
- **安全提示**: 发布和管理安全提示信息

### 6. 访客管理
- **来访人员管理**: 登记和管理来访人员信息
- **来访车辆管理**: 登记和管理来访车辆信息

### 7. 营区管理
- **岗位职责**: 展示和管理各岗位的职责说明
- **人员区域管理**: 管理人员的活动区域和权限

### 8. 无人机管理
- **无人机管理**: 管理无人机设备和飞行任务

## 界面设计
- **主题风格**: 采用空军蓝为主色调，营造专业、现代的界面风格
- **布局模式**: 侧边栏菜单 + 右侧抽屉式内容区域 + 底层3D地图展示
- **交互体验**: 支持菜单折叠、平滑过渡动画、响应式设计
- **视觉效果**: 运用半透明背景、模糊效果、渐变色彩提升视觉层次感

## 开发指南
### 安装依赖
```bash
npm install
```

### 开发模式
```bash
npm run dev
```

### 构建生产版本
```bash
npm run build
```

### 预览生产版本
```bash
npm run preview
```

## 环境配置
- **开发环境**: .env.development
- **生产环境**: .env.production

## 浏览器支持
- Chrome (推荐)
- Firefox
- Safari
- Edge

## License
MIT