fix: 베팅 후보에 종목별 핵심 능력치를 표시
전력전은 종합, 통솔전은 통솔, 일기토는 무력, 설전은 지력을 배당과 현재 투자금 옆에 표시한다. 네 종목 매핑과 desktop/mobile Chromium containment를 회귀 검사한다.
This commit is contained in:
@@ -3,6 +3,7 @@ import { computed, ref } from 'vue';
|
||||
import GeneralIdentity from '../ui/GeneralIdentity.vue';
|
||||
import {
|
||||
buildTournamentBracket,
|
||||
resolveTournamentCoreStat,
|
||||
type TournamentBracketMatch,
|
||||
type TournamentBracketParticipant,
|
||||
} from '../../utils/tournamentBracket';
|
||||
@@ -14,6 +15,7 @@ const props = defineProps<{
|
||||
betTotals?: Record<number, number>;
|
||||
myBetTotals?: Record<number, number>;
|
||||
totalBet: number;
|
||||
tournamentType?: number;
|
||||
showLegend?: boolean;
|
||||
}>();
|
||||
|
||||
@@ -68,6 +70,8 @@ const odds = (id: number | null) => {
|
||||
return (props.totalBet / amount).toFixed(2);
|
||||
};
|
||||
const myBet = (id: number | null) => (id === null ? 0 : (props.myBetTotals?.[id] ?? 0));
|
||||
const coreStat = (slot: (typeof bracket.value.top16.slots)[number]) =>
|
||||
resolveTournamentCoreStat(slot, props.tournamentType ?? 0);
|
||||
const mobilePairs = computed(() => {
|
||||
const column = roundColumns.value[activeMobileRound.value] ?? [];
|
||||
if (activeMobileRound.value === roundColumns.value.length - 1) return column.map((slot) => [slot]);
|
||||
@@ -119,6 +123,9 @@ const mobilePairs = computed(() => {
|
||||
>
|
||||
<GeneralIdentity :name="slot.name" :picture="slot.picture" :image-server="slot.imageServer" />
|
||||
<div v-if="columnIndex === 0" class="bracket-bet-summary">
|
||||
<small v-if="coreStat(slot)" class="bracket-core-stat">
|
||||
{{ coreStat(slot)?.label }} {{ coreStat(slot)?.value }}
|
||||
</small>
|
||||
<small class="bracket-odds">배당 {{ odds(slot.id) }}</small>
|
||||
<small class="bracket-my-bet">내 투자 금{{ myBet(slot.id) }}</small>
|
||||
</div>
|
||||
@@ -152,6 +159,9 @@ const mobilePairs = computed(() => {
|
||||
>
|
||||
<GeneralIdentity :name="slot.name" :picture="slot.picture" :image-server="slot.imageServer" />
|
||||
<div v-if="activeMobileRound === 0" class="bracket-bet-summary">
|
||||
<small v-if="coreStat(slot)" class="bracket-core-stat">
|
||||
{{ coreStat(slot)?.label }} {{ coreStat(slot)?.value }}
|
||||
</small>
|
||||
<small class="bracket-odds">배당 {{ odds(slot.id) }}</small>
|
||||
<small class="bracket-my-bet">내 투자 금{{ myBet(slot.id) }}</small>
|
||||
</div>
|
||||
@@ -236,6 +246,7 @@ const mobilePairs = computed(() => {
|
||||
gap: 4px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.bracket-core-stat,
|
||||
.bracket-odds,
|
||||
.bracket-my-bet {
|
||||
display: block;
|
||||
@@ -244,6 +255,9 @@ const mobilePairs = computed(() => {
|
||||
font-size: 11px;
|
||||
line-height: 12px;
|
||||
}
|
||||
.bracket-core-stat {
|
||||
color: #fff;
|
||||
}
|
||||
.bracket-my-bet {
|
||||
overflow: hidden;
|
||||
color: orange;
|
||||
|
||||
@@ -3,6 +3,9 @@ export interface TournamentBracketParticipant {
|
||||
name: string;
|
||||
picture?: string | null;
|
||||
imageServer?: number | null;
|
||||
leadership?: number;
|
||||
strength?: number;
|
||||
intel?: number;
|
||||
}
|
||||
|
||||
export interface TournamentBracketMatch {
|
||||
@@ -20,6 +23,14 @@ export interface TournamentBracketSlot {
|
||||
picture: string | null;
|
||||
imageServer: number;
|
||||
advanced: boolean;
|
||||
leadership?: number;
|
||||
strength?: number;
|
||||
intel?: number;
|
||||
}
|
||||
|
||||
export interface TournamentCoreStat {
|
||||
label: '종합' | '통솔' | '무력' | '지력';
|
||||
value: number;
|
||||
}
|
||||
|
||||
export interface TournamentBracketRound {
|
||||
@@ -43,6 +54,18 @@ const emptySlot = (): TournamentBracketSlot => ({
|
||||
advanced: false,
|
||||
});
|
||||
|
||||
export const resolveTournamentCoreStat = (
|
||||
participant: Pick<TournamentBracketParticipant, 'leadership' | 'strength' | 'intel'>,
|
||||
tournamentType: number
|
||||
): TournamentCoreStat | null => {
|
||||
const { leadership, strength, intel } = participant;
|
||||
if (leadership === undefined || strength === undefined || intel === undefined) return null;
|
||||
if (tournamentType === 0) return { label: '종합', value: leadership + strength + intel };
|
||||
if (tournamentType === 1) return { label: '통솔', value: leadership };
|
||||
if (tournamentType === 2) return { label: '무력', value: strength };
|
||||
return { label: '지력', value: intel };
|
||||
};
|
||||
|
||||
export const buildTournamentBracket = (
|
||||
participants: TournamentBracketParticipant[],
|
||||
matches: TournamentBracketMatch[],
|
||||
@@ -65,6 +88,9 @@ export const buildTournamentBracket = (
|
||||
picture: participant?.picture ?? null,
|
||||
imageServer: participant?.imageServer ?? 0,
|
||||
advanced: match.winnerId === id,
|
||||
leadership: participant?.leadership,
|
||||
strength: participant?.strength,
|
||||
intel: participant?.intel,
|
||||
};
|
||||
})
|
||||
);
|
||||
@@ -84,6 +110,9 @@ export const buildTournamentBracket = (
|
||||
picture: participantOf(resolvedWinnerId)?.picture ?? null,
|
||||
imageServer: participantOf(resolvedWinnerId)?.imageServer ?? 0,
|
||||
advanced: resolvedWinnerId !== null,
|
||||
leadership: participantOf(resolvedWinnerId)?.leadership,
|
||||
strength: participantOf(resolvedWinnerId)?.strength,
|
||||
intel: participantOf(resolvedWinnerId)?.intel,
|
||||
},
|
||||
final,
|
||||
semi: buildRound(9, 4),
|
||||
|
||||
@@ -137,6 +137,7 @@ const placeBet = async (targetId: number) => {
|
||||
:bet-totals="betTotals"
|
||||
:my-bet-totals="myBetTotals"
|
||||
:total-bet="totalAmount"
|
||||
:tournament-type="snapshot?.state?.type ?? 0"
|
||||
:show-legend="false"
|
||||
/>
|
||||
|
||||
|
||||
@@ -193,6 +193,7 @@ const start = async () => {
|
||||
:bet-totals="betTotals"
|
||||
:my-bet-totals="myBetTotals"
|
||||
:total-bet="totalBet"
|
||||
:tournament-type="snapshot?.state?.type ?? 0"
|
||||
/>
|
||||
|
||||
<section v-if="currentMatch" class="fight bg0">
|
||||
|
||||
Reference in New Issue
Block a user