Initial commit
This commit is contained in:
268
OTHER_EQUIPMENT_DATA_STORAGE.md
Normal file
268
OTHER_EQUIPMENT_DATA_STORAGE.md
Normal file
@@ -0,0 +1,268 @@
|
||||
# 其他装备列表数据存储结构详解
|
||||
|
||||
## 📊 **存储概览**
|
||||
|
||||
其他装备列表的数据采用**双重存储机制**：
|
||||
- **内存存储**: Vue3响应式数组 `otherEquipmentList.value`
|
||||
- **持久化存储**: 浏览器localStorage `"index-otherEquipmentList"`
|
||||
|
||||
## 🗂️ **数据结构定义**
|
||||
|
||||
### **1. Vue响应式变量**
|
||||
```javascript
|
||||
// 定义位置：homeShow/index.vue 第1536行
|
||||
const otherEquipmentList = ref([]); // 设备列表数组
|
||||
const otherEquipmentCount = computed(() => {
|
||||
return otherEquipmentList.value.filter(
|
||||
item => item.online_status === true
|
||||
).length;
|
||||
}); // 在线设备计数
|
||||
```
|
||||
|
||||
### **2. localStorage存储键**
|
||||
```javascript
|
||||
// 存储键名
|
||||
const STORAGE_KEY = "index-otherEquipmentList";
|
||||
|
||||
// 存储操作
|
||||
localStorage.setItem(STORAGE_KEY, JSON.stringify(otherEquipmentList.value));
|
||||
localStorage.getItem(STORAGE_KEY); // 获取数据
|
||||
```
|
||||
|
||||
## 📋 **设备对象数据结构**
|
||||
|
||||
### **通用其他装备数据格式**
|
||||
```javascript
|
||||
{
|
||||
// === 基础标识信息 ===
|
||||
equipmentId: "OTHER_001", // 设备唯一ID
|
||||
equipmentType: "电子干扰设备", // 设备类型
|
||||
category: "电子战", // 设备分类
|
||||
|
||||
// === 状态信息 ===
|
||||
status: "正常", // 设备状态
|
||||
online_status: true, // 在线状态 (boolean)
|
||||
maintenanceStatus: "良好", // 维护状态
|
||||
|
||||
// === 功能参数 ===
|
||||
function: "信号干扰", // 主要功能
|
||||
range: 15, // 作用范围 (km)
|
||||
operationTime: 8.5, // 运行时间 (小时)
|
||||
|
||||
// === 位置信息 ===
|
||||
latitude: 39.9042, // 纬度
|
||||
longitude: 116.4074, // 经度
|
||||
altitude: 0, // 高度 (仅QB303设备有)
|
||||
|
||||
// === 时间戳 ===
|
||||
lastUpdateTime: 1757292674555 // 最后更新时间
|
||||
}
|
||||
```
|
||||
|
||||
### **QB303设备专用数据格式**
|
||||
```javascript
|
||||
{
|
||||
// === 基础信息 ===
|
||||
equipmentId: "dy04", // 使用battle_unit_code作为ID
|
||||
equipmentType: "QB303设备",
|
||||
category: "平台设备", // 根据platform_type映射
|
||||
|
||||
// === QB303特有标识 ===
|
||||
battleUnitCode: "dy04", // 作战单元代码 (主键)
|
||||
sn: "2", // 原始序列号
|
||||
sid: "2", // 原始设备ID
|
||||
|
||||
// === 状态信息 ===
|
||||
status: "正常", // 根据health_status映射
|
||||
online_status: true, // 基于health_status
|
||||
maintenanceStatus: "正常",
|
||||
|
||||
// === 功能信息 ===
|
||||
function: "QB303平台设备",
|
||||
range: "N/A",
|
||||
operationTime: 60, // 计算得出 (分钟)
|
||||
|
||||
// === 位置和运动信息 ===
|
||||
latitude: 28.20648476190476,
|
||||
longitude: 112.8945530952381,
|
||||
altitude: 200, // QB303独有
|
||||
|
||||
// === 运动数据 (QB303独有) ===
|
||||
velocity: 0, // 总速度
|
||||
velocity_x: 0.10144216567277908, // X轴速度
|
||||
velocity_y: -0.0755225121974945, // Y轴速度
|
||||
velocity_z: 0.050013765692710876, // Z轴速度
|
||||
|
||||
// === 姿态数据 (QB303独有) ===
|
||||
roll: -1.02637914332358, // 横滚角
|
||||
pitch: 2.0691601321652815, // 俯仰角
|
||||
yaw: 0, // 偏航角
|
||||
|
||||
// === 时间信息 ===
|
||||
reportTime: 1757150761138, // 设备上报时间
|
||||
lastUpdateTime: 1757295666670 // 系统更新时间
|
||||
}
|
||||
```
|
||||
|
||||
## 💾 **数据持久化机制**
|
||||
|
||||
### **1. 初始化加载**
|
||||
```javascript
|
||||
// 位置：第1537-1556行
|
||||
const otherEquipmentInit = async () => {
|
||||
const localData = localStorage.getItem("index-otherEquipmentList");
|
||||
|
||||
if (localData) {
|
||||
try {
|
||||
const savedEquipment = JSON.parse(localData);
|
||||
otherEquipmentList.value = savedEquipment;
|
||||
otherEquipmentCount.value = savedEquipment.length;
|
||||
} catch (error) {
|
||||
console.error('解析本地数据失败:', error);
|
||||
}
|
||||
} else {
|
||||
otherEquipmentList.value = [];
|
||||
otherEquipmentCount.value = 0;
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
### **2. 数据保存时机**
|
||||
数据会在以下情况自动保存到localStorage：
|
||||
|
||||
1. **WebSocket接收新数据时**
|
||||
2. **设备信息更新时**
|
||||
3. **手动编辑设备信息时**
|
||||
4. **测试数据添加时**
|
||||
|
||||
```javascript
|
||||
// 保存代码模式
|
||||
localStorage.setItem("index-otherEquipmentList", JSON.stringify(otherEquipmentList.value));
|
||||
```
|
||||
|
||||
## 📱 **数据实例示例**
|
||||
|
||||
### **实际存储的数据结构 (localStorage)**
|
||||
```json
|
||||
[
|
||||
{
|
||||
"equipmentId": "OTHER_001",
|
||||
"equipmentType": "电子干扰设备",
|
||||
"category": "电子战",
|
||||
"status": "正常",
|
||||
"function": "信号干扰",
|
||||
"range": 15,
|
||||
"operationTime": 8.5,
|
||||
"maintenanceStatus": "良好",
|
||||
"online_status": true,
|
||||
"latitude": 39.9042,
|
||||
"longitude": 116.4074,
|
||||
"lastUpdateTime": 1757292674555
|
||||
},
|
||||
{
|
||||
"equipmentId": "dy04",
|
||||
"equipmentType": "QB303设备",
|
||||
"category": "平台设备",
|
||||
"status": "正常",
|
||||
"function": "QB303平台设备",
|
||||
"range": "N/A",
|
||||
"operationTime": 60,
|
||||
"maintenanceStatus": "正常",
|
||||
"online_status": true,
|
||||
"latitude": 28.20648476190476,
|
||||
"longitude": 112.8945530952381,
|
||||
"altitude": 200,
|
||||
"velocity": 0,
|
||||
"velocity_x": 0.10144216567277908,
|
||||
"velocity_y": -0.0755225121974945,
|
||||
"velocity_z": 0.050013765692710876,
|
||||
"roll": -1.02637914332358,
|
||||
"pitch": 2.0691601321652815,
|
||||
"yaw": 0,
|
||||
"battleUnitCode": "dy04",
|
||||
"sn": "2",
|
||||
"sid": "2",
|
||||
"reportTime": 1757150761138,
|
||||
"lastUpdateTime": 1757295666670
|
||||
}
|
||||
]
|
||||
```
|
||||
|
||||
## 🔧 **数据操作接口**
|
||||
|
||||
### **查看当前数据**
|
||||
```javascript
|
||||
// 1. 查看内存中的数据
|
||||
console.log('内存数据:', otherEquipmentList.value);
|
||||
console.log('设备总数:', otherEquipmentList.value.length);
|
||||
console.log('在线设备数:', otherEquipmentCount.value);
|
||||
|
||||
// 2. 查看localStorage中的数据
|
||||
const storedData = localStorage.getItem("index-otherEquipmentList");
|
||||
console.log('存储数据:', JSON.parse(storedData));
|
||||
|
||||
// 3. 查看特定设备
|
||||
const device = otherEquipmentList.value.find(d => d.equipmentId === 'dy04');
|
||||
console.log('QB303设备 dy04:', device);
|
||||
```
|
||||
|
||||
### **数据操作功能**
|
||||
```javascript
|
||||
// 1. 清空所有数据
|
||||
localStorage.removeItem("index-otherEquipmentList");
|
||||
otherEquipmentList.value = [];
|
||||
|
||||
// 2. 添加测试数据
|
||||
testQB303Data(); // 添加单个QB303设备
|
||||
testMultipleQB303Data(); // 添加多个QB303设备
|
||||
|
||||
// 3. 手动编辑设备信息
|
||||
// 通过UI界面的编辑功能进行
|
||||
|
||||
// 4. 导出数据
|
||||
const exportData = JSON.stringify(otherEquipmentList.value, null, 2);
|
||||
console.log('导出数据:', exportData);
|
||||
```
|
||||
|
||||
## 🎯 **数据字段映射关系**
|
||||
|
||||
### **QB303数据映射**
|
||||
| WebSocket字段 | 存储字段 | 说明 |
|
||||
|-------------|----------|------|
|
||||
| `data.host.battle_unit_code` | `equipmentId` | 设备主键 |
|
||||
| `data.host.battle_unit_code` | `battleUnitCode` | 作战单元代码 |
|
||||
| `data.sn` | `sn` | 原始序列号 |
|
||||
| `data.host.sid` | `sid` | 原始设备ID |
|
||||
| `data.host.platform_type` | `category` | 设备分类 (1→"平台设备") |
|
||||
| `data.host.health_status` | `status` | 设备状态 (1→"正常") |
|
||||
| `data.host.latitude` | `latitude` | 纬度 |
|
||||
| `data.host.longitude` | `longitude` | 经度 |
|
||||
| `data.host.altitude` | `altitude` | 高度 |
|
||||
| `data.host.velocity` | `velocity` | 速度 |
|
||||
| `data.host.report_time` | `reportTime` | 上报时间 |
|
||||
|
||||
### **通用装备数据映射**
|
||||
| WebSocket字段 | 存储字段 | 说明 |
|
||||
|-------------|----------|------|
|
||||
| `data.equipment_id` | `equipmentId` | 设备ID |
|
||||
| `data.equipment_type` | `equipmentType` | 设备类型 |
|
||||
| `data.category` | `category` | 设备分类 |
|
||||
| `data.online_status` | `online_status` | 在线状态 |
|
||||
| `data.latitude` | `latitude` | 纬度 |
|
||||
| `data.longitude` | `longitude` | 经度 |
|
||||
|
||||
## 🔍 **数据调试方法**
|
||||
|
||||
### **快速检查数据状态**
|
||||
```javascript
|
||||
// 在浏览器控制台运行
|
||||
console.table(otherEquipmentList.value.map(d => ({
|
||||
ID: d.equipmentId,
|
||||
类型: d.equipmentType,
|
||||
状态: d.status,
|
||||
在线: d.online_status ? '是' : '否',
|
||||
位置: `${d.latitude}, ${d.longitude}`
|
||||
})));
|
||||
```
|
||||
|
||||
这就是您的其他装备列表数据存储的完整结构！数据既保存在内存中供实时操作，也持久化到localStorage中确保页面刷新后数据不丢失。
|
||||
Reference in New Issue
Block a user