diff --git a/client/src/components/ModalDialog.vue b/client/src/components/ModalDialog.vue index 7a64d1f..464646e 100644 --- a/client/src/components/ModalDialog.vue +++ b/client/src/components/ModalDialog.vue @@ -68,7 +68,7 @@ const emit = defineEmits(['close']) &__footer { display: flex; - justify-content: end; + // justify-content: end; margin: 24px 16px; } diff --git a/client/src/components/admin/PlayerDialog.vue b/client/src/components/admin/PlayerDialog.vue index 6397549..ae7d0f1 100644 --- a/client/src/components/admin/PlayerDialog.vue +++ b/client/src/components/admin/PlayerDialog.vue @@ -1,16 +1,17 @@ Name - + Score - + Authcode - + - {{ player.id }} + {{ player.id }} - {{ buttonText }} + {{ button.name }} @@ -19,10 +20,16 @@ import { ref, watch } from 'vue' import { PlayerEdit } from '@/composables/engine.d' +type Button = { + id: string + name: string + primary?: boolean +} + const props = defineProps<{ title: string show: boolean - buttonText: string + buttons: Array player: PlayerEdit }>() @@ -58,5 +65,9 @@ watch([props], () => { showId.value = false }) // reset visibility each time th visibility: visible; } } + + &__button ~ &__button { + margin-left: 16px; + } } \ No newline at end of file diff --git a/client/src/components/admin/PlayersTile.vue b/client/src/components/admin/PlayersTile.vue index 9140a45..797e5c2 100644 --- a/client/src/components/admin/PlayersTile.vue +++ b/client/src/components/admin/PlayersTile.vue @@ -21,14 +21,8 @@ - + @@ -37,11 +31,14 @@ import { computed, ref } from 'vue' import useI18n from '@/composables/useI18n' import useDateFormatter from '@/composables/useDateFormatter'; import type { GameInfo, PlayerEdit } from '@/composables/engine.d' +import EngineDebugVue from '../EngineDebug.vue'; +import useEngine from '~~/src/composables/useEngine'; +import { EmitFlags } from 'typescript'; const props = defineProps<{ gameinfo: GameInfo }>() -// const emit = defineEmits(['update']) +const emit = defineEmits(['update']) const { $t } = useI18n({ name: { en: 'Name', de: 'Name' }, @@ -58,28 +55,42 @@ const players = computed(() => { const showPlayerDialog = ref(false) const playerDialogPlayer = ref({} as PlayerEdit) const playerDialogTitle = ref('') -const playerDialogButtonText = ref('') +type ButtonAction = 'cancel' | 'create' | 'edit' | 'delete' +type Button = { + id: ButtonAction + name: string + primary?: boolean +} +const playerDialogButtons = ref([] as Array) const addPlayer = () => { showPlayerDialog.value = true playerDialogTitle.value = 'Add new player' - playerDialogButtonText.value = 'Create Player' + playerDialogButtons.value = [ + { id: 'create', name: 'Create Player', primary: true }, + { id: 'cancel', name: 'Cancel', primary: false }, + ], playerDialogPlayer.value = { - id: 'asdfasf', + id: '', name: '', score: 0, authcode: '', } } -const editPlayer = (player: PlayerEdit) => { - showPlayerDialog.value = true - playerDialogTitle.value = 'Add new player' - playerDialogButtonText.value = 'Create Player' - playerDialogPlayer.value = player -} -const playerDialogSubmit = () => { + +const playerDialogSubmit = async (action: ButtonAction): Promise => { showPlayerDialog.value = false - console.log(playerDialogPlayer.value) + switch (action) { + case 'cancel': + break + case 'create': + case 'edit': + await useEngine().savePlayer(playerDialogPlayer.value) + emit('update') + break + case 'delete': + break + } } diff --git a/client/src/composables/engine.d.ts b/client/src/composables/engine.d.ts index 10f5a8f..498faa4 100644 --- a/client/src/composables/engine.d.ts +++ b/client/src/composables/engine.d.ts @@ -10,7 +10,7 @@ export type Player = { export type Players = Array export type PlayerEdit = Player & { - authcode?: string + authcode: string } export type PlayerInfo = PlayerEdit & { diff --git a/client/src/composables/engine/gamemaster.ts b/client/src/composables/engine/gamemaster.ts index 09faa53..4fe80e1 100644 --- a/client/src/composables/engine/gamemaster.ts +++ b/client/src/composables/engine/gamemaster.ts @@ -1,5 +1,5 @@ import { EngineContext } from '@/composables/useEngine' -import type { GameInfo } from '@/composables/engine.d' +import type { GameInfo, PlayerEdit } from '@/composables/engine.d' import { useUserinfoStore } from "@/stores/UserinfoStore" export async function collectQuotes(this: EngineContext): Promise { @@ -59,3 +59,15 @@ export async function setGameName(this: EngineContext, name: string): Promise { + const userInfoStore = useUserinfoStore() + await this.callApi('/api/savePlayer', { + g: userInfoStore.gameId, + id: player.id, + name: player.name, + score: player.score.toString(), + authcode: player.authcode, + }) +} + diff --git a/client/src/composables/useEngine.ts b/client/src/composables/useEngine.ts index e30aa15..fbcd1e5 100644 --- a/client/src/composables/useEngine.ts +++ b/client/src/composables/useEngine.ts @@ -3,9 +3,9 @@ import { callApi, QueryParams } from '@/composables/engine/callApi' import { start, stop } from '@/composables/engine/startStop' import { fetchUpdate } from '@/composables/engine/fetchUpdate' import { loadQuotes, getQuotesRef, deleteQuote, saveQuote } from '@/composables/engine/quotes' -import { collectQuotes, startGame, continueGame, resetGame, finishGame, fetchGameInfo, setGameLang, setGameName } from '@/composables/engine/gamemaster' +import { collectQuotes, startGame, continueGame, resetGame, finishGame, fetchGameInfo, setGameLang, setGameName, savePlayer } from '@/composables/engine/gamemaster' import { saveSelection } from '@/composables/engine/play' -import type { Quotes, GameInfo } from '@/composables/engine.d' +import type { Quotes, GameInfo, PlayerEdit } from '@/composables/engine.d' export interface EngineContext { isActive: boolean @@ -39,6 +39,7 @@ export interface useEngine { fetchGameInfo: () => Promise setGameLang: (lang: string) => Promise setGameName: (name: string) => Promise + savePlayer: (player: PlayerEdit) => Promise } export default (): useEngine => { @@ -75,5 +76,6 @@ export default (): useEngine => { fetchGameInfo: () => fetchGameInfo.apply(context), setGameLang: (lang: string) => setGameLang.apply(context, [lang]), setGameName: (name: string) => setGameName.apply(context, [name]), + savePlayer: (player: PlayerEdit) => savePlayer.apply(context, [player]), } } \ No newline at end of file