merge: 최신 main 정렬 제어 변경을 갱신 제어 작업에 통합
This commit is contained in:
@@ -1993,7 +1993,7 @@ export const createReservedTurnHandler = async (options: {
|
|||||||
let deleteGeneral = false;
|
let deleteGeneral = false;
|
||||||
const deletedTroopIds = Array.from(commandDeletedTroopIds);
|
const deletedTroopIds = Array.from(commandDeletedTroopIds);
|
||||||
const lifecycleSnapshot = cloneTurnGeneral(currentGeneral);
|
const lifecycleSnapshot = cloneTurnGeneral(currentGeneral);
|
||||||
if (currentGeneral.meta.killturn <= 0 && typeof currentGeneral.deadYear === 'number') {
|
if (currentGeneral.meta.killturn <= 0) {
|
||||||
if (
|
if (
|
||||||
currentGeneral.npcState === 1 &&
|
currentGeneral.npcState === 1 &&
|
||||||
typeof currentGeneral.deadYear === 'number' &&
|
typeof currentGeneral.deadYear === 'number' &&
|
||||||
|
|||||||
@@ -316,12 +316,13 @@ describe('legacy general turn lifecycle', () => {
|
|||||||
expect(harness.world.peekDirtyState().deletedGenerals).toContain(1);
|
expect(harness.world.peekDirtyState().deletedGenerals).toContain(1);
|
||||||
});
|
});
|
||||||
|
|
||||||
it('keeps compatibility fixtures without legacy lifespan metadata alive', async () => {
|
it('deletes an expired NPC even when its in-memory lifespan metadata is missing', async () => {
|
||||||
const harness = await createTurnTestHarness({
|
const harness = await createTurnTestHarness({
|
||||||
snapshot: makeSnapshot([
|
snapshot: makeSnapshot([
|
||||||
makeGeneral({
|
makeGeneral({
|
||||||
deadYear: undefined,
|
deadYear: undefined,
|
||||||
npcState: 2,
|
npcState: 4,
|
||||||
|
name: 'ⓖ의병',
|
||||||
meta: { killturn: 1 },
|
meta: { killturn: 1 },
|
||||||
}),
|
}),
|
||||||
]),
|
]),
|
||||||
@@ -332,9 +333,9 @@ describe('legacy general turn lifecycle', () => {
|
|||||||
|
|
||||||
await harness.runOneTick();
|
await harness.runOneTick();
|
||||||
|
|
||||||
expect(harness.world.getGeneralById(1)).not.toBeNull();
|
expect(harness.world.getGeneralById(1)).toBeNull();
|
||||||
expect(harness.world.getGeneralById(1)!.meta.killturn).toBe(0);
|
expect(harness.world.peekDirtyState().deletedGenerals).toContain(1);
|
||||||
expect(harness.world.peekDirtyState().lifecycleEvents[0]?.outcome).toBe('active');
|
expect(harness.world.peekDirtyState().lifecycleEvents[0]?.outcome).toBe('deleted');
|
||||||
});
|
});
|
||||||
|
|
||||||
it('retires a player general and resets inherited stats and rank state', async () => {
|
it('retires a player general and resets inherited stats and rank state', async () => {
|
||||||
|
|||||||
@@ -130,6 +130,45 @@ const generals = [
|
|||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
|
const npcGenerals = [
|
||||||
|
{
|
||||||
|
id: 10,
|
||||||
|
name: '낮은장수',
|
||||||
|
ownerName: '',
|
||||||
|
npcState: 0,
|
||||||
|
level: 4,
|
||||||
|
nationId: 2,
|
||||||
|
nationName: '촉',
|
||||||
|
personality: null,
|
||||||
|
specialDomestic: null,
|
||||||
|
specialWar: null,
|
||||||
|
statTotal: 120,
|
||||||
|
leadership: 30,
|
||||||
|
strength: 50,
|
||||||
|
intelligence: 40,
|
||||||
|
experience: 100,
|
||||||
|
dedication: 50,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 20,
|
||||||
|
name: '높은장수',
|
||||||
|
ownerName: '빙의자',
|
||||||
|
npcState: 1,
|
||||||
|
level: 8,
|
||||||
|
nationId: 1,
|
||||||
|
nationName: '위',
|
||||||
|
personality: null,
|
||||||
|
specialDomestic: null,
|
||||||
|
specialWar: null,
|
||||||
|
statTotal: 240,
|
||||||
|
leadership: 90,
|
||||||
|
strength: 70,
|
||||||
|
intelligence: 80,
|
||||||
|
experience: 500,
|
||||||
|
dedication: 300,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
const parseSort = (route: Route): number => {
|
const parseSort = (route: Route): number => {
|
||||||
try {
|
try {
|
||||||
const request = route.request();
|
const request = route.request();
|
||||||
@@ -224,6 +263,20 @@ const install = async (
|
|||||||
sort === 8 ? [...generals].sort((left, right) => left.killturn - right.killturn) : generals;
|
sort === 8 ? [...generals].sort((left, right) => left.killturn - right.killturn) : generals;
|
||||||
return response({ sort, generals: rows });
|
return response({ sort, generals: rows });
|
||||||
}
|
}
|
||||||
|
if (operation === 'public.getNpcList') {
|
||||||
|
const sort = parseSort(route);
|
||||||
|
const rows = [...npcGenerals].sort((left, right) => {
|
||||||
|
if (sort === 2) return left.nationId - right.nationId || left.id - right.id;
|
||||||
|
if (sort === 3) return right.statTotal - left.statTotal || left.id - right.id;
|
||||||
|
if (sort === 4) return right.leadership - left.leadership || left.id - right.id;
|
||||||
|
if (sort === 5) return right.strength - left.strength || left.id - right.id;
|
||||||
|
if (sort === 6) return right.intelligence - left.intelligence || left.id - right.id;
|
||||||
|
if (sort === 7) return right.experience - left.experience || left.id - right.id;
|
||||||
|
if (sort === 8) return right.dedication - left.dedication || left.id - right.id;
|
||||||
|
return left.name.localeCompare(right.name) || left.id - right.id;
|
||||||
|
});
|
||||||
|
return response({ sort, generals: rows, tokenKeepCounts: {} });
|
||||||
|
}
|
||||||
return { error: { message: `unhandled ${operation}`, data: { code: 'BAD_REQUEST' } } };
|
return { error: { message: `unhandled ${operation}`, data: { code: 'BAD_REQUEST' } } };
|
||||||
});
|
});
|
||||||
await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify(results) });
|
await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify(results) });
|
||||||
@@ -340,7 +393,7 @@ test('nation and general directories preserve the fixed legacy Chromium geometry
|
|||||||
await expect.poll(() => accessPages).toContain('nation-list');
|
await expect.poll(() => accessPages).toContain('nation-list');
|
||||||
expect(accessPages).not.toContain('general-list');
|
expect(accessPages).not.toContain('general-list');
|
||||||
|
|
||||||
const header = page.locator('.general-table thead td').first();
|
const header = page.locator('.general-table thead th').first();
|
||||||
expect(await header.evaluate((element) => getComputedStyle(element).backgroundImage)).toContain('back_green.jpg');
|
expect(await header.evaluate((element) => getComputedStyle(element).backgroundImage)).toContain('back_green.jpg');
|
||||||
const icon = page.locator('.general-icon').first();
|
const icon = page.locator('.general-icon').first();
|
||||||
await expect(icon).toBeVisible();
|
await expect(icon).toBeVisible();
|
||||||
@@ -392,6 +445,78 @@ test('general directory submits the legacy sort selector and keeps wounded/bonus
|
|||||||
expect(await page.locator('#viewType').evaluate((element) => document.activeElement === element)).toBe(true);
|
expect(await page.locator('#viewType').evaluate((element) => document.activeElement === element)).toBe(true);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
test('directory sort controls stay legible in dark mode and sortable headers apply the matching option', async ({
|
||||||
|
page,
|
||||||
|
}, testInfo) => {
|
||||||
|
await install(page);
|
||||||
|
await page.goto('general-list');
|
||||||
|
|
||||||
|
const select = page.locator('#viewType');
|
||||||
|
const submit = page.getByRole('button', { name: '정렬하기' });
|
||||||
|
const colors = await select.evaluate((element) => {
|
||||||
|
const selectStyle = getComputedStyle(element);
|
||||||
|
const optionStyle = getComputedStyle(element.querySelector('option')!);
|
||||||
|
return {
|
||||||
|
selectBackground: selectStyle.backgroundColor,
|
||||||
|
selectColor: selectStyle.color,
|
||||||
|
optionBackground: optionStyle.backgroundColor,
|
||||||
|
optionColor: optionStyle.color,
|
||||||
|
};
|
||||||
|
});
|
||||||
|
expect(colors).toEqual({
|
||||||
|
selectBackground: 'rgb(24, 35, 29)',
|
||||||
|
selectColor: 'rgb(247, 250, 248)',
|
||||||
|
optionBackground: 'rgb(24, 35, 29)',
|
||||||
|
optionColor: 'rgb(247, 250, 248)',
|
||||||
|
});
|
||||||
|
const defaultButton = await submit.evaluate((element) => {
|
||||||
|
const style = getComputedStyle(element);
|
||||||
|
return {
|
||||||
|
background: style.backgroundColor,
|
||||||
|
color: style.color,
|
||||||
|
borderBottomWidth: style.borderBottomWidth,
|
||||||
|
cursor: style.cursor,
|
||||||
|
};
|
||||||
|
});
|
||||||
|
expect(defaultButton).toEqual({
|
||||||
|
background: 'rgb(55, 90, 127)',
|
||||||
|
color: 'rgb(255, 255, 255)',
|
||||||
|
borderBottomWidth: '3px',
|
||||||
|
cursor: 'pointer',
|
||||||
|
});
|
||||||
|
await submit.hover();
|
||||||
|
await page.mouse.down();
|
||||||
|
expect(await submit.evaluate((element) => getComputedStyle(element).borderBottomWidth)).toBe('1px');
|
||||||
|
await page.mouse.up();
|
||||||
|
|
||||||
|
await page.getByRole('button', { name: '삭턴 기준 정렬' }).click();
|
||||||
|
await expect(select).toHaveValue('8');
|
||||||
|
await expect(page.locator('th[aria-sort="ascending"]')).toContainText('삭턴');
|
||||||
|
await expect(page.locator('tbody tr[data-general-id]').first()).toHaveAttribute('data-general-id', '20');
|
||||||
|
await page.screenshot({ path: testInfo.outputPath('directory-sort-controls-desktop.png'), fullPage: true });
|
||||||
|
|
||||||
|
await page.setViewportSize({ width: 500, height: 844 });
|
||||||
|
await expect(select).toHaveCSS('background-color', 'rgb(24, 35, 29)');
|
||||||
|
await expect(submit).toHaveCSS('border-bottom-width', '3px');
|
||||||
|
await page.screenshot({ path: testInfo.outputPath('directory-sort-controls-mobile.png'), fullPage: true });
|
||||||
|
});
|
||||||
|
|
||||||
|
test('npc directory reuses the dark sort controls and sorts from a table header', async ({ page }, testInfo) => {
|
||||||
|
await install(page);
|
||||||
|
await page.goto('npc-list');
|
||||||
|
await expect(page.locator('.npc-table tbody tr[data-general-id]')).toHaveCount(2);
|
||||||
|
await page.getByRole('button', { name: '통솔 기준 정렬' }).click();
|
||||||
|
await expect(page.locator('#npc-list-sort')).toHaveValue('4');
|
||||||
|
await expect(page.locator('.npc-table th[aria-sort="descending"]')).toContainText('통솔');
|
||||||
|
await expect(page.locator('.npc-table tbody tr[data-general-id]').first()).toHaveAttribute('data-general-id', '20');
|
||||||
|
await expect(page.locator('#npc-list-sort')).toHaveCSS('background-color', 'rgb(24, 35, 29)');
|
||||||
|
await expect(page.getByRole('button', { name: '정렬하기' })).toHaveCSS('background-color', 'rgb(55, 90, 127)');
|
||||||
|
await page.screenshot({ path: testInfo.outputPath('npc-sort-controls-desktop.png'), fullPage: true });
|
||||||
|
await page.setViewportSize({ width: 500, height: 844 });
|
||||||
|
await expect(page.locator('#npc-list-sort')).toHaveCSS('color', 'rgb(247, 250, 248)');
|
||||||
|
await page.screenshot({ path: testInfo.outputPath('npc-sort-controls-mobile.png'), fullPage: true });
|
||||||
|
});
|
||||||
|
|
||||||
test('nation directory reuses only the public general-directory row on hover and keyboard focus', async ({ page }) => {
|
test('nation directory reuses only the public general-directory row on hover and keyboard focus', async ({ page }) => {
|
||||||
const requestedOperations: string[] = [];
|
const requestedOperations: string[] = [];
|
||||||
await install(page, 'general', [], requestedOperations);
|
await install(page, 'general', [], requestedOperations);
|
||||||
|
|||||||
@@ -353,6 +353,15 @@ test('암행부 행을 도시별로 나누고 수뇌의 인사부 즉시 임명
|
|||||||
await expect(page.locator('.city-user-table')).toHaveCount(0);
|
await expect(page.locator('.city-user-table')).toHaveCount(0);
|
||||||
await expect(page.getByRole('button', { name: '인사부 연동' })).toHaveCount(0);
|
await expect(page.getByRole('button', { name: '인사부 연동' })).toHaveCount(0);
|
||||||
|
|
||||||
|
const citySort = page.locator('#nation-city-sort');
|
||||||
|
await expect(citySort).toHaveCSS('background-color', 'rgb(24, 35, 29)');
|
||||||
|
await citySort.selectOption('5');
|
||||||
|
await page.getByRole('button', { name: '정렬하기' }).click();
|
||||||
|
await expect(page.locator('.city th[aria-sort="descending"]').first()).toContainText('농업');
|
||||||
|
await page.getByRole('button', { name: '시세 기준 정렬' }).first().click();
|
||||||
|
await expect(citySort).toHaveValue('10');
|
||||||
|
await expect(page.locator('.city th[aria-sort="descending"]').first()).toContainText('시세');
|
||||||
|
|
||||||
await page.getByRole('button', { name: '암행부 연동' }).click();
|
await page.getByRole('button', { name: '암행부 연동' }).click();
|
||||||
await expect(page.locator('.city-user-table')).toHaveCount(2);
|
await expect(page.locator('.city-user-table')).toHaveCount(2);
|
||||||
await expect(page.locator('.city[data-city-id="1"] .city-user-table tr[data-general-id="21"]')).toContainText(
|
await expect(page.locator('.city[data-city-id="1"] .city-user-table tr[data-general-id="21"]')).toContainText(
|
||||||
|
|||||||
@@ -149,6 +149,30 @@ const install = async (page: Page, secretAllowed = true) => {
|
|||||||
{ action: '휴식', args: {} },
|
{ action: '휴식', args: {} },
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
id: 2,
|
||||||
|
name: '부유장수',
|
||||||
|
npcState: 0,
|
||||||
|
injury: 0,
|
||||||
|
stats: { leadership: 60, strength: 50, intelligence: 40 },
|
||||||
|
leadershipBonus: 0,
|
||||||
|
experienceLevel: 8,
|
||||||
|
troopId: 1,
|
||||||
|
troopName: '제1부대',
|
||||||
|
gold: 3000,
|
||||||
|
rice: 1000,
|
||||||
|
cityId: 2,
|
||||||
|
cityName: '낙양',
|
||||||
|
defenceTrain: 80,
|
||||||
|
defenceTrainText: '◎',
|
||||||
|
crewTypeId: 2,
|
||||||
|
crew: 100,
|
||||||
|
train: 80,
|
||||||
|
atmos: 80,
|
||||||
|
killTurn: 3,
|
||||||
|
turnTime: '2026-01-01T02:02:00.000Z',
|
||||||
|
reservedCommands: [],
|
||||||
|
},
|
||||||
],
|
],
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@@ -381,7 +405,7 @@ test('secret office renders five Ref-style command briefs and the forbidden erro
|
|||||||
'5 : 휴식',
|
'5 : 휴식',
|
||||||
]);
|
]);
|
||||||
await expect(commandRows.nth(2)).toHaveAttribute('title', '【다른장수】에게 쌀 200을 증여');
|
await expect(commandRows.nth(2)).toHaveAttribute('title', '【다른장수】에게 쌀 200을 증여');
|
||||||
const geometry = await page.locator('#secret-general-list .turns').evaluate((element) => {
|
const geometry = await page.locator('#secret-general-list .turns').first().evaluate((element) => {
|
||||||
const rect = element.getBoundingClientRect();
|
const rect = element.getBoundingClientRect();
|
||||||
const style = getComputedStyle(element);
|
const style = getComputedStyle(element);
|
||||||
return {
|
return {
|
||||||
@@ -416,3 +440,22 @@ test('secret office renders five Ref-style command briefs and the forbidden erro
|
|||||||
await expect(page.getByRole('alert')).toContainText('권한이 부족합니다.');
|
await expect(page.getByRole('alert')).toContainText('권한이 부족합니다.');
|
||||||
await expect(page.locator('#secret-general-list')).toHaveCount(0);
|
await expect(page.locator('#secret-general-list')).toHaveCount(0);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
test('secret office applies the selected sort on submit and immediately from sortable headers', async ({ page }) => {
|
||||||
|
await install(page);
|
||||||
|
await page.goto('nation/secret');
|
||||||
|
const rows = page.locator('#secret-general-list tbody tr[data-general-id]');
|
||||||
|
await expect(rows.first()).toHaveAttribute('data-general-id', '1');
|
||||||
|
|
||||||
|
await page.locator('#secret-list-sort').selectOption('1');
|
||||||
|
await expect(rows.first()).toHaveAttribute('data-general-id', '1');
|
||||||
|
await page.getByRole('button', { name: '정렬하기' }).click();
|
||||||
|
await expect(rows.first()).toHaveAttribute('data-general-id', '2');
|
||||||
|
await expect(page.locator('#secret-general-list th[aria-sort="descending"]')).toContainText('자 금');
|
||||||
|
|
||||||
|
await page.getByRole('button', { name: '도시 기준 정렬' }).click();
|
||||||
|
await expect(page.locator('#secret-list-sort')).toHaveValue('3');
|
||||||
|
await expect(rows.first()).toHaveAttribute('data-general-id', '1');
|
||||||
|
await expect(page.locator('#secret-list-sort')).toHaveCSS('color', 'rgb(247, 250, 248)');
|
||||||
|
await expect(page.getByRole('button', { name: '정렬하기' })).toHaveCSS('border-bottom-width', '3px');
|
||||||
|
});
|
||||||
|
|||||||
@@ -38,6 +38,109 @@
|
|||||||
opacity: 0.65;
|
opacity: 0.65;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Compact sorting controls used by the Ref-style directory pages. Native
|
||||||
|
* dark-mode selects vary by browser, so both the closed control and its option
|
||||||
|
* popup own an explicit high-contrast palette. The submit control keeps a
|
||||||
|
* raised face and pressed edge without increasing the legacy title row.
|
||||||
|
*/
|
||||||
|
.legacy-sort-form {
|
||||||
|
min-height: 25px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 4px;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.legacy-sort-select,
|
||||||
|
.legacy-sort-submit {
|
||||||
|
box-sizing: border-box;
|
||||||
|
height: 25px;
|
||||||
|
font: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
.legacy-sort-select {
|
||||||
|
min-width: 78px;
|
||||||
|
border: 1px solid #91a39a;
|
||||||
|
border-radius: 3px;
|
||||||
|
padding: 1px 24px 1px 6px;
|
||||||
|
background-color: #18231d;
|
||||||
|
color: #f7faf8;
|
||||||
|
color-scheme: dark;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.legacy-sort-select option {
|
||||||
|
background-color: #18231d;
|
||||||
|
color: #f7faf8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.legacy-sort-select option:checked {
|
||||||
|
background-color: #375a7f;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.legacy-sort-submit {
|
||||||
|
margin-top: 0;
|
||||||
|
border-color: #27405a;
|
||||||
|
border-style: solid;
|
||||||
|
border-width: 0 1px 3px;
|
||||||
|
border-radius: 3px;
|
||||||
|
padding: 1px 9px;
|
||||||
|
background: #375a7f;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 700;
|
||||||
|
line-height: 21px;
|
||||||
|
vertical-align: middle;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.legacy-sort-submit:hover {
|
||||||
|
margin-top: 1px;
|
||||||
|
border-bottom-width: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.legacy-sort-submit:active {
|
||||||
|
margin-top: 2px;
|
||||||
|
border-bottom-width: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.legacy-sort-select:focus-visible,
|
||||||
|
.legacy-sort-submit:focus-visible,
|
||||||
|
.legacy-sort-header:focus-visible {
|
||||||
|
outline: 2px solid var(--sammo-color-accent);
|
||||||
|
outline-offset: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.legacy-sort-header {
|
||||||
|
width: 100%;
|
||||||
|
min-height: 18px;
|
||||||
|
margin: 0;
|
||||||
|
border: 0;
|
||||||
|
padding: 0 2px;
|
||||||
|
background: transparent;
|
||||||
|
color: inherit;
|
||||||
|
font: inherit;
|
||||||
|
line-height: inherit;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.legacy-sort-header:hover {
|
||||||
|
background: rgb(255 255 255 / 12%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.legacy-sort-indicator {
|
||||||
|
margin-left: 2px;
|
||||||
|
color: #9ee7ba;
|
||||||
|
font-size: 0.75em;
|
||||||
|
opacity: 0.65;
|
||||||
|
}
|
||||||
|
|
||||||
|
[aria-sort] .legacy-sort-indicator {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
|
||||||
/*
|
/*
|
||||||
* Ref Bootstrap 5.2 + Lumen button family. This class owns the common raised
|
* Ref Bootstrap 5.2 + Lumen button family. This class owns the common raised
|
||||||
* edge and pressed movement. Semantic modifiers below only select face, edge,
|
* edge and pressed movement. Semantic modifiers below only select face, edge,
|
||||||
|
|||||||
@@ -4,18 +4,51 @@ import { formatOfficerLevelText } from '../../utils/nationFormat';
|
|||||||
import { getNpcColor } from '../../utils/npcColor';
|
import { getNpcColor } from '../../utils/npcColor';
|
||||||
import type { GeneralDirectoryGeneral } from '../../types/directory';
|
import type { GeneralDirectoryGeneral } from '../../types/directory';
|
||||||
|
|
||||||
withDefaults(
|
type SortDirection = 'ascending' | 'descending';
|
||||||
|
type Header = {
|
||||||
|
label: string;
|
||||||
|
sort?: number;
|
||||||
|
direction?: SortDirection;
|
||||||
|
title?: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
const props = withDefaults(
|
||||||
defineProps<{
|
defineProps<{
|
||||||
generals: GeneralDirectoryGeneral[];
|
generals: GeneralDirectoryGeneral[];
|
||||||
loading?: boolean;
|
loading?: boolean;
|
||||||
layout?: 'responsive' | 'card';
|
layout?: 'responsive' | 'card';
|
||||||
|
activeSort?: number;
|
||||||
}>(),
|
}>(),
|
||||||
{
|
{
|
||||||
loading: false,
|
loading: false,
|
||||||
layout: 'responsive',
|
layout: 'responsive',
|
||||||
|
activeSort: undefined,
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const emit = defineEmits<{ sort: [value: number] }>();
|
||||||
|
|
||||||
|
const headers: ReadonlyArray<Header> = [
|
||||||
|
{ label: '얼 굴' },
|
||||||
|
{ label: '이 름' },
|
||||||
|
{ label: '연령', sort: 14, direction: 'descending' },
|
||||||
|
{ label: '성격', sort: 11, direction: 'descending' },
|
||||||
|
{ label: '특기' },
|
||||||
|
{ label: '레 벨', sort: 10, direction: 'descending' },
|
||||||
|
{ label: '국 가', sort: 1, direction: 'ascending' },
|
||||||
|
{ label: '명 성', sort: 5, direction: 'descending' },
|
||||||
|
{ label: '계 급', sort: 6, direction: 'descending' },
|
||||||
|
{ label: '관 직', sort: 7, direction: 'descending' },
|
||||||
|
{ label: '통솔', sort: 2, direction: 'descending' },
|
||||||
|
{ label: '무력', sort: 3, direction: 'descending' },
|
||||||
|
{ label: '지력', sort: 4, direction: 'descending' },
|
||||||
|
{ label: '삭턴', sort: 8, direction: 'ascending' },
|
||||||
|
{ label: '벌점', sort: 9, direction: 'descending' },
|
||||||
|
];
|
||||||
|
|
||||||
|
const ariaSort = (header: Header): SortDirection | undefined =>
|
||||||
|
header.sort === props.activeSort ? header.direction : undefined;
|
||||||
|
|
||||||
const injuredStat = (value: number, injury: number): number => Math.trunc((value * (100 - injury)) / 100);
|
const injuredStat = (value: number, injury: number): number => Math.trunc((value * (100 - injury)) / 100);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -40,21 +73,28 @@ const injuredStat = (value: number, injury: number): number => Math.trunc((value
|
|||||||
</colgroup>
|
</colgroup>
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="header-cell">얼 굴</td>
|
<th
|
||||||
<td class="header-cell">이 름</td>
|
v-for="header in headers"
|
||||||
<td class="header-cell">연령</td>
|
:key="header.label"
|
||||||
<td class="header-cell">성격</td>
|
class="header-cell"
|
||||||
<td class="header-cell">특기</td>
|
scope="col"
|
||||||
<td class="header-cell">레 벨</td>
|
:aria-sort="ariaSort(header)"
|
||||||
<td class="header-cell">국 가</td>
|
>
|
||||||
<td class="header-cell">명 성</td>
|
<button
|
||||||
<td class="header-cell">계 급</td>
|
v-if="header.sort !== undefined && activeSort !== undefined"
|
||||||
<td class="header-cell">관 직</td>
|
class="legacy-sort-header"
|
||||||
<td class="header-cell">통솔</td>
|
type="button"
|
||||||
<td class="header-cell">무력</td>
|
:aria-label="`${header.label.replaceAll(' ', '')} 기준 정렬`"
|
||||||
<td class="header-cell">지력</td>
|
:title="header.title ?? `${header.label.replaceAll(' ', '')} 기준 정렬`"
|
||||||
<td class="header-cell">삭턴</td>
|
@click="emit('sort', header.sort)"
|
||||||
<td class="header-cell">벌점</td>
|
>
|
||||||
|
{{ header.label
|
||||||
|
}}<span class="legacy-sort-indicator">{{
|
||||||
|
header.sort === activeSort ? (header.direction === 'ascending' ? '▲' : '▼') : '↕'
|
||||||
|
}}</span>
|
||||||
|
</button>
|
||||||
|
<template v-else>{{ header.label }}</template>
|
||||||
|
</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
@@ -232,7 +272,8 @@ const injuredStat = (value: number, injury: number): number => Math.trunc((value
|
|||||||
line-height: 1.3;
|
line-height: 1.3;
|
||||||
word-break: break-all;
|
word-break: break-all;
|
||||||
}
|
}
|
||||||
.directory-table td {
|
.directory-table td,
|
||||||
|
.directory-table th {
|
||||||
border: 1px solid gray;
|
border: 1px solid gray;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
word-break: break-all;
|
word-break: break-all;
|
||||||
@@ -242,6 +283,8 @@ const injuredStat = (value: number, injury: number): number => Math.trunc((value
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
background-color: #14241b;
|
background-color: #14241b;
|
||||||
background-image: var(--sammo-texture-green);
|
background-image: var(--sammo-texture-green);
|
||||||
|
color: inherit;
|
||||||
|
font-weight: 400;
|
||||||
}
|
}
|
||||||
.general-icon {
|
.general-icon {
|
||||||
display: inline;
|
display: inline;
|
||||||
|
|||||||
@@ -0,0 +1,37 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
defineProps<{
|
||||||
|
controlId: string;
|
||||||
|
modelValue: number;
|
||||||
|
options: ReadonlyArray<{ value: number; label: string }>;
|
||||||
|
busy?: boolean;
|
||||||
|
}>();
|
||||||
|
|
||||||
|
const emit = defineEmits<{
|
||||||
|
'update:modelValue': [value: number];
|
||||||
|
submit: [];
|
||||||
|
}>();
|
||||||
|
|
||||||
|
const updateValue = (event: Event): void => {
|
||||||
|
const value = Number((event.target as HTMLSelectElement).value);
|
||||||
|
emit('update:modelValue', value);
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<form class="legacy-sort-form" @submit.prevent="emit('submit')">
|
||||||
|
<label :for="controlId">정렬순서 :</label>
|
||||||
|
<select
|
||||||
|
:id="controlId"
|
||||||
|
class="legacy-sort-select"
|
||||||
|
name="type"
|
||||||
|
size="1"
|
||||||
|
:value="modelValue"
|
||||||
|
@change="updateValue"
|
||||||
|
>
|
||||||
|
<option v-for="option in options" :key="option.value" :value="option.value">
|
||||||
|
{{ option.label }}
|
||||||
|
</option>
|
||||||
|
</select>
|
||||||
|
<button class="legacy-sort-submit" type="submit" :aria-busy="busy || undefined">정렬하기</button>
|
||||||
|
</form>
|
||||||
|
</template>
|
||||||
@@ -3,6 +3,7 @@ import { onMounted, ref } from 'vue';
|
|||||||
import { useRouter } from 'vue-router';
|
import { useRouter } from 'vue-router';
|
||||||
|
|
||||||
import GeneralDirectoryTable from '../components/directory/GeneralDirectoryTable.vue';
|
import GeneralDirectoryTable from '../components/directory/GeneralDirectoryTable.vue';
|
||||||
|
import LegacySortControls from '../components/ui/LegacySortControls.vue';
|
||||||
import type { GeneralDirectoryGeneral } from '../types/directory';
|
import type { GeneralDirectoryGeneral } from '../types/directory';
|
||||||
import { trpc } from '../utils/trpc';
|
import { trpc } from '../utils/trpc';
|
||||||
|
|
||||||
@@ -45,6 +46,15 @@ const loadDirectory = async () => {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const updateSort = (value: number): void => {
|
||||||
|
sort.value = value as SortKey;
|
||||||
|
};
|
||||||
|
|
||||||
|
const sortByHeader = (value: number): void => {
|
||||||
|
updateSort(value);
|
||||||
|
void loadDirectory();
|
||||||
|
};
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
void loadDirectory();
|
void loadDirectory();
|
||||||
});
|
});
|
||||||
@@ -63,22 +73,21 @@ onMounted(() => {
|
|||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>
|
<td>
|
||||||
<form class="sort-form" @submit.prevent="loadDirectory">
|
<LegacySortControls
|
||||||
<label for="viewType">정렬순서 : </label>
|
control-id="viewType"
|
||||||
<select id="viewType" v-model.number="sort" name="type" size="1">
|
:model-value="sort"
|
||||||
<option v-for="option in sortOptions" :key="option.value" :value="option.value">
|
:options="sortOptions"
|
||||||
{{ option.label }}
|
:busy="loading"
|
||||||
</option>
|
@update:model-value="updateSort"
|
||||||
</select>
|
@submit="loadDirectory"
|
||||||
<input type="submit" value="정렬하기" />
|
/>
|
||||||
</form>
|
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
|
|
||||||
<p v-if="error" class="directory-error" role="alert">{{ error }}</p>
|
<p v-if="error" class="directory-error" role="alert">{{ error }}</p>
|
||||||
<GeneralDirectoryTable :generals="generals" :loading="loading" />
|
<GeneralDirectoryTable :generals="generals" :loading="loading" :active-sort="sort" @sort="sortByHeader" />
|
||||||
|
|
||||||
<table class="directory-table title-table legacy-bg0">
|
<table class="directory-table title-table legacy-bg0">
|
||||||
<tbody>
|
<tbody>
|
||||||
@@ -121,13 +130,6 @@ onMounted(() => {
|
|||||||
padding: 5px 10px;
|
padding: 5px 10px;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
}
|
}
|
||||||
.sort-form {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
.sort-form select,
|
|
||||||
.sort-form button {
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
.directory-error {
|
.directory-error {
|
||||||
width: 998px;
|
width: 998px;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
|||||||
@@ -4,6 +4,7 @@ import { computed, onMounted, ref } from 'vue';
|
|||||||
import { useRouter } from 'vue-router';
|
import { useRouter } from 'vue-router';
|
||||||
import { formatReservedCommandBrief } from '../components/command/reservedCommandBrief';
|
import { formatReservedCommandBrief } from '../components/command/reservedCommandBrief';
|
||||||
import type { CommandTable } from '../components/command/types';
|
import type { CommandTable } from '../components/command/types';
|
||||||
|
import LegacySortControls from '../components/ui/LegacySortControls.vue';
|
||||||
import { useGameFeedback } from '../composables/useGameFeedback';
|
import { useGameFeedback } from '../composables/useGameFeedback';
|
||||||
import { getNpcColor } from '../utils/npcColor';
|
import { getNpcColor } from '../utils/npcColor';
|
||||||
import { legacyNationTextColor } from '../utils/legacyNationColor';
|
import { legacyNationTextColor } from '../utils/legacyNationColor';
|
||||||
@@ -28,6 +29,7 @@ const secretLoading = ref(false);
|
|||||||
const personnelLoading = ref(false);
|
const personnelLoading = ref(false);
|
||||||
const pendingAppointment = ref('');
|
const pendingAppointment = ref('');
|
||||||
const sort = ref<Sort>(10);
|
const sort = ref<Sort>(10);
|
||||||
|
const selectedSort = ref<Sort>(10);
|
||||||
const extraSort = ref<
|
const extraSort = ref<
|
||||||
| 'name'
|
| 'name'
|
||||||
| 'populationRate'
|
| 'populationRate'
|
||||||
@@ -42,7 +44,20 @@ const extraSort = ref<
|
|||||||
>(null);
|
>(null);
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const { error: showErrorToast, info: showInfoToast, success: showSuccessToast } = useGameFeedback();
|
const { error: showErrorToast, info: showInfoToast, success: showSuccessToast } = useGameFeedback();
|
||||||
const options = ['기본', '인구', '인구율', '민심', '농업', '상업', '치안', '수비', '성벽', '시세', '지역', '규모'];
|
const sortOptions = [
|
||||||
|
'기본',
|
||||||
|
'인구',
|
||||||
|
'인구율',
|
||||||
|
'민심',
|
||||||
|
'농업',
|
||||||
|
'상업',
|
||||||
|
'치안',
|
||||||
|
'수비',
|
||||||
|
'성벽',
|
||||||
|
'시세',
|
||||||
|
'지역',
|
||||||
|
'규모',
|
||||||
|
].map((label, index) => ({ value: index + 1, label }));
|
||||||
const officerLabels: Record<OfficerLevel, string> = { 4: '태수', 3: '군사', 2: '종사' };
|
const officerLabels: Record<OfficerLevel, string> = { 4: '태수', 3: '군사', 2: '종사' };
|
||||||
const generalsForCity = (cityId: number) => data.value?.generals.filter((general) => general.cityId === cityId) ?? [];
|
const generalsForCity = (cityId: number) => data.value?.generals.filter((general) => general.cityId === cityId) ?? [];
|
||||||
const secretGeneralsForCity = (cityId: number) =>
|
const secretGeneralsForCity = (cityId: number) =>
|
||||||
@@ -89,6 +104,20 @@ const cities = computed(() => {
|
|||||||
const setExtraSort = (value: NonNullable<typeof extraSort.value>) => {
|
const setExtraSort = (value: NonNullable<typeof extraSort.value>) => {
|
||||||
extraSort.value = value;
|
extraSort.value = value;
|
||||||
};
|
};
|
||||||
|
const updateSelectedSort = (value: number): void => {
|
||||||
|
selectedSort.value = value as Sort;
|
||||||
|
};
|
||||||
|
const applySelectedSort = (): void => {
|
||||||
|
sort.value = selectedSort.value;
|
||||||
|
extraSort.value = null;
|
||||||
|
};
|
||||||
|
const sortByHeader = (value: Sort): void => {
|
||||||
|
selectedSort.value = value;
|
||||||
|
sort.value = value;
|
||||||
|
extraSort.value = null;
|
||||||
|
};
|
||||||
|
const sortIndicator = (value: Sort, direction: 'ascending' | 'descending'): string =>
|
||||||
|
sort.value === value && extraSort.value === null ? (direction === 'ascending' ? '▲' : '▼') : '↕';
|
||||||
const remain = (value: number, maximum: number) => value - maximum;
|
const remain = (value: number, maximum: number) => value - maximum;
|
||||||
const warnRemain = (
|
const warnRemain = (
|
||||||
kind: 'agriculture' | 'commerce' | 'security' | 'defence' | 'wall',
|
kind: 'agriculture' | 'commerce' | 'security' | 'defence' | 'wall',
|
||||||
@@ -272,14 +301,14 @@ onMounted(async () => {
|
|||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>
|
<td>
|
||||||
<form @submit.prevent="extraSort = null">
|
<div class="city-sort-actions">
|
||||||
정렬순서 :
|
<LegacySortControls
|
||||||
<select v-model.number="sort">
|
control-id="nation-city-sort"
|
||||||
<option v-for="(label, index) in options" :key="label" :value="index + 1">
|
:model-value="selectedSort"
|
||||||
{{ label }}
|
:options="sortOptions"
|
||||||
</option>
|
@update:model-value="updateSelectedSort"
|
||||||
</select>
|
@submit="applySelectedSort"
|
||||||
<input type="submit" value="정렬하기" />
|
/>
|
||||||
<button type="button" :aria-busy="secretLoading" @click="loadSecretIntegration">
|
<button type="button" :aria-busy="secretLoading" @click="loadSecretIntegration">
|
||||||
암행부 연동
|
암행부 연동
|
||||||
</button>
|
</button>
|
||||||
@@ -292,7 +321,7 @@ onMounted(async () => {
|
|||||||
>
|
>
|
||||||
인사부 연동
|
인사부 연동
|
||||||
</button>
|
</button>
|
||||||
</form>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
@@ -337,11 +366,29 @@ onMounted(async () => {
|
|||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<th>주민</th>
|
<th :aria-sort="sort === 2 && extraSort === null ? 'descending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="주민 기준 정렬"
|
||||||
|
@click="sortByHeader(2)"
|
||||||
|
>
|
||||||
|
주민<span class="legacy-sort-indicator">{{ sortIndicator(2, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
<td :class="developmentClass('population', city.population, city.populationMax)">
|
<td :class="developmentClass('population', city.population, city.populationMax)">
|
||||||
{{ city.population }}/{{ city.populationMax }}
|
{{ city.population }}/{{ city.populationMax }}
|
||||||
</td>
|
</td>
|
||||||
<th>인구율</th>
|
<th :aria-sort="sort === 3 && extraSort === null ? 'descending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="인구율 기준 정렬"
|
||||||
|
@click="sortByHeader(3)"
|
||||||
|
>
|
||||||
|
인구율<span class="legacy-sort-indicator">{{ sortIndicator(3, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
<td :class="developmentClass('population', city.population, city.populationMax)">
|
<td :class="developmentClass('population', city.population, city.populationMax)">
|
||||||
{{ Number(((city.population / city.populationMax) * 100).toFixed(2)) }}%
|
{{ Number(((city.population / city.populationMax) * 100).toFixed(2)) }}%
|
||||||
</td>
|
</td>
|
||||||
@@ -353,35 +400,80 @@ onMounted(async () => {
|
|||||||
<td>{{ city.incomes.wall.toLocaleString() }}</td>
|
<td>{{ city.incomes.wall.toLocaleString() }}</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<th>농업</th>
|
<th :aria-sort="sort === 5 && extraSort === null ? 'descending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="농업 기준 정렬"
|
||||||
|
@click="sortByHeader(5)"
|
||||||
|
>
|
||||||
|
농업<span class="legacy-sort-indicator">{{ sortIndicator(5, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
<td :class="developmentClass('agriculture', city.agriculture, city.agricultureMax)">
|
<td :class="developmentClass('agriculture', city.agriculture, city.agricultureMax)">
|
||||||
{{ city.agriculture }}/{{ city.agricultureMax
|
{{ city.agriculture }}/{{ city.agricultureMax
|
||||||
}}<span v-if="warnRemain('agriculture', city.agriculture, city.agricultureMax)" class="remain"
|
}}<span v-if="warnRemain('agriculture', city.agriculture, city.agricultureMax)" class="remain"
|
||||||
>[{{ remain(city.agriculture, city.agricultureMax) }}]</span
|
>[{{ remain(city.agriculture, city.agricultureMax) }}]</span
|
||||||
>
|
>
|
||||||
</td>
|
</td>
|
||||||
<th>상업</th>
|
<th :aria-sort="sort === 6 && extraSort === null ? 'descending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="상업 기준 정렬"
|
||||||
|
@click="sortByHeader(6)"
|
||||||
|
>
|
||||||
|
상업<span class="legacy-sort-indicator">{{ sortIndicator(6, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
<td :class="developmentClass('commerce', city.commerce, city.commerceMax)">
|
<td :class="developmentClass('commerce', city.commerce, city.commerceMax)">
|
||||||
{{ city.commerce }}/{{ city.commerceMax
|
{{ city.commerce }}/{{ city.commerceMax
|
||||||
}}<span v-if="warnRemain('commerce', city.commerce, city.commerceMax)" class="remain"
|
}}<span v-if="warnRemain('commerce', city.commerce, city.commerceMax)" class="remain"
|
||||||
>[{{ remain(city.commerce, city.commerceMax) }}]</span
|
>[{{ remain(city.commerce, city.commerceMax) }}]</span
|
||||||
>
|
>
|
||||||
</td>
|
</td>
|
||||||
<th>치안</th>
|
<th :aria-sort="sort === 7 && extraSort === null ? 'descending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="치안 기준 정렬"
|
||||||
|
@click="sortByHeader(7)"
|
||||||
|
>
|
||||||
|
치안<span class="legacy-sort-indicator">{{ sortIndicator(7, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
<td :class="developmentClass('security', city.security, city.securityMax)">
|
<td :class="developmentClass('security', city.security, city.securityMax)">
|
||||||
{{ city.security }}/{{ city.securityMax
|
{{ city.security }}/{{ city.securityMax
|
||||||
}}<span v-if="warnRemain('security', city.security, city.securityMax)" class="remain"
|
}}<span v-if="warnRemain('security', city.security, city.securityMax)" class="remain"
|
||||||
>[{{ remain(city.security, city.securityMax) }}]</span
|
>[{{ remain(city.security, city.securityMax) }}]</span
|
||||||
>
|
>
|
||||||
</td>
|
</td>
|
||||||
<th>수비</th>
|
<th :aria-sort="sort === 8 && extraSort === null ? 'descending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="수비 기준 정렬"
|
||||||
|
@click="sortByHeader(8)"
|
||||||
|
>
|
||||||
|
수비<span class="legacy-sort-indicator">{{ sortIndicator(8, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
<td :class="developmentClass('defence', city.defence, city.defenceMax)">
|
<td :class="developmentClass('defence', city.defence, city.defenceMax)">
|
||||||
{{ city.defence }}/{{ city.defenceMax
|
{{ city.defence }}/{{ city.defenceMax
|
||||||
}}<span v-if="warnRemain('defence', city.defence, city.defenceMax)" class="remain"
|
}}<span v-if="warnRemain('defence', city.defence, city.defenceMax)" class="remain"
|
||||||
>[{{ remain(city.defence, city.defenceMax) }}]</span
|
>[{{ remain(city.defence, city.defenceMax) }}]</span
|
||||||
>
|
>
|
||||||
</td>
|
</td>
|
||||||
<th>성벽</th>
|
<th :aria-sort="sort === 9 && extraSort === null ? 'descending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="성벽 기준 정렬"
|
||||||
|
@click="sortByHeader(9)"
|
||||||
|
>
|
||||||
|
성벽<span class="legacy-sort-indicator">{{ sortIndicator(9, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
<td :class="developmentClass('wall', city.wall, city.wallMax)">
|
<td :class="developmentClass('wall', city.wall, city.wallMax)">
|
||||||
{{ city.wall }}/{{ city.wallMax
|
{{ city.wall }}/{{ city.wallMax
|
||||||
}}<span v-if="warnRemain('wall', city.wall, city.wallMax)" class="remain"
|
}}<span v-if="warnRemain('wall', city.wall, city.wallMax)" class="remain"
|
||||||
@@ -390,9 +482,27 @@ onMounted(async () => {
|
|||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<th>민심</th>
|
<th :aria-sort="sort === 4 && extraSort === null ? 'descending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="민심 기준 정렬"
|
||||||
|
@click="sortByHeader(4)"
|
||||||
|
>
|
||||||
|
민심<span class="legacy-sort-indicator">{{ sortIndicator(4, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
<td>{{ city.trust.toFixed(1) }}</td>
|
<td>{{ city.trust.toFixed(1) }}</td>
|
||||||
<th>시세</th>
|
<th :aria-sort="sort === 10 && extraSort === null ? 'descending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="시세 기준 정렬"
|
||||||
|
@click="sortByHeader(10)"
|
||||||
|
>
|
||||||
|
시세<span class="legacy-sort-indicator">{{ sortIndicator(10, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
<td>{{ city.trade ?? '-' }}%</td>
|
<td>{{ city.trade ?? '-' }}%</td>
|
||||||
<th>태수</th>
|
<th>태수</th>
|
||||||
<td class="officer-4-value" :class="{ 'effective-officer': officerIsStationed(city, 4) }">
|
<td class="officer-4-value" :class="{ 'effective-officer': officerIsStationed(city, 4) }">
|
||||||
@@ -567,6 +677,13 @@ onMounted(async () => {
|
|||||||
.title {
|
.title {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
}
|
}
|
||||||
|
.city-sort-actions {
|
||||||
|
min-height: 25px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 4px;
|
||||||
|
}
|
||||||
.city {
|
.city {
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
}
|
}
|
||||||
@@ -669,7 +786,7 @@ onMounted(async () => {
|
|||||||
.footer {
|
.footer {
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
}
|
}
|
||||||
.nation-cities-page button,
|
.nation-cities-page button:not(.legacy-sort-submit, .legacy-sort-header),
|
||||||
.nation-cities-page input[type='submit'] {
|
.nation-cities-page input[type='submit'] {
|
||||||
border: 2px outset #fff;
|
border: 2px outset #fff;
|
||||||
background-color: buttonface;
|
background-color: buttonface;
|
||||||
|
|||||||
@@ -3,6 +3,7 @@ import { formatServerDateTime } from '@sammo-ts/common/time/ServerDateTime';
|
|||||||
import { computed, onMounted, ref } from 'vue';
|
import { computed, onMounted, ref } from 'vue';
|
||||||
import { formatReservedCommandBrief } from '../components/command/reservedCommandBrief';
|
import { formatReservedCommandBrief } from '../components/command/reservedCommandBrief';
|
||||||
import type { CommandTable } from '../components/command/types';
|
import type { CommandTable } from '../components/command/types';
|
||||||
|
import LegacySortControls from '../components/ui/LegacySortControls.vue';
|
||||||
import { trpc } from '../utils/trpc';
|
import { trpc } from '../utils/trpc';
|
||||||
type Result = Awaited<ReturnType<typeof trpc.nation.getSecretGeneralList.query>>;
|
type Result = Awaited<ReturnType<typeof trpc.nation.getSecretGeneralList.query>>;
|
||||||
type ReservedCommand = Result['generals'][number]['reservedCommands'][number];
|
type ReservedCommand = Result['generals'][number]['reservedCommands'][number];
|
||||||
@@ -12,7 +13,11 @@ const commandTable = ref<CommandTable | null>(null);
|
|||||||
const error = ref('');
|
const error = ref('');
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
const sort = ref<Sort>(7);
|
const sort = ref<Sort>(7);
|
||||||
const options = ['자금', '군량', '도시', '병종', '병사', '삭제턴', '턴', '부대'];
|
const selectedSort = ref<Sort>(7);
|
||||||
|
const sortOptions = ['자금', '군량', '도시', '병종', '병사', '삭제턴', '턴', '부대'].map((label, index) => ({
|
||||||
|
value: index + 1,
|
||||||
|
label,
|
||||||
|
}));
|
||||||
const load = async () => {
|
const load = async () => {
|
||||||
loading.value = true;
|
loading.value = true;
|
||||||
error.value = '';
|
error.value = '';
|
||||||
@@ -44,6 +49,18 @@ const displayName = (general: { name: string; npcState: number }) =>
|
|||||||
general.npcState > 0 && !/^[ⓜⓝ㉥]/u.test(general.name) ? `ⓝ${general.name}` : general.name;
|
general.npcState > 0 && !/^[ⓜⓝ㉥]/u.test(general.name) ? `ⓝ${general.name}` : general.name;
|
||||||
const commandBrief = (command: ReservedCommand): string =>
|
const commandBrief = (command: ReservedCommand): string =>
|
||||||
formatReservedCommandBrief('general', command.action, command.args, commandTable.value);
|
formatReservedCommandBrief('general', command.action, command.args, commandTable.value);
|
||||||
|
const updateSelectedSort = (value: number): void => {
|
||||||
|
selectedSort.value = value as Sort;
|
||||||
|
};
|
||||||
|
const applySelectedSort = (): void => {
|
||||||
|
sort.value = selectedSort.value;
|
||||||
|
};
|
||||||
|
const sortByHeader = (value: Sort): void => {
|
||||||
|
selectedSort.value = value;
|
||||||
|
sort.value = value;
|
||||||
|
};
|
||||||
|
const sortIndicator = (value: Sort, direction: 'ascending' | 'descending'): string =>
|
||||||
|
sort.value === value ? (direction === 'ascending' ? '▲' : '▼') : '↕';
|
||||||
onMounted(load);
|
onMounted(load);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -58,13 +75,13 @@ onMounted(load);
|
|||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>
|
<td>
|
||||||
정렬순서 :
|
<LegacySortControls
|
||||||
<select v-model.number="sort" aria-label="암행부 정렬">
|
control-id="secret-list-sort"
|
||||||
<option v-for="(label, index) in options" :key="label" :value="index + 1">
|
:model-value="selectedSort"
|
||||||
{{ label }}
|
:options="sortOptions"
|
||||||
</option>
|
@update:model-value="updateSelectedSort"
|
||||||
</select>
|
@submit="applySelectedSort"
|
||||||
<input type="submit" value="정렬하기" />
|
/>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
@@ -117,22 +134,94 @@ onMounted(load);
|
|||||||
<tr>
|
<tr>
|
||||||
<th width="98">이 름</th>
|
<th width="98">이 름</th>
|
||||||
<th width="98">통무지</th>
|
<th width="98">통무지</th>
|
||||||
<th width="98">부 대</th>
|
<th width="98" :aria-sort="sort === 8 ? 'descending' : undefined">
|
||||||
<th width="53">자 금</th>
|
<button
|
||||||
<th width="53">군 량</th>
|
class="legacy-sort-header"
|
||||||
<th width="48">도시</th>
|
type="button"
|
||||||
|
aria-label="부대 기준 정렬"
|
||||||
|
@click="sortByHeader(8)"
|
||||||
|
>
|
||||||
|
부 대<span class="legacy-sort-indicator">{{ sortIndicator(8, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
|
<th width="53" :aria-sort="sort === 1 ? 'descending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="자금 기준 정렬"
|
||||||
|
@click="sortByHeader(1)"
|
||||||
|
>
|
||||||
|
자 금<span class="legacy-sort-indicator">{{ sortIndicator(1, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
|
<th width="53" :aria-sort="sort === 2 ? 'descending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="군량 기준 정렬"
|
||||||
|
@click="sortByHeader(2)"
|
||||||
|
>
|
||||||
|
군 량<span class="legacy-sort-indicator">{{ sortIndicator(2, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
|
<th width="48" :aria-sort="sort === 3 ? 'ascending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="도시 기준 정렬"
|
||||||
|
@click="sortByHeader(3)"
|
||||||
|
>
|
||||||
|
도시<span class="legacy-sort-indicator">{{ sortIndicator(3, 'ascending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
<th width="28">守</th>
|
<th width="28">守</th>
|
||||||
<th width="58">병 종</th>
|
<th width="58" :aria-sort="sort === 4 ? 'descending' : undefined">
|
||||||
<th width="63">병 사</th>
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="병종 기준 정렬"
|
||||||
|
@click="sortByHeader(4)"
|
||||||
|
>
|
||||||
|
병 종<span class="legacy-sort-indicator">{{ sortIndicator(4, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
|
<th width="63" :aria-sort="sort === 5 ? 'descending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="병사 기준 정렬"
|
||||||
|
@click="sortByHeader(5)"
|
||||||
|
>
|
||||||
|
병 사<span class="legacy-sort-indicator">{{ sortIndicator(5, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
<th width="38">훈련</th>
|
<th width="38">훈련</th>
|
||||||
<th width="38">사기</th>
|
<th width="38">사기</th>
|
||||||
<th width="213">명 령</th>
|
<th width="213">명 령</th>
|
||||||
<th width="38">삭턴</th>
|
<th width="38" :aria-sort="sort === 6 ? 'ascending' : undefined">
|
||||||
<th width="48">턴</th>
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="삭제턴 기준 정렬"
|
||||||
|
@click="sortByHeader(6)"
|
||||||
|
>
|
||||||
|
삭턴<span class="legacy-sort-indicator">{{ sortIndicator(6, 'ascending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
|
<th width="48" :aria-sort="sort === 7 ? 'ascending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="턴 기준 정렬"
|
||||||
|
@click="sortByHeader(7)"
|
||||||
|
>
|
||||||
|
턴<span class="legacy-sort-indicator">{{ sortIndicator(7, 'ascending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr v-for="general in generals" :key="general.id">
|
<tr v-for="general in generals" :key="general.id" :data-general-id="general.id">
|
||||||
<td>{{ displayName(general) }}<br />Lv {{ general.experienceLevel }}</td>
|
<td>{{ displayName(general) }}<br />Lv {{ general.experienceLevel }}</td>
|
||||||
<td>
|
<td>
|
||||||
{{ general.stats.leadership
|
{{ general.stats.leadership
|
||||||
@@ -235,19 +324,6 @@ th,
|
|||||||
border-bottom-width: 2px;
|
border-bottom-width: 2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
input[type='submit'] {
|
|
||||||
cursor: pointer;
|
|
||||||
padding: 1px 6px;
|
|
||||||
border: 2px outset #fff;
|
|
||||||
background: rgb(107, 107, 107);
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
select {
|
|
||||||
padding: 0;
|
|
||||||
border: 1px solid rgb(133, 133, 133);
|
|
||||||
background: rgb(107, 107, 107);
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
.legacy-bg0 {
|
.legacy-bg0 {
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { onMounted, ref } from 'vue';
|
import { onMounted, ref } from 'vue';
|
||||||
|
|
||||||
|
import LegacySortControls from '../components/ui/LegacySortControls.vue';
|
||||||
import { trpc } from '../utils/trpc';
|
import { trpc } from '../utils/trpc';
|
||||||
|
|
||||||
type NpcList = Awaited<ReturnType<typeof trpc.public.getNpcList.query>>;
|
type NpcList = Awaited<ReturnType<typeof trpc.public.getNpcList.query>>;
|
||||||
@@ -10,6 +11,10 @@ const sort = ref<NpcListSort>(1);
|
|||||||
const data = ref<NpcList | null>(null);
|
const data = ref<NpcList | null>(null);
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
const errorMessage = ref('');
|
const errorMessage = ref('');
|
||||||
|
const sortOptions = ['이름', '국가', '종능', '통솔', '무력', '지력', '명성', '계급'].map((label, index) => ({
|
||||||
|
value: index + 1,
|
||||||
|
label,
|
||||||
|
}));
|
||||||
|
|
||||||
const getErrorMessage = (error: unknown): string => {
|
const getErrorMessage = (error: unknown): string => {
|
||||||
if (error instanceof Error) {
|
if (error instanceof Error) {
|
||||||
@@ -35,6 +40,15 @@ const load = async () => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const closeWindow = () => window.close();
|
const closeWindow = () => window.close();
|
||||||
|
const updateSort = (value: number): void => {
|
||||||
|
sort.value = value as NpcListSort;
|
||||||
|
};
|
||||||
|
const sortByHeader = (value: NpcListSort): void => {
|
||||||
|
updateSort(value);
|
||||||
|
void load();
|
||||||
|
};
|
||||||
|
const sortIndicator = (value: NpcListSort, direction: 'ascending' | 'descending'): string =>
|
||||||
|
sort.value === value ? (direction === 'ascending' ? '▲' : '▼') : '↕';
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
void load();
|
void load();
|
||||||
@@ -53,20 +67,14 @@ onMounted(() => {
|
|||||||
</tr>
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td>
|
<td>
|
||||||
<form class="sort-form" @submit.prevent="load">
|
<LegacySortControls
|
||||||
<label for="npc-list-sort">정렬순서 :</label>
|
control-id="npc-list-sort"
|
||||||
<select id="npc-list-sort" v-model.number="sort" name="type" size="1">
|
:model-value="sort"
|
||||||
<option :value="1">이름</option>
|
:options="sortOptions"
|
||||||
<option :value="2">국가</option>
|
:busy="loading"
|
||||||
<option :value="3">종능</option>
|
@update:model-value="updateSort"
|
||||||
<option :value="4">통솔</option>
|
@submit="load"
|
||||||
<option :value="5">무력</option>
|
/>
|
||||||
<option :value="6">지력</option>
|
|
||||||
<option :value="7">명성</option>
|
|
||||||
<option :value="8">계급</option>
|
|
||||||
</select>
|
|
||||||
<input type="submit" value="정렬하기" :disabled="loading" />
|
|
||||||
</form>
|
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
@@ -92,18 +100,90 @@ onMounted(() => {
|
|||||||
</colgroup>
|
</colgroup>
|
||||||
<thead>
|
<thead>
|
||||||
<tr class="legacy-bg1">
|
<tr class="legacy-bg1">
|
||||||
<th>희생된 장수</th>
|
<th :aria-sort="sort === 1 ? 'ascending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="이름 기준 정렬"
|
||||||
|
@click="sortByHeader(1)"
|
||||||
|
>
|
||||||
|
희생된 장수<span class="legacy-sort-indicator">{{ sortIndicator(1, 'ascending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
<th>악령 이름</th>
|
<th>악령 이름</th>
|
||||||
<th>레벨</th>
|
<th>레벨</th>
|
||||||
<th>국가</th>
|
<th :aria-sort="sort === 2 ? 'ascending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="국가 기준 정렬"
|
||||||
|
@click="sortByHeader(2)"
|
||||||
|
>
|
||||||
|
국가<span class="legacy-sort-indicator">{{ sortIndicator(2, 'ascending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
<th>성격</th>
|
<th>성격</th>
|
||||||
<th>특기</th>
|
<th>특기</th>
|
||||||
<th>종능</th>
|
<th :aria-sort="sort === 3 ? 'descending' : undefined">
|
||||||
<th>통솔</th>
|
<button
|
||||||
<th>무력</th>
|
class="legacy-sort-header"
|
||||||
<th>지력</th>
|
type="button"
|
||||||
<th>명성</th>
|
aria-label="종능 기준 정렬"
|
||||||
<th>계급</th>
|
@click="sortByHeader(3)"
|
||||||
|
>
|
||||||
|
종능<span class="legacy-sort-indicator">{{ sortIndicator(3, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
|
<th :aria-sort="sort === 4 ? 'descending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="통솔 기준 정렬"
|
||||||
|
@click="sortByHeader(4)"
|
||||||
|
>
|
||||||
|
통솔<span class="legacy-sort-indicator">{{ sortIndicator(4, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
|
<th :aria-sort="sort === 5 ? 'descending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="무력 기준 정렬"
|
||||||
|
@click="sortByHeader(5)"
|
||||||
|
>
|
||||||
|
무력<span class="legacy-sort-indicator">{{ sortIndicator(5, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
|
<th :aria-sort="sort === 6 ? 'descending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="지력 기준 정렬"
|
||||||
|
@click="sortByHeader(6)"
|
||||||
|
>
|
||||||
|
지력<span class="legacy-sort-indicator">{{ sortIndicator(6, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
|
<th :aria-sort="sort === 7 ? 'descending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="명성 기준 정렬"
|
||||||
|
@click="sortByHeader(7)"
|
||||||
|
>
|
||||||
|
명성<span class="legacy-sort-indicator">{{ sortIndicator(7, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
|
<th :aria-sort="sort === 8 ? 'descending' : undefined">
|
||||||
|
<button
|
||||||
|
class="legacy-sort-header"
|
||||||
|
type="button"
|
||||||
|
aria-label="계급 기준 정렬"
|
||||||
|
@click="sortByHeader(8)"
|
||||||
|
>
|
||||||
|
계급<span class="legacy-sort-indicator">{{ sortIndicator(8, 'descending') }}</span>
|
||||||
|
</button>
|
||||||
|
</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
@@ -202,32 +282,6 @@ onMounted(() => {
|
|||||||
min-height: 20px;
|
min-height: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sort-form {
|
|
||||||
min-height: 25px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
gap: 4px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sort-form select,
|
|
||||||
.sort-form input[type='submit'] {
|
|
||||||
height: 23px;
|
|
||||||
font: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sort-form select {
|
|
||||||
background: #ddd;
|
|
||||||
color: #303030;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sort-form input[type='submit'] {
|
|
||||||
border: 2px outset #fff;
|
|
||||||
background: #6b6b6b;
|
|
||||||
color: #fff;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.npc-table {
|
.npc-table {
|
||||||
margin-top: 0;
|
margin-top: 0;
|
||||||
}
|
}
|
||||||
@@ -321,8 +375,7 @@ onMounted(() => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.legacy-close:focus-visible,
|
.legacy-close:focus-visible,
|
||||||
.sort-form select:focus-visible,
|
.trait-tooltip:focus-visible {
|
||||||
.sort-form input[type='submit']:focus-visible {
|
|
||||||
outline: 2px solid #f39c12;
|
outline: 2px solid #f39c12;
|
||||||
outline-offset: 1px;
|
outline-offset: 1px;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -27,6 +27,14 @@ two shell layers. It owns only control geometry and state rules that are proven
|
|||||||
identical in the Ref Bootstrap/Lumen family. A page still owns control width,
|
identical in the Ref Bootstrap/Lumen family. A page still owns control width,
|
||||||
grid placement, and any visual family that is not Bootstrap/Lumen.
|
grid placement, and any visual family that is not Bootstrap/Lumen.
|
||||||
|
|
||||||
|
The Ref-style directory pages share a second, deliberately compact control
|
||||||
|
family through `LegacySortControls.vue`. Its `.legacy-sort-*` rules own the
|
||||||
|
explicit dark select/option palette, the raised submit button, and the
|
||||||
|
focus/active states for sortable table headers. A page supplies only the
|
||||||
|
available legacy sort keys, their fixed directions, and placement. Columns
|
||||||
|
without an unambiguous legacy sort key remain plain headers rather than
|
||||||
|
inventing a new ordering contract.
|
||||||
|
|
||||||
## Button composition
|
## Button composition
|
||||||
|
|
||||||
Choose the Ref visual family before choosing a semantic color. Buttons from
|
Choose the Ref visual family before choosing a semantic color. Buttons from
|
||||||
|
|||||||
@@ -452,6 +452,8 @@ export class ActionResolver<
|
|||||||
}),
|
}),
|
||||||
turnTime,
|
turnTime,
|
||||||
...(turnTick === undefined ? {} : { turnTick }),
|
...(turnTick === undefined ? {} : { turnTick }),
|
||||||
|
bornYear: birthYear,
|
||||||
|
deadYear: deathYear,
|
||||||
};
|
};
|
||||||
effects.push(createGeneralAddEffect(newGeneral));
|
effects.push(createGeneralAddEffect(newGeneral));
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,113 @@
|
|||||||
|
import { ConstantRNG, RandUtil } from '@sammo-ts/common';
|
||||||
|
import { describe, expect, it } from 'vitest';
|
||||||
|
|
||||||
|
import type { General, Nation } from '../../../src/domain/entities.js';
|
||||||
|
import {
|
||||||
|
ActionResolver,
|
||||||
|
type VolunteerRecruitEnvironment,
|
||||||
|
type VolunteerRecruitResolveContext,
|
||||||
|
} from '../../../src/actions/turn/nation/che_의병모집.js';
|
||||||
|
|
||||||
|
const general: General = {
|
||||||
|
id: 1,
|
||||||
|
name: '군주',
|
||||||
|
nationId: 1,
|
||||||
|
cityId: 3,
|
||||||
|
troopId: 0,
|
||||||
|
stats: { leadership: 70, strength: 70, intelligence: 70 },
|
||||||
|
experience: 1_000,
|
||||||
|
dedication: 1_000,
|
||||||
|
officerLevel: 12,
|
||||||
|
role: {
|
||||||
|
personality: null,
|
||||||
|
specialDomestic: null,
|
||||||
|
specialWar: null,
|
||||||
|
items: { horse: null, weapon: null, book: null, item: null },
|
||||||
|
},
|
||||||
|
injury: 0,
|
||||||
|
gold: 1_000,
|
||||||
|
rice: 1_000,
|
||||||
|
crew: 0,
|
||||||
|
crewTypeId: 0,
|
||||||
|
train: 0,
|
||||||
|
atmos: 0,
|
||||||
|
age: 30,
|
||||||
|
npcState: 0,
|
||||||
|
triggerState: { flags: {}, counters: {}, modifiers: {}, meta: {} },
|
||||||
|
meta: { killturn: 24 },
|
||||||
|
};
|
||||||
|
|
||||||
|
const nation: Nation = {
|
||||||
|
id: 1,
|
||||||
|
name: '테스트국',
|
||||||
|
color: '#000000',
|
||||||
|
capitalCityId: 3,
|
||||||
|
chiefGeneralId: 1,
|
||||||
|
gold: 10_000,
|
||||||
|
rice: 10_000,
|
||||||
|
power: 0,
|
||||||
|
level: 1,
|
||||||
|
typeCode: 'che_중립',
|
||||||
|
meta: { gennum: 1, strategic_cmd_limit: 0 },
|
||||||
|
};
|
||||||
|
|
||||||
|
const environment: VolunteerRecruitEnvironment = {
|
||||||
|
openingPartYear: 0,
|
||||||
|
initialNationGenLimit: 10,
|
||||||
|
defaultNpcGold: 1_000,
|
||||||
|
defaultNpcRice: 1_000,
|
||||||
|
defaultCrewTypeId: 0,
|
||||||
|
defaultSpecialDomestic: null,
|
||||||
|
defaultSpecialWar: null,
|
||||||
|
createCountBase: 1,
|
||||||
|
createCountDivisor: 8,
|
||||||
|
npcAge: 20,
|
||||||
|
npcDeathYears: 10,
|
||||||
|
randomGeneralFirstNames: ['장'],
|
||||||
|
randomGeneralMiddleNames: [''],
|
||||||
|
randomGeneralLastNames: ['수'],
|
||||||
|
availablePersonalities: ['che_안전'],
|
||||||
|
};
|
||||||
|
|
||||||
|
describe('nation volunteer recruitment lifespan', () => {
|
||||||
|
it('places the Ref birth and death years on the created general entity', () => {
|
||||||
|
const resolver = new ActionResolver([], environment);
|
||||||
|
const context = {
|
||||||
|
general: structuredClone(general),
|
||||||
|
nation: structuredClone(nation),
|
||||||
|
rng: new RandUtil(new ConstantRNG(0)),
|
||||||
|
addLog: () => undefined,
|
||||||
|
currentYear: 190,
|
||||||
|
currentMonth: 1,
|
||||||
|
startYear: 180,
|
||||||
|
averageNationGeneralCount: 0,
|
||||||
|
nationAverageStats: { leadership: 50, strength: 50, intelligence: 50 },
|
||||||
|
nationAverageExperience: 1_000,
|
||||||
|
nationAverageDedication: 1_000,
|
||||||
|
nationAverageDex: [100, 100, 100, 100, 100],
|
||||||
|
friendlyGenerals: [general],
|
||||||
|
createGeneralId: () => 2,
|
||||||
|
turnTermSeconds: 60,
|
||||||
|
turnTimeBase: new Date('0190-01-01T00:00:00.000Z'),
|
||||||
|
ticksPerSecond: 1,
|
||||||
|
} as VolunteerRecruitResolveContext;
|
||||||
|
|
||||||
|
const outcome = resolver.resolve(context, {});
|
||||||
|
const createdEffect = outcome.effects.find((effect) => effect.type === 'general:add');
|
||||||
|
expect(createdEffect?.type).toBe('general:add');
|
||||||
|
if (!createdEffect || createdEffect.type !== 'general:add') {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
const created = createdEffect.general as General & { bornYear?: number; deadYear?: number };
|
||||||
|
expect(created).toMatchObject({
|
||||||
|
name: 'ⓖ장수',
|
||||||
|
bornYear: 170,
|
||||||
|
deadYear: 200,
|
||||||
|
meta: {
|
||||||
|
birthYear: 170,
|
||||||
|
deathYear: 200,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
Reference in New Issue
Block a user