feat: 优化运动监控页面的日期选择逻辑,增强场景加载后的机器人初始化流程

This commit is contained in:
xudan 2025-10-10 14:55:43 +08:00
parent b2fc2d8d73
commit b1d8806a59

View File

@ -6,6 +6,7 @@ import { isNil } from 'lodash-es';
import { computed, onMounted, onUnmounted, provide, ref, type ShallowRef, shallowRef, watch } from 'vue';
import { useRoute } from 'vue-router';
import type { RobotRealtimeInfo } from '../apis/robot';
import { getSceneByGroupId, getSceneById, monitorRealSceneById, monitorSceneById } from '../apis/scene';
import expandIcon from '../assets/icons/png/expand.png';
import foldIcon from '../assets/icons/png/fold.png';
@ -71,7 +72,7 @@ const client = shallowRef<WebSocket>();
// Ctrl/Cmd+F
const leftSiderEl = shallowRef<HTMLElement>();
const isPlaybackControllerVisible = ref<boolean>(true);
const selectedDate = ref<Dayjs | null>(null);
const selectedDate = ref<Dayjs>();
const playback = usePlaybackWebSocket(editor);
@ -85,9 +86,16 @@ watch(mode, async (newMode) => {
}
});
const handleDateChange = (date: Dayjs) => {
watch(playback.sceneJson, async (newJson) => {
if (newJson) {
await editor.value?.load(newJson);
// []
await editor.value?.initRobots();
}
});
watch(selectedDate, (date) => {
if (date) {
selectedDate.value = date;
const startOfDayTimestamp = date.startOf('day').valueOf();
playback.seek(startOfDayTimestamp);
// The total duration is now relative to the start of the day
@ -95,7 +103,7 @@ const handleDateChange = (date: Dayjs) => {
// Set current time to the beginning of the selected day for the slider
playback.currentTime.value = startOfDayTimestamp;
}
};
});
const handleSeek = (relativeTime: number) => {
if (selectedDate.value) {
@ -552,9 +560,7 @@ const focusFindKeydownHandler = (event: KeyboardEvent) => {
if (input) {
event.preventDefault();
input.focus();
try {
input.select?.();
} catch {}
input.select?.();
}
}
}
@ -583,12 +589,7 @@ const handleGlobalKeydown = (event: KeyboardEvent) => {
<a-button type="primary" :loading="isSaving" @click="handleSaveViewState"> 保存比例 </a-button>
<a-divider type="vertical" />
<a-date-picker
v-if="isPlaybackMode"
:value="selectedDate"
@change="handleDateChange"
placeholder="请选择回放日期"
/>
<a-date-picker v-if="isPlaybackMode" v-model:value="selectedDate" placeholder="请选择回放日期" />
</a-space>
</a-flex>
</a-layout-header>