asco.fablab/BrainBlast
11
0
Fork 0
Code Issues 3 Pull Requests Packages Projects Releases Wiki Activity

Modification des données affichée dans la gestion des scores en vu d'une migration vers du dialog via WebSocket entre le serveur backend et le frontend

Browse Source
This commit is contained in:
Jérémy CHOMAZ 2024-04-01 15:03:27 +02:00
parent 87bdf08b65
commit 995cca83ae
3 changed files with 46 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
ui/src/components/GameStatus.vue
View File

@ -19,10 +19,10 @@
<v-row no-gutters justify="space-around" class="scorebox-1-pos"> <v-row no-gutters justify="space-around" class="scorebox-1-pos">
<v-row> <v-row>
<v-col class="align-start scorediv-style-red pr-1"> <v-col class="align-start scorediv-style-red pr-1">
<v-label class="labelScore-style">{{ localStorageVars.RedScore }}</v-label> <v-label class="labelScore-style">{{ RedScore }}</v-label>
</v-col> </v-col>
<v-col class="align-start scorediv-style-blue pl-1"> <v-col class="align-start scorediv-style-blue pl-1">
<v-label class="labelScore-style">{{ localStorageVars.BlueScore }}</v-label> <v-label class="labelScore-style">{{ BlueScore }}</v-label>
</v-col> </v-col>
</v-row> </v-row>
</v-row> </v-row>
@ -31,10 +31,10 @@
<v-row no-gutters justify="space-around" class="scorebox-2-pos mb-0"> <v-row no-gutters justify="space-around" class="scorebox-2-pos mb-0">
<v-row> <v-row>
<v-col class="align-start scorediv-style-orange pr-1"> <v-col class="align-start scorediv-style-orange pr-1">
<v-label class="labelScore-style">{{ localStorageVars.OrangeScore }}</v-label> <v-label class="labelScore-style">{{ OrangeScore }}</v-label>
</v-col> </v-col>
<v-col class="align-start scorediv-style-green pl-1"> <v-col class="align-start scorediv-style-green pl-1">
<v-label class="labelScore-style">{{ localStorageVars.GreenScore }}</v-label> <v-label class="labelScore-style">{{ GreenScore }}</v-label>
</v-col> </v-col>
</v-row> </v-row>
</v-row> </v-row>
@ -43,12 +43,14 @@
</template> </template>
<script setup> <script setup>
import { localStorageVars } from '@/variables.js'; import { ref} from 'vue'; // Import des fonctions de Vue 3
import variables from '@/variables.js';
localStorage.setItem('RedScore', 10); // Déclaration des variables locales pour les scores
localStorage.setItem('BlueScore', 11); const RedScore = ref(variables.RedScore);
localStorage.setItem('OrangeScore', 12); const BlueScore = ref(variables.BlueScore);
localStorage.setItem('GreenScore', 13); const OrangeScore = ref(variables.OrangeScore);
const GreenScore = ref(variables.GreenScore);
</script> </script>

24
ui/src/variables.js
View File

@ -1,8 +1,24 @@
export default {
// Gestion des score et des Buzzers
RedScore: 9999,
BlueScore: 1321,
OrangeScore: 10,
GreenScore: 10,
BuzzerRed: false,
BuzzerBlue: false,
BuzzerOrange: false,
BuzzerGreen: false,
// Ajoutez d'autres variables globales ici
};
// Variables localStorage // Variables localStorage
export const localStorageVars = { export const localStorageVars = {
// Exemple de variable localStorage // Exemple de variable localStorage
RedScore: localStorage.getItem('RedScore') || '', RedScorelocal: localStorage.getItem('RedScore') || '',
BlueScore: localStorage.getItem('BlueScore') || '', BlueScorelocal: localStorage.getItem('BlueScore') || '',
OrangeScore: localStorage.getItem('OrangeScore') || '', OrangeScorelocal: localStorage.getItem('OrangeScore') || '',
GreenScore: localStorage.getItem('GreenScore') || '', GreenScorelocal: localStorage.getItem('GreenScore') || '',
}; };

15
ui/src/views/GameDisplay.vue
View File

@ -0,0 +1,15 @@
<template>
<v-container>
<v-btn @click="update"></v-btn>
</v-container>
</template>
<script setup>
import { ref} from 'vue'; // Import des fonctions de Vue 3
import variables from '@/variables.js';
function update() {
variables.RedScore = '10'
}
</script>