feat: 플레이 감사 장수 로그를 기수별로 조회
This commit is contained in:
@@ -30,6 +30,7 @@ const history = [
|
||||
];
|
||||
|
||||
const publicResponse = (operation: string): unknown => {
|
||||
if (operation === 'lobby.info') return response({ myGeneral: null });
|
||||
if (operation === 'public.getMapLayout') return response({ mapName: 'che', cityList: [] });
|
||||
if (operation === 'public.getCachedMap') {
|
||||
return response({ year: 200, month: 1, cityList: [], nationList: [], history });
|
||||
|
||||
@@ -71,6 +71,22 @@ const install = async (page: Page, denied = false) => {
|
||||
},
|
||||
}
|
||||
: result({ profileName: gameProfile, read: true, accounts: false });
|
||||
case 'playAudit.generalLogs':
|
||||
return result({
|
||||
...world,
|
||||
type: input.type,
|
||||
coverage: 'IDENTIFIED_LOGS_ONLY',
|
||||
items: [
|
||||
{
|
||||
id: 1,
|
||||
year: 190,
|
||||
month: 1,
|
||||
text: `<script>window.auditInjected=true</script>${input.type} 감사 로그`,
|
||||
createdAt: '0190-01-01T00:00:00.000Z',
|
||||
},
|
||||
],
|
||||
nextCursor: null,
|
||||
});
|
||||
case 'playAudit.coverage':
|
||||
return result({ ...world, status: 'COLLECTED', samples: [], nextCursor: null });
|
||||
case 'playAudit.nations':
|
||||
@@ -404,3 +420,57 @@ test('city detail is addressable without reloading the list and retains month fo
|
||||
at: { year: 190, month: 6, kind: 'MONTH_END' },
|
||||
});
|
||||
});
|
||||
|
||||
test('general logs load explicitly and cache each category without reloading entity lists', async ({ page }) => {
|
||||
const requests = await install(page);
|
||||
await page.goto(gamePath('/play-audit?tab=generals&general=1'));
|
||||
await expect(page.getByRole('button', { name: '장수 기록 조회', exact: true })).toBeVisible();
|
||||
expect(requests.filter((r) => r.operation === 'playAudit.generalLogs')).toHaveLength(0);
|
||||
const listCount = requests.filter((r) => r.operation === 'playAudit.generals').length;
|
||||
await page.getByRole('button', { name: '장수 기록 조회', exact: true }).click();
|
||||
await expect(page.getByText('generalHistory 감사 로그', { exact: false })).toBeVisible();
|
||||
await page.getByLabel('기록 종류').selectOption('generalAction');
|
||||
await expect(page.getByText('generalAction 감사 로그', { exact: false })).toBeVisible();
|
||||
await page.getByLabel('기록 종류').selectOption('generalHistory');
|
||||
await expect(page.getByText('generalHistory 감사 로그', { exact: false })).toBeVisible();
|
||||
expect(requests.filter((r) => r.operation === 'playAudit.generalLogs')).toHaveLength(2);
|
||||
expect(requests.filter((r) => r.operation === 'playAudit.generals')).toHaveLength(listCount);
|
||||
expect(await page.evaluate(() => Reflect.get(window, 'auditInjected'))).toBeUndefined();
|
||||
await expect(page.locator('.audit-logs script')).toHaveCount(0);
|
||||
await capture(page, 'general-logs');
|
||||
});
|
||||
|
||||
test('historical log failure retries independently and sends only the selected month', async ({ page }) => {
|
||||
const requests = await install(page);
|
||||
let fail = true;
|
||||
await page.route(gameTrpcRoute, async (route) => {
|
||||
if (decodeURIComponent(route.request().url()).includes('playAudit.generalLogs') && fail) {
|
||||
fail = false;
|
||||
await route.fulfill({
|
||||
status: 500,
|
||||
contentType: 'application/json',
|
||||
body: JSON.stringify([
|
||||
{
|
||||
error: {
|
||||
message: '기록 조회 재시도',
|
||||
code: -32603,
|
||||
data: { code: 'INTERNAL_SERVER_ERROR', httpStatus: 500 },
|
||||
},
|
||||
},
|
||||
]),
|
||||
});
|
||||
} else await route.fallback();
|
||||
});
|
||||
await page.setViewportSize({ width: 390, height: 844 });
|
||||
await page.goto(gamePath('/play-audit?tab=generals&general=1&at=month&year=190&month=6'));
|
||||
await page.getByRole('button', { name: '장수 기록 조회', exact: true }).click();
|
||||
await expect(page.getByRole('alert')).toContainText('기록 조회 재시도');
|
||||
await page.getByRole('button', { name: '다시 조회', exact: true }).click();
|
||||
await expect(page.getByText('generalHistory 감사 로그', { exact: false })).toBeVisible();
|
||||
expect(requests.filter((r) => r.operation === 'playAudit.generalLogs')[0]?.input).toMatchObject({
|
||||
generalId: 1,
|
||||
month: { year: 190, month: 6 },
|
||||
});
|
||||
expect(requests.filter((r) => r.operation === 'playAudit.generalTurns')).toHaveLength(0);
|
||||
await capture(page, 'historical-general-logs-mobile');
|
||||
});
|
||||
|
||||
@@ -8,13 +8,18 @@ const props = withDefaults(
|
||||
loading?: boolean;
|
||||
trustedHtml?: boolean;
|
||||
unavailable?: GeneralRecordType[];
|
||||
types?: GeneralRecordType[];
|
||||
errors?: Partial<Record<GeneralRecordType, string>>;
|
||||
}>(),
|
||||
{
|
||||
loading: false,
|
||||
trustedHtml: false,
|
||||
unavailable: () => [],
|
||||
types: () => [...GENERAL_RECORD_TYPES],
|
||||
errors: () => ({}),
|
||||
}
|
||||
);
|
||||
defineEmits<{ retry: [type: GeneralRecordType] }>();
|
||||
|
||||
const labels: Record<GeneralRecordType, string> = {
|
||||
generalHistory: '장수 열전',
|
||||
@@ -33,9 +38,12 @@ const unavailableText: Record<GeneralRecordType, string> = {
|
||||
|
||||
<template>
|
||||
<div class="log-grid" data-general-record-panels>
|
||||
<div v-for="type in GENERAL_RECORD_TYPES" :key="type" class="log-block" :data-log-type="type">
|
||||
<div v-for="type in props.types" :key="type" class="log-block" :data-log-type="type">
|
||||
<div class="log-title">{{ labels[type] }}</div>
|
||||
<SkeletonLines v-if="loading" :lines="3" />
|
||||
<div v-else-if="props.errors[type]" class="empty" role="alert">
|
||||
{{ props.errors[type] }} <button class="legacy-button" @click="$emit('retry', type)">다시 조회</button>
|
||||
</div>
|
||||
<template v-else-if="props.unavailable.includes(type)">
|
||||
<div class="empty unavailable">{{ unavailableText[type] }}</div>
|
||||
</template>
|
||||
|
||||
@@ -26,7 +26,7 @@ const load = async () => {
|
||||
};
|
||||
const format = (value: number) => value.toLocaleString('ko-KR', { maximumFractionDigits: 2 });
|
||||
watch(
|
||||
() => [props.cityId, props.at] as const,
|
||||
[() => props.cityId, () => props.at?.year, () => props.at?.month, () => props.at?.kind],
|
||||
() => {
|
||||
void load();
|
||||
},
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
<script setup lang="ts">
|
||||
import { ref, watch } from 'vue';
|
||||
import PanelCard from '../ui/PanelCard.vue';
|
||||
import AuditGeneralLogs from './AuditGeneralLogs.vue';
|
||||
import { trpc } from '../../utils/trpc';
|
||||
const props = defineProps<{ generalId: number; at?: { year: number; month: number; kind: 'MONTH_END' | 'FINAL' } }>();
|
||||
defineEmits<{ close: [] }>();
|
||||
@@ -12,6 +13,7 @@ const loading = ref(false);
|
||||
const turnsLoading = ref(false);
|
||||
const error = ref('');
|
||||
const turnsError = ref('');
|
||||
const showLogs = ref(false);
|
||||
let generation = 0;
|
||||
const format = (value: number) => value.toLocaleString('ko-KR', { maximumFractionDigits: 2 });
|
||||
const load = async () => {
|
||||
@@ -56,7 +58,7 @@ const loadTurns = async (more = false) => {
|
||||
}
|
||||
};
|
||||
watch(
|
||||
() => [props.generalId, props.at] as const,
|
||||
[() => props.generalId, () => props.at?.year, () => props.at?.month, () => props.at?.kind],
|
||||
() => {
|
||||
void load();
|
||||
},
|
||||
@@ -117,6 +119,14 @@ watch(
|
||||
</template>
|
||||
</template>
|
||||
</template>
|
||||
<button class="legacy-button" @click="showLogs = !showLogs">
|
||||
{{ showLogs ? '장수 기록 닫기' : '장수 기록 조회' }}
|
||||
</button>
|
||||
<AuditGeneralLogs
|
||||
v-if="showLogs"
|
||||
:general-id="generalId"
|
||||
:month="at ? { year: at.year, month: at.month } : undefined"
|
||||
/>
|
||||
</PanelCard>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -0,0 +1,106 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, ref, watch } from 'vue';
|
||||
import GeneralRecordPanels from '../main/GeneralRecordPanels.vue';
|
||||
import type { GeneralRecordType } from '../generalRecords';
|
||||
import { formatLog } from '../../utils/formatLog';
|
||||
import { trpc } from '../../utils/trpc';
|
||||
const props = defineProps<{ generalId: number; month?: { year: number; month: number } }>();
|
||||
type LogPage = Awaited<ReturnType<typeof trpc.playAudit.generalLogs.query>>;
|
||||
const type = ref<GeneralRecordType>('generalHistory');
|
||||
const pages = ref<Partial<Record<GeneralRecordType, LogPage>>>({});
|
||||
const errors = ref<Partial<Record<GeneralRecordType, string>>>({});
|
||||
const loading = ref<Partial<Record<GeneralRecordType, boolean>>>({});
|
||||
let generation = 0;
|
||||
const records = computed(() =>
|
||||
Object.fromEntries(
|
||||
Object.entries(pages.value).map(([key, page]) => [
|
||||
key,
|
||||
page.items.map((item) => ({ id: item.id, content: formatLog(item.text) })),
|
||||
])
|
||||
)
|
||||
);
|
||||
const load = async (target: GeneralRecordType, more = false) => {
|
||||
if (loading.value[target]) return;
|
||||
const request = generation;
|
||||
loading.value[target] = true;
|
||||
errors.value[target] = '';
|
||||
try {
|
||||
const response = await trpc.playAudit.generalLogs.query({
|
||||
generalId: props.generalId,
|
||||
type: target,
|
||||
month: props.month,
|
||||
limit: 50,
|
||||
cursor: more ? (pages.value[target]?.nextCursor ?? undefined) : undefined,
|
||||
});
|
||||
if (request === generation)
|
||||
pages.value[target] = {
|
||||
...response,
|
||||
items: more ? [...(pages.value[target]?.items ?? []), ...response.items] : response.items,
|
||||
};
|
||||
} catch (cause) {
|
||||
if (request === generation)
|
||||
errors.value[target] = cause instanceof Error ? cause.message : '기록을 조회하지 못했습니다.';
|
||||
} finally {
|
||||
if (request === generation) loading.value[target] = false;
|
||||
}
|
||||
};
|
||||
watch(
|
||||
[() => props.generalId, () => props.month?.year, () => props.month?.month],
|
||||
() => {
|
||||
generation++;
|
||||
pages.value = {};
|
||||
errors.value = {};
|
||||
loading.value = {};
|
||||
void load(type.value);
|
||||
},
|
||||
{ immediate: true }
|
||||
);
|
||||
watch(type, (target) => {
|
||||
if (!pages.value[target]) void load(target);
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="audit-logs">
|
||||
<label
|
||||
>기록 종류
|
||||
<select v-model="type" class="legacy-sort-select" aria-label="기록 종류">
|
||||
<option value="generalHistory">장수 열전</option>
|
||||
<option value="generalAction">개인 기록</option>
|
||||
<option value="battleResult">전투 결과</option>
|
||||
<option value="battleDetail">전투 기록</option>
|
||||
</select></label
|
||||
>
|
||||
<p>
|
||||
{{ month ? `${month.year}년 ${month.month}월 전체 기록` : '현재 기수 기록' }} · 기수가 확인되는 로그만
|
||||
표시합니다. 도입 이전의 식별자 없는 기록은 포함하지 않습니다.
|
||||
</p>
|
||||
<p v-if="pages[type]?.coverage === 'IDENTITY_MISSING'">게임의 기수 식별자가 없어 기록을 구분할 수 없습니다.</p>
|
||||
<GeneralRecordPanels
|
||||
:types="[type]"
|
||||
:records="records"
|
||||
:loading="loading[type]"
|
||||
:errors="errors"
|
||||
trusted-html
|
||||
@retry="load($event)"
|
||||
/>
|
||||
<button
|
||||
v-if="pages[type]?.nextCursor != null"
|
||||
class="legacy-button"
|
||||
:disabled="loading[type]"
|
||||
@click="load(type, true)"
|
||||
>
|
||||
기록 더 불러오기
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.audit-logs {
|
||||
display: grid;
|
||||
gap: 8px;
|
||||
margin-top: 12px;
|
||||
min-width: 0;
|
||||
overflow-wrap: anywhere;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user