merge: 최종 main을 토너먼트 즉시 조편성 수정에 통합

app/game-frontend/src/components/command/ReservedCommandEditor.vue

@@ -21,6 +21,7 @@ import type {
     CommandTable,
     ReservedCommandRow,
 } from './types';
+import { formatReservedCommandBrief } from './reservedCommandBrief';
 
 const props = withDefaults(
     defineProps<{
@@ -37,6 +38,7 @@ const props = withDefaults(
         currentTime?: string;
         mapData?: CommandMapData | null;
         mapLayout?: CommandMapLayout | null;
+        autonomousUntil?: string | null;
     }>(),
     {
         maxPushTurn: 6,
@@ -47,6 +49,7 @@ const props = withDefaults(
         currentTime: '--:--:--',
         mapData: null,
         mapLayout: null,
+        autonomousUntil: null,
     }
 );
 
@@ -70,6 +73,7 @@ const commandArgsValid = ref(false);
 const expanded = ref(false);
 const menuRevision = ref(0);
 const pendingReservation = ref<CommandPatternEntry | null>(null);
+const editorElement = ref<HTMLElement | null>(null);
 const pickerElement = ref<HTMLElement | null>(null);
 const collapsedRowCount = 15;
 
@@ -133,12 +137,16 @@ const labelMap = computed(() => {
 const displayRows = computed(() =>
     props.rows.slice(0, expanded.value || props.compact ? props.rows.length : collapsedRowCount)
 );
-const quickPickerTop = computed(() => `${70 + (quickTarget.value ?? 0) * 34.4}px`);
+const quickPickerTop = ref('38px');
 const isRecruitmentCommand = computed(
     () => selectedCommand.value?.key === 'che_징병' || selectedCommand.value?.key === 'che_모병'
 );
 const isRecruitmentOverlayOpen = computed(() => pickerOpen.value && isRecruitmentCommand.value);
-const rowLabel = (row: ReservedCommandRow): string => row.label ?? labelMap.value.get(row.action) ?? row.action;
+const rowLabel = (row: ReservedCommandRow): string =>
+    formatReservedCommandBrief(props.scope, row.action, row.args, props.commandTable) ||
+    row.label ||
+    labelMap.value.get(row.action) ||
+    row.action;
 const selectedIndices = () => normalizedSelection(selected.value, previousSelected.value, props.rows.length);
 const pattern = () => extractPattern(props.rows, selectedIndices());
 const touchMenus = () => (menuRevision.value += 1);
@@ -163,6 +171,19 @@ const finishDrag = (next: Set<number>) => {
 };
 
 const openPicker = (turnIndex?: number) => {
+    if (!props.compact && editorElement.value) {
+        const editorRect = editorElement.value.getBoundingClientRect();
+        const anchor =
+            turnIndex === undefined
+                ? editorElement.value.querySelector<HTMLElement>('.control-pad')
+                : editorElement.value.querySelector<HTMLElement>(`[data-turn-index="${turnIndex}"]`);
+        if (anchor) {
+            const anchorRect = anchor.getBoundingClientRect();
+            quickPickerTop.value = `${
+                turnIndex === undefined ? anchorRect.bottom - editorRect.top : anchorRect.top - editorRect.top + 30
+            }px`;
+        }
+    }
     quickTarget.value = turnIndex ?? null;
     pickerOpen.value = true;
     selectedCommand.value = null;
@@ -281,7 +302,7 @@ const rearrange = (direction: 'pull' | 'push') => {
 const textCopy = async () => {
     const lines = selectedIndices().map((index) => {
         const row = props.rows[index];
-        return `${index + 1}턴 ${row?.label ?? labelMap.value.get(row?.action ?? '') ?? row?.action ?? ''}`;
+        return `${index + 1}턴 ${row ? rowLabel(row) : ''}`;
     });
     await navigator.clipboard.writeText(lines.join('\n'));
     releaseSelection();
@@ -310,6 +331,7 @@ const clickOutsideMenu = (event: Event) => {
 
 <template>
     <article
+        ref="editorElement"
         class="reserved-command-editor"
         :class="{
             compact: props.compact,
@@ -326,6 +348,10 @@ const clickOutsideMenu = (event: Event) => {
             <span>{{ props.title }} :</span><strong>{{ props.name ?? '-' }}</strong>
         </header>
 
+        <div v-if="props.autonomousUntil" class="autorun-status" data-command-autorun-status role="status">
+            자율 행동: {{ props.autonomousUntil }}
+        </div>
+
         <div class="editor-layout">
             <aside class="control-pad">
                 <div v-if="props.mobile && props.compact" class="mobile-identity legacy-bg1">
@@ -614,7 +640,11 @@ const clickOutsideMenu = (event: Event) => {
                         <div
                             v-for="row in displayRows"
                             :key="row.index"
-                            :title="row.autonomous ? `${rowLabel(row)} · 자율 행동` : rowLabel(row)"
+                            :title="
+                                row.autonomous
+                                    ? `${rowLabel(row)} · 자율 행동${props.autonomousUntil ? ` (${props.autonomousUntil})` : ''}`
+                                    : rowLabel(row)
+                            "
                             :class="{ autonomous: row.autonomous }"
                         >
                             <span>{{ rowLabel(row) }}</span>
@@ -655,7 +685,7 @@ const clickOutsideMenu = (event: Event) => {
                 class="command-picker"
                 :class="{ 'recruitment-picker': isRecruitmentCommand }"
                 data-testid="command-picker"
-                :style="isRecruitmentCommand || quickTarget === null || props.compact ? undefined : { top: quickPickerTop }"
+                :style="isRecruitmentCommand || props.compact ? undefined : { top: quickPickerTop }"
                 :role="isRecruitmentCommand ? 'dialog' : undefined"
                 :aria-modal="isRecruitmentCommand ? 'true' : undefined"
                 :aria-label="
@@ -855,6 +885,15 @@ const clickOutsideMenu = (event: Event) => {
     display: grid;
     grid-template-columns: 75px 40px minmax(0, 1fr) 38px;
 }
+.autorun-status {
+    padding: 3px 6px;
+    border-bottom: 1px solid #2d6574;
+    background: #102c35;
+    color: #aaffff;
+    font-size: 0.78rem;
+    line-height: 1.35;
+    text-align: center;
+}
 .queue-grid.advanced {
     grid-template-columns: 34px 75px 40px minmax(0, 1fr);
 }
@@ -1154,5 +1193,4 @@ const clickOutsideMenu = (event: Event) => {
     bottom: 0;
     left: 109px;
 }
-
 </style>

app/game-frontend/src/components/command/reservedCommandBrief.ts

@@ -0,0 +1,185 @@
+import { JosaUtil } from '@sammo-ts/common';
+
+import type { CommandOption, CommandTable } from './types';
+
+type CommandScope = 'general' | 'nation';
+type CommandArgs = Record<string, unknown>;
+
+const CITY_TO_COMMANDS = new Set(['che_이동', 'che_강행', 'che_출병', 'che_천도']);
+const CITY_AT_COMMANDS = new Set([
+    'che_첩보',
+    'che_화계',
+    'che_선동',
+    'che_탈취',
+    'che_파괴',
+    'che_백성동원',
+    'che_허보',
+]);
+const CITY_OBJECT_COMMANDS = new Set(['che_수몰', 'che_초토화']);
+const NATION_AT_COMMANDS = new Set(['che_선전포고', 'che_급습', 'che_이호경식']);
+const NATION_PROPOSAL_COMMANDS = new Set(['che_불가침파기제의', 'che_종전제의']);
+
+const ITEM_TYPE_NAMES: Record<string, string> = {
+    horse: '명마',
+    weapon: '무기',
+    book: '서적',
+    item: '도구',
+};
+
+const asArgs = (value: unknown): CommandArgs =>
+    value && typeof value === 'object' && !Array.isArray(value) ? (value as CommandArgs) : {};
+
+const firstValue = (args: CommandArgs, keys: readonly string[]): unknown => {
+    for (const key of keys) {
+        if (args[key] !== undefined) return args[key];
+    }
+    return undefined;
+};
+
+const optionLabel = (options: readonly CommandOption[], value: unknown): string | null => {
+    const option = options.find((entry) => entry.value === value || String(entry.value) === String(value));
+    if (!option) return null;
+    // 도시·장수 option에는 선택 보조용 소속 정보가 괄호로 붙지만 Ref brief에는 이름만 들어간다.
+    return option.label.replace(/\s+\([^)]*\)$/u, '');
+};
+
+const commandNameMap = (table: CommandTable | null, scope: CommandScope): Map<string, string> => {
+    const result = new Map<string, string>([['휴식', '휴식']]);
+    for (const group of table?.[scope] ?? []) {
+        for (const command of group.values) result.set(command.key, command.name);
+    }
+    return result;
+};
+
+const defaultCommandName = (action: string): string => action.replace(/^(?:che_|cr_|event_)/u, '');
+
+const numberText = (value: unknown, grouped = false): string => {
+    if (typeof value !== 'number' || !Number.isFinite(value)) return String(value ?? '');
+    return grouped ? value.toLocaleString('en-US') : String(value);
+};
+
+const wrap = (value: string): string => `【${value}】`;
+const withParticle = (value: string, particle: '을' | '으로'): string => `${value}${JosaUtil.pick(value, particle)}`;
+const wrappedWithParticle = (value: string, particle: '을' | '으로'): string =>
+    `${wrap(value)}${JosaUtil.pick(value, particle)}`;
+
+export const formatReservedCommandBrief = (
+    scope: CommandScope,
+    action: string,
+    rawArgs: unknown,
+    table: CommandTable | null
+): string => {
+    const args = asArgs(rawArgs);
+    const input = table?.inputOptions;
+    const commandNames = commandNameMap(table, scope);
+    const commandName = commandNames.get(action) ?? defaultCommandName(action);
+    const cityName = optionLabel(input?.cities ?? [], firstValue(args, ['destCityId', 'destCityID']));
+    const nationName = optionLabel(input?.nations ?? [], firstValue(args, ['destNationId', 'destNationID']));
+    const generalName = optionLabel(input?.generals ?? [], firstValue(args, ['destGeneralId', 'destGeneralID']));
+
+    if (CITY_TO_COMMANDS.has(action) && cityName) {
+        return `${wrappedWithParticle(cityName, '으로')} ${commandName}`;
+    }
+    if (action === 'cr_인구이동' && cityName) {
+        return `${wrappedWithParticle(cityName, '으로')} ${numberText(args.amount, true)}명 ${commandName}`;
+    }
+    if (CITY_AT_COMMANDS.has(action) && cityName) {
+        const suffix =
+            scope === 'nation' ? commandName : action === 'che_첩보' ? `${commandName} 실행` : `${commandName}실행`;
+        return `${wrap(cityName)}에 ${suffix}`;
+    }
+    if (CITY_OBJECT_COMMANDS.has(action) && cityName) {
+        return `${wrappedWithParticle(cityName, '을')} ${commandName}`;
+    }
+    if (action === 'che_임관' && nationName) {
+        return `${wrappedWithParticle(nationName, '으로')} ${commandName}`;
+    }
+    if (NATION_AT_COMMANDS.has(action) && nationName) {
+        return `${wrap(nationName)}에 ${commandName}`;
+    }
+    if (NATION_PROPOSAL_COMMANDS.has(action) && nationName) {
+        return `${wrap(nationName)}에게 ${commandName}`;
+    }
+    if (action === 'che_불가침제의' && nationName) {
+        return `${wrap(nationName)}에게 ${numberText(args.year)}년 ${numberText(args.month)}월까지 ${commandName}`;
+    }
+    if (action === 'che_등용' && generalName) {
+        return `${wrappedWithParticle(generalName, '을')} ${commandName}`;
+    }
+    if (action === 'che_장수대상임관' && generalName) {
+        return `${wrappedWithParticle(generalName, '을')} 따라 임관`;
+    }
+    if (action === 'che_선양' && generalName) {
+        return `${wrap(generalName)}에게 ${commandName}`;
+    }
+    if (action === 'che_랜덤임관') {
+        return '무작위 국가로 임관';
+    }
+    if ((action === 'che_건국' || action === 'cr_건국') && typeof args.nationName === 'string') {
+        return `${wrappedWithParticle(args.nationName, '을')} 건국`;
+    }
+    if (action === 'che_무작위건국' && typeof args.nationName === 'string') {
+        return `${wrappedWithParticle(args.nationName, '을')} 무작위 도시에 건국`;
+    }
+    if (action === 'che_군량매매') {
+        return `군량 ${numberText(args.amount)}을 ${args.buyRice ? '구입' : '판매'}`;
+    }
+    if (action === 'che_헌납') {
+        return `${args.isGold ? '금' : '쌀'} ${numberText(args.amount)}을 ${commandName}`;
+    }
+    if (action === 'che_증여' && generalName) {
+        return `${wrap(generalName)}에게 ${args.isGold ? '금' : '쌀'} ${numberText(args.amount)}을 ${commandName}`;
+    }
+    if (action === 'che_징병' || action === 'che_모병') {
+        const crewType = optionLabel(input?.crewTypes ?? [], args.crewType);
+        if (crewType) return `${wrap(crewType)} ${numberText(args.amount)}명 ${commandName}`;
+    }
+    if (action === 'che_숙련전환') {
+        const srcArmType = optionLabel(input?.armTypes ?? [], args.srcArmType);
+        const destArmType = optionLabel(input?.armTypes ?? [], args.destArmType);
+        if (srcArmType && destArmType) return `${wrap(srcArmType)}숙련을 ${wrap(destArmType)}숙련으로 전환`;
+    }
+    if (action === 'che_장비매매') {
+        const itemType = typeof args.itemType === 'string' ? args.itemType : '';
+        if (args.itemCode === 'None') {
+            const itemTypeName = ITEM_TYPE_NAMES[itemType];
+            if (itemTypeName) return `${withParticle(itemTypeName, '을')} 판매`;
+        }
+        const itemName = optionLabel(input?.items[itemType] ?? [], args.itemCode);
+        if (itemName) {
+            const itemRawName = itemName.replace(/\([^)]*\)$/u, '');
+            return `${wrap(itemName)}${JosaUtil.pick(itemRawName, '을')} 구입`;
+        }
+    }
+    if (action === 'che_발령' && generalName && cityName) {
+        return `${wrap(generalName)}${wrappedWithParticle(cityName, '으로')} ${commandName}`;
+    }
+    if (action === 'che_부대탈퇴지시' && generalName) {
+        return `${wrap(generalName)}${commandName}`;
+    }
+    if ((action === 'che_포상' || action === 'che_몰수') && generalName) {
+        return `${wrap(generalName)} ${args.isGold ? '금' : '쌀'} ${numberText(args.amount, true)} ${commandName}`;
+    }
+    if (action === 'che_물자원조' && nationName && Array.isArray(args.amountList)) {
+        return `${wrap(nationName)}에게 국고 ${numberText(args.amountList[0], true)} 병량 ${numberText(
+            args.amountList[1],
+            true
+        )} ${commandName}`;
+    }
+    if (action === 'che_증축' || action === 'che_감축') {
+        return `수도를 ${commandName}`;
+    }
+    if (action === 'che_국기변경') {
+        return '【국기】를 변경';
+    }
+    if (action === 'che_국호변경' && typeof args.nationName === 'string') {
+        return `국호를 ${wrappedWithParticle(args.nationName, '으로')} 변경`;
+    }
+    if (action === 'che_피장파장' && nationName) {
+        const targetAction = typeof args.commandType === 'string' ? args.commandType : '';
+        const targetName = commandNames.get(targetAction) ?? defaultCommandName(targetAction);
+        return `${wrap(nationName)}에 ${wrap(targetName)} ${commandName}`;
+    }
+
+    return commandName;
+};

app/game-frontend/src/components/main/CommandListPanel.vue

@@ -2,7 +2,7 @@
 import { computed, onUnmounted, ref, watch } from 'vue';
 import { addMinutes } from 'date-fns';
 import ReservedCommandEditor from '../command/ReservedCommandEditor.vue';
-import { formatLocalTimeSeconds } from '../../utils/legacyDateTime';
+import { formatLocalDateTime, formatLocalTimeSeconds } from '../../utils/legacyDateTime';
 import type {
     CommandMapData,
     CommandMapLayout,
@@ -65,6 +65,26 @@ 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 lastAutonomousMonth = props.autorunLimit - 1;
+    if (lastAutonomousMonth < currentAbsoluteMonth) return null;
+
+    const untilYear = Math.floor(lastAutonomousMonth / 12);
+    const untilMonth = (lastAutonomousMonth % 12) + 1;
+    const base = props.general?.turnTime ? new Date(props.general.turnTime) : null;
+    const term = props.turnTermMinutes ?? 0;
+    const expiresAt =
+        base && Number.isFinite(base.getTime())
+            ? addMinutes(base, (lastAutonomousMonth - currentAbsoluteMonth) * term)
+            : null;
+    const currentTimeLabel = expiresAt ? formatLocalDateTime(expiresAt) : '현재시각 확인 불가';
+    return `${untilYear}年 ${untilMonth}月 · ${currentTimeLabel}까지`;
+});
+
 const currentServerTime = ref('--:--:--');
 let sampledServerTimeMs: number | null = null;
 let sampledClientTimeMs = 0;
@@ -112,6 +132,7 @@ onUnmounted(() => {
         :current-time="currentServerTime"
         :map-data="props.mapData"
         :map-layout="props.mapLayout"
+        :autonomous-until="autonomousUntil"
         @reserve-bulk="emit('set-general-turns', $event)"
         @shift="emit('shift-general-turns', $event)"
         @repeat="emit('repeat-general-turns', $event)"

app/game-frontend/src/utils/legacyDateTime.ts

@@ -15,3 +15,12 @@ export const formatLocalTimeSeconds = (value: string | Date): string => {
         .map((part) => String(part).padStart(2, '0'))
         .join(':');
 };
+
+export const formatLocalDateTime = (value: string | Date): string => {
+    const parsed = value instanceof Date ? value : new Date(value);
+    if (!Number.isFinite(parsed.getTime())) return '-';
+    const date = [parsed.getFullYear(), parsed.getMonth() + 1, parsed.getDate()]
+        .map((part, index) => String(part).padStart(index === 0 ? 4 : 2, '0'))
+        .join('-');
+    return `${date} ${formatLocalTimeSeconds(parsed)}`;
+};