xiaomubiao-master/OTHER_EQUIPMENT_DATA_STORAGE.md

其他装备列表数据存储结构详解

📊 存储概览

其他装备列表的数据采用双重存储机制：

• 内存存储: Vue3响应式数组 otherEquipmentList.value
• 持久化存储: 浏览器localStorage "index-otherEquipmentList"

🗂️ 数据结构定义

1. Vue响应式变量

// 定义位置：homeShow/index.vue 第1536行
const otherEquipmentList = ref([]);      // 设备列表数组
const otherEquipmentCount = computed(() => {
    return otherEquipmentList.value.filter(
        item => item.online_status === true
    ).length;
}); // 在线设备计数

2. localStorage存储键

// 存储键名
const STORAGE_KEY = "index-otherEquipmentList";

// 存储操作
localStorage.setItem(STORAGE_KEY, JSON.stringify(otherEquipmentList.value));
localStorage.getItem(STORAGE_KEY); // 获取数据

📋 设备对象数据结构

通用其他装备数据格式

{
  // === 基础标识信息 ===
  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设备专用数据格式

{
  // === 基础信息 ===
  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. 初始化加载

// 位置：第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. 测试数据添加时

// 保存代码模式
localStorage.setItem("index-otherEquipmentList", JSON.stringify(otherEquipmentList.value));

📱 数据实例示例

实际存储的数据结构 (localStorage)

[
  {
    "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
  }
]

🔧 数据操作接口

查看当前数据

// 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);

数据操作功能

// 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	经度

🔍 数据调试方法

快速检查数据状态

// 在浏览器控制台运行
console.table(otherEquipmentList.value.map(d => ({
    ID: d.equipmentId,
    类型: d.equipmentType,
    状态: d.status,
    在线: d.online_status ? '是' : '否',
    位置: `${d.latitude}, ${d.longitude}`
})));

这就是您的其他装备列表数据存储的完整结构！数据既保存在内存中供实时操作，也持久化到localStorage中确保页面刷新后数据不丢失。