feat: 优化播放控制器中的时间格式化逻辑,移除不必要的乐观显示状态,简化代码结构
This commit is contained in:
parent
b49d662e72
commit
6a5a72828f
@ -62,24 +62,13 @@ const formatTime = (ms: number): string => {
|
||||
return `${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}:${String(seconds).padStart(2, '0')}`;
|
||||
};
|
||||
|
||||
const currentTimeFormatted = computed(() => formatTime(pendingSeekTime.value ?? props.currentTime));
|
||||
const currentTimeFormatted = computed(() => formatTime(props.currentTime));
|
||||
const totalDurationFormatted = computed(() => formatTime(props.totalDuration));
|
||||
|
||||
// 本地“乐观显示”的时间:在 seek 后先行展示,待实际时间变更后清空
|
||||
const pendingSeekTime = ref<number | null>(null);
|
||||
|
||||
// 同步清理:当外部 currentTime 改变时,移除乐观显示
|
||||
watch(
|
||||
() => props.currentTime,
|
||||
() => {
|
||||
pendingSeekTime.value = null;
|
||||
},
|
||||
);
|
||||
|
||||
const playheadPosition = computed(() => {
|
||||
const viewDuration = viewEndTime.value - viewStartTime.value;
|
||||
if (viewDuration <= 0) return '0%';
|
||||
const current = pendingSeekTime.value ?? props.currentTime;
|
||||
const current = props.currentTime;
|
||||
const relativeTime = current - viewStartTime.value;
|
||||
const clamped = Math.min(Math.max(relativeTime, 0), viewDuration);
|
||||
return `${(clamped / viewDuration) * 100}%`;
|
||||
@ -116,7 +105,6 @@ const handleHourChange = (newHour: number) => {
|
||||
const newTime = newHour * HOUR_IN_MS;
|
||||
// 确保搜寻时间不超过总时长
|
||||
const clampedTime = Math.min(newTime, props.totalDuration);
|
||||
pendingSeekTime.value = clampedTime;
|
||||
emit('seek', clampedTime);
|
||||
};
|
||||
|
||||
@ -140,7 +128,6 @@ const handleTimelineClick = (event: MouseEvent) => {
|
||||
const ratio = clampedX / effectiveWidth;
|
||||
const viewDuration = viewEndTime.value - viewStartTime.value;
|
||||
const targetTime = Math.floor(viewStartTime.value + ratio * viewDuration);
|
||||
pendingSeekTime.value = targetTime;
|
||||
emit('seek', targetTime);
|
||||
// 点击发生后,立即更新所选小时,保持左侧小时选择与视窗一致
|
||||
const clickedHour = Math.floor(targetTime / HOUR_IN_MS);
|
||||
|
Loading…
x
Reference in New Issue
Block a user