61 lines
1.6 KiB
Vue
61 lines
1.6 KiB
Vue
<script setup>
|
|
import PlayerComponent from '@/components/PlayerComponent.vue';
|
|
import { Space, Button } from 'vant';
|
|
import { postRequest } from '@/utils';
|
|
import { useBackendStateStore } from '@/stores/backendState'
|
|
import { onMounted } from 'vue';
|
|
import { usePlayerStateStore } from '@/stores/playersState';
|
|
import { QButton } from '@qvant/qui-max'
|
|
|
|
|
|
const backendStateStore = useBackendStateStore()
|
|
const playerStateStore = usePlayerStateStore()
|
|
|
|
backendStateStore.updateCanWatch()
|
|
|
|
function kill(...names) {
|
|
postRequest("/api/commands/kill", { names })
|
|
playerStateStore.refreshPlayers()
|
|
}
|
|
|
|
function startWatching() {
|
|
postRequest("/api/commands/start-watching")
|
|
playerStateStore.refreshPlayers()
|
|
}
|
|
|
|
onMounted(() => {
|
|
backendStateStore.updateCanWatch()
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<div id="controls">
|
|
<QButton class="btn-ctrl" @click="kill('mpv')" theme="secondary" :full-width="true">
|
|
Следующая серия
|
|
</QButton>
|
|
<QButton class="btn-ctrl" @click="kill('awatch', 'mpv')" theme="secondary" :full-width="true">
|
|
Закончить потребление
|
|
</QButton>
|
|
<QButton class="btn-ctrl" @click="startWatching()" theme="secondary"
|
|
:disabled="!backendStateStore.backendState.canWatch" :full-width="true">
|
|
Начать потребление
|
|
</QButton>
|
|
</div>
|
|
<PlayerComponent />
|
|
</template>
|
|
|
|
<style>
|
|
#controls {
|
|
position: relative;
|
|
top: calc(50% - var(--van-action-bar-height));
|
|
margin-top: calc(-50px - var(--van-action-bar-height));
|
|
width: 100%;
|
|
}
|
|
|
|
.btn-ctrl {
|
|
margin-bottom: 10px;
|
|
height: 60px;
|
|
margin-left: 0 !important;
|
|
border-radius: 10px !important;
|
|
}
|
|
</style> |