feat: add NationGeneralsView and NationPersonnelView components for managing generals and personnel in the nation
This commit is contained in:
@@ -1,10 +1,874 @@
|
||||
import { TRPCError } from '@trpc/server';
|
||||
import { z } from 'zod';
|
||||
|
||||
import { asNumber, asRecord } from '@sammo-ts/common';
|
||||
import {
|
||||
DomesticTraitLoader,
|
||||
loadDomesticTraitModules,
|
||||
isDomesticTraitKey,
|
||||
loadNationTraitModules,
|
||||
NationTraitLoader,
|
||||
isNationTraitKey,
|
||||
loadPersonalityTraitModules,
|
||||
PersonalityTraitLoader,
|
||||
isPersonalityTraitKey,
|
||||
loadWarTraitModules,
|
||||
WarTraitLoader,
|
||||
isWarTraitKey,
|
||||
type GeneralActionContext,
|
||||
type General as LogicGeneral,
|
||||
type Nation as LogicNation,
|
||||
type TriggerValue,
|
||||
} from '@sammo-ts/logic';
|
||||
|
||||
import type { WorldStateRow } from '../../context.js';
|
||||
import { authedProcedure, router } from '../../trpc.js';
|
||||
import { getMyGeneral } from '../shared/general.js';
|
||||
|
||||
type PermissionKind = 'normal' | 'ambassador' | 'auditor';
|
||||
|
||||
type TraitNameMap = Map<string, { name: string; info: string }>;
|
||||
|
||||
type TraitCache = {
|
||||
domestic: TraitNameMap;
|
||||
war: TraitNameMap;
|
||||
personality: TraitNameMap;
|
||||
nation: TraitNameMap;
|
||||
};
|
||||
|
||||
type NationTraitModule = Awaited<ReturnType<typeof loadNationTraitModules>>[number] | null;
|
||||
|
||||
type NationIncomeContext = {
|
||||
trait: NationTraitModule;
|
||||
context: GeneralActionContext;
|
||||
rate: number;
|
||||
};
|
||||
|
||||
type NationIncomeRow = {
|
||||
id: number;
|
||||
name: string;
|
||||
color: string;
|
||||
capitalCityId: number | null;
|
||||
level: number;
|
||||
typeCode: string;
|
||||
meta: unknown;
|
||||
gold?: number;
|
||||
rice?: number;
|
||||
};
|
||||
|
||||
type CityIncomeRow = {
|
||||
id: number;
|
||||
name: string;
|
||||
level: number;
|
||||
nationId: number;
|
||||
region: number;
|
||||
population: number;
|
||||
populationMax: number;
|
||||
agriculture: number;
|
||||
agricultureMax: number;
|
||||
commerce: number;
|
||||
commerceMax: number;
|
||||
security: number;
|
||||
securityMax: number;
|
||||
trust: number;
|
||||
trade: number;
|
||||
defence: number;
|
||||
defenceMax: number;
|
||||
wall: number;
|
||||
wallMax: number;
|
||||
supplyState: number;
|
||||
frontState: number;
|
||||
meta: unknown;
|
||||
};
|
||||
|
||||
type GeneralListRow = {
|
||||
id: number;
|
||||
name: string;
|
||||
npcState: number;
|
||||
nationId: number;
|
||||
cityId: number;
|
||||
troopId: number;
|
||||
officerLevel: number;
|
||||
leadership: number;
|
||||
strength: number;
|
||||
intel: number;
|
||||
experience: number;
|
||||
dedication: number;
|
||||
injury: number;
|
||||
gold: number;
|
||||
rice: number;
|
||||
crew: number;
|
||||
personalCode: string;
|
||||
specialCode: string;
|
||||
special2Code: string;
|
||||
meta: unknown;
|
||||
penalty: unknown;
|
||||
};
|
||||
|
||||
type GeneralOfficerRow = {
|
||||
id: number;
|
||||
name: string;
|
||||
npcState: number;
|
||||
officerLevel: number;
|
||||
cityId: number;
|
||||
leadership: number;
|
||||
strength: number;
|
||||
intel: number;
|
||||
meta: unknown;
|
||||
};
|
||||
|
||||
const traitCache: TraitCache = {
|
||||
domestic: new Map(),
|
||||
war: new Map(),
|
||||
personality: new Map(),
|
||||
nation: new Map(),
|
||||
};
|
||||
|
||||
const DEFAULT_CHIEF_STAT_MIN = 65;
|
||||
|
||||
const normalizeTraitKey = (value: string | null | undefined): string | null => {
|
||||
if (!value || value === 'None') {
|
||||
return null;
|
||||
}
|
||||
return value;
|
||||
};
|
||||
|
||||
const readMetaNumber = (meta: Record<string, unknown>, key: string, fallback: number): number => {
|
||||
const raw = meta[key];
|
||||
return typeof raw === 'number' && Number.isFinite(raw) ? raw : fallback;
|
||||
};
|
||||
|
||||
const resolveOfficerCity = (meta: Record<string, unknown>): number => {
|
||||
const camel = readMetaNumber(meta, 'officerCity', 0);
|
||||
if (camel > 0) {
|
||||
return camel;
|
||||
}
|
||||
return readMetaNumber(meta, 'officer_city', 0);
|
||||
};
|
||||
|
||||
const resolveBelong = (meta: Record<string, unknown>): number => readMetaNumber(meta, 'belong', 0);
|
||||
|
||||
const resolvePermission = (meta: Record<string, unknown>): PermissionKind => {
|
||||
const value = meta.permission;
|
||||
if (value === 'ambassador' || value === 'auditor') {
|
||||
return value;
|
||||
}
|
||||
return 'normal';
|
||||
};
|
||||
|
||||
const resolveChiefStatMin = (worldState: WorldStateRow | null): number => {
|
||||
if (!worldState) {
|
||||
return DEFAULT_CHIEF_STAT_MIN;
|
||||
}
|
||||
const config = asRecord(worldState.config);
|
||||
const stat = asRecord(config.stat);
|
||||
return asNumber(stat.chiefMin, DEFAULT_CHIEF_STAT_MIN);
|
||||
};
|
||||
|
||||
const resolveNationRate = (nation: NationIncomeRow): number => {
|
||||
const meta = asRecord(nation.meta);
|
||||
return asNumber(meta.rate, 20);
|
||||
};
|
||||
|
||||
const checkSecretMaxPermission = (penalty: Record<string, unknown>): number => {
|
||||
if (penalty.noTopSecret) {
|
||||
return 1;
|
||||
}
|
||||
if (penalty.noChief) {
|
||||
return 1;
|
||||
}
|
||||
if (penalty.noAmbassador) {
|
||||
return 2;
|
||||
}
|
||||
return 4;
|
||||
};
|
||||
|
||||
const loadTraitNames = async (
|
||||
keys: Array<string | null>,
|
||||
kind: keyof TraitCache
|
||||
): Promise<TraitNameMap> => {
|
||||
const cache = traitCache[kind];
|
||||
const unique = Array.from(new Set(keys.filter((key): key is string => Boolean(key))));
|
||||
const missing = unique.filter((key) => !cache.has(key));
|
||||
|
||||
if (!missing.length) {
|
||||
return cache;
|
||||
}
|
||||
|
||||
if (kind === 'domestic') {
|
||||
const filtered = missing.filter((key) => isDomesticTraitKey(key));
|
||||
if (filtered.length) {
|
||||
const modules = await loadDomesticTraitModules(filtered, new DomesticTraitLoader());
|
||||
for (const module of modules) {
|
||||
cache.set(module.key, { name: module.name, info: module.info ?? '' });
|
||||
}
|
||||
}
|
||||
} else if (kind === 'war') {
|
||||
const filtered = missing.filter((key) => isWarTraitKey(key));
|
||||
if (filtered.length) {
|
||||
const modules = await loadWarTraitModules(filtered, new WarTraitLoader());
|
||||
for (const module of modules) {
|
||||
cache.set(module.key, { name: module.name, info: module.info ?? '' });
|
||||
}
|
||||
}
|
||||
} else if (kind === 'personality') {
|
||||
const filtered = missing.filter((key) => isPersonalityTraitKey(key));
|
||||
if (filtered.length) {
|
||||
const modules = await loadPersonalityTraitModules(filtered, new PersonalityTraitLoader());
|
||||
for (const module of modules) {
|
||||
cache.set(module.key, { name: module.name, info: module.info ?? '' });
|
||||
}
|
||||
}
|
||||
} else if (kind === 'nation') {
|
||||
const filtered = missing.filter((key) => isNationTraitKey(key));
|
||||
if (filtered.length) {
|
||||
const modules = await loadNationTraitModules(filtered, new NationTraitLoader());
|
||||
for (const module of modules) {
|
||||
cache.set(module.key, { name: module.name, info: module.info ?? '' });
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return cache;
|
||||
};
|
||||
|
||||
const buildIncomeContext = (nation: NationIncomeRow): GeneralActionContext => {
|
||||
const nationMeta = asRecord(nation.meta) as Record<string, TriggerValue>;
|
||||
const general: LogicGeneral = {
|
||||
id: 0,
|
||||
name: 'SYSTEM',
|
||||
nationId: nation.id,
|
||||
cityId: 0,
|
||||
troopId: 0,
|
||||
stats: { leadership: 0, strength: 0, intelligence: 0 },
|
||||
experience: 0,
|
||||
dedication: 0,
|
||||
officerLevel: 0,
|
||||
role: {
|
||||
personality: null,
|
||||
specialDomestic: null,
|
||||
specialWar: null,
|
||||
items: {
|
||||
horse: null,
|
||||
weapon: null,
|
||||
book: null,
|
||||
item: null,
|
||||
},
|
||||
},
|
||||
injury: 0,
|
||||
gold: 0,
|
||||
rice: 0,
|
||||
crew: 0,
|
||||
crewTypeId: 0,
|
||||
train: 0,
|
||||
atmos: 0,
|
||||
age: 0,
|
||||
npcState: 0,
|
||||
triggerState: {
|
||||
flags: {},
|
||||
counters: {},
|
||||
modifiers: {},
|
||||
meta: {},
|
||||
},
|
||||
meta: {},
|
||||
};
|
||||
const logicNation: LogicNation = {
|
||||
id: nation.id,
|
||||
name: nation.name,
|
||||
color: nation.color,
|
||||
capitalCityId: nation.capitalCityId,
|
||||
chiefGeneralId: null,
|
||||
gold: nation.gold ?? 0,
|
||||
rice: nation.rice ?? 0,
|
||||
power: 0,
|
||||
level: nation.level,
|
||||
typeCode: nation.typeCode,
|
||||
meta: nationMeta,
|
||||
};
|
||||
return { general, nation: logicNation };
|
||||
};
|
||||
|
||||
const buildNationIncomeContext = async (nation: NationIncomeRow): Promise<NationIncomeContext> => {
|
||||
let trait: NationTraitModule = null;
|
||||
if (isNationTraitKey(nation.typeCode)) {
|
||||
[trait] = await loadNationTraitModules([nation.typeCode], new NationTraitLoader());
|
||||
}
|
||||
return {
|
||||
trait,
|
||||
context: buildIncomeContext(nation),
|
||||
rate: resolveNationRate(nation),
|
||||
};
|
||||
};
|
||||
|
||||
const applyNationIncome = (
|
||||
incomeContext: NationIncomeContext,
|
||||
type: 'gold' | 'rice' | 'pop',
|
||||
amount: number
|
||||
): number => {
|
||||
if (!incomeContext.trait?.onCalcNationalIncome) {
|
||||
return amount;
|
||||
}
|
||||
return incomeContext.trait.onCalcNationalIncome(incomeContext.context, type, amount);
|
||||
};
|
||||
|
||||
const calcCityGoldIncome = (
|
||||
incomeContext: NationIncomeContext,
|
||||
city: CityIncomeRow,
|
||||
officerCnt: number,
|
||||
isCapital: boolean,
|
||||
nationLevel: number
|
||||
): number => {
|
||||
if (city.supplyState === 0) {
|
||||
return 0;
|
||||
}
|
||||
const trustRatio = city.trust / 200 + 0.5;
|
||||
const commMax = Math.max(1, city.commerceMax);
|
||||
const secuMax = Math.max(1, city.securityMax);
|
||||
|
||||
let income = (city.population * city.commerce * trustRatio) / commMax / 30;
|
||||
income *= 1 + city.security / secuMax / 10;
|
||||
income *= Math.pow(1.05, officerCnt);
|
||||
if (isCapital && nationLevel > 0) {
|
||||
income *= 1 + 1 / (3 * nationLevel);
|
||||
}
|
||||
|
||||
const adjusted = applyNationIncome(incomeContext, 'gold', income);
|
||||
return Math.round(adjusted * (incomeContext.rate / 20));
|
||||
};
|
||||
|
||||
const calcCityRiceIncome = (
|
||||
incomeContext: NationIncomeContext,
|
||||
city: CityIncomeRow,
|
||||
officerCnt: number,
|
||||
isCapital: boolean,
|
||||
nationLevel: number
|
||||
): number => {
|
||||
if (city.supplyState === 0) {
|
||||
return 0;
|
||||
}
|
||||
const trustRatio = city.trust / 200 + 0.5;
|
||||
const agriMax = Math.max(1, city.agricultureMax);
|
||||
const secuMax = Math.max(1, city.securityMax);
|
||||
|
||||
let income = (city.population * city.agriculture * trustRatio) / agriMax / 30;
|
||||
income *= 1 + city.security / secuMax / 10;
|
||||
income *= Math.pow(1.05, officerCnt);
|
||||
if (isCapital && nationLevel > 0) {
|
||||
income *= 1 + 1 / (3 * nationLevel);
|
||||
}
|
||||
|
||||
const adjusted = applyNationIncome(incomeContext, 'rice', income);
|
||||
return Math.round(adjusted * (incomeContext.rate / 20));
|
||||
};
|
||||
|
||||
const calcCityWallIncome = (
|
||||
incomeContext: NationIncomeContext,
|
||||
city: CityIncomeRow,
|
||||
officerCnt: number,
|
||||
isCapital: boolean,
|
||||
nationLevel: number
|
||||
): number => {
|
||||
if (city.supplyState === 0) {
|
||||
return 0;
|
||||
}
|
||||
const wallMax = Math.max(1, city.wallMax);
|
||||
const secuMax = Math.max(1, city.securityMax);
|
||||
|
||||
let income = (city.defence * city.wall) / wallMax / 3;
|
||||
income *= 1 + city.security / secuMax / 10;
|
||||
income *= Math.pow(1.05, officerCnt);
|
||||
if (isCapital && nationLevel > 0) {
|
||||
income *= 1 + 1 / (3 * nationLevel);
|
||||
}
|
||||
|
||||
const adjusted = applyNationIncome(incomeContext, 'rice', income);
|
||||
return Math.round(adjusted * (incomeContext.rate / 20));
|
||||
};
|
||||
|
||||
const assertNationAccess = (general: { nationId: number; officerLevel: number }) => {
|
||||
if (general.nationId <= 0 || general.officerLevel <= 0) {
|
||||
throw new TRPCError({ code: 'PRECONDITION_FAILED', message: 'Nation membership required.' });
|
||||
}
|
||||
};
|
||||
|
||||
const mapGeneralList = async (
|
||||
generals: GeneralListRow[],
|
||||
cityNameMap: Map<number, string>,
|
||||
troopNameMap: Map<number, string>
|
||||
) => {
|
||||
const personalityKeys = generals.map((general) => normalizeTraitKey(general.personalCode));
|
||||
const domesticKeys = generals.map((general) => normalizeTraitKey(general.specialCode));
|
||||
const warKeys = generals.map((general) => normalizeTraitKey(general.special2Code));
|
||||
|
||||
const [personalityMap, domesticMap, warMap] = await Promise.all([
|
||||
loadTraitNames(personalityKeys, 'personality'),
|
||||
loadTraitNames(domesticKeys, 'domestic'),
|
||||
loadTraitNames(warKeys, 'war'),
|
||||
]);
|
||||
|
||||
return generals.map((general) => {
|
||||
const meta = asRecord(general.meta);
|
||||
const officerCity = resolveOfficerCity(meta);
|
||||
const permission = resolvePermission(meta);
|
||||
const belong = resolveBelong(meta);
|
||||
const personalityKey = normalizeTraitKey(general.personalCode);
|
||||
const domesticKey = normalizeTraitKey(general.specialCode);
|
||||
const warKey = normalizeTraitKey(general.special2Code);
|
||||
|
||||
return {
|
||||
id: general.id,
|
||||
name: general.name,
|
||||
npcState: general.npcState,
|
||||
officerLevel: general.officerLevel,
|
||||
cityId: general.cityId,
|
||||
cityName: cityNameMap.get(general.cityId) ?? null,
|
||||
troopId: general.troopId,
|
||||
troopName: troopNameMap.get(general.troopId) ?? null,
|
||||
officerCity,
|
||||
officerCityName: officerCity > 0 ? cityNameMap.get(officerCity) ?? null : null,
|
||||
stats: {
|
||||
leadership: general.leadership,
|
||||
strength: general.strength,
|
||||
intelligence: general.intel,
|
||||
},
|
||||
experience: general.experience,
|
||||
dedication: general.dedication,
|
||||
injury: general.injury,
|
||||
gold: general.gold,
|
||||
rice: general.rice,
|
||||
crew: general.crew,
|
||||
personality: personalityKey
|
||||
? {
|
||||
key: personalityKey,
|
||||
name: personalityMap.get(personalityKey)?.name ?? personalityKey,
|
||||
}
|
||||
: null,
|
||||
specialDomestic: domesticKey
|
||||
? {
|
||||
key: domesticKey,
|
||||
name: domesticMap.get(domesticKey)?.name ?? domesticKey,
|
||||
}
|
||||
: null,
|
||||
specialWar: warKey
|
||||
? {
|
||||
key: warKey,
|
||||
name: warMap.get(warKey)?.name ?? warKey,
|
||||
}
|
||||
: null,
|
||||
belong,
|
||||
permission,
|
||||
};
|
||||
});
|
||||
};
|
||||
|
||||
export const nationRouter = router({
|
||||
getGeneralList: authedProcedure.query(async ({ ctx }) => {
|
||||
const general = await getMyGeneral(ctx);
|
||||
assertNationAccess(general);
|
||||
|
||||
const [nation, cityRows, troopRows, generalRows, worldState] = await Promise.all([
|
||||
ctx.db.nation.findUnique({
|
||||
where: { id: general.nationId },
|
||||
select: {
|
||||
id: true,
|
||||
name: true,
|
||||
color: true,
|
||||
level: true,
|
||||
typeCode: true,
|
||||
capitalCityId: true,
|
||||
meta: true,
|
||||
},
|
||||
}),
|
||||
ctx.db.city.findMany({ select: { id: true, name: true } }),
|
||||
ctx.db.troop.findMany({ select: { troopLeaderId: true, name: true } }),
|
||||
ctx.db.general.findMany({
|
||||
where: { nationId: general.nationId },
|
||||
select: {
|
||||
id: true,
|
||||
name: true,
|
||||
npcState: true,
|
||||
nationId: true,
|
||||
cityId: true,
|
||||
troopId: true,
|
||||
picture: true,
|
||||
imageServer: true,
|
||||
officerLevel: true,
|
||||
leadership: true,
|
||||
strength: true,
|
||||
intel: true,
|
||||
experience: true,
|
||||
dedication: true,
|
||||
injury: true,
|
||||
gold: true,
|
||||
rice: true,
|
||||
crew: true,
|
||||
personalCode: true,
|
||||
specialCode: true,
|
||||
special2Code: true,
|
||||
meta: true,
|
||||
penalty: true,
|
||||
},
|
||||
orderBy: { id: 'asc' },
|
||||
}),
|
||||
ctx.db.worldState.findFirst(),
|
||||
]);
|
||||
|
||||
if (!nation) {
|
||||
throw new TRPCError({ code: 'NOT_FOUND', message: 'Nation not found' });
|
||||
}
|
||||
|
||||
const cityNameMap = new Map(cityRows.map((city) => [city.id, city.name]));
|
||||
const troopNameMap = new Map(troopRows.map((troop) => [troop.troopLeaderId, troop.name]));
|
||||
const list = await mapGeneralList(generalRows, cityNameMap, troopNameMap);
|
||||
|
||||
return {
|
||||
nation: {
|
||||
id: nation.id,
|
||||
name: nation.name,
|
||||
color: nation.color,
|
||||
level: nation.level,
|
||||
typeCode: nation.typeCode,
|
||||
capitalCityId: nation.capitalCityId ?? 0,
|
||||
},
|
||||
chiefStatMin: resolveChiefStatMin(worldState),
|
||||
generals: list,
|
||||
};
|
||||
}),
|
||||
getCityOverview: authedProcedure.query(async ({ ctx }) => {
|
||||
const me = await getMyGeneral(ctx);
|
||||
assertNationAccess(me);
|
||||
|
||||
const [nation, cityRows, generalRows, worldState] = await Promise.all([
|
||||
ctx.db.nation.findUnique({
|
||||
where: { id: me.nationId },
|
||||
select: {
|
||||
id: true,
|
||||
name: true,
|
||||
color: true,
|
||||
level: true,
|
||||
typeCode: true,
|
||||
capitalCityId: true,
|
||||
meta: true,
|
||||
},
|
||||
}),
|
||||
ctx.db.city.findMany({
|
||||
where: { nationId: me.nationId },
|
||||
select: {
|
||||
id: true,
|
||||
name: true,
|
||||
level: true,
|
||||
nationId: true,
|
||||
region: true,
|
||||
population: true,
|
||||
populationMax: true,
|
||||
agriculture: true,
|
||||
agricultureMax: true,
|
||||
commerce: true,
|
||||
commerceMax: true,
|
||||
security: true,
|
||||
securityMax: true,
|
||||
trust: true,
|
||||
trade: true,
|
||||
defence: true,
|
||||
defenceMax: true,
|
||||
wall: true,
|
||||
wallMax: true,
|
||||
supplyState: true,
|
||||
frontState: true,
|
||||
meta: true,
|
||||
},
|
||||
orderBy: { id: 'asc' },
|
||||
}),
|
||||
ctx.db.general.findMany({
|
||||
where: { nationId: me.nationId },
|
||||
select: {
|
||||
id: true,
|
||||
name: true,
|
||||
npcState: true,
|
||||
officerLevel: true,
|
||||
cityId: true,
|
||||
leadership: true,
|
||||
strength: true,
|
||||
intel: true,
|
||||
meta: true,
|
||||
},
|
||||
orderBy: { id: 'asc' },
|
||||
}),
|
||||
ctx.db.worldState.findFirst(),
|
||||
]);
|
||||
|
||||
if (!nation) {
|
||||
throw new TRPCError({ code: 'NOT_FOUND', message: 'Nation not found' });
|
||||
}
|
||||
|
||||
const cityNameMap = new Map(cityRows.map((city) => [city.id, city.name]));
|
||||
|
||||
const officerByCity = new Map<number, Record<number, GeneralOfficerRow>>();
|
||||
const officerCntByCity = new Map<number, number>();
|
||||
|
||||
for (const general of generalRows) {
|
||||
if (general.officerLevel < 2 || general.officerLevel > 4) {
|
||||
continue;
|
||||
}
|
||||
const meta = asRecord(general.meta);
|
||||
const officerCity = resolveOfficerCity(meta);
|
||||
if (!officerCity) {
|
||||
continue;
|
||||
}
|
||||
const entry = officerByCity.get(officerCity) ?? {};
|
||||
entry[general.officerLevel] = general;
|
||||
officerByCity.set(officerCity, entry);
|
||||
|
||||
if (general.cityId === officerCity) {
|
||||
officerCntByCity.set(officerCity, (officerCntByCity.get(officerCity) ?? 0) + 1);
|
||||
}
|
||||
}
|
||||
|
||||
const incomeContext = await buildNationIncomeContext(nation);
|
||||
|
||||
const cities = cityRows.map((city) => {
|
||||
const officers = officerByCity.get(city.id) ?? {};
|
||||
const officerCnt = officerCntByCity.get(city.id) ?? 0;
|
||||
const isCapital = nation.capitalCityId === city.id;
|
||||
const incomes = {
|
||||
gold: calcCityGoldIncome(incomeContext, city, officerCnt, isCapital, nation.level),
|
||||
rice: calcCityRiceIncome(incomeContext, city, officerCnt, isCapital, nation.level),
|
||||
wall: calcCityWallIncome(incomeContext, city, officerCnt, isCapital, nation.level),
|
||||
};
|
||||
|
||||
return {
|
||||
id: city.id,
|
||||
name: city.name,
|
||||
level: city.level,
|
||||
region: city.region,
|
||||
population: city.population,
|
||||
populationMax: city.populationMax,
|
||||
agriculture: city.agriculture,
|
||||
agricultureMax: city.agricultureMax,
|
||||
commerce: city.commerce,
|
||||
commerceMax: city.commerceMax,
|
||||
security: city.security,
|
||||
securityMax: city.securityMax,
|
||||
trust: city.trust,
|
||||
trade: city.trade,
|
||||
defence: city.defence,
|
||||
defenceMax: city.defenceMax,
|
||||
wall: city.wall,
|
||||
wallMax: city.wallMax,
|
||||
supplyState: city.supplyState,
|
||||
frontState: city.frontState,
|
||||
incomes,
|
||||
officers: {
|
||||
4: officers[4]
|
||||
? {
|
||||
id: officers[4].id,
|
||||
name: officers[4].name,
|
||||
npcState: officers[4].npcState,
|
||||
officerLevel: officers[4].officerLevel,
|
||||
cityId: officers[4].cityId,
|
||||
cityName: cityNameMap.get(officers[4].cityId) ?? null,
|
||||
}
|
||||
: null,
|
||||
3: officers[3]
|
||||
? {
|
||||
id: officers[3].id,
|
||||
name: officers[3].name,
|
||||
npcState: officers[3].npcState,
|
||||
officerLevel: officers[3].officerLevel,
|
||||
cityId: officers[3].cityId,
|
||||
cityName: cityNameMap.get(officers[3].cityId) ?? null,
|
||||
}
|
||||
: null,
|
||||
2: officers[2]
|
||||
? {
|
||||
id: officers[2].id,
|
||||
name: officers[2].name,
|
||||
npcState: officers[2].npcState,
|
||||
officerLevel: officers[2].officerLevel,
|
||||
cityId: officers[2].cityId,
|
||||
cityName: cityNameMap.get(officers[2].cityId) ?? null,
|
||||
}
|
||||
: null,
|
||||
},
|
||||
};
|
||||
});
|
||||
|
||||
const generals = generalRows.map((general) => {
|
||||
const meta = asRecord(general.meta);
|
||||
return {
|
||||
id: general.id,
|
||||
name: general.name,
|
||||
npcState: general.npcState,
|
||||
officerLevel: general.officerLevel,
|
||||
cityId: general.cityId,
|
||||
officerCity: resolveOfficerCity(meta),
|
||||
stats: {
|
||||
leadership: general.leadership,
|
||||
strength: general.strength,
|
||||
intelligence: general.intel,
|
||||
},
|
||||
};
|
||||
});
|
||||
|
||||
return {
|
||||
me: {
|
||||
id: me.id,
|
||||
officerLevel: me.officerLevel,
|
||||
},
|
||||
nation: {
|
||||
id: nation.id,
|
||||
name: nation.name,
|
||||
color: nation.color,
|
||||
level: nation.level,
|
||||
typeCode: nation.typeCode,
|
||||
capitalCityId: nation.capitalCityId ?? 0,
|
||||
rate: resolveNationRate(nation),
|
||||
},
|
||||
chiefStatMin: resolveChiefStatMin(worldState),
|
||||
cities,
|
||||
generals,
|
||||
};
|
||||
}),
|
||||
getPersonnelInfo: authedProcedure.query(async ({ ctx }) => {
|
||||
const me = await getMyGeneral(ctx);
|
||||
assertNationAccess(me);
|
||||
|
||||
const [nation, cityRows, troopRows, generalRows, worldState] = await Promise.all([
|
||||
ctx.db.nation.findUnique({
|
||||
where: { id: me.nationId },
|
||||
select: {
|
||||
id: true,
|
||||
name: true,
|
||||
color: true,
|
||||
level: true,
|
||||
typeCode: true,
|
||||
capitalCityId: true,
|
||||
meta: true,
|
||||
},
|
||||
}),
|
||||
ctx.db.city.findMany({
|
||||
where: { nationId: me.nationId },
|
||||
select: { id: true, name: true, level: true, region: true },
|
||||
orderBy: { id: 'asc' },
|
||||
}),
|
||||
ctx.db.troop.findMany({ select: { troopLeaderId: true, name: true } }),
|
||||
ctx.db.general.findMany({
|
||||
where: { nationId: me.nationId },
|
||||
select: {
|
||||
id: true,
|
||||
name: true,
|
||||
npcState: true,
|
||||
nationId: true,
|
||||
cityId: true,
|
||||
troopId: true,
|
||||
officerLevel: true,
|
||||
leadership: true,
|
||||
strength: true,
|
||||
intel: true,
|
||||
experience: true,
|
||||
dedication: true,
|
||||
injury: true,
|
||||
gold: true,
|
||||
rice: true,
|
||||
crew: true,
|
||||
personalCode: true,
|
||||
specialCode: true,
|
||||
special2Code: true,
|
||||
meta: true,
|
||||
penalty: true,
|
||||
},
|
||||
orderBy: { id: 'asc' },
|
||||
}),
|
||||
ctx.db.worldState.findFirst(),
|
||||
]);
|
||||
|
||||
if (!nation) {
|
||||
throw new TRPCError({ code: 'NOT_FOUND', message: 'Nation not found' });
|
||||
}
|
||||
|
||||
const cityNameMap = new Map(cityRows.map((city) => [city.id, city.name]));
|
||||
const troopNameMap = new Map(troopRows.map((troop) => [troop.troopLeaderId, troop.name]));
|
||||
const mappedGenerals = await mapGeneralList(generalRows, cityNameMap, troopNameMap);
|
||||
|
||||
const chiefAssignments = mappedGenerals
|
||||
.filter((general) => general.officerLevel >= 5)
|
||||
.reduce<Record<number, typeof mappedGenerals[number]>>((acc, general) => {
|
||||
acc[general.officerLevel] = general;
|
||||
return acc;
|
||||
}, {});
|
||||
|
||||
const cityAssignments = cityRows.map((city) => {
|
||||
const officers = mappedGenerals.filter(
|
||||
(general) => general.officerLevel >= 2 && general.officerLevel <= 4 && general.officerCity === city.id
|
||||
);
|
||||
|
||||
const officerMap: Record<number, typeof mappedGenerals[number] | null> = {
|
||||
4: null,
|
||||
3: null,
|
||||
2: null,
|
||||
};
|
||||
|
||||
for (const officer of officers) {
|
||||
officerMap[officer.officerLevel] = officer;
|
||||
}
|
||||
|
||||
return {
|
||||
id: city.id,
|
||||
name: city.name,
|
||||
level: city.level,
|
||||
region: city.region,
|
||||
officers: officerMap,
|
||||
};
|
||||
});
|
||||
|
||||
const penaltyMap = new Map<number, Record<string, unknown>>(
|
||||
generalRows.map((row) => [row.id, asRecord(row.penalty)])
|
||||
);
|
||||
|
||||
const permissionCandidates = mappedGenerals
|
||||
.filter((general) => general.officerLevel !== 12)
|
||||
.map((general) => {
|
||||
const penalty = penaltyMap.get(general.id) ?? {};
|
||||
const maxPermission = checkSecretMaxPermission(penalty);
|
||||
return {
|
||||
id: general.id,
|
||||
name: general.name,
|
||||
npcState: general.npcState,
|
||||
permission: general.permission,
|
||||
maxPermission,
|
||||
};
|
||||
});
|
||||
|
||||
const ambassadors = permissionCandidates.filter(
|
||||
(candidate) => candidate.permission === 'ambassador' || candidate.maxPermission === 4
|
||||
);
|
||||
const auditors = permissionCandidates.filter(
|
||||
(candidate) => candidate.permission === 'auditor' || candidate.maxPermission >= 3
|
||||
);
|
||||
|
||||
return {
|
||||
me: {
|
||||
id: me.id,
|
||||
officerLevel: me.officerLevel,
|
||||
},
|
||||
nation: {
|
||||
id: nation.id,
|
||||
name: nation.name,
|
||||
color: nation.color,
|
||||
level: nation.level,
|
||||
typeCode: nation.typeCode,
|
||||
capitalCityId: nation.capitalCityId ?? 0,
|
||||
},
|
||||
chiefStatMin: resolveChiefStatMin(worldState),
|
||||
generals: mappedGenerals,
|
||||
chiefAssignments,
|
||||
cityAssignments,
|
||||
permissionCandidates: {
|
||||
ambassadors,
|
||||
auditors,
|
||||
},
|
||||
};
|
||||
}),
|
||||
changePermission: authedProcedure
|
||||
.input(
|
||||
z.object({
|
||||
|
||||
@@ -3,6 +3,9 @@ import MainView from '../views/MainView.vue';
|
||||
import PublicView from '../views/PublicView.vue';
|
||||
import LoginView from '../views/LoginView.vue';
|
||||
import JoinView from '../views/JoinView.vue';
|
||||
import NationCitiesView from '../views/NationCitiesView.vue';
|
||||
import NationGeneralsView from '../views/NationGeneralsView.vue';
|
||||
import NationPersonnelView from '../views/NationPersonnelView.vue';
|
||||
import NotFoundView from '../views/NotFoundView.vue';
|
||||
import { useSessionStore } from '../stores/session';
|
||||
|
||||
@@ -30,6 +33,33 @@ const routes = [
|
||||
requiresNoGeneral: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/nation/cities',
|
||||
name: 'nation-cities',
|
||||
component: NationCitiesView,
|
||||
meta: {
|
||||
requiresAuth: true,
|
||||
requiresGeneral: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/nation/generals',
|
||||
name: 'nation-generals',
|
||||
component: NationGeneralsView,
|
||||
meta: {
|
||||
requiresAuth: true,
|
||||
requiresGeneral: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/nation/personnel',
|
||||
name: 'nation-personnel',
|
||||
component: NationPersonnelView,
|
||||
meta: {
|
||||
requiresAuth: true,
|
||||
requiresGeneral: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/login',
|
||||
name: 'login',
|
||||
|
||||
@@ -0,0 +1,123 @@
|
||||
export const officerLevelMapDefault: Record<number, string> = {
|
||||
12: '군주',
|
||||
11: '참모',
|
||||
10: '제1장군',
|
||||
9: '제1모사',
|
||||
8: '제2장군',
|
||||
7: '제2모사',
|
||||
6: '제3장군',
|
||||
5: '제3모사',
|
||||
4: '태수',
|
||||
3: '군사',
|
||||
2: '종사',
|
||||
1: '일반',
|
||||
0: '재야',
|
||||
};
|
||||
|
||||
export const officerLevelMapByNationLevel: Record<number, Record<number, string>> = {
|
||||
7: {
|
||||
12: '황제',
|
||||
11: '승상',
|
||||
10: '표기장군',
|
||||
9: '사공',
|
||||
8: '거기장군',
|
||||
7: '태위',
|
||||
6: '위장군',
|
||||
5: '사도',
|
||||
},
|
||||
6: {
|
||||
12: '왕',
|
||||
11: '광록훈',
|
||||
10: '좌장군',
|
||||
9: '상서령',
|
||||
8: '우장군',
|
||||
7: '중서령',
|
||||
6: '전장군',
|
||||
5: '비서령',
|
||||
},
|
||||
5: {
|
||||
12: '공',
|
||||
11: '광록대부',
|
||||
10: '안국장군',
|
||||
9: '집금오',
|
||||
8: '파로장군',
|
||||
7: '소부',
|
||||
},
|
||||
4: {
|
||||
12: '주목',
|
||||
11: '태사령',
|
||||
10: '아문장군',
|
||||
9: '낭중',
|
||||
8: '호군',
|
||||
7: '종사중랑',
|
||||
},
|
||||
3: {
|
||||
12: '주자사',
|
||||
11: '주부',
|
||||
10: '편장군',
|
||||
9: '간의대부',
|
||||
},
|
||||
2: {
|
||||
12: '군벌',
|
||||
11: '참모',
|
||||
10: '비장군',
|
||||
9: '부참모',
|
||||
},
|
||||
1: {
|
||||
12: '영주',
|
||||
11: '참모',
|
||||
},
|
||||
0: {
|
||||
12: '두목',
|
||||
11: '부두목',
|
||||
},
|
||||
};
|
||||
|
||||
export const formatOfficerLevelText = (officerLevel: number, nationLevel?: number): string => {
|
||||
if (officerLevel < 5) {
|
||||
return officerLevelMapDefault[officerLevel] ?? '???';
|
||||
}
|
||||
|
||||
const nationMap =
|
||||
nationLevel === undefined
|
||||
? officerLevelMapDefault
|
||||
: (officerLevelMapByNationLevel[nationLevel] ?? officerLevelMapDefault);
|
||||
|
||||
return nationMap[officerLevel] ?? (officerLevelMapDefault[officerLevel] ?? '???');
|
||||
};
|
||||
|
||||
export const regionMap: Record<number, string> = {
|
||||
1: '하북',
|
||||
2: '중원',
|
||||
3: '서북',
|
||||
4: '서촉',
|
||||
5: '남중',
|
||||
6: '초',
|
||||
7: '오월',
|
||||
8: '동이',
|
||||
};
|
||||
|
||||
export const cityLevelMap: Record<number, string> = {
|
||||
1: '수',
|
||||
2: '진',
|
||||
3: '관',
|
||||
4: '이',
|
||||
5: '소',
|
||||
6: '중',
|
||||
7: '대',
|
||||
8: '특',
|
||||
};
|
||||
|
||||
export const getNationChiefLevel = (nationLevel: number): number => {
|
||||
const map: Record<number, number> = {
|
||||
7: 5,
|
||||
6: 5,
|
||||
5: 7,
|
||||
4: 7,
|
||||
3: 9,
|
||||
2: 9,
|
||||
1: 11,
|
||||
0: 11,
|
||||
};
|
||||
return map[nationLevel] ?? 11;
|
||||
};
|
||||
@@ -91,6 +91,9 @@ watch(
|
||||
<p class="page-subtitle">{{ statusLine }}</p>
|
||||
</div>
|
||||
<div class="header-actions">
|
||||
<RouterLink class="ghost" to="/nation/cities">세력 도시</RouterLink>
|
||||
<RouterLink class="ghost" to="/nation/generals">세력 장수</RouterLink>
|
||||
<RouterLink class="ghost" to="/nation/personnel">인사부</RouterLink>
|
||||
<button
|
||||
class="toggle"
|
||||
:class="{ active: realtimeEnabled }"
|
||||
|
||||
@@ -0,0 +1,582 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, onMounted, reactive, ref, watch } from 'vue';
|
||||
import PanelCard from '../components/ui/PanelCard.vue';
|
||||
import SkeletonLines from '../components/ui/SkeletonLines.vue';
|
||||
import { trpc } from '../utils/trpc';
|
||||
import { cityLevelMap, regionMap } from '../utils/nationFormat';
|
||||
|
||||
type CityOverviewResponse = Awaited<ReturnType<typeof trpc.nation.getCityOverview.query>>;
|
||||
|
||||
type CityEntry = CityOverviewResponse['cities'][number];
|
||||
type GeneralEntry = CityOverviewResponse['generals'][number];
|
||||
|
||||
type CitySortKey = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
|
||||
|
||||
type OfficerLevel = 2 | 3 | 4;
|
||||
|
||||
const officerLabels: Record<OfficerLevel, string> = {
|
||||
4: '태수',
|
||||
3: '군사',
|
||||
2: '종사',
|
||||
};
|
||||
|
||||
const officerLevels: OfficerLevel[] = [4, 3, 2];
|
||||
|
||||
const sortOptions: Array<{ key: CitySortKey; label: string }> = [
|
||||
{ key: 1, label: '기본' },
|
||||
{ key: 2, label: '인구' },
|
||||
{ key: 3, label: '인구율' },
|
||||
{ key: 4, label: '민심' },
|
||||
{ key: 5, label: '농업' },
|
||||
{ key: 6, label: '상업' },
|
||||
{ key: 7, label: '치안' },
|
||||
{ key: 8, label: '수비' },
|
||||
{ key: 9, label: '성벽' },
|
||||
{ key: 10, label: '시세' },
|
||||
{ key: 11, label: '지역' },
|
||||
{ key: 12, label: '규모' },
|
||||
];
|
||||
|
||||
const loading = ref(false);
|
||||
const error = ref<string | null>(null);
|
||||
const data = ref<CityOverviewResponse | null>(null);
|
||||
const sortKey = ref<CitySortKey>(1);
|
||||
const filterText = ref('');
|
||||
const showAppointment = ref(false);
|
||||
const appointmentDraft = reactive<Record<number, Record<number, number>>>({});
|
||||
|
||||
const resolveErrorMessage = (value: unknown): string => {
|
||||
if (value instanceof Error) {
|
||||
return value.message;
|
||||
}
|
||||
if (typeof value === 'string') {
|
||||
return value;
|
||||
}
|
||||
return 'unknown_error';
|
||||
};
|
||||
|
||||
const loadCities = async () => {
|
||||
if (loading.value) {
|
||||
return;
|
||||
}
|
||||
loading.value = true;
|
||||
error.value = null;
|
||||
|
||||
try {
|
||||
data.value = await trpc.nation.getCityOverview.query();
|
||||
} catch (err) {
|
||||
error.value = resolveErrorMessage(err);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
const cityNameMap = computed(() => {
|
||||
const map = new Map<number, string>();
|
||||
if (data.value) {
|
||||
for (const city of data.value.cities) {
|
||||
map.set(city.id, city.name);
|
||||
}
|
||||
}
|
||||
return map;
|
||||
});
|
||||
|
||||
const generalMap = computed(() => {
|
||||
const map = new Map<number, GeneralEntry>();
|
||||
for (const general of data.value?.generals ?? []) {
|
||||
map.set(general.id, general);
|
||||
}
|
||||
return map;
|
||||
});
|
||||
|
||||
const generalsByCity = computed(() => {
|
||||
const map = new Map<number, GeneralEntry[]>();
|
||||
for (const general of data.value?.generals ?? []) {
|
||||
if (!map.has(general.cityId)) {
|
||||
map.set(general.cityId, []);
|
||||
}
|
||||
map.get(general.cityId)?.push(general);
|
||||
}
|
||||
return map;
|
||||
});
|
||||
|
||||
const canAppoint = computed(() => (data.value?.me.officerLevel ?? 0) >= 5);
|
||||
|
||||
const candidatesByLevel = computed(() => {
|
||||
const minStat = data.value?.chiefStatMin ?? 0;
|
||||
const base = (data.value?.generals ?? []).filter((general) => general.officerLevel !== 12);
|
||||
return {
|
||||
4: base.filter((general) => general.stats.strength >= minStat),
|
||||
3: base.filter((general) => general.stats.intelligence >= minStat),
|
||||
2: base,
|
||||
} as Record<OfficerLevel, GeneralEntry[]>;
|
||||
});
|
||||
|
||||
const formatCandidateLabel = (general: GeneralEntry): string => {
|
||||
const cityName = cityNameMap.value.get(general.cityId);
|
||||
const role = general.officerLevel >= 5 ? '수뇌' : general.officerLevel >= 2 ? '관직' : '일반';
|
||||
return `${general.name}${cityName ? ` (${cityName})` : ''} · ${role}`;
|
||||
};
|
||||
|
||||
const ensureDraft = (cityId: number, level: OfficerLevel, defaultValue: number) => {
|
||||
if (!appointmentDraft[cityId]) {
|
||||
appointmentDraft[cityId] = { 2: 0, 3: 0, 4: 0 };
|
||||
}
|
||||
if (appointmentDraft[cityId][level] === undefined) {
|
||||
appointmentDraft[cityId][level] = defaultValue;
|
||||
}
|
||||
};
|
||||
|
||||
const resetDrafts = (cities: CityEntry[]) => {
|
||||
for (const key of Object.keys(appointmentDraft)) {
|
||||
delete appointmentDraft[Number(key)];
|
||||
}
|
||||
for (const city of cities) {
|
||||
appointmentDraft[city.id] = {
|
||||
2: city.officers[2]?.id ?? 0,
|
||||
3: city.officers[3]?.id ?? 0,
|
||||
4: city.officers[4]?.id ?? 0,
|
||||
};
|
||||
}
|
||||
};
|
||||
|
||||
watch(
|
||||
() => data.value,
|
||||
(value) => {
|
||||
if (value) {
|
||||
resetDrafts(value.cities);
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
const sortedCities = computed(() => {
|
||||
const list = data.value?.cities ?? [];
|
||||
const keyword = filterText.value.trim();
|
||||
const filtered = keyword
|
||||
? list.filter((city) => city.name.includes(keyword))
|
||||
: list;
|
||||
|
||||
return [...filtered].sort((lhs, rhs) => {
|
||||
switch (sortKey.value) {
|
||||
case 2:
|
||||
return rhs.population - lhs.population;
|
||||
case 3:
|
||||
return rhs.population / rhs.populationMax - lhs.population / lhs.populationMax;
|
||||
case 4:
|
||||
return rhs.trust - lhs.trust;
|
||||
case 5:
|
||||
return rhs.agriculture - lhs.agriculture;
|
||||
case 6:
|
||||
return rhs.commerce - lhs.commerce;
|
||||
case 7:
|
||||
return rhs.security - lhs.security;
|
||||
case 8:
|
||||
return rhs.defence - lhs.defence;
|
||||
case 9:
|
||||
return rhs.wall - lhs.wall;
|
||||
case 10:
|
||||
return rhs.trade - lhs.trade;
|
||||
case 11: {
|
||||
const regionCmp = lhs.region - rhs.region;
|
||||
if (regionCmp !== 0) {
|
||||
return regionCmp;
|
||||
}
|
||||
return rhs.level - lhs.level;
|
||||
}
|
||||
case 12: {
|
||||
const levelCmp = rhs.level - lhs.level;
|
||||
if (levelCmp !== 0) {
|
||||
return levelCmp;
|
||||
}
|
||||
return lhs.region - rhs.region;
|
||||
}
|
||||
default:
|
||||
return lhs.id - rhs.id;
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
const formatPercent = (value: number, max: number): string => {
|
||||
if (!max) {
|
||||
return '-';
|
||||
}
|
||||
return `${((value / max) * 100).toFixed(1)}%`;
|
||||
};
|
||||
|
||||
const formatNumber = (value: number): string => new Intl.NumberFormat('ko-KR').format(value);
|
||||
|
||||
const resolveOfficerName = (officer: CityEntry['officers'][OfficerLevel]): string => {
|
||||
if (!officer) {
|
||||
return '-';
|
||||
}
|
||||
if (officer.cityName) {
|
||||
return `${officer.name} (${officer.cityName})`;
|
||||
}
|
||||
return officer.name;
|
||||
};
|
||||
|
||||
const appointOfficer = async (cityId: number, officerLevel: OfficerLevel) => {
|
||||
if (!data.value) {
|
||||
return;
|
||||
}
|
||||
const city = data.value.cities.find((entry) => entry.id === cityId);
|
||||
if (!city) {
|
||||
return;
|
||||
}
|
||||
const destGeneralId = appointmentDraft[cityId]?.[officerLevel] ?? 0;
|
||||
const general = generalMap.value.get(destGeneralId);
|
||||
const officerLabel = officerLabels[officerLevel];
|
||||
const targetName = destGeneralId === 0 ? '공석' : general?.name ?? '알 수 없음';
|
||||
const message =
|
||||
destGeneralId === 0
|
||||
? `${city.name} ${officerLabel} 자리를 비우시겠습니까?`
|
||||
: `${targetName}을(를) ${city.name} ${officerLabel}로 임명하시겠습니까?`;
|
||||
|
||||
if (!window.confirm(message)) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await trpc.nation.appoint.mutate({
|
||||
destGeneralId,
|
||||
destCityId: cityId,
|
||||
officerLevel,
|
||||
});
|
||||
await loadCities();
|
||||
} catch (err) {
|
||||
error.value = resolveErrorMessage(err);
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
void loadCities();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<main class="nation-page">
|
||||
<header class="page-header">
|
||||
<div>
|
||||
<h1 class="page-title">세력 도시</h1>
|
||||
<p class="page-subtitle">세력 도시 현황과 관직 배치를 확인합니다.</p>
|
||||
</div>
|
||||
<div class="header-actions">
|
||||
<RouterLink class="ghost" to="/">메인</RouterLink>
|
||||
<RouterLink class="ghost" to="/nation/generals">세력 장수</RouterLink>
|
||||
<RouterLink class="ghost" to="/nation/personnel">인사부</RouterLink>
|
||||
<button class="ghost" @click="loadCities">새로고침</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div v-if="error" class="error">{{ error }}</div>
|
||||
|
||||
<PanelCard title="세력 도시 목록" subtitle="도시별 개발 상태 및 관직 현황">
|
||||
<template #actions>
|
||||
<div class="toolbar-actions">
|
||||
<select v-model.number="sortKey" class="select-input">
|
||||
<option v-for="option in sortOptions" :key="option.key" :value="option.key">
|
||||
{{ option.label }}
|
||||
</option>
|
||||
</select>
|
||||
<input v-model="filterText" class="filter-input" placeholder="도시 검색" />
|
||||
<button
|
||||
class="ghost"
|
||||
:class="{ active: showAppointment }"
|
||||
@click="showAppointment = !showAppointment"
|
||||
v-if="canAppoint"
|
||||
>
|
||||
관직 임명 모드
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div class="list-meta">
|
||||
총 {{ sortedCities.length }}개 도시 · 관직 최소 능력 {{ data?.chiefStatMin ?? '-' }}
|
||||
</div>
|
||||
|
||||
<SkeletonLines v-if="loading" :lines="8" />
|
||||
<section v-else class="city-grid">
|
||||
<article v-for="city in sortedCities" :key="city.id" class="city-card">
|
||||
<div class="city-header">
|
||||
<div>
|
||||
<div class="city-title">
|
||||
{{ city.name }}
|
||||
<span v-if="data?.nation.capitalCityId === city.id" class="capital-tag">수도</span>
|
||||
</div>
|
||||
<div class="city-meta">
|
||||
{{ regionMap[city.region] ?? '미지' }} · {{ cityLevelMap[city.level] ?? '-' }} 규모
|
||||
</div>
|
||||
</div>
|
||||
<div class="city-meta">시세 {{ city.trade }}%</div>
|
||||
</div>
|
||||
|
||||
<div class="city-stats">
|
||||
<div>
|
||||
주민 {{ city.population }}/{{ city.populationMax }}
|
||||
<span class="muted">({{ formatPercent(city.population, city.populationMax) }})</span>
|
||||
</div>
|
||||
<div>농업 {{ city.agriculture }}/{{ city.agricultureMax }}</div>
|
||||
<div>상업 {{ city.commerce }}/{{ city.commerceMax }}</div>
|
||||
<div>치안 {{ city.security }}/{{ city.securityMax }}</div>
|
||||
<div>수비 {{ city.defence }}/{{ city.defenceMax }}</div>
|
||||
<div>성벽 {{ city.wall }}/{{ city.wallMax }}</div>
|
||||
<div>민심 {{ city.trust }}</div>
|
||||
</div>
|
||||
|
||||
<div class="city-incomes">
|
||||
<div>자금 수입 {{ formatNumber(city.incomes.gold) }}</div>
|
||||
<div>군량 수입 {{ formatNumber(city.incomes.rice) }}</div>
|
||||
<div>둔전 수입 {{ formatNumber(city.incomes.wall) }}</div>
|
||||
</div>
|
||||
|
||||
<div class="city-officers">
|
||||
<div>
|
||||
<span class="officer-label">태수</span>
|
||||
{{ resolveOfficerName(city.officers[4]) }}
|
||||
</div>
|
||||
<div>
|
||||
<span class="officer-label">군사</span>
|
||||
{{ resolveOfficerName(city.officers[3]) }}
|
||||
</div>
|
||||
<div>
|
||||
<span class="officer-label">종사</span>
|
||||
{{ resolveOfficerName(city.officers[2]) }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="showAppointment && canAppoint" class="city-appoint">
|
||||
<div class="appoint-row" v-for="level in officerLevels" :key="level">
|
||||
<span class="officer-label">{{ officerLabels[level] }}</span>
|
||||
<select
|
||||
v-model.number="appointmentDraft[city.id][level]"
|
||||
class="select-input"
|
||||
@focus="ensureDraft(city.id, level, city.officers[level]?.id ?? 0)"
|
||||
>
|
||||
<option :value="0">공석</option>
|
||||
<option
|
||||
v-for="candidate in candidatesByLevel[level]"
|
||||
:key="candidate.id"
|
||||
:value="candidate.id"
|
||||
>
|
||||
{{ formatCandidateLabel(candidate) }}
|
||||
</option>
|
||||
</select>
|
||||
<button class="ghost" @click="appointOfficer(city.id, level)">임명</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="city-generals">
|
||||
<div class="muted">장수</div>
|
||||
<div class="general-tags">
|
||||
<span
|
||||
v-for="general in generalsByCity.get(city.id) ?? []"
|
||||
:key="general.id"
|
||||
class="general-tag"
|
||||
>
|
||||
<span v-if="general.npcState > 0" class="npc-tag">NPC</span>
|
||||
{{ general.name }}
|
||||
</span>
|
||||
<span v-if="(generalsByCity.get(city.id) ?? []).length === 0" class="muted">-</span>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
</PanelCard>
|
||||
</main>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.nation-page {
|
||||
min-height: 100vh;
|
||||
padding: 24px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
border-bottom: 1px solid rgba(201, 164, 90, 0.4);
|
||||
padding-bottom: 12px;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
font-size: 1.6rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.page-subtitle {
|
||||
font-size: 0.85rem;
|
||||
color: rgba(232, 221, 196, 0.7);
|
||||
}
|
||||
|
||||
.header-actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.ghost {
|
||||
border: 1px solid rgba(201, 164, 90, 0.4);
|
||||
padding: 6px 12px;
|
||||
font-size: 0.8rem;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
background: rgba(16, 16, 16, 0.6);
|
||||
}
|
||||
|
||||
.ghost.active {
|
||||
background: rgba(201, 164, 90, 0.2);
|
||||
}
|
||||
|
||||
.error {
|
||||
color: #f5b7b1;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.toolbar-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.select-input {
|
||||
border: 1px solid rgba(201, 164, 90, 0.4);
|
||||
background: rgba(16, 16, 16, 0.8);
|
||||
color: rgba(232, 221, 196, 0.9);
|
||||
padding: 6px 8px;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.filter-input {
|
||||
border: 1px solid rgba(201, 164, 90, 0.4);
|
||||
background: rgba(16, 16, 16, 0.8);
|
||||
color: rgba(232, 221, 196, 0.9);
|
||||
padding: 6px 8px;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.list-meta {
|
||||
margin-bottom: 12px;
|
||||
font-size: 0.75rem;
|
||||
color: rgba(232, 221, 196, 0.6);
|
||||
}
|
||||
|
||||
.city-grid {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.city-card {
|
||||
border: 1px solid rgba(201, 164, 90, 0.3);
|
||||
padding: 12px;
|
||||
background: rgba(12, 12, 12, 0.75);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.city-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.city-title {
|
||||
font-size: 1rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.city-meta {
|
||||
font-size: 0.75rem;
|
||||
color: rgba(232, 221, 196, 0.6);
|
||||
}
|
||||
|
||||
.capital-tag {
|
||||
margin-left: 6px;
|
||||
font-size: 0.65rem;
|
||||
padding: 2px 6px;
|
||||
border: 1px solid rgba(201, 164, 90, 0.4);
|
||||
color: rgba(232, 221, 196, 0.8);
|
||||
}
|
||||
|
||||
.city-stats,
|
||||
.city-incomes,
|
||||
.city-officers {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
|
||||
gap: 6px;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
.city-incomes {
|
||||
padding-top: 6px;
|
||||
border-top: 1px solid rgba(201, 164, 90, 0.2);
|
||||
}
|
||||
|
||||
.city-officers {
|
||||
border-top: 1px solid rgba(201, 164, 90, 0.2);
|
||||
padding-top: 6px;
|
||||
}
|
||||
|
||||
.officer-label {
|
||||
font-weight: 600;
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
||||
.city-appoint {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
border-top: 1px dashed rgba(201, 164, 90, 0.2);
|
||||
padding-top: 8px;
|
||||
}
|
||||
|
||||
.appoint-row {
|
||||
display: grid;
|
||||
grid-template-columns: 60px minmax(0, 1fr) auto;
|
||||
gap: 6px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.city-generals {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.general-tags {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.general-tag {
|
||||
padding: 3px 6px;
|
||||
border: 1px solid rgba(201, 164, 90, 0.3);
|
||||
font-size: 0.75rem;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.npc-tag {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 0.6rem;
|
||||
padding: 1px 3px;
|
||||
border: 1px solid rgba(201, 164, 90, 0.4);
|
||||
color: rgba(232, 221, 196, 0.8);
|
||||
}
|
||||
|
||||
.muted {
|
||||
color: rgba(232, 221, 196, 0.6);
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,349 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, onMounted, ref } from 'vue';
|
||||
import PanelCard from '../components/ui/PanelCard.vue';
|
||||
import SkeletonLines from '../components/ui/SkeletonLines.vue';
|
||||
import { trpc } from '../utils/trpc';
|
||||
import { formatOfficerLevelText } from '../utils/nationFormat';
|
||||
|
||||
type GeneralListResponse = Awaited<ReturnType<typeof trpc.nation.getGeneralList.query>>;
|
||||
|
||||
type GeneralEntry = GeneralListResponse['generals'][number];
|
||||
|
||||
type SortKey =
|
||||
| 1
|
||||
| 2
|
||||
| 3
|
||||
| 4
|
||||
| 5
|
||||
| 6
|
||||
| 7
|
||||
| 8
|
||||
| 9
|
||||
| 10
|
||||
| 11
|
||||
| 12
|
||||
| 13
|
||||
| 14
|
||||
| 15;
|
||||
|
||||
const sortOptions: Array<{ key: SortKey; label: string }> = [
|
||||
{ key: 1, label: '관직' },
|
||||
{ key: 2, label: '공헌' },
|
||||
{ key: 3, label: '경험' },
|
||||
{ key: 4, label: '통솔' },
|
||||
{ key: 5, label: '무력' },
|
||||
{ key: 6, label: '지력' },
|
||||
{ key: 7, label: '자금' },
|
||||
{ key: 8, label: '군량' },
|
||||
{ key: 9, label: '병사' },
|
||||
{ key: 10, label: '벌점' },
|
||||
{ key: 11, label: '성격' },
|
||||
{ key: 12, label: '내특' },
|
||||
{ key: 13, label: '전특' },
|
||||
{ key: 14, label: '사관' },
|
||||
{ key: 15, label: 'NPC' },
|
||||
];
|
||||
|
||||
const loading = ref(false);
|
||||
const error = ref<string | null>(null);
|
||||
const data = ref<GeneralListResponse | null>(null);
|
||||
const sortKey = ref<SortKey>(1);
|
||||
const filterText = ref('');
|
||||
|
||||
const resolveErrorMessage = (value: unknown): string => {
|
||||
if (value instanceof Error) {
|
||||
return value.message;
|
||||
}
|
||||
if (typeof value === 'string') {
|
||||
return value;
|
||||
}
|
||||
return 'unknown_error';
|
||||
};
|
||||
|
||||
const loadGenerals = async () => {
|
||||
if (loading.value) {
|
||||
return;
|
||||
}
|
||||
loading.value = true;
|
||||
error.value = null;
|
||||
|
||||
try {
|
||||
data.value = await trpc.nation.getGeneralList.query();
|
||||
} catch (err) {
|
||||
error.value = resolveErrorMessage(err);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
const sortGenerals = (list: GeneralEntry[]): GeneralEntry[] => {
|
||||
const key = sortKey.value;
|
||||
const sorted = [...list].sort((lhs, rhs) => {
|
||||
switch (key) {
|
||||
case 1:
|
||||
return rhs.officerLevel - lhs.officerLevel;
|
||||
case 2:
|
||||
return rhs.dedication - lhs.dedication;
|
||||
case 3:
|
||||
return rhs.experience - lhs.experience;
|
||||
case 4:
|
||||
return rhs.stats.leadership - lhs.stats.leadership;
|
||||
case 5:
|
||||
return rhs.stats.strength - lhs.stats.strength;
|
||||
case 6:
|
||||
return rhs.stats.intelligence - lhs.stats.intelligence;
|
||||
case 7:
|
||||
return rhs.gold - lhs.gold;
|
||||
case 8:
|
||||
return rhs.rice - lhs.rice;
|
||||
case 9:
|
||||
return rhs.crew - lhs.crew;
|
||||
case 10:
|
||||
return 0;
|
||||
case 11:
|
||||
return (lhs.personality?.name ?? '').localeCompare(rhs.personality?.name ?? '');
|
||||
case 12:
|
||||
return (lhs.specialDomestic?.name ?? '').localeCompare(rhs.specialDomestic?.name ?? '');
|
||||
case 13:
|
||||
return (lhs.specialWar?.name ?? '').localeCompare(rhs.specialWar?.name ?? '');
|
||||
case 14:
|
||||
return rhs.belong - lhs.belong;
|
||||
case 15:
|
||||
return rhs.npcState - lhs.npcState;
|
||||
default:
|
||||
return 0;
|
||||
}
|
||||
});
|
||||
|
||||
if (key === 11 || key === 12 || key === 13) {
|
||||
return sorted;
|
||||
}
|
||||
|
||||
return sorted;
|
||||
};
|
||||
|
||||
const filteredGenerals = computed(() => {
|
||||
const list = data.value?.generals ?? [];
|
||||
const keyword = filterText.value.trim().toLowerCase();
|
||||
const filtered = keyword
|
||||
? list.filter((general) => {
|
||||
return (
|
||||
general.name.toLowerCase().includes(keyword) ||
|
||||
(general.cityName ?? '').toLowerCase().includes(keyword) ||
|
||||
(general.officerCityName ?? '').toLowerCase().includes(keyword)
|
||||
);
|
||||
})
|
||||
: list;
|
||||
|
||||
return sortGenerals(filtered);
|
||||
});
|
||||
|
||||
const nationLevel = computed(() => data.value?.nation.level ?? 0);
|
||||
|
||||
const formatSpecial = (general: GeneralEntry): string => {
|
||||
const domestic = general.specialDomestic?.name ?? '-';
|
||||
const war = general.specialWar?.name ?? '-';
|
||||
return `${domestic} / ${war}`;
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
void loadGenerals();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<main class="nation-page">
|
||||
<header class="page-header">
|
||||
<div>
|
||||
<h1 class="page-title">세력 장수</h1>
|
||||
<p class="page-subtitle">세력 내 장수 현황 및 정렬</p>
|
||||
</div>
|
||||
<div class="header-actions">
|
||||
<RouterLink class="ghost" to="/">메인</RouterLink>
|
||||
<RouterLink class="ghost" to="/nation/cities">세력 도시</RouterLink>
|
||||
<RouterLink class="ghost" to="/nation/personnel">인사부</RouterLink>
|
||||
<button class="ghost" @click="loadGenerals">새로고침</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div v-if="error" class="error">{{ error }}</div>
|
||||
|
||||
<PanelCard title="세력 장수 목록" subtitle="국가 소속 장수들을 확인합니다.">
|
||||
<template #actions>
|
||||
<div class="toolbar-actions">
|
||||
<select v-model.number="sortKey" class="select-input">
|
||||
<option v-for="option in sortOptions" :key="option.key" :value="option.key">
|
||||
{{ option.label }}
|
||||
</option>
|
||||
</select>
|
||||
<input v-model="filterText" class="filter-input" placeholder="이름/도시 검색" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<div class="list-meta">총 {{ filteredGenerals.length }}명</div>
|
||||
|
||||
<SkeletonLines v-if="loading" :lines="6" />
|
||||
<div v-else class="table-scroll">
|
||||
<table class="nation-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>이름</th>
|
||||
<th>관직</th>
|
||||
<th>공헌</th>
|
||||
<th>경험</th>
|
||||
<th>통솔</th>
|
||||
<th>무력</th>
|
||||
<th>지력</th>
|
||||
<th>자금</th>
|
||||
<th>군량</th>
|
||||
<th>병사</th>
|
||||
<th>성격</th>
|
||||
<th>특기</th>
|
||||
<th>사관</th>
|
||||
<th>현재 도시</th>
|
||||
<th>관직 도시</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="general in filteredGenerals" :key="general.id">
|
||||
<td>
|
||||
<span v-if="general.npcState > 0" class="npc-tag">NPC</span>
|
||||
{{ general.name }}
|
||||
</td>
|
||||
<td>{{ formatOfficerLevelText(general.officerLevel, nationLevel) }}</td>
|
||||
<td>{{ general.dedication }}</td>
|
||||
<td>{{ general.experience }}</td>
|
||||
<td>{{ general.stats.leadership }}</td>
|
||||
<td>{{ general.stats.strength }}</td>
|
||||
<td>{{ general.stats.intelligence }}</td>
|
||||
<td>{{ general.gold }}</td>
|
||||
<td>{{ general.rice }}</td>
|
||||
<td>{{ general.crew }}</td>
|
||||
<td>{{ general.personality?.name ?? '-' }}</td>
|
||||
<td>{{ formatSpecial(general) }}</td>
|
||||
<td>{{ general.belong > 0 ? general.belong : '-' }}</td>
|
||||
<td>{{ general.cityName ?? '-' }}</td>
|
||||
<td>{{ general.officerCityName ?? '-' }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</PanelCard>
|
||||
</main>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.nation-page {
|
||||
min-height: 100vh;
|
||||
padding: 24px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
border-bottom: 1px solid rgba(201, 164, 90, 0.4);
|
||||
padding-bottom: 12px;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
font-size: 1.6rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.page-subtitle {
|
||||
font-size: 0.85rem;
|
||||
color: rgba(232, 221, 196, 0.7);
|
||||
}
|
||||
|
||||
.header-actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.ghost {
|
||||
border: 1px solid rgba(201, 164, 90, 0.4);
|
||||
padding: 6px 12px;
|
||||
font-size: 0.8rem;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
background: rgba(16, 16, 16, 0.6);
|
||||
}
|
||||
|
||||
.error {
|
||||
color: #f5b7b1;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.toolbar-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.select-input {
|
||||
border: 1px solid rgba(201, 164, 90, 0.4);
|
||||
background: rgba(16, 16, 16, 0.8);
|
||||
color: rgba(232, 221, 196, 0.9);
|
||||
padding: 6px 8px;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.filter-input {
|
||||
border: 1px solid rgba(201, 164, 90, 0.4);
|
||||
background: rgba(16, 16, 16, 0.8);
|
||||
color: rgba(232, 221, 196, 0.9);
|
||||
padding: 6px 8px;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.list-meta {
|
||||
margin-bottom: 8px;
|
||||
font-size: 0.75rem;
|
||||
color: rgba(232, 221, 196, 0.6);
|
||||
}
|
||||
|
||||
.table-scroll {
|
||||
overflow-x: auto;
|
||||
max-height: 70vh;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.nation-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
.nation-table th,
|
||||
.nation-table td {
|
||||
padding: 6px 8px;
|
||||
border-bottom: 1px solid rgba(201, 164, 90, 0.2);
|
||||
text-align: left;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.nation-table thead th {
|
||||
font-size: 0.7rem;
|
||||
color: rgba(232, 221, 196, 0.6);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
.npc-tag {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 0.6rem;
|
||||
padding: 2px 4px;
|
||||
margin-right: 6px;
|
||||
border: 1px solid rgba(201, 164, 90, 0.4);
|
||||
color: rgba(232, 221, 196, 0.8);
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,627 @@
|
||||
<script setup lang="ts">
|
||||
import { computed, onMounted, reactive, ref, watch } from 'vue';
|
||||
import PanelCard from '../components/ui/PanelCard.vue';
|
||||
import SkeletonLines from '../components/ui/SkeletonLines.vue';
|
||||
import { trpc } from '../utils/trpc';
|
||||
import {
|
||||
cityLevelMap,
|
||||
formatOfficerLevelText,
|
||||
getNationChiefLevel,
|
||||
regionMap,
|
||||
} from '../utils/nationFormat';
|
||||
|
||||
type PersonnelResponse = Awaited<ReturnType<typeof trpc.nation.getPersonnelInfo.query>>;
|
||||
|
||||
type GeneralEntry = PersonnelResponse['generals'][number];
|
||||
|
||||
type OfficerLevel = 2 | 3 | 4;
|
||||
|
||||
const officerLabels: Record<OfficerLevel, string> = {
|
||||
4: '태수',
|
||||
3: '군사',
|
||||
2: '종사',
|
||||
};
|
||||
|
||||
const loading = ref(false);
|
||||
const error = ref<string | null>(null);
|
||||
const data = ref<PersonnelResponse | null>(null);
|
||||
|
||||
const chiefAppointmentDraft = reactive<Record<number, number>>({});
|
||||
const selectedCityId = ref<number>(0);
|
||||
const selectedOfficerLevel = ref<OfficerLevel>(4);
|
||||
const selectedGeneralId = ref<number>(0);
|
||||
const kickTargetId = ref<number>(0);
|
||||
const ambassadorSelection = ref<number[]>([]);
|
||||
const auditorSelection = ref<number[]>([]);
|
||||
|
||||
const resolveErrorMessage = (value: unknown): string => {
|
||||
if (value instanceof Error) {
|
||||
return value.message;
|
||||
}
|
||||
if (typeof value === 'string') {
|
||||
return value;
|
||||
}
|
||||
return 'unknown_error';
|
||||
};
|
||||
|
||||
const loadPersonnel = async () => {
|
||||
if (loading.value) {
|
||||
return;
|
||||
}
|
||||
loading.value = true;
|
||||
error.value = null;
|
||||
|
||||
try {
|
||||
data.value = await trpc.nation.getPersonnelInfo.query();
|
||||
} catch (err) {
|
||||
error.value = resolveErrorMessage(err);
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
const nationLevel = computed(() => data.value?.nation.level ?? 0);
|
||||
const canAssign = computed(() => (data.value?.me.officerLevel ?? 0) >= 5);
|
||||
const isLeader = computed(() => (data.value?.me.officerLevel ?? 0) >= 12);
|
||||
|
||||
const chiefLevels = computed(() => {
|
||||
if (!data.value) {
|
||||
return [] as number[];
|
||||
}
|
||||
const minLevel = getNationChiefLevel(data.value.nation.level);
|
||||
const levels: number[] = [];
|
||||
for (let level = 12; level >= minLevel; level -= 1) {
|
||||
levels.push(level);
|
||||
}
|
||||
return levels;
|
||||
});
|
||||
|
||||
const cityNameMap = computed(() => {
|
||||
const map = new Map<number, string>();
|
||||
for (const city of data.value?.cityAssignments ?? []) {
|
||||
map.set(city.id, city.name);
|
||||
}
|
||||
return map;
|
||||
});
|
||||
|
||||
const generalMap = computed(() => {
|
||||
const map = new Map<number, GeneralEntry>();
|
||||
for (const general of data.value?.generals ?? []) {
|
||||
map.set(general.id, general);
|
||||
}
|
||||
return map;
|
||||
});
|
||||
|
||||
const chiefAssignments = computed(() => data.value?.chiefAssignments ?? {});
|
||||
|
||||
const formatCandidateLabel = (general: GeneralEntry): string => {
|
||||
const cityName = cityNameMap.value.get(general.cityId);
|
||||
const role = general.officerLevel >= 5 ? '수뇌' : general.officerLevel >= 2 ? '관직' : '일반';
|
||||
return `${general.name}${cityName ? ` (${cityName})` : ''} · ${role}`;
|
||||
};
|
||||
|
||||
const chiefCandidates = (level: number): GeneralEntry[] => {
|
||||
const minStat = data.value?.chiefStatMin ?? 0;
|
||||
const list = data.value?.generals ?? [];
|
||||
if (level === 11) {
|
||||
return list;
|
||||
}
|
||||
if (level % 2 === 0) {
|
||||
return list.filter((general) => general.stats.strength >= minStat);
|
||||
}
|
||||
return list.filter((general) => general.stats.intelligence >= minStat);
|
||||
};
|
||||
|
||||
const cityCandidatesByLevel = computed(() => {
|
||||
const minStat = data.value?.chiefStatMin ?? 0;
|
||||
const base = (data.value?.generals ?? []).filter((general) => general.officerLevel !== 12);
|
||||
return {
|
||||
4: base.filter((general) => general.stats.strength >= minStat),
|
||||
3: base.filter((general) => general.stats.intelligence >= minStat),
|
||||
2: base,
|
||||
} as Record<OfficerLevel, GeneralEntry[]>;
|
||||
});
|
||||
|
||||
const currentCityOfficer = computed(() => {
|
||||
const city = data.value?.cityAssignments.find((entry) => entry.id === selectedCityId.value);
|
||||
if (!city) {
|
||||
return null;
|
||||
}
|
||||
return city.officers[selectedOfficerLevel.value] ?? null;
|
||||
});
|
||||
|
||||
const initializeDrafts = () => {
|
||||
if (!data.value) {
|
||||
return;
|
||||
}
|
||||
for (const key of Object.keys(chiefAppointmentDraft)) {
|
||||
delete chiefAppointmentDraft[Number(key)];
|
||||
}
|
||||
for (const level of chiefLevels.value) {
|
||||
chiefAppointmentDraft[level] = chiefAssignments.value[level]?.id ?? 0;
|
||||
}
|
||||
|
||||
selectedCityId.value = data.value.cityAssignments[0]?.id ?? 0;
|
||||
selectedOfficerLevel.value = 4;
|
||||
selectedGeneralId.value = currentCityOfficer.value?.id ?? 0;
|
||||
kickTargetId.value = 0;
|
||||
|
||||
ambassadorSelection.value = data.value.permissionCandidates.ambassadors
|
||||
.filter((candidate) => candidate.permission === 'ambassador')
|
||||
.map((candidate) => candidate.id);
|
||||
auditorSelection.value = data.value.permissionCandidates.auditors
|
||||
.filter((candidate) => candidate.permission === 'auditor')
|
||||
.map((candidate) => candidate.id);
|
||||
};
|
||||
|
||||
watch(
|
||||
() => data.value,
|
||||
(value) => {
|
||||
if (value) {
|
||||
initializeDrafts();
|
||||
}
|
||||
}
|
||||
);
|
||||
|
||||
watch([selectedCityId, selectedOfficerLevel], () => {
|
||||
selectedGeneralId.value = currentCityOfficer.value?.id ?? 0;
|
||||
});
|
||||
|
||||
const appointChief = async (level: number) => {
|
||||
if (!data.value) {
|
||||
return;
|
||||
}
|
||||
const generalId = chiefAppointmentDraft[level] ?? 0;
|
||||
const general = generalMap.value.get(generalId);
|
||||
const title = formatOfficerLevelText(level, nationLevel.value);
|
||||
const message =
|
||||
generalId === 0
|
||||
? `${title} 자리를 비우시겠습니까?`
|
||||
: `${general?.name ?? '선택 장수'}을(를) ${title}로 임명하시겠습니까?`;
|
||||
|
||||
if (!window.confirm(message)) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await trpc.nation.appoint.mutate({
|
||||
destGeneralId: generalId,
|
||||
destCityId: 0,
|
||||
officerLevel: level,
|
||||
});
|
||||
await loadPersonnel();
|
||||
} catch (err) {
|
||||
error.value = resolveErrorMessage(err);
|
||||
}
|
||||
};
|
||||
|
||||
const appointCityOfficer = async () => {
|
||||
if (!data.value || !selectedCityId.value) {
|
||||
return;
|
||||
}
|
||||
const city = data.value.cityAssignments.find((entry) => entry.id === selectedCityId.value);
|
||||
const general = generalMap.value.get(selectedGeneralId.value);
|
||||
const officerLabel = officerLabels[selectedOfficerLevel.value];
|
||||
const message =
|
||||
selectedGeneralId.value === 0
|
||||
? `${city?.name ?? ''} ${officerLabel} 자리를 비우시겠습니까?`
|
||||
: `${general?.name ?? '선택 장수'}을(를) ${city?.name ?? ''} ${officerLabel}로 임명하시겠습니까?`;
|
||||
|
||||
if (!window.confirm(message)) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await trpc.nation.appoint.mutate({
|
||||
destGeneralId: selectedGeneralId.value,
|
||||
destCityId: selectedCityId.value,
|
||||
officerLevel: selectedOfficerLevel.value,
|
||||
});
|
||||
await loadPersonnel();
|
||||
} catch (err) {
|
||||
error.value = resolveErrorMessage(err);
|
||||
}
|
||||
};
|
||||
|
||||
const kickGeneral = async () => {
|
||||
const general = generalMap.value.get(kickTargetId.value);
|
||||
if (!general) {
|
||||
return;
|
||||
}
|
||||
if (!window.confirm(`${general.name}을(를) 추방하시겠습니까?`)) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await trpc.nation.kick.mutate({ destGeneralId: general.id });
|
||||
await loadPersonnel();
|
||||
} catch (err) {
|
||||
error.value = resolveErrorMessage(err);
|
||||
}
|
||||
};
|
||||
|
||||
const enforceLimit = (list: number[], id: number) => {
|
||||
if (list.length <= 2) {
|
||||
return;
|
||||
}
|
||||
const idx = list.indexOf(id);
|
||||
if (idx >= 0) {
|
||||
list.splice(idx, 1);
|
||||
}
|
||||
alert('최대 2명까지 설정 가능합니다.');
|
||||
};
|
||||
|
||||
const enforceAmbassadorLimit = (id: number) => {
|
||||
enforceLimit(ambassadorSelection.value, id);
|
||||
};
|
||||
|
||||
const enforceAuditorLimit = (id: number) => {
|
||||
enforceLimit(auditorSelection.value, id);
|
||||
};
|
||||
|
||||
const changePermissions = async (isAmbassador: boolean) => {
|
||||
const selection = isAmbassador ? ambassadorSelection.value : auditorSelection.value;
|
||||
if (!window.confirm('권한을 변경하시겠습니까?')) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
await trpc.nation.changePermission.mutate({
|
||||
isAmbassador,
|
||||
targetGeneralIds: selection,
|
||||
});
|
||||
await loadPersonnel();
|
||||
} catch (err) {
|
||||
error.value = resolveErrorMessage(err);
|
||||
}
|
||||
};
|
||||
|
||||
const kickCandidates = computed(() => {
|
||||
const list = data.value?.generals ?? [];
|
||||
const myId = data.value?.me.id ?? 0;
|
||||
return list.filter((general) => general.id !== myId);
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
void loadPersonnel();
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<main class="nation-page">
|
||||
<header class="page-header">
|
||||
<div>
|
||||
<h1 class="page-title">인사부</h1>
|
||||
<p class="page-subtitle">수뇌 임명과 도시 관직 관리</p>
|
||||
</div>
|
||||
<div class="header-actions">
|
||||
<RouterLink class="ghost" to="/">메인</RouterLink>
|
||||
<RouterLink class="ghost" to="/nation/cities">세력 도시</RouterLink>
|
||||
<RouterLink class="ghost" to="/nation/generals">세력 장수</RouterLink>
|
||||
<button class="ghost" @click="loadPersonnel">새로고침</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div v-if="error" class="error">{{ error }}</div>
|
||||
|
||||
<SkeletonLines v-if="loading" :lines="6" />
|
||||
|
||||
<section v-else class="panel-grid">
|
||||
<PanelCard title="수뇌 현황" subtitle="현재 수뇌 배치">
|
||||
<div class="chief-grid">
|
||||
<div v-for="level in chiefLevels" :key="level" class="chief-item">
|
||||
<div class="chief-title">{{ formatOfficerLevelText(level, nationLevel) }}</div>
|
||||
<div class="chief-name">
|
||||
{{ chiefAssignments[level]?.name ?? '-' }}
|
||||
</div>
|
||||
<div class="chief-meta" v-if="chiefAssignments[level]">
|
||||
{{ chiefAssignments[level]?.officerCityName ?? chiefAssignments[level]?.cityName ?? '-' }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</PanelCard>
|
||||
|
||||
<PanelCard title="수뇌부 임명" subtitle="수뇌 관직 임명 및 해임" v-if="canAssign">
|
||||
<div class="chief-appoint">
|
||||
<div v-for="level in chiefLevels" :key="level" class="appoint-row">
|
||||
<div class="appoint-label">{{ formatOfficerLevelText(level, nationLevel) }}</div>
|
||||
<select v-model.number="chiefAppointmentDraft[level]" class="select-input">
|
||||
<option :value="0">공석</option>
|
||||
<option v-for="candidate in chiefCandidates(level)" :key="candidate.id" :value="candidate.id">
|
||||
{{ formatCandidateLabel(candidate) }}
|
||||
</option>
|
||||
</select>
|
||||
<button class="ghost" @click="appointChief(level)">임명</button>
|
||||
</div>
|
||||
</div>
|
||||
</PanelCard>
|
||||
|
||||
<PanelCard title="도시 관직 빠른 임명" subtitle="도시별 관직을 신속하게 배치합니다" v-if="canAssign">
|
||||
<div class="fast-appoint">
|
||||
<div class="appoint-row">
|
||||
<div class="appoint-label">도시</div>
|
||||
<select v-model.number="selectedCityId" class="select-input">
|
||||
<option v-for="city in data?.cityAssignments ?? []" :key="city.id" :value="city.id">
|
||||
{{ regionMap[city.region] ?? '-' }} · {{ cityLevelMap[city.level] ?? '-' }} {{ city.name }}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="appoint-row">
|
||||
<div class="appoint-label">관직</div>
|
||||
<select v-model.number="selectedOfficerLevel" class="select-input">
|
||||
<option :value="4">태수</option>
|
||||
<option :value="3">군사</option>
|
||||
<option :value="2">종사</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="appoint-row">
|
||||
<div class="appoint-label">장수</div>
|
||||
<select v-model.number="selectedGeneralId" class="select-input">
|
||||
<option :value="0">공석</option>
|
||||
<option
|
||||
v-for="candidate in cityCandidatesByLevel[selectedOfficerLevel]"
|
||||
:key="candidate.id"
|
||||
:value="candidate.id"
|
||||
>
|
||||
{{ formatCandidateLabel(candidate) }}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="current-officer">
|
||||
현재 임명: {{ currentCityOfficer?.name ?? '-' }}
|
||||
</div>
|
||||
<button class="ghost" @click="appointCityOfficer">임명</button>
|
||||
</div>
|
||||
</PanelCard>
|
||||
|
||||
<PanelCard title="도시 관직 현황" subtitle="도시별 관직 배치">
|
||||
<div class="table-scroll">
|
||||
<table class="nation-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>도시</th>
|
||||
<th>태수</th>
|
||||
<th>군사</th>
|
||||
<th>종사</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr v-for="city in data?.cityAssignments ?? []" :key="city.id">
|
||||
<td>{{ city.name }}</td>
|
||||
<td>{{ city.officers[4]?.name ?? '-' }}</td>
|
||||
<td>{{ city.officers[3]?.name ?? '-' }}</td>
|
||||
<td>{{ city.officers[2]?.name ?? '-' }}</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</PanelCard>
|
||||
|
||||
<PanelCard title="외교 권한" subtitle="외교권자/조언자 임명" v-if="isLeader">
|
||||
<div class="permission-grid">
|
||||
<div>
|
||||
<div class="permission-title">외교권자 (최대 2명)</div>
|
||||
<div class="permission-list">
|
||||
<label
|
||||
v-for="candidate in data?.permissionCandidates.ambassadors ?? []"
|
||||
:key="candidate.id"
|
||||
class="permission-item"
|
||||
>
|
||||
<input
|
||||
type="checkbox"
|
||||
:value="candidate.id"
|
||||
v-model="ambassadorSelection"
|
||||
@change="enforceAmbassadorLimit(candidate.id)"
|
||||
/>
|
||||
{{ candidate.name }}
|
||||
</label>
|
||||
</div>
|
||||
<button class="ghost" @click="changePermissions(true)">변경</button>
|
||||
</div>
|
||||
<div>
|
||||
<div class="permission-title">조언자 (최대 2명)</div>
|
||||
<div class="permission-list">
|
||||
<label
|
||||
v-for="candidate in data?.permissionCandidates.auditors ?? []"
|
||||
:key="candidate.id"
|
||||
class="permission-item"
|
||||
>
|
||||
<input
|
||||
type="checkbox"
|
||||
:value="candidate.id"
|
||||
v-model="auditorSelection"
|
||||
@change="enforceAuditorLimit(candidate.id)"
|
||||
/>
|
||||
{{ candidate.name }}
|
||||
</label>
|
||||
</div>
|
||||
<button class="ghost" @click="changePermissions(false)">변경</button>
|
||||
</div>
|
||||
</div>
|
||||
</PanelCard>
|
||||
|
||||
<PanelCard title="추방" subtitle="국가에서 장수를 추방합니다" v-if="canAssign">
|
||||
<div class="kick-panel">
|
||||
<select v-model.number="kickTargetId" class="select-input">
|
||||
<option :value="0">장수 선택</option>
|
||||
<option v-for="general in kickCandidates" :key="general.id" :value="general.id">
|
||||
{{ general.name }}
|
||||
</option>
|
||||
</select>
|
||||
<button class="ghost" @click="kickGeneral" :disabled="kickTargetId === 0">추방</button>
|
||||
</div>
|
||||
</PanelCard>
|
||||
</section>
|
||||
</main>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.nation-page {
|
||||
min-height: 100vh;
|
||||
padding: 24px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
border-bottom: 1px solid rgba(201, 164, 90, 0.4);
|
||||
padding-bottom: 12px;
|
||||
}
|
||||
|
||||
.page-title {
|
||||
font-size: 1.6rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.page-subtitle {
|
||||
font-size: 0.85rem;
|
||||
color: rgba(232, 221, 196, 0.7);
|
||||
}
|
||||
|
||||
.header-actions {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.ghost {
|
||||
border: 1px solid rgba(201, 164, 90, 0.4);
|
||||
padding: 6px 12px;
|
||||
font-size: 0.8rem;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
background: rgba(16, 16, 16, 0.6);
|
||||
}
|
||||
|
||||
.error {
|
||||
color: #f5b7b1;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
.panel-grid {
|
||||
display: grid;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.chief-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.chief-item {
|
||||
border: 1px solid rgba(201, 164, 90, 0.2);
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
.chief-title {
|
||||
font-size: 0.75rem;
|
||||
color: rgba(232, 221, 196, 0.6);
|
||||
}
|
||||
|
||||
.chief-name {
|
||||
font-size: 0.9rem;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.chief-meta {
|
||||
font-size: 0.75rem;
|
||||
color: rgba(232, 221, 196, 0.6);
|
||||
}
|
||||
|
||||
.chief-appoint,
|
||||
.fast-appoint {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.appoint-row {
|
||||
display: grid;
|
||||
grid-template-columns: 120px minmax(0, 1fr) auto;
|
||||
gap: 8px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.appoint-label {
|
||||
font-size: 0.8rem;
|
||||
color: rgba(232, 221, 196, 0.7);
|
||||
}
|
||||
|
||||
.select-input {
|
||||
border: 1px solid rgba(201, 164, 90, 0.4);
|
||||
background: rgba(16, 16, 16, 0.8);
|
||||
color: rgba(232, 221, 196, 0.9);
|
||||
padding: 6px 8px;
|
||||
font-size: 0.75rem;
|
||||
}
|
||||
|
||||
.current-officer {
|
||||
font-size: 0.75rem;
|
||||
color: rgba(232, 221, 196, 0.6);
|
||||
}
|
||||
|
||||
.table-scroll {
|
||||
overflow-x: auto;
|
||||
max-height: 320px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.nation-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
.nation-table th,
|
||||
.nation-table td {
|
||||
padding: 6px 8px;
|
||||
border-bottom: 1px solid rgba(201, 164, 90, 0.2);
|
||||
text-align: left;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.nation-table thead th {
|
||||
font-size: 0.7rem;
|
||||
color: rgba(232, 221, 196, 0.6);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
}
|
||||
|
||||
.permission-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.permission-title {
|
||||
font-size: 0.8rem;
|
||||
color: rgba(232, 221, 196, 0.7);
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.permission-list {
|
||||
display: grid;
|
||||
gap: 6px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.permission-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
.kick-panel {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user