xiaomubiao-master/VUEX_MUTATIONS_FIX.md

# Vuex Mutations 修复说明

## 🚨 问题描述
```
[vuex] unknown mutation type: SET_QB303_DEVICE_INFO
```

## 🔧 解决方案

### 1. 添加了缺失的 Vuex Mutations

在 `src/pages/dataGovernanceDashboard/store/index.ts` 中添加了以下mutations：

#### **SET_OTHER_EQUIPMENT_INFO**
```typescript
SET_OTHER_EQUIPMENT_INFO(state, info) {
  if (!state.positionData.otherEquipment[info.equipment_id || info.sn]) {
    state.positionData.otherEquipment[info.equipment_id || info.sn] = {
      longitude: info.longitude || info.position?.lng || 0,
      latitude: info.latitude || info.position?.lat || 0,
      dock_sn: info.equipment_id || info.sn
    }
  } else {
    // 更新现有设备位置信息
    ...
  }
}
```

#### **SET_QB303_DEVICE_INFO**
```typescript
SET_QB303_DEVICE_INFO(state, info) {
  let equipmentId = info.sn || info.host?.sid || 'QB303_' + Date.now();
  if (!state.positionData.qb303Device[equipmentId]) {
    state.positionData.qb303Device[equipmentId] = {
      longitude: info.host?.longitude || 0,
      latitude: info.host?.latitude || 0,
      altitude: info.host?.altitude || 0,
      dock_sn: equipmentId,
      // QB303特有字段
      velocity: info.host?.velocity || 0,
      velocity_x: info.host?.velocity_x || 0,
      velocity_y: info.host?.velocity_y || 0,
      velocity_z: info.host?.velocity_z || 0,
      roll: info.host?.roll || 0,
      pitch: info.host?.pitch || 0,
      yaw: info.host?.yaw || 0,
      platform_type: info.host?.platform_type || 1,
      health_status: info.host?.health_status || 1,
      battle_unit_code: info.host?.battle_unit_code || '',
      report_time: info.host?.report_time || Date.now()
    }
  } else {
    // 更新现有设备数据
    ...
  }
}
```

### 2. 更新了 State 接口定义

添加了新的数据结构：

```typescript
positionData: {
  // ... 现有字段 ...
  
  otherEquipment:{
    [key:string]:{
      longitude: string | number;
      latitude: string | number;
      dock_sn: string;
    }
  }

  qb303Device:{
    [key:string]:{
      longitude: string | number;
      latitude: string | number;
      altitude: number;
      dock_sn: string;
      velocity: number;
      velocity_x: number;
      velocity_y: number;
      velocity_z: number;
      roll: number;
      pitch: number;
      yaw: number;
      platform_type: number;
      health_status: number;
      battle_unit_code: string;
      report_time: number;
    }
  }
}
```

### 3. 初始化了 Store State

在 `createStoreData.state` 中添加了初始化数据：

```typescript
positionData: {
  // ... 现有字段 ...
  
  //其他装备
  otherEquipment:{},

  //QB303设备
  qb303Device:{}
}
```

## ✅ 验证修复

### 检查 Mutations 是否正常工作
```javascript
// 在浏览器控制台测试
testQB303Data()
```

### 检查 Store 状态
```javascript
// 查看 store 中的数据
console.log(store.state.positionData.qb303Device)
console.log(store.state.positionData.otherEquipment)
```

## 📋 数据流程

1. **WebSocket 接收**: 接收到 `qb303_device_status` 消息
2. **DualWebSocketManager**: 调用 `this.store.commit('SET_QB303_DEVICE_INFO', payload.data)`
3. **Vuex Mutation**: 执行 `SET_QB303_DEVICE_INFO` 更新 store 状态
4. **EventBus**: 触发 `QB303Device-Update` 事件
5. **组件更新**: 主页面接收事件并更新其他装备列表

## 🎯 支持的设备类型

### QB303设备数据格式
```json
{
  "biz_code": "qb303_device_status",
  "data": {
    "host": {
      "altitude": 200,
      "latitude": 28.20648476190476,
      "longitude": 112.8945530952381,
      "platform_type": 1,
      "health_status": 1,
      "battle_unit_code": "dy04",
      "velocity": 0,
      "velocity_x": 0.10144216567277908,
      "velocity_y": -0.0755225121974945,
      "velocity_z": 0.050013765692710876,
      "roll": -1.02637914332358,
      "pitch": 2.0691601321652815,
      "yaw": 0,
      "report_time": 1757150761138
    },
    "sn": "2"
  }
}
```

### 通用其他装备数据格式
```json
{
  "biz_code": "other_equipment",
  "data": {
    "equipment_id": "DEVICE_001",
    "equipment_type": "雷达系统",
    "latitude": 39.9042,
    "longitude": 116.4074,
    "online_status": true
  }
}
```

现在WebSocket消息处理应该正常工作，不会再出现 `unknown mutation type` 错误。