studio/shotgun
2
0
Fork 0
Code Issues 3 Pull Requests Packages Projects Releases Wiki Activity

disable item buttons you can't use

Browse Source
This commit is contained in:
Branden J Brown 2024-01-30 21:50:41 -06:00
parent 72304fab0b
commit cceaa5635f
3 changed files with 19 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
site/src/components/Game.vue
View File

@ -10,12 +10,12 @@
<v-row>
<v-col cols="6">
<!-- dealer -->
<Player :stats="props.game.players[0]" :dealer="true" />
<Player :stats="props.game.players[0]" :dealer="true" :disabled="!props.dealer || !myTurn" />
</v-col>
<v-divider vertical />
<v-col cols="6">
<!-- challenger -->
<Player :stats="props.game.players[1]" :dealer="false" />
<Player :stats="props.game.players[1]" :dealer="false" :disabled="props.dealer || !myTurn" />
</v-col>
</v-row>
<v-row v-if="myTurn" class="py-4">

16
site/src/components/Player.vue
View File

@ -6,7 +6,7 @@
<v-row>
<v-col cols="4"></v-col>
<v-col cols="8">
<PlayerItems :items="props.stats.items" />
<PlayerItems :items="props.stats.items" :disabled="props.disabled" />
</v-col>
</v-row>
</v-container>
@ -17,8 +17,18 @@ import { computed } from 'vue';
import { Player } from '@/lib/game';
export interface Props {
stats: Player
dealer: boolean
/**
* The status of the player to show.
*/
stats: Player;
/**
* Whether this is the dealer's side, for alignment.
*/
dealer: boolean;
/**
* Whether the controls are disabled.
*/
disabled: boolean;
}
const props = defineProps<Props>();

7
site/src/components/PlayerItems.vue
View File

@ -2,7 +2,7 @@
<v-container>
<v-row v-for="r in 4">
<v-col v-for="c in 2" cols="4">
<v-btn :disabled="!props.items[itemIndex(r, c)]" :elevation="itemElev(props.items[itemIndex(r, c)])" @click="emit('item', itemIndex(r, c))">
<v-btn :disabled="btnDisabled(r, c)" @click="emit('item', itemIndex(r, c))" variant="outlined">
{{ props.items[itemIndex(r, c)] }}
</v-btn>
</v-col>
@ -13,6 +13,7 @@
<script setup lang="ts">
export interface Props {
items: string[];
disabled: boolean;
}
export interface Emits {
@ -26,7 +27,7 @@ function itemIndex(r: number, c: number): number {
return (r - 1) * 2 + (c - 1);
}
function itemElev(item: string): number {
return item ? 8 : 0;
function btnDisabled(r: number, c: number): boolean {
return props.disabled || !props.items[itemIndex(r, c)];
}
</script>