feat: admin: display game controls for role admin

This commit is contained in:
Settel 2022-03-25 15:20:41 +01:00
parent 3a61f6fae1
commit e9f45e8176
2 changed files with 30 additions and 19 deletions

View File

@ -1,18 +1,24 @@
<template>
<nav v-if="isGamemaster" class="gamecontrols">
<div v-if="$route.path != '/gamemaster'">
<button @click="go('/gamemaster')">admin interface</button>
<button :disabled="buttonsDisabled.collect" @click="collectQuotes">Collect Quotes</button>
<button :disabled="buttonsDisabled.start" @click="startGame">Start</button>
<button :disabled="buttonsDisabled.continue" @click="continueGame">Continue</button>
<button :disabled="buttonsDisabled.idle" @click="resetGame">Idle</button>
<button :disabled="buttonsDisabled.finish" @click="finishGame">Finish Game</button>
<button class="button-logout" @click="logout">logout</button>
</div>
<div v-if="$route.path != '/play'">
<button @click="go('/play')">back to game</button>
<button class="button-logout" @click="logout">logout</button>
</div>
<nav v-if="isGamemaster || isAdmin" class="gamecontrols">
<template v-if="isGamemaster">
<template v-if="$route.path != '/gamemaster'">
<button @click="go('/gamemaster')">admin interface</button>
<button :disabled="buttonsDisabled.collect" @click="collectQuotes">Collect Quotes</button>
<button :disabled="buttonsDisabled.start" @click="startGame">Start</button>
<button :disabled="buttonsDisabled.continue" @click="continueGame">Continue</button>
<button :disabled="buttonsDisabled.idle" @click="resetGame">Idle</button>
<button :disabled="buttonsDisabled.finish" @click="finishGame">Finish Game</button>
</template>
<template v-if="$route.path != '/play'">
<button @click="go('/play')">back to game</button>
</template>
</template>
<template v-if="isAdmin">
<template v-if="$route.path != '/admin'">
<button @click="go('/admin')">admin interface</button>
</template>
</template>
<button class="button-logout" @click="logout">logout</button>
</nav>
</template>
@ -26,6 +32,10 @@ export default {
const user = this.$store.state.engine.user
return user && user.role === 'gamemaster'
},
isAdmin() {
const user = this.$store.state.engine.user
return user && user.role === 'admin'
},
buttonsDisabled() {
const { state, phase } = this.$store.state.game
return {
@ -69,17 +79,21 @@ export default {
@import '~/assets/css/components';
.gamecontrols {
display: flex;
flex-direction: row;
padding: 8px 1em;
border-bottom: 1px solid $primary-box-border-color;
button {
font-family: Dosis;
margin: 0 2px;
padding: 0 1rem;
font-size: 18px;
}
.button-logout {
float: right;
margin-left: auto;
}
}
</style>

View File

@ -1,6 +1,7 @@
<template>
<div class="page-admin">
<template v-if="user.role === 'admin'">
<GameControls />
<div class="page-admin__body">
<div class="page-admin__tiles">
<AdminTileMyself :user="user" />
@ -42,10 +43,6 @@ export default {
width: 100%;
height: 100%;
&__body {
position: relative;
}
&__tiles {
display: flex;
flex-wrap: wrap;