wsy182
be9bd8c76d
- 在房间创建接口中添加总回合数配置选项 - 实现桌面弃牌区域的可视化展示，区分各玩家的弃牌和组合 - 添加缺门标识显示，帮助玩家识别缺门牌组起始位置 - 优化牌面操作状态管理，增加弃牌等待状态和超时处理机制 - 更新样式布局适配新的桌面牌面区域，调整墙体和桌面对齐方式 - 修复多处牌面状态同步问题，确保游戏流程中的界面一致性
64 lines
1.7 KiB
Vue
64 lines
1.7 KiB
Vue
<script setup lang="ts">
|
|
import { computed } from 'vue'
|
|
import defaultAvatarIcon from '../../assets/images/icons/avatar.svg'
|
|
import { getLackSuitImage } from '../../config/flowerColorMap'
|
|
import type { Suit } from '../../types/tile'
|
|
import type { SeatPlayerCardModel } from './seat-player-card'
|
|
|
|
const props = defineProps<{
|
|
seatClass: string
|
|
player: SeatPlayerCardModel
|
|
}>()
|
|
|
|
function normalizeMissingSuit(value: string): Suit | null {
|
|
const normalized = value.trim().toLowerCase()
|
|
const missingSuitMap: Record<string, Suit> = {
|
|
万: 'W',
|
|
筒: 'T',
|
|
条: 'B',
|
|
w: 'W',
|
|
t: 'T',
|
|
b: 'B',
|
|
wan: 'W',
|
|
tong: 'T',
|
|
tiao: 'B',
|
|
}
|
|
|
|
return missingSuitMap[normalized] ?? null
|
|
}
|
|
|
|
const missingSuitIcon = computed(() => {
|
|
const suit = normalizeMissingSuit(props.player.missingSuitLabel)
|
|
return suit ? getLackSuitImage(suit) : ''
|
|
})
|
|
|
|
const resolvedAvatarUrl = computed(() => {
|
|
return props.player.avatarUrl || defaultAvatarIcon
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<article
|
|
class="player-badge"
|
|
:class="[seatClass, { 'is-turn': player.isTurn }]"
|
|
>
|
|
<div class="avatar-panel">
|
|
<div class="avatar-card">
|
|
<img :src="resolvedAvatarUrl" :alt="`${player.name}头像`" />
|
|
</div>
|
|
<span v-if="player.dealer" class="dealer-mark">庄</span>
|
|
</div>
|
|
|
|
<div class="player-meta">
|
|
<p>{{ player.name }}</p>
|
|
<small v-if="player.isTrustee" class="trustee-chip">托管中</small>
|
|
<small v-if="player.isReady" class="ready-chip">已准备</small>
|
|
</div>
|
|
|
|
<div class="missing-mark">
|
|
<img v-if="missingSuitIcon" :src="missingSuitIcon" alt="" />
|
|
<span v-else>{{ player.missingSuitLabel }}</span>
|
|
</div>
|
|
</article>
|
|
</template>
|