refactor: 更新上下文菜单和机器人菜单组件,改为通过机器人ID传递信息,添加editor token,优化机器人信息获取逻辑

This commit is contained in:
xudan 2025-09-11 15:27:30 +08:00
parent c32dd105ef
commit 96cbdf8b51
4 changed files with 35 additions and 21 deletions

View File

@ -34,8 +34,9 @@
<!-- 机器人菜单 --> <!-- 机器人菜单 -->
<RobotMenu <RobotMenu
v-else-if="menuType === 'robot' && robotInfo" v-else-if="menuType === 'robot' && robotId"
:robot-info="robotInfo" :robot-id="robotId"
:token="token"
@action-complete="handleActionComplete" @action-complete="handleActionComplete"
@custom-image="handleCustomImage" @custom-image="handleCustomImage"
/> />
@ -52,10 +53,10 @@
<script setup lang="ts"> <script setup lang="ts">
import { message } from 'ant-design-vue'; import { message } from 'ant-design-vue';
import { computed, defineAsyncComponent, ref } from 'vue'; import { computed, defineAsyncComponent, type InjectionKey, ref, type ShallowRef } from 'vue';
import type { RobotInfo } from '../../apis/robot';
import type { StorageLocationInfo } from '../../services/context-menu'; import type { StorageLocationInfo } from '../../services/context-menu';
import type { EditorService } from '../../services/editor.service';
// 使 TypeScript // 使 TypeScript
const DefaultMenu = defineAsyncComponent(() => import('./default-menu.vue')); const DefaultMenu = defineAsyncComponent(() => import('./default-menu.vue'));
@ -68,14 +69,15 @@ interface Props {
y?: number; y?: number;
menuType?: 'default' | 'storage' | 'storage-background' | 'robot' | 'point' | 'area'; menuType?: 'default' | 'storage' | 'storage-background' | 'robot' | 'point' | 'area';
storageLocations?: StorageLocationInfo[]; storageLocations?: StorageLocationInfo[];
robotInfo?: RobotInfo; robotId?: string; // ID
token?: InjectionKey<ShallowRef<EditorService>>; // editor token
apiBaseUrl?: string; apiBaseUrl?: string;
} }
interface Emits { interface Emits {
(e: 'close'): void; (e: 'close'): void;
(e: 'actionComplete', data: any): void; (e: 'actionComplete', data: any): void;
(e: 'customImage', data: { robotInfo: RobotInfo }): void; (e: 'customImage', data: { robotInfo: any }): void; // 使 any RobotInfo
} }
const props = withDefaults(defineProps<Props>(), { const props = withDefaults(defineProps<Props>(), {
@ -190,7 +192,7 @@ const getActionDisplayName = (action: string): string => {
}; };
// //
const handleCustomImage = (data: { robotInfo: RobotInfo }) => { const handleCustomImage = (data: { robotInfo: any }) => {
console.log('打开自定义图片设置:', data.robotInfo); console.log('打开自定义图片设置:', data.robotInfo);
emit('customImage', data); emit('customImage', data);
// //

View File

@ -126,7 +126,7 @@
<script setup lang="ts"> <script setup lang="ts">
import { message } from 'ant-design-vue'; import { message } from 'ant-design-vue';
import { ref } from 'vue'; import { computed, inject, type InjectionKey, ref, type ShallowRef } from 'vue';
import type { RobotInfo } from '../../apis/robot'; import type { RobotInfo } from '../../apis/robot';
import type { RobotAction } from '../../services/context-menu/robot-menu.service'; import type { RobotAction } from '../../services/context-menu/robot-menu.service';
@ -135,10 +135,12 @@ import {
getRobotStatusColor, getRobotStatusColor,
getRobotStatusText getRobotStatusText
} from '../../services/context-menu/robot-menu.service'; } from '../../services/context-menu/robot-menu.service';
import type { EditorService } from '../../services/editor.service';
import RobotImageSettingsModal from '../modal/robot-image-settings-modal.vue'; import RobotImageSettingsModal from '../modal/robot-image-settings-modal.vue';
interface Props { interface Props {
robotInfo?: RobotInfo; robotId?: string; // ID
token?: InjectionKey<ShallowRef<EditorService>>; // editor token
} }
interface Emits { interface Emits {
@ -150,6 +152,15 @@ const props = defineProps<Props>();
const emit = defineEmits<Emits>(); const emit = defineEmits<Emits>();
// editor service
const editor = props.token ? inject(props.token) : null;
// robotId
const robotInfo = computed<RobotInfo | null>(() => {
if (!props.robotId || !editor?.value) return null;
return editor.value.getRobotById(props.robotId) || null;
});
// //
const imageSettingsVisible = ref(false); const imageSettingsVisible = ref(false);
const selectedRobotName = ref(''); const selectedRobotName = ref('');
@ -171,40 +182,40 @@ const getBatteryClass = (batteryLevel: number) => {
// //
const handleRobotAction = async (action: RobotAction | 'custom_image', actionName: string) => { const handleRobotAction = async (action: RobotAction | 'custom_image', actionName: string) => {
if (!props.robotInfo) return; if (!robotInfo.value) return;
// //
if (action === 'custom_image') { if (action === 'custom_image') {
if (!props.robotInfo?.label) { if (!robotInfo.value?.label) {
message.error('未找到机器人信息'); message.error('未找到机器人信息');
return; return;
} }
console.log('打开机器人图片设置:', props.robotInfo); console.log('打开机器人图片设置:', robotInfo.value);
// //
selectedRobotName.value = props.robotInfo.label; selectedRobotName.value = robotInfo.value.label;
imageSettingsVisible.value = true; imageSettingsVisible.value = true;
// //
emit('customImage', { emit('customImage', {
robotInfo: props.robotInfo robotInfo: robotInfo.value
}); });
return; return;
} }
try { try {
console.log(`执行机器人操作: ${action} (${actionName})`, props.robotInfo); console.log(`执行机器人操作: ${action} (${actionName})`, robotInfo.value);
// 使 // 使
const result = await executeRobotAction(action, props.robotInfo); const result = await executeRobotAction(action, robotInfo.value);
console.log('机器人操作结果:', result); console.log('机器人操作结果:', result);
// //
emit('actionComplete', { emit('actionComplete', {
action, action,
robot: props.robotInfo, robot: robotInfo.value,
success: result.success success: result.success
}); });
} catch (error) { } catch (error) {
@ -212,7 +223,7 @@ const handleRobotAction = async (action: RobotAction | 'custom_image', actionNam
emit('actionComplete', { emit('actionComplete', {
action, action,
robot: props.robotInfo, robot: robotInfo.value,
success: false success: false
}); });
} }

View File

@ -160,7 +160,8 @@ const toRemoveRobots = () =>
:x="contextMenuState.x" :x="contextMenuState.x"
:y="contextMenuState.y" :y="contextMenuState.y"
:menu-type="contextMenuState.menuType" :menu-type="contextMenuState.menuType"
:robot-info="contextMenuState.robotInfo" :robot-id="contextMenuState.robotInfo?.id"
:token="token"
@close="handleContextMenuClose" @close="handleContextMenuClose"
/> />

View File

@ -465,8 +465,8 @@ const handleGlobalKeydown = (event: KeyboardEvent) => {
:y="contextMenuState.y" :y="contextMenuState.y"
:menu-type="contextMenuState.menuType" :menu-type="contextMenuState.menuType"
:storage-locations="contextMenuState.storageLocations" :storage-locations="contextMenuState.storageLocations"
:robot-info="contextMenuState.robotInfo" :robot-id="contextMenuState.robotInfo?.id"
:editor="editor" :token="EDITOR_KEY"
@close="handleCloseContextMenu" @close="handleCloseContextMenu"
@action-complete="handleActionComplete" @action-complete="handleActionComplete"
/> />