feat(ui): FRO-34 Lobby (#21)

Started with Lobby Component

Co-authored-by: LQ63 <lkhermann@web.de>
Co-authored-by: Janis <janis-e@gmx.de>
Reviewed-on: #21
Reviewed-by: Janis <janis-e@gmx.de>
Co-authored-by: lq64 <lq@blackhole.local>
Co-committed-by: lq64 <lq@blackhole.local>
This commit is contained in:
2025-12-14 15:10:27 +01:00
committed by Janis
parent f0623dbfb2
commit bb6355d9ed
24 changed files with 408 additions and 140 deletions

View File

@@ -1,26 +1,26 @@
<script setup lang="ts">
import { computed } from 'vue'
import {computed, toRefs} from 'vue'
import type {PlayerQueue} from "@/types/GameSubTypes.ts";
import {useIngame} from "@/composables/useIngame.ts";
import type {GameInfo} from "@/types/GameTypes.ts";
const props = defineProps<{
queue: PlayerQueue
}>()
const safeNextPlayers = computed(() => props.queue.players ?? [])
const ig = useIngame()
const currentPlayer = computed(() => (<GameInfo>ig.data).playerQueue.currentPlayer)
const queue = computed(() => { return (<GameInfo>ig.data).playerQueue.queue ?? []})
</script>
<template>
<q-card flat class="turn-tracker-container q-pa-md">
<q-card flat class="turn-tracker-container q-pa-md no-background">
<q-card-section>
<div class="text-subtitle2 q-mb-xs">Current Player</div>
<div id="current-player-name" class="text-h6 text-weight-bold text-positive">{{
props.queue.currentPlayer?.name
currentPlayer?.name
}}</div>
<div v-if="safeNextPlayers.length > 0" class="q-mt-md">
<div v-if="queue.length > 0" class="q-mt-md">
<div id="next-players-text" class="text-subtitle2 q-mb-xs">Next Players</div>
<q-list id="next-players-container" dense>
<q-item v-for="player in safeNextPlayers" :key="player.id">
<q-item v-for="player in queue" :key="player.id">
<q-item-section>
<div class="text-body1 text-primary">{{ player.name }}</div>
</q-item-section>
@@ -35,4 +35,7 @@ const safeNextPlayers = computed(() => props.queue.players ?? [])
.turn-tracker-container {
max-width: 320px;
}
.no-background {
background: none !important;
}
</style>