merge: 최신 main을 국가 메시지 편집기 보완에 통합한다
This commit is contained in:
@@ -29,8 +29,6 @@ defineProps<{
|
||||
}
|
||||
.directory-tooltip--enabled {
|
||||
cursor: help;
|
||||
text-decoration: underline dotted rgb(150 210 255 / 85%);
|
||||
text-underline-offset: 2px;
|
||||
}
|
||||
.directory-tooltip--enabled:focus-visible {
|
||||
border-radius: 2px;
|
||||
|
||||
@@ -3,6 +3,7 @@ import { computed, onUnmounted, ref, watch } from 'vue';
|
||||
import { addMinutes } from 'date-fns';
|
||||
import ReservedCommandEditor from '../command/ReservedCommandEditor.vue';
|
||||
import { formatLocalDateTime, formatLocalTimeSeconds } from '../../utils/legacyDateTime';
|
||||
import { projectServerClock, sampleServerClock, type SampledServerClock } from '../../utils/serverClockProjection';
|
||||
import type {
|
||||
CommandMapData,
|
||||
CommandMapLayout,
|
||||
@@ -15,12 +16,15 @@ const props = defineProps<{
|
||||
commandTable: CommandTable | null;
|
||||
loading: boolean;
|
||||
reservedGeneralTurns: Array<{ index: number; action: string; args?: unknown }> | null;
|
||||
general: { id: number; turnTime?: string } | null;
|
||||
general: { id: number; turnTime?: string; nextTurnMonthOffset?: 0 | 1 } | null;
|
||||
currentYear?: number;
|
||||
currentMonth?: number;
|
||||
turnTermMinutes?: number;
|
||||
serverTime?: string;
|
||||
serverWallTime?: string;
|
||||
clockMode?: 'realtime' | 'manual';
|
||||
clockRunning?: boolean;
|
||||
clockStartsAt?: string | null;
|
||||
autorunLimit?: number | null;
|
||||
storageKey?: string;
|
||||
mapData?: CommandMapData | null;
|
||||
@@ -41,13 +45,19 @@ const labelMap = computed(() => {
|
||||
return result;
|
||||
});
|
||||
|
||||
const firstReservedMonth = computed(
|
||||
() =>
|
||||
(props.currentYear ?? 0) * 12 +
|
||||
(props.currentMonth ?? 1) -
|
||||
1 +
|
||||
(props.general?.nextTurnMonthOffset ?? 0)
|
||||
);
|
||||
|
||||
const rows = computed<ReservedCommandRow[]>(() => {
|
||||
const base = props.general?.turnTime ? new Date(props.general.turnTime) : null;
|
||||
const term = props.turnTermMinutes ?? 0;
|
||||
const baseYear = props.currentYear ?? 0;
|
||||
const baseMonth = props.currentMonth ?? 1;
|
||||
return (props.reservedGeneralTurns ?? []).map((turn, offset) => {
|
||||
const absoluteMonth = baseYear * 12 + baseMonth - 1 + offset;
|
||||
const absoluteMonth = firstReservedMonth.value + offset;
|
||||
const date = base && Number.isFinite(base.getTime()) ? addMinutes(base, offset * term) : null;
|
||||
return {
|
||||
...turn,
|
||||
@@ -67,9 +77,7 @@ const rows = computed<ReservedCommandRow[]>(() => {
|
||||
|
||||
const autonomousUntil = computed(() => {
|
||||
if (props.autorunLimit == null) return null;
|
||||
const baseYear = props.currentYear ?? 0;
|
||||
const baseMonth = props.currentMonth ?? 1;
|
||||
const currentAbsoluteMonth = baseYear * 12 + baseMonth - 1;
|
||||
const currentAbsoluteMonth = firstReservedMonth.value;
|
||||
const lastAutonomousMonth = props.autorunLimit - 1;
|
||||
if (lastAutonomousMonth < currentAbsoluteMonth) return null;
|
||||
|
||||
@@ -86,32 +94,34 @@ const autonomousUntil = computed(() => {
|
||||
});
|
||||
|
||||
const currentServerTime = ref('--:--:--');
|
||||
let sampledServerTimeMs: number | null = null;
|
||||
let sampledClientTimeMs = 0;
|
||||
const MAX_SERVER_CLOCK_TIMER_DELAY_MS = 60_000;
|
||||
let serverClockSample: SampledServerClock | null = null;
|
||||
let serverClockTimer: ReturnType<typeof setTimeout> | undefined;
|
||||
|
||||
const updateServerClock = () => {
|
||||
if (serverClockTimer !== undefined) clearTimeout(serverClockTimer);
|
||||
serverClockTimer = undefined;
|
||||
if (sampledServerTimeMs === null) {
|
||||
if (serverClockSample === null) {
|
||||
currentServerTime.value = '--:--:--';
|
||||
return;
|
||||
}
|
||||
const projectedTime = new Date(
|
||||
props.clockMode === 'manual' ? sampledServerTimeMs : sampledServerTimeMs + Date.now() - sampledClientTimeMs
|
||||
);
|
||||
const { clientElapsedMs, time: projectedTime } = projectServerClock(serverClockSample);
|
||||
currentServerTime.value = formatLocalTimeSeconds(projectedTime);
|
||||
if (props.clockMode !== 'manual') {
|
||||
serverClockTimer = setTimeout(updateServerClock, 1_000 - projectedTime.getMilliseconds());
|
||||
if (serverClockSample.clockMode !== 'manual' && serverClockSample.startDelayMs !== null) {
|
||||
const untilStartMs = serverClockSample.startDelayMs - clientElapsedMs;
|
||||
serverClockTimer = setTimeout(
|
||||
updateServerClock,
|
||||
untilStartMs > 0
|
||||
? Math.min(untilStartMs, MAX_SERVER_CLOCK_TIMER_DELAY_MS)
|
||||
: 1_000 - projectedTime.getMilliseconds()
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
watch(
|
||||
() => [props.serverTime, props.clockMode] as const,
|
||||
([serverTime]) => {
|
||||
const parsed = serverTime ? new Date(serverTime).getTime() : Number.NaN;
|
||||
sampledServerTimeMs = Number.isFinite(parsed) ? parsed : null;
|
||||
sampledClientTimeMs = Date.now();
|
||||
() => [props.serverTime, props.serverWallTime, props.clockMode, props.clockRunning, props.clockStartsAt] as const,
|
||||
([serverTime, serverWallTime, clockMode, clockRunning, clockStartsAt]) => {
|
||||
serverClockSample = sampleServerClock({ serverTime, serverWallTime, clockMode, clockRunning, clockStartsAt });
|
||||
updateServerClock();
|
||||
},
|
||||
{ immediate: true }
|
||||
|
||||
@@ -7,6 +7,7 @@ export type GeneralBattleSummaryData = {
|
||||
available?: boolean;
|
||||
experience?: number | null;
|
||||
dedicationText?: string | null;
|
||||
bill?: number | null;
|
||||
warnum?: number | null;
|
||||
wins?: number | null;
|
||||
losses?: number | null;
|
||||
@@ -62,8 +63,13 @@ const killRate = computed(() => {
|
||||
<template v-else>
|
||||
<span>명성</span><strong>{{ numberText(summary.experience) }}</strong> <span>계급</span
|
||||
><strong>{{ summary.dedicationText || '-' }}</strong>
|
||||
<span class="battle-general-extra__empty" aria-hidden="true"></span>
|
||||
<strong class="battle-general-extra__empty" aria-hidden="true"></strong>
|
||||
<template v-if="summary.bill !== undefined">
|
||||
<span>봉급</span><strong>{{ numberText(summary.bill) }}</strong>
|
||||
</template>
|
||||
<template v-else>
|
||||
<span class="battle-general-extra__empty" aria-hidden="true"></span>
|
||||
<strong class="battle-general-extra__empty" aria-hidden="true"></strong>
|
||||
</template>
|
||||
<span>전투</span
|
||||
><strong>{{ numberText(summary.warnum) }}<template v-if="summary.warnum != null">회</template></strong>
|
||||
<span>계략</span><strong>{{ numberText(summary.strategies) }}</strong>
|
||||
|
||||
@@ -1,10 +1,26 @@
|
||||
<script setup lang="ts">
|
||||
import { formatServerDateTime } from '@sammo-ts/common/time/ServerDateTime';
|
||||
import { computed } from 'vue';
|
||||
import { computed, onUnmounted, ref, watch } from 'vue';
|
||||
import { resolveTournamentStageName } from '../../utils/tournamentStatus';
|
||||
import {
|
||||
GAME_SERVER_ACTIVITY_FRESHNESS_MS,
|
||||
gameServerActivity,
|
||||
isRecentGameServerActivity,
|
||||
} from '../../utils/gameServerActivity';
|
||||
import {
|
||||
millisecondsUntilNextMinute,
|
||||
projectServerClock,
|
||||
sampleServerClock,
|
||||
type SampledServerClock,
|
||||
} from '../../utils/serverClockProjection';
|
||||
|
||||
const props = defineProps<{
|
||||
tournamentStage: number;
|
||||
serverTime?: string;
|
||||
serverWallTime?: string;
|
||||
clockMode?: 'realtime' | 'manual';
|
||||
clockRunning?: boolean;
|
||||
clockStartsAt?: string | null;
|
||||
status: {
|
||||
onlineUserCount: number;
|
||||
onlineNations: string;
|
||||
@@ -20,16 +36,75 @@ const props = defineProps<{
|
||||
}>();
|
||||
|
||||
const tournamentStatus = computed(() => resolveTournamentStageName(props.tournamentStage));
|
||||
const lastExecutedStatus = computed(() =>
|
||||
formatServerDateTime(props.status?.lastExecuted, { format: 'monthDayTime', fallback: '기록 없음' })
|
||||
const currentServerTime = ref('기록 없음');
|
||||
const hasServerClock = ref(false);
|
||||
const serverClockFresh = ref(false);
|
||||
const serverClockTitle = computed(() => {
|
||||
if (!hasServerClock.value) return '서버 시각을 아직 받지 못했습니다.';
|
||||
if (!serverClockFresh.value) return '최근 45초 동안 서버 통신이 없어 시각 갱신을 멈췄습니다.';
|
||||
return undefined;
|
||||
});
|
||||
|
||||
let serverClockSample: SampledServerClock | null = null;
|
||||
let serverClockTimer: ReturnType<typeof setTimeout> | undefined;
|
||||
|
||||
const updateServerClock = () => {
|
||||
if (serverClockTimer !== undefined) clearTimeout(serverClockTimer);
|
||||
serverClockTimer = undefined;
|
||||
if (serverClockSample === null) {
|
||||
currentServerTime.value = '기록 없음';
|
||||
hasServerClock.value = false;
|
||||
serverClockFresh.value = false;
|
||||
return;
|
||||
}
|
||||
|
||||
const now = Date.now();
|
||||
const projection = projectServerClock(serverClockSample, now);
|
||||
currentServerTime.value = formatServerDateTime(projection.time, {
|
||||
format: 'monthDayTime',
|
||||
fallback: '기록 없음',
|
||||
});
|
||||
hasServerClock.value = true;
|
||||
|
||||
const lastContactAt = gameServerActivity.lastContactAt.value;
|
||||
serverClockFresh.value = isRecentGameServerActivity(lastContactAt, now);
|
||||
if (!serverClockFresh.value || lastContactAt === null) return;
|
||||
|
||||
const nextDelays = [lastContactAt + GAME_SERVER_ACTIVITY_FRESHNESS_MS - now + 1];
|
||||
if (serverClockSample.clockMode !== 'manual' && serverClockSample.startDelayMs !== null) {
|
||||
const untilStartMs = serverClockSample.startDelayMs - projection.clientElapsedMs;
|
||||
nextDelays.push(untilStartMs > 0 ? untilStartMs : millisecondsUntilNextMinute(projection.time));
|
||||
}
|
||||
serverClockTimer = setTimeout(updateServerClock, Math.max(1, Math.min(...nextDelays)));
|
||||
};
|
||||
|
||||
watch(
|
||||
() => [props.serverTime, props.serverWallTime, props.clockMode, props.clockRunning, props.clockStartsAt] as const,
|
||||
([serverTime, serverWallTime, clockMode, clockRunning, clockStartsAt]) => {
|
||||
serverClockSample = sampleServerClock({ serverTime, serverWallTime, clockMode, clockRunning, clockStartsAt });
|
||||
updateServerClock();
|
||||
},
|
||||
{ immediate: true }
|
||||
);
|
||||
watch(() => gameServerActivity.lastContactAt.value, updateServerClock);
|
||||
|
||||
onUnmounted(() => {
|
||||
if (serverClockTimer !== undefined) clearTimeout(serverClockTimer);
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<section class="front-status" aria-label="접속 현황과 국가 방침">
|
||||
<div class="activity-status" aria-label="동작 시각, 토너먼트와 설문 진행 현황">
|
||||
<div class="status-row execution-status" :class="{ 'execution-status--empty': !status?.lastExecuted }">
|
||||
동작 시각: {{ lastExecutedStatus }}
|
||||
<div class="activity-status" aria-label="현재 시각, 토너먼트와 설문 진행 현황">
|
||||
<div
|
||||
class="status-row execution-status"
|
||||
:class="{
|
||||
'execution-status--empty': !hasServerClock,
|
||||
'execution-status--stale': hasServerClock && !serverClockFresh,
|
||||
}"
|
||||
:title="serverClockTitle"
|
||||
>
|
||||
현재 시각: {{ currentServerTime }}
|
||||
</div>
|
||||
<div class="status-row tournament-status">
|
||||
<RouterLink to="/tournament">
|
||||
@@ -120,6 +195,10 @@ const lastExecutedStatus = computed(() =>
|
||||
color: magenta;
|
||||
}
|
||||
|
||||
.execution-status--stale {
|
||||
color: magenta;
|
||||
}
|
||||
|
||||
.vote-label {
|
||||
color: cyan;
|
||||
}
|
||||
|
||||
@@ -284,7 +284,6 @@ const displayChiefName = (chief: NationChief | undefined): string => {
|
||||
|
||||
.strategic.has-tooltip {
|
||||
overflow: visible;
|
||||
text-decoration: underline dashed red;
|
||||
}
|
||||
|
||||
.cooldown-tooltip {
|
||||
|
||||
@@ -97,8 +97,6 @@ watch(
|
||||
|
||||
.rich-tooltip-trigger--enabled {
|
||||
cursor: help;
|
||||
text-decoration: underline dotted rgb(150 210 255 / 85%);
|
||||
text-underline-offset: 2px;
|
||||
}
|
||||
|
||||
.rich-tooltip-trigger--enabled:focus-visible {
|
||||
|
||||
Reference in New Issue
Block a user