Added queued events to WebUI

This commit is contained in:
Abdulmhsen B. A. A.
2024-05-29 19:55:31 +03:00
parent dbd5fd39ca
commit c267397b88
5 changed files with 169 additions and 25 deletions

12
composer.lock generated
View File

@@ -3186,12 +3186,12 @@
"source": {
"type": "git",
"url": "https://github.com/Roave/SecurityAdvisories.git",
"reference": "0ec6bad5f4523eda2514e89d5ea48cde6ebe7f99"
"reference": "e567d8d7d81fe18d93e87f64427a49caf3d5511f"
},
"dist": {
"type": "zip",
"url": "https://api.github.com/repos/Roave/SecurityAdvisories/zipball/0ec6bad5f4523eda2514e89d5ea48cde6ebe7f99",
"reference": "0ec6bad5f4523eda2514e89d5ea48cde6ebe7f99",
"url": "https://api.github.com/repos/Roave/SecurityAdvisories/zipball/e567d8d7d81fe18d93e87f64427a49caf3d5511f",
"reference": "e567d8d7d81fe18d93e87f64427a49caf3d5511f",
"shasum": ""
},
"conflict": {
@@ -3199,6 +3199,7 @@
"admidio/admidio": "<4.2.13",
"adodb/adodb-php": "<=5.20.20|>=5.21,<=5.21.3",
"aheinze/cockpit": "<2.2",
"aimeos/aimeos-core": ">=2022.04.1,<2022.10.17|>=2023.04.1,<2023.10.17|>=2024.04.1,<2024.04.7",
"aimeos/aimeos-typo3": "<19.10.12|>=20,<20.10.5",
"airesvsg/acf-to-rest-api": "<=3.1",
"akaunting/akaunting": "<2.1.13",
@@ -3400,6 +3401,7 @@
"funadmin/funadmin": "<=3.2|>=3.3.2,<=3.3.3",
"gaoming13/wechat-php-sdk": "<=1.10.2",
"genix/cms": "<=1.1.11",
"getformwork/formwork": "<1.13",
"getgrav/grav": "<1.7.46",
"getkirby/cms": "<4.1.1",
"getkirby/kirby": "<=2.5.12",
@@ -3706,7 +3708,7 @@
"silverstripe/admin": "<1.13.19|>=2,<2.1.8",
"silverstripe/assets": ">=1,<1.11.1",
"silverstripe/cms": "<4.11.3",
"silverstripe/comments": ">=1.3,<1.9.99|>=2,<2.9.99|>=3,<3.1.1",
"silverstripe/comments": ">=1.3,<3.1.1",
"silverstripe/forum": "<=0.6.1|>=0.7,<=0.7.3",
"silverstripe/framework": "<4.13.39|>=5,<5.1.11",
"silverstripe/graphql": ">=2,<2.0.5|>=3,<3.8.2|>=4,<4.3.7|>=5,<5.1.3",
@@ -3976,7 +3978,7 @@
"type": "tidelift"
}
],
"time": "2024-05-23T15:04:32+00:00"
"time": "2024-05-29T15:04:31+00:00"
},
{
"name": "sebastian/cli-parser",

View File

@@ -236,7 +236,7 @@ return (function () {
ImportCommand::TASK_NAME => [
'command' => ImportCommand::ROUTE,
'name' => ImportCommand::TASK_NAME,
'info' => 'Import play state and metadata from backends.',
'info' => 'Import data from backends.',
'enabled' => (bool)env('WS_CRON_IMPORT', false),
'timer' => $checkTaskTimer((string)env('WS_CRON_IMPORT_AT', '0 */1 * * *'), '0 */1 * * *'),
'args' => env('WS_CRON_IMPORT_ARGS', '-v'),
@@ -244,7 +244,7 @@ return (function () {
ExportCommand::TASK_NAME => [
'command' => ExportCommand::ROUTE,
'name' => ExportCommand::TASK_NAME,
'info' => 'Export play state to backends.',
'info' => 'Export data to backends.',
'enabled' => (bool)env('WS_CRON_EXPORT', false),
'timer' => $checkTaskTimer((string)env('WS_CRON_EXPORT_AT', '30 */1 * * *'), '30 */1 * * *'),
'args' => env('WS_CRON_EXPORT_ARGS', '-v'),
@@ -252,7 +252,7 @@ return (function () {
PushCommand::TASK_NAME => [
'command' => PushCommand::ROUTE,
'name' => PushCommand::TASK_NAME,
'info' => 'Push Webhook play states to backends.',
'info' => 'Send queued events to backends.',
'enabled' => (bool)env('WS_CRON_PUSH', true),
'timer' => $checkTaskTimer((string)env('WS_CRON_PUSH_AT', '*/10 * * * *'), '*/10 * * * *'),
'args' => env('WS_CRON_PUSH_ARGS', '-v'),
@@ -260,7 +260,7 @@ return (function () {
ProgressCommand::TASK_NAME => [
'command' => ProgressCommand::ROUTE,
'name' => ProgressCommand::TASK_NAME,
'info' => 'Push play progress to backends.',
'info' => 'Send play progress to backends.',
'enabled' => (bool)env('WS_CRON_PROGRESS', false),
'timer' => $checkTaskTimer((string)env('WS_CRON_PROGRESS_AT', '*/45 * * * *'), '*/45 * * * *'),
'args' => env('WS_CRON_PROGRESS_ARGS', '-v'),

View File

@@ -67,6 +67,13 @@
</span>
</NuxtLink>
<NuxtLink class="navbar-item" to="/queue" @click.native="showMenu=false">
<span class="icon-text">
<span class="icon"><i class="fas fa-list"></i></span>
<span>Queue</span>
</span>
</NuxtLink>
</div>
<div class="navbar-end pr-3">
<div class="navbar-item">

139
frontend/pages/queue.vue Normal file
View File

@@ -0,0 +1,139 @@
<template>
<div class="columns is-multiline">
<div class="column is-12 is-clearfix">
<span class="title is-4">Queue</span>
<div class="is-pulled-right">
<div class="field is-grouped">
<p class="control">
<button class="button is-info" @click.prevent="loadContent">
<span class="icon"><i class="fas fa-sync"></i></span>
</button>
</p>
</div>
</div>
<div class="is-hidden-mobile">
<span class="subtitle">This page will show events that are queued to be sent to backends via the
<code>Push</code> task.</span>
</div>
</div>
<div class="column is-12" v-if="items.length < 1">
<Message message_class="is-info" title="Loading..." v-if="isLoading">
<span class="icon-text">
<span class="icon"><i class="fas fa-spinner fa-spin"></i></span>
<span>Requesting queued events. Please wait...</span>
</span>
</Message>
<Message message_class="has-background-success-90 has-text-dark" title="Information" v-else>
<span class="icon-text">
<span class="icon"><i class="fas fa-check"></i></span>
<span>There are currently no queued events to be sent to backends.</span>
</span>
</Message>
</div>
<div class="column is-4 is-6-tablet" v-for="item in items" :key="item.id">
<div class="card" :class="{ 'is-success': 'Yes' === item.played }">
<header class="card-header">
<p class="card-header-title is-text-overflow pr-1">
<span class="icon" v-if="!item.progress">
<i class="fas fa-eye-slash" v-if="!item.watched"></i>
<i class="fas fa-eye" v-else></i>
&nbsp;
</span>
<NuxtLink :to="'/history/'+item.id" v-text="item.title"/>
</p>
<span class="card-header-icon">
<span class="icon" v-if="'episode' === item.type"><i class="fas fa-tv"></i></span>
<span class="icon" v-else><i class="fas fa-film"></i></span>
</span>
</header>
<div class="card-content">
<div class="columns is-multiline is-mobile has-text-centered">
<div class="column is-4-tablet is-6-mobile has-text-left-mobile">
<span class="icon-text">
<span class="icon"><i class="fas fa-calendar"></i>&nbsp;</span>
{{ moment(item.updated).fromNow() }}
</span>
</div>
<div class="column is-4-tablet is-6-mobile has-text-right-mobile">
<span class="icon-text">
<span class="icon"><i class="fas fa-server"></i></span>
<span>
<NuxtLink :to="'/backend/'+item.via" v-text="item.via"/>
</span>
</span>
</div>
<div class="column is-4-tablet is-12-mobile has-text-left-mobile">
<span class="icon-text">
<span class="icon"><i class="fas fa-envelope"></i></span>
<span>{{ item.event }}</span>
</span>
</div>
</div>
</div>
<div class="card-footer" v-if="item.progress">
<div class="card-footer-item">
<span class="has-text-success" v-if="item.watched">Played</span>
<span class="has-text-danger" v-else>Unplayed</span>
</div>
<div class="card-footer-item">
<span class="icon-text">
<span class="icon"><i class="fas fa-bars-progress"></i></span>
<span>{{ formatDuration(item.progress) }}</span>
</span>
</div>
</div>
</div>
</div>
</div>
</template>
<script setup>
import request from '~/utils/request.js'
import moment from 'moment'
import Message from '~/components/Message.vue'
import {formatDuration, notification} from '~/utils/index.js'
useHead({title: 'Queue'})
const items = ref([])
const isLoading = ref(false)
const loadContent = async () => {
isLoading.value = true
items.value = []
let response, json;
try {
response = await request(`/system/queue`)
} catch (e) {
isLoading.value = false
return notification('error', 'Error', e.message)
}
try {
json = await response.json()
} catch (e) {
json = {
error: {
code: response.status,
message: response.statusText
}
}
}
isLoading.value = false
if (!response.ok) {
notification('error', 'Error', `${json.error.code}: ${json.error.message}`)
return
}
items.value = json
}
onMounted(async () => loadContent())
</script>

View File

@@ -27,19 +27,14 @@ final class Queue
* @throws InvalidArgumentException
*/
#[Get(self::URL . '[/]', name: 'system.queue')]
public function envList(iRequest $request): iResponse
public function queueList(iRequest $request): iResponse
{
$response = [
'queue' => [],
'links' => [
'self' => (string)$request->getUri()->withHost('')->withPort(0)->withScheme(''),
],
];
$entities = $items = [];
$response = [];
$queue = $this->cache->get('queue', []);
$entities = $items = [];
foreach ($queue as $item) {
$items[] = Container::get(iState::class)::fromArray($item);
}
@@ -53,13 +48,14 @@ final class Queue
$items = null;
foreach ($entities as $entity) {
$response['queue'][] = [
'id' => $entity->id,
'title' => $entity->getName(),
'played' => $entity->isWatched() ? 'Yes' : 'No',
'via' => $entity->via ?? '??',
'date' => makeDate($entity->updated),
'event' => ag($entity->getExtra($entity->via), iState::COLUMN_EXTRA_EVENT),
$response[] = [
iState::COLUMN_ID => $entity->id,
iState::COLUMN_TITLE => $entity->getName(),
iState::COLUMN_WATCHED => $entity->isWatched(),
iState::COLUMN_VIA => $entity->via ?? '??',
iState::COLUMN_UPDATED => makeDate($entity->updated),
iState::COLUMN_EXTRA_EVENT => ag($entity->getExtra($entity->via), iState::COLUMN_EXTRA_EVENT),
iState::COLUMN_META_DATA_PROGRESS => $entity->hasPlayProgress() ? $entity->getPlayProgress() : null
];
}