nucleo000/snatchgame
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

system message guardados en historial por sala

Browse Source
This commit is contained in:
josedario87
2025-08-27 18:23:22 -06:00
parent 80af7461a4
commit d7c0b79549
3 changed files with 35 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
client/src/components/RoomCard.vue
View File

@@ -88,6 +88,16 @@
<span class="winner-name">{{ roomDetails.winner }}</span>
</div>
</div>
<div v-if="roomDetails.systemMessages?.length" class="system-messages">
<div class="sys-head">System Messages</div>
<div class="sys-list">
<div v-for="m in roomDetails.systemMessages" :key="m.timestamp + '-' + (m.kind||'')" class="sys-item">
<span class="sys-time">{{ formatTime(m.timestamp) }}</span>
<span class="sys-text">{{ m.text }}</span>
</div>
</div>
</div>
</div>
</div>
</template>
@@ -116,6 +126,7 @@ interface RoomDetails {
}>;
timeRemaining: number;
winner?: string;
systemMessages?: Array<{ text: string; kind: string; timestamp: number }>;
}
defineProps<{
@@ -350,4 +361,11 @@ function formatSeconds(seconds: number): string {
color: #4caf50;
font-weight: bold;
}
</style>
.system-messages { margin-top: 14px; }
.sys-head { font-weight: 800; font-size: 13px; color:#556; margin-bottom: 6px; }
.sys-list { display:flex; flex-direction:column; gap:6px; max-height: 180px; overflow:auto; padding-right: 4px; }
.sys-item { display:flex; gap:8px; align-items:center; background:#f8f9fa; border:1px solid #eee; border-radius:8px; padding:6px 8px; }
.sys-time { font-family: monospace; font-size: 11px; color:#666; }
.sys-text { font-size: 13px; font-weight:600; color:#333; }
</style>