54 lines
1.9 KiB
Vue
54 lines
1.9 KiB
Vue
<script setup lang="ts">
|
|
import { NButton, NCard, NSpace, NTag } from 'naive-ui'
|
|
import type { OnlineIntent, OnlineState } from '../types/online'
|
|
defineProps<{ state: OnlineState; isBusy: boolean }>()
|
|
const emit = defineEmits<{ action: [intent: OnlineIntent] }>()
|
|
function run(intent: OnlineIntent) {
|
|
emit('action', intent)
|
|
}
|
|
</script>
|
|
<template>
|
|
<n-card title="Экран игры">
|
|
<template #header-extra>
|
|
<n-tag
|
|
role="status"
|
|
data-testid="game-connection-status"
|
|
:type="state.connection === 'connected' ? 'success' : 'error'"
|
|
>
|
|
{{ state.connection === 'connected' ? 'Подключено' : 'Не подключено' }}
|
|
</n-tag>
|
|
</template>
|
|
<slot />
|
|
<n-space v-if="state.screenId" align="center">
|
|
<span>Экран №{{ state.screenId }}</span>
|
|
<n-button
|
|
:disabled="isBusy || state.busy"
|
|
@click="run({ action: 'disconnect' })"
|
|
>Отключиться</n-button
|
|
>
|
|
</n-space>
|
|
<template v-if="state.screenId">
|
|
<p role="status" data-testid="sound-assignment">
|
|
{{
|
|
state.soundEnabled === null
|
|
? 'Назначение звука пока неизвестно'
|
|
: state.soundEnabled
|
|
? 'Экран назначен для звука'
|
|
: 'Экран не назначен для звука'
|
|
}}
|
|
<template v-if="state.soundEnabled !== null && state.connection !== 'connected'">
|
|
· Последнее состояние
|
|
</template>
|
|
</p>
|
|
</template>
|
|
<n-space v-if="state.screenId">
|
|
<n-button
|
|
v-if="state.soundEnabled !== true"
|
|
:disabled="isBusy || state.busy || !state.authenticated"
|
|
@click="run({ action: 'sound' })"
|
|
>Назначить звук этому экрану</n-button
|
|
>
|
|
</n-space>
|
|
</n-card>
|
|
</template>
|