This commit is contained in:
Владимир Фёдоров 2025-05-31 04:05:37 +07:00
parent 6a8b7edb45
commit ceb744ec12
2 changed files with 47 additions and 3 deletions

View File

@ -28,6 +28,10 @@
opacity: 0.9;
}
.button-custom:disabled {
opacity: 0.5;
}
.input-custom, .button-custom {
padding: 12px 16px;
border: 1px solid #ddd;

View File

@ -29,6 +29,8 @@
const team = ref<Team>({name: "", actions: []})
const actions = ref<Action[]>([])
const scrollContainer = ref<HTMLDivElement | null>();
const gameState = ref("")
const gameStateText = ref("")
function getTeam() {
fetch(
@ -87,6 +89,28 @@
}
};
function getGame() {
fetch(
getApiUrl("/game")
)
.then(response => response.json())
.then(data => {
gameState.value = data.state
if (data.state === "NEW") {
gameStateText.value = "Игра ещё не началась"
}
if (data.state === "RUN") {
gameStateText.value = ""
}
if (data.state === "STOP") {
gameStateText.value = "Игра остановлена"
}
})
.catch(error => {
console.error('Ошибка:', error)
});
}
// Автоматическая прокрутка при изменении items
watch(actions, () => {
scrollToBottom();
@ -105,7 +129,10 @@
getTeam()
intervalId = setInterval(() => {getTeam()}, 2000);
intervalId = setInterval(() => {
getTeam()
getGame()
}, 2000);
router.beforeEach((to, from, next) => {
clearInterval(intervalId);
@ -128,10 +155,19 @@
<div class="center-block-custom">
<form @submit.prevent="addAction">
<div>
<input class="input-custom" v-model="place" type="text" placeholder="Место назначения (А-1, а-1, а1)">
<input
class="input-custom"
v-model="place"
type="text"
placeholder="Место назначения (А-1, а-1, а1)"
:disabled="gameState == 'STOP'">
</div>
<div class="button-container">
<button class="button-custom" type="submit">Поехали</button>
<div class="second-color">{{ gameStateText }}</div>
<button
class="button-custom"
type="submit"
:disabled="gameState == 'STOP'">Поехали</button>
</div>
</form>
</div>
@ -187,6 +223,10 @@ body {
margin: 10px;
}
.second-color {
color: var(--second-color);
}
.form-custom {
border: 1px solid #444444;
background-color: var(--main-back-color);