feat: 优化机器人详情卡片组件的状态和类型判断，提升代码健壮性；合并机器人业务数据与位置数据，简化更新逻辑；在运动监控页面中为机器人详情卡片添加唯一键以优化渲染

src/components/card/robot-detail-card.vue

@@ -121,7 +121,7 @@ const getDoInfo = (information: AmrRedisState['information'] | undefined) => {
           <a-flex align="center" :gap="8">
             <i class="icon robot" />
             <a-typography-text class="card-title" style="flex: auto" :content="robot.label" ellipsis />
-            <a-tag :bordered="false">{{ $t(RobotType[robot.type]) }}</a-tag>
+            <a-tag v-if="robot.type" :bordered="false">{{ $t(RobotType[robot.type]) }}</a-tag>
           </a-flex>
         </a-col>
 
@@ -145,7 +145,7 @@ const getDoInfo = (information: AmrRedisState['information'] | undefined) => {
               <span>{{ robot.battery?.toFixed() ?? 0 }}%</span>
             </a-tag>
 
-            <a-tag v-if="robot.state">
+            <a-tag v-if="robot.state !== undefined">
               <i class="dot mr-4" :class="stateDot" />
               <span>{{ $t(RobotState[robot.state]) }}</span>
             </a-tag>

src/hooks/usePlaybackWebSocket.ts

@@ -160,7 +160,6 @@ export function usePlaybackWebSocket(editorService: ShallowRef<EditorService | u
   };
 
   const batchUpdateRobots = (updates: Array<{ id: string; data: RobotRealtimeInfo }>) => {
-
     const editor = editorService.value;
     if (!editor || updates.length === 0) return;
 
@@ -168,14 +167,18 @@ export function usePlaybackWebSocket(editorService: ShallowRef<EditorService | u
       const robotExists = editor.checkRobotById(id);
       if (robotExists) {
         const { x, y, angle, ...rest } = data;
-        editor.updateRobot(id, rest);
-        editor.setValue({
-          id,
-          x: x - 60,
-          y: y - 60,
-          rotate: -angle! + 180,
-          visible: true,
-        }, { render: false });
+        // 将业务数据和位置数据合并到一个对象中，通过 setValue 一次性更新
+        editor.setValue(
+          {
+            id,
+            x: x - 60,
+            y: y - 60,
+            rotate: -angle! + 180,
+            visible: true,
+            robot: rest, // 将业务数据挂载到图元的 robot 属性上
+          },
+          { render: false },
+        );
       }
     });
   };

src/pages/movement-supervision.vue

@@ -676,7 +676,7 @@ const handleGlobalKeydown = (event: KeyboardEvent) => {
       <template #icon><i class="icon detail" /></template>
     </a-float-button>
     <div v-if="show" class="card-container">
-      <RobotDetailCard v-if="isRobot" :token="EDITOR_KEY" :current="current.id" />
+      <RobotDetailCard v-if="isRobot" :key="current.id" :token="EDITOR_KEY" :current="current.id" />
       <PointDetailCard
         v-if="isPoint"
         :token="EDITOR_KEY"