devsam/core2026
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: synchronize account icons across game profiles

Browse Source
This commit is contained in:
Hide_D
2026-07-31 11:21:08 +00:00
parent c8adeeb47b
commit 5f20413552
87 changed files with 5755 additions and 280 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/game-frontend/src/components/main/MessagePlate.vue
+10 -11
View File
@@ -1,6 +1,7 @@
<script setup lang="ts">
import { computed, onBeforeUnmount, onMounted, ref } from 'vue';
import type { MessageType } from '@sammo-ts/logic';
import { resolveMessageGeneralIconUrl, useDefaultGeneralIcon } from '../../utils/generalIcon';
interface MessageTarget {
generalId: number;
@@ -105,16 +106,7 @@ const isBright = (color: string): boolean => {
return red * 0.299 + green * 0.587 + blue * 0.114 > 160;
};
const iconUrl = computed(() => {
const icon = props.message.src.icon?.trim();
if (!icon) {
return '/image/icons/default.jpg';
}
if (icon.startsWith('/') || /^https?:\/\//i.test(icon)) {
return icon;
}
return `${import.meta.env.BASE_URL}${icon.replace(/^\/+/, '')}`;
});
const iconUrl = computed(() => resolveMessageGeneralIconUrl(props.message.src.icon));
const targetClass = (target: MessageTarget) => ({
'msg-target': true,
@@ -155,7 +147,14 @@ onBeforeUnmount(() => {
:data-id="message.id"
>
<div class="msg-icon">
<img class="general-icon" width="64" height="64" :src="iconUrl" :alt="message.src.generalName" />
<img
class="general-icon"
width="64"
height="64"
:src="iconUrl"
:alt="message.src.generalName"
@error="useDefaultGeneralIcon"
/>
</div>
<div class="msg-body">
<div class="msg-header">
app/game-frontend/src/utils/generalIcon.ts
+74
View File
@@ -0,0 +1,74 @@
export const DEFAULT_GENERAL_ICON_URL = '/image/icons/default.jpg';
export const DEFAULT_GATEWAY_USER_ICON_BASE_URL = '/gateway/api/user-icons';
export type GeneralIconSource = {
picture?: string | null;
imageServer?: number | null;
};
type GeneralIconOptions = {
legacyBaseUrl?: string;
userIconBaseUrl?: string;
};
const trimTrailingSlashes = (value: string): string => value.replace(/\/+$/u, '');
const encodeLegacyIconPath = (value: string): string =>
value
.split('/')
.map((segment) => {
if (segment === '.') return '%2E';
if (segment === '..') return '%2E%2E';
return encodeURIComponent(segment);
})
.join('/');
const configuredUserIconBaseUrl = (): string =>
import.meta.env?.VITE_GATEWAY_USER_ICON_BASE_URL?.trim() || DEFAULT_GATEWAY_USER_ICON_BASE_URL;
export const resolveGeneralIconUrl = (
source: GeneralIconSource,
{ legacyBaseUrl = '/image/icons', userIconBaseUrl = configuredUserIconBaseUrl() }: GeneralIconOptions = {}
): string => {
const picture = source.picture?.trim() || 'default.jpg';
const baseUrl = source.imageServer ? userIconBaseUrl : legacyBaseUrl;
const encodedPicture = source.imageServer ? encodeURIComponent(picture) : encodeLegacyIconPath(picture);
return `${trimTrailingSlashes(baseUrl)}/${encodedPicture}`;
};
export const resolveGeneralIconBackgroundImage = (source: GeneralIconSource, options?: GeneralIconOptions): string => {
const resolved = resolveGeneralIconUrl(source, options);
return `url(${JSON.stringify(resolved)}), url(${JSON.stringify(DEFAULT_GENERAL_ICON_URL)})`;
};
export const resolveMessageGeneralIconUrl = (
icon: string | null | undefined,
userIconBaseUrl = configuredUserIconBaseUrl()
): string => {
const normalized = icon?.trim();
if (!normalized) {
return DEFAULT_GENERAL_ICON_URL;
}
const userIconMatch = /^\/?d_pic\/(.+)$/u.exec(normalized);
if (userIconMatch) {
return resolveGeneralIconUrl({ picture: userIconMatch[1], imageServer: 1 }, { userIconBaseUrl });
}
if (normalized.startsWith('/') || /^https?:\/\//iu.test(normalized)) {
return normalized;
}
return `${import.meta.env.BASE_URL}${normalized.replace(/^\/+/u, '')}`;
};
export const useDefaultGeneralIcon = (event: Event): void => {
if (
typeof HTMLImageElement === 'undefined' ||
!(event.currentTarget instanceof HTMLImageElement) ||
event.currentTarget.dataset.generalIconFallbackSource === event.currentTarget.currentSrc
) {
return;
}
event.currentTarget.dataset.generalIconFallbackSource = event.currentTarget.currentSrc;
event.currentTarget.src = DEFAULT_GENERAL_ICON_URL;
};
app/game-frontend/src/views/BestGeneralView.vue
+14 -22
View File
@@ -2,6 +2,7 @@
import { onMounted, ref, watch } from 'vue';
import { useRouter } from 'vue-router';
import { resolveGeneralIconUrl, useDefaultGeneralIcon } from '../utils/generalIcon';
import { trpc } from '../utils/trpc';
type RankEntry = {
@@ -47,10 +48,7 @@ const loading = ref(false);
const errorMessage = ref('');
const data = ref<BestGeneralPayload | null>(null);
const imageUrl = (entry: { picture: string | null; imageServer: number }): string => {
const picture = entry.picture?.trim() || 'default.jpg';
return entry.imageServer ? `${import.meta.env.BASE_URL}d_pic/${picture}` : `/image/icons/${picture}`;
};
const imageUrl = (entry: { picture: string | null; imageServer: number }): string => resolveGeneralIconUrl(entry);
const closePage = async (): Promise<void> => {
if (window.opener) {
@@ -89,20 +87,10 @@ watch(viewMode, () => {
</div>
<div class="view-selector" role="group" aria-label="장수 유형">
<button
class="legacy-button"
type="button"
:aria-pressed="viewMode === 'user'"
@click="viewMode = 'user'"
>
<button class="legacy-button" type="button" :aria-pressed="viewMode === 'user'" @click="viewMode = 'user'">
유저 보기
</button>
<button
class="legacy-button"
type="button"
:aria-pressed="viewMode === 'npc'"
@click="viewMode = 'npc'"
>
<button class="legacy-button" type="button" :aria-pressed="viewMode === 'npc'" @click="viewMode = 'npc'">
NPC 보기
</button>
</div>
@@ -117,7 +105,14 @@ watch(viewMode, () => {
<li v-for="(entry, rank) in section.entries" :key="`${section.title}:${entry.id}:${rank}`">
<div class="hall-rank legacy-bg2">{{ rank + 1 }}위</div>
<div class="hall-img">
<img class="generalIcon" :src="imageUrl(entry)" width="64" height="64" :alt="entry.name" />
<img
class="generalIcon"
:src="imageUrl(entry)"
width="64"
height="64"
:alt="entry.name"
@error="useDefaultGeneralIcon"
/>
</div>
<div class="hall-nation" :style="{ backgroundColor: entry.bgColor, color: entry.fgColor }">
{{ entry.nationName || '-' }}
@@ -134,11 +129,7 @@ watch(viewMode, () => {
<article v-for="section in data.uniqueItems" :key="section.slot" class="rankView legacy-bg0">
<h2 class="rankType legacy-bg1">{{ section.title }}</h2>
<ul>
<li
v-for="(entry, index) in section.entries"
:key="`${entry.itemKey}:${index}`"
class="no-value"
>
<li v-for="(entry, index) in section.entries" :key="`${entry.itemKey}:${index}`" class="no-value">
<div class="hall-rank legacy-bg2 item-name" :title="entry.itemInfo">{{ entry.itemName }}</div>
<div class="hall-img">
<img
@@ -147,6 +138,7 @@ watch(viewMode, () => {
width="64"
height="64"
:alt="entry.owner.name"
@error="useDefaultGeneralIcon"
/>
</div>
<div
app/game-frontend/src/views/BoardView.vue
+7 -4
View File
@@ -2,6 +2,7 @@
import { computed, nextTick, onMounted, reactive, ref, watch } from 'vue';
import { useRoute } from 'vue-router';
import { resolveGeneralIconUrl, useDefaultGeneralIcon } from '../utils/generalIcon';
import { trpc } from '../utils/trpc';
type BoardArticle = Awaited<ReturnType<typeof trpc.board.getArticles.query>>[number];
@@ -37,10 +38,11 @@ const resizeTextArea = (element: HTMLTextAreaElement | null) => {
const formatDate = (value: string): string => value.slice(5, 16).replace('T', ' ');
const iconPath = (article: BoardArticle): string => {
const picture = article.authorPicture || 'default.jpg';
return article.authorImageServer ? `${import.meta.env.BASE_URL}d_pic/${picture}` : `/image/icons/${picture}`;
};
const iconPath = (article: BoardArticle): string =>
resolveGeneralIconUrl({
picture: article.authorPicture,
imageServer: article.authorImageServer,
});
const refreshArticles = async () => {
if (loading.value) {
@@ -177,6 +179,7 @@ onMounted(() => {
height="64"
:src="iconPath(article)"
:alt="`${article.authorName} 아이콘`"
@error="useDefaultGeneralIcon"
/>
</div>
<div class="article-text">{{ article.content }}</div>
app/game-frontend/src/views/CurrentCityView.vue
+9 -5
View File
@@ -3,6 +3,7 @@ import { computed, ref, watch } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import { cityLevelMap, formatOfficerLevelText, regionMap } from '../utils/nationFormat';
import { getNpcColor } from '../utils/npcColor';
import { resolveGeneralIconUrl, useDefaultGeneralIcon } from '../utils/generalIcon';
import { trpc } from '../utils/trpc';
type Result = Awaited<ReturnType<typeof trpc.world.getCurrentCity.query>>;
@@ -93,10 +94,7 @@ const defenceTrainText = (value: number | null) => {
if (value >= 60) return '○';
return '△';
};
const generalImage = (general: General) => {
const picture = general.picture ?? 'default.jpg';
return general.imageServer ? `${import.meta.env.BASE_URL}d_pic/${picture}` : `/image/icons/${picture}`;
};
const generalImage = (general: General): string => resolveGeneralIconUrl(general);
</script>
<template>
@@ -270,7 +268,13 @@ const generalImage = (general: General) => {
:data-general-wounded="general.injury"
>
<td class="icon-cell">
<img class="general-icon" width="64" height="64" :src="generalImage(general)" />
<img
class="general-icon"
width="64"
height="64"
:src="generalImage(general)"
@error="useDefaultGeneralIcon"
/>
</td>
<td :style="{ color: getNpcColor(general.npcState) }">{{ general.name }}</td>
<td :class="{ wounded: general.injury !== 0 }">
app/game-frontend/src/views/GeneralListView.vue
+14 -9
View File
@@ -1,6 +1,7 @@
<script setup lang="ts">
import { onMounted, ref } from 'vue';
import { resolveGeneralIconUrl, useDefaultGeneralIcon } from '../utils/generalIcon';
import { formatOfficerLevelText } from '../utils/nationFormat';
import { getNpcColor } from '../utils/npcColor';
import { trpc } from '../utils/trpc';
@@ -45,10 +46,7 @@ const loadDirectory = async () => {
}
};
const imageUrl = (general: General): string => {
const picture = general.picture ?? 'default.jpg';
return general.imageServer ? `${import.meta.env.BASE_URL}d_pic/${picture}` : `/image/general/${picture}`;
};
const imageUrl = (general: General): string => resolveGeneralIconUrl(general, { legacyBaseUrl: '/image/general' });
const injuredStat = (value: number, injury: number): number => Math.trunc((value * (100 - injury)) / 100);
onMounted(() => {
@@ -135,11 +133,20 @@ onMounted(() => {
:data-npc-type="general.npcState"
>
<td class="center">
<img class="general-icon" width="64" height="64" :src="imageUrl(general)" alt="" />
<img
class="general-icon"
width="64"
height="64"
:src="imageUrl(general)"
alt=""
@error="useDefaultGeneralIcon"
/>
</td>
<td class="center">
<span :style="{ color: getNpcColor(general.npcState) }">{{ general.name }}</span>
<template v-if="general.ownerName"><br /><small>({{ general.ownerName }})</small></template>
<template v-if="general.ownerName"
><br /><small>({{ general.ownerName }})</small></template
>
</td>
<td class="center">{{ general.age }}세</td>
<td class="center">
@@ -156,9 +163,7 @@ onMounted(() => {
<td class="center">{{ formatOfficerLevelText(general.officerLevel, general.nationLevel) }}</td>
<td class="center">
<span :class="{ wounded: general.injury > 0 }">{{
general.injury > 0
? injuredStat(general.leadership, general.injury)
: general.leadership
general.injury > 0 ? injuredStat(general.leadership, general.injury) : general.leadership
}}</span
><span v-if="general.leadershipBonus > 0" class="leadership-bonus"
>+{{ general.leadershipBonus }}</span
app/game-frontend/src/views/HallOfFameView.vue
+10 -5
View File
@@ -2,6 +2,7 @@
import { computed, onMounted, ref, watch } from 'vue';
import { useRouter } from 'vue-router';
import { resolveGeneralIconUrl, useDefaultGeneralIcon } from '../utils/generalIcon';
import { trpc } from '../utils/trpc';
type HallOption = {
@@ -59,10 +60,7 @@ const selection = computed({
},
});
const imageUrl = (entry: HallEntry): string => {
const picture = entry.picture?.trim() || 'default.jpg';
return entry.imageServer ? `${import.meta.env.BASE_URL}d_pic/${picture}` : `/image/icons/${picture}`;
};
const imageUrl = (entry: HallEntry): string => resolveGeneralIconUrl(entry);
const closePage = async (): Promise<void> => {
if (window.opener) {
@@ -143,7 +141,14 @@ onMounted(loadOptions);
<li v-for="(entry, rank) in section.entries" :key="`${section.title}:${entry.generalId}:${rank}`">
<div class="hall-rank legacy-bg2">{{ rank + 1 }}위</div>
<div class="hall-img">
<img class="generalIcon" :src="imageUrl(entry)" width="64" height="64" :alt="entry.name" />
<img
class="generalIcon"
:src="imageUrl(entry)"
width="64"
height="64"
:alt="entry.name"
@error="useDefaultGeneralIcon"
/>
</div>
<div
v-if="entry.serverName"
app/game-frontend/src/views/JoinView.vue
+5 -16
View File
@@ -8,6 +8,7 @@ import { useSessionStore } from '../stores/session';
import { cityLevelMap, formatOfficerLevelText, regionMap } from '../utils/nationFormat';
import { getNpcColor } from '../utils/npcColor';
import { formatSeoulDateTime } from '../utils/legacyDateTime';
import { resolveGeneralIconUrl, useDefaultGeneralIcon } from '../utils/generalIcon';
type JoinConfig = Awaited<ReturnType<typeof trpc.join.getConfig.query>>;
type JoinInput = Parameters<typeof trpc.join.createGeneral.mutate>[0];
@@ -161,20 +162,8 @@ const isTrpcBusinessError = (value: unknown): boolean => {
return Boolean(data && typeof data === 'object' && 'code' in data && typeof data.code === 'string');
};
const npcImageUrl = (candidate: { picture: string | null; imageServer: number }): string => {
const picture = candidate.picture ?? 'default.jpg';
const userIconBaseUrl = import.meta.env.VITE_GATEWAY_USER_ICON_BASE_URL ?? '/gateway/api/user-icons';
return candidate.imageServer
? `${userIconBaseUrl.replace(/\/$/, '')}/${encodeURIComponent(picture)}`
: `/image/icons/${encodeURIComponent(picture)}`;
};
const useDefaultNpcImage = (event: Event): void => {
const image = event.currentTarget;
if (image instanceof HTMLImageElement && !image.src.endsWith('/image/icons/default.jpg')) {
image.src = '/image/icons/default.jpg';
}
};
const npcImageUrl = (candidate: { picture: string | null; imageServer: number }): string =>
resolveGeneralIconUrl(candidate);
const npcReservation = ref<PossessReservation | null>(null);
const npcLoading = ref(false);
@@ -806,7 +795,7 @@ onUnmounted(() => {
:alt="`${npc.name} 얼굴`"
width="64"
height="64"
@error="useDefaultNpcImage"
@error="useDefaultGeneralIcon"
/>
</h4>
<p>
@@ -935,7 +924,7 @@ onUnmounted(() => {
:alt="`${general.name} 얼굴`"
width="64"
height="64"
@error="useDefaultNpcImage"
@error="useDefaultGeneralIcon"
/>
</td>
<td
app/game-frontend/src/views/MyPageView.vue
+3 -3
View File
@@ -5,6 +5,7 @@ import { formatLog } from '../utils/formatLog';
import { formatSeoulDateTime } from '../utils/legacyDateTime';
import { isDefenceTrainPenaltyWaivedByScenarioEffect } from '@sammo-ts/logic';
import { useSessionStore } from '../stores/session';
import { resolveGeneralIconUrl, useDefaultGeneralIcon } from '../utils/generalIcon';
const SCREEN_MODE_KEY = 'sam.screenMode';
const CUSTOM_CSS_KEY = 'sam_customCSS';
@@ -307,10 +308,9 @@ onMounted(() => {
<div v-else class="general-table">
<div class="portrait-cell">
<img
:src="
data.general.picture ? `/image/game/${data.general.picture}` : '/image/game/default.jpg'
"
:src="resolveGeneralIconUrl(data.general, { legacyBaseUrl: '/image/game' })"
alt=""
@error="useDefaultGeneralIcon"
/>
<strong>{{ data.general.name }}</strong>
</div>
app/game-frontend/src/views/NationPersonnelView.vue
+3 -5
View File
@@ -1,6 +1,7 @@
<script setup lang="ts">
import { computed, onMounted, reactive, ref, watch } from 'vue';
import { resolveGeneralIconBackgroundImage } from '../utils/generalIcon';
import { trpc } from '../utils/trpc';
import { cityLevelMap, formatOfficerLevelText, getNationChiefLevel, regionMap } from '../utils/nationFormat';
@@ -61,10 +62,7 @@ const chiefAssignments = computed(() => data.value?.chiefAssignments ?? {});
const cityNameMap = computed(() => new Map((data.value?.cityAssignments ?? []).map((city) => [city.id, city.name])));
const generalMap = computed(() => new Map((data.value?.generals ?? []).map((general) => [general.id, general])));
const imageUrl = (general: GeneralEntry | undefined): string => {
const picture = general?.picture ?? 'default.jpg';
return general?.imageServer ? `${import.meta.env.BASE_URL}d_pic/${picture}` : `/image/icons/${picture}`;
};
const imageBackground = (general: GeneralEntry | undefined): string => resolveGeneralIconBackgroundImage(general ?? {});
const officerLocked = (value: number, level: number): boolean => (value & (1 << level)) !== 0;
const chiefLocked = (level: number): boolean => officerLocked(data.value?.nation.chiefSet ?? 0, level);
const cityOfficerLocked = (city: PersonnelResponse['cityAssignments'][number], level: number): boolean =>
@@ -219,7 +217,7 @@ onMounted(() => void loadPersonnel());
<td class="green-cell role-cell">{{ formatOfficerLevelText(level, nationLevel) }}</td>
<td
class="general-icon"
:style="{ backgroundImage: `url('${imageUrl(chiefAssignments[level])}')` }"
:style="{ backgroundImage: imageBackground(chiefAssignments[level]) }"
/>
<td class="chief-name">
{{ chiefAssignments[level]?.name ?? '-' }}({{
app/game-frontend/src/views/SelectGeneralView.vue
+16 -35
View File
@@ -4,6 +4,7 @@ import { useRouter } from 'vue-router';
import { useSessionStore } from '../stores/session';
import { formatSeoulDateTime } from '../utils/legacyDateTime';
import { resolveGeneralIconUrl, useDefaultGeneralIcon } from '../utils/generalIcon';
import { trpc } from '../utils/trpc';
type JoinConfig = Awaited<ReturnType<typeof trpc.join.getConfig.query>>;
@@ -107,12 +108,7 @@ const clearPendingAction = (action: PendingSelectionAction): void => {
const isIndeterminateTimeout = (value: unknown): boolean => {
if (!value || typeof value !== 'object' || !('data' in value)) return false;
const data = value.data;
return Boolean(
data &&
typeof data === 'object' &&
'code' in data &&
data.code === 'TIMEOUT'
);
return Boolean(data && typeof data === 'object' && 'code' in data && data.code === 'TIMEOUT');
};
const formatDateTime = (value: string | null | undefined): string => {
@@ -131,25 +127,14 @@ const shuffleNations = (source: Nation[]): Nation[] => {
return shuffled;
};
const userIconBaseUrl =
import.meta.env.VITE_GATEWAY_USER_ICON_BASE_URL ?? '/gateway/api/user-icons';
const imageUrl = (candidate: Candidate): string =>
candidate.imageServer
? `${userIconBaseUrl.replace(/\/$/, '')}/${candidate.picture}`
: `/image/icons/${candidate.picture}`;
const useFallbackImage = (event: Event): void => {
const image = event.currentTarget as HTMLImageElement;
if (image.dataset.fallbackApplied === 'true') return;
image.dataset.fallbackApplied = 'true';
image.src = '/image/icons/default.jpg';
};
const imageUrl = (candidate: Candidate): string => resolveGeneralIconUrl(candidate);
const personalityName = (key: string | null): string | null => {
if (!key) return null;
return personalities.value.find((entry) => entry.key === key)?.name ?? key;
};
const personalityInfo = (key: string | null): string =>
key ? personalities.value.find((entry) => entry.key === key)?.info ?? '' : '';
key ? (personalities.value.find((entry) => entry.key === key)?.info ?? '') : '';
const lightTextNationColors = new Set([
'',
@@ -294,8 +279,10 @@ onBeforeUnmount(() => {
<tbody>
<tr>
<td>
현재 : {{ serverInfo.currentYear }}年 {{ serverInfo.currentMonth }}月
(<span class="cyan">{{ serverInfo.tickMinutes }}분 턴</span> 서버)<br />
현재 : {{ serverInfo.currentYear }}年 {{ serverInfo.currentMonth }}月 (<span class="cyan"
>{{ serverInfo.tickMinutes }}분 턴</span
>
서버)<br />
등록 장수 : 유저 {{ serverInfo.userGeneralCount }} / {{ serverInfo.maxGeneral }} 명 +
<span class="cyan">NPC {{ serverInfo.npcGeneralCount }} 명</span>
</td>
@@ -319,7 +306,9 @@ onBeforeUnmount(() => {
}"
>
<td class="invitation-nation">{{ nation.name }}</td>
<td><div class="invitation-message">{{ nation.scoutMessage ?? '-' }}</div></td>
<td>
<div class="invitation-message">{{ nation.scoutMessage ?? '-' }}</div>
</td>
</tr>
</tbody>
</table>
@@ -337,11 +326,7 @@ onBeforeUnmount(() => {
<small v-else class="expired-text">- 만료 -</small>
<br />
<div class="card-holder">
<article
v-for="candidate in candidates"
:key="candidate.uniqueName"
class="general-card"
>
<article v-for="candidate in candidates" :key="candidate.uniqueName" class="general-card">
<h4 class="legacy-bg1 with-border">{{ candidate.generalName }}</h4>
<h4 class="portrait">
<img
@@ -349,7 +334,7 @@ onBeforeUnmount(() => {
:alt="candidate.generalName"
width="64"
height="64"
@error="useFallbackImage"
@error="useDefaultGeneralIcon"
/>
</h4>
<p>
@@ -398,7 +383,7 @@ onBeforeUnmount(() => {
:alt="selectedCandidate.generalName"
width="64"
height="64"
@error="useFallbackImage"
@error="useDefaultGeneralIcon"
/>
</h4>
<p>
@@ -486,12 +471,8 @@ onBeforeUnmount(() => {
</div>
<div class="footer-banner with-border">
<small>
삼국지 모의전투 HiDCHe core2026 / KOEI의 이미지를 사용, 응용하였습니다 / 제작 :
HideD /
<a
href="https://sam.hided.net/wiki/hidche/credit"
target="_blank"
rel="noopener noreferrer"
삼국지 모의전투 HiDCHe core2026 / KOEI의 이미지를 사용, 응용하였습니다 / 제작 : HideD /
<a href="https://sam.hided.net/wiki/hidche/credit" target="_blank" rel="noopener noreferrer"
>Credit</a
>
</small>
app/game-frontend/src/views/TroopView.vue
+3 -4
View File
@@ -1,6 +1,7 @@
<script setup lang="ts">
import { computed, onMounted, ref } from 'vue';
import { resolveGeneralIconUrl, useDefaultGeneralIcon } from '../utils/generalIcon';
import { trpc } from '../utils/trpc';
type TroopList = Awaited<ReturnType<typeof trpc.troop.getList.query>>;
@@ -159,10 +160,7 @@ const hideMemberPopup = () => {
popupMember.value = null;
};
const iconPath = (troop: Troop): string => {
const picture = troop.leader?.picture || 'default.jpg';
return troop.leader?.imageServer ? `${import.meta.env.BASE_URL}d_pic/${picture}` : `/image/icons/${picture}`;
};
const iconPath = (troop: Troop): string => resolveGeneralIconUrl(troop.leader ?? {});
const formatTurn = (turnTime: string | null): string => {
if (!turnTime) {
@@ -212,6 +210,7 @@ onMounted(() => {
width="64"
:src="iconPath(troop)"
:alt="`${troop.leader?.name ?? '부대장'} 아이콘`"
@error="useDefaultGeneralIcon"
/>
</div>
<div class="troopLeaderName">{{ troop.leader?.name ?? '알 수 없음' }}</div>