feat: issue a warning on admin page when there're no teams yet

This commit is contained in:
Settel 2024-02-18 13:42:59 +01:00
parent 2bcb322488
commit 512edbc62b

View File

@ -1,5 +1,6 @@
<template> <template>
<AdminInfoTile title="Games"> <div>
<AdminInfoTile v-if="gamesCount > 0" title="Games">
<table class="gameinfos-tile__table"> <table class="gameinfos-tile__table">
<tr class="gameinfos-tile__row"> <tr class="gameinfos-tile__row">
<th class="gameinfos-tile__table-head">{{ $t('team-name')}}</th> <th class="gameinfos-tile__table-head">{{ $t('team-name')}}</th>
@ -22,11 +23,15 @@
</tr> </tr>
</table> </table>
</AdminInfoTile> </AdminInfoTile>
<AdminInfoTile v-if="gamesCount == 0" :title="$t('no-games-1')">
<p>{{ $t('no-games-2') }}</p>
</AdminInfoTile>
</div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { navigateTo } from "#app" import { navigateTo } from "#app"
import { ref } from 'vue' import { ref, computed } from 'vue'
import useI18n from '@/composables/useI18n' import useI18n from '@/composables/useI18n'
import useEngine from '@/composables/useEngine' import useEngine from '@/composables/useEngine'
import type { GameInfo } from '@/composables/engine.d' import type { GameInfo } from '@/composables/engine.d'
@ -37,11 +42,16 @@ const { $t } = useI18n({
state: { en: 'State', de: 'Status' }, state: { en: 'State', de: 'Status' },
'num-players': { en: '# Players', de: '# Spieler' }, 'num-players': { en: '# Players', de: '# Spieler' },
gamemasters: { en: 'Gamemaster(s)', de: 'Gamemaster(s)' }, gamemasters: { en: 'Gamemaster(s)', de: 'Gamemaster(s)' },
'no-games-1': { en: 'The list of teams is empty', de: 'Die Liste der Teams ist noch leer'},
'no-games-2': { en: 'Log out and click the "create team" button on the start page.', de: 'Logge dich aus und klicke auf der Startseite auf "Team erstellen".'},
}) })
const { fetchGameInfos, cameo } = useEngine() const { fetchGameInfos, cameo } = useEngine()
const games = ref(await fetchGameInfos()) const games = ref(await fetchGameInfos())
const gamesCount = computed(() => {
return Object.keys(games.value).length
})
const getGamemastersFromGame = (game: GameInfo) => game.players.filter((player) => player.role === 'gamemaster').map((player) => player.name) const getGamemastersFromGame = (game: GameInfo) => game.players.filter((player) => player.role === 'gamemaster').map((player) => player.name)
const selectGame = async (game: GameInfo): Promise<void> => { const selectGame = async (game: GameInfo): Promise<void> => {