@tak-ps/cloudtak 12.54.0 → 12.55.0

package/src/components/Admin/Tasks/AdminTasks.vue

@@ -1,286 +0,0 @@
-<template>
-    <div>
-        <div class='card-header'>
-            <h1 class='card-title'>
-                Registered Tasks
-            </h1>
-
-            <div class='ms-auto btn-list'>
-                <template v-if='!edit'>
-                    <TablerIconButton
-                        title='Register New Task'
-                        @click='edit = {
-                            "name": "",
-                            "prefix": "",
-                            "readme": "",
-                            "repo": ""
-                        }'
-                    >
-                        <IconPlus
-                            :size='32'
-                            stroke='1'
-                        />
-                    </TablerIconButton>
-                    <TablerRefreshButton
-                        title='Refresh'
-                        :loading='loading'
-                        @click='fetchList'
-                    />
-                </template>
-                <template v-else-if='edit.id'>
-                    <TablerDelete
-                        displaytype='icon'
-                        @delete='deleteTask(edit)'
-                    />
-                </template>
-            </div>
-        </div>
-        <div style='min-height: 20vh; margin-bottom: 61px'>
-            <template v-if='edit'>
-                <TablerLoading
-                    v-if='loading'
-                    desc='Saving Tasks'
-                />
-                <template v-else>
-                    <div class='row g-2 py-2 px-2'>
-                        <div class='col-md-6 col-12'>
-                            <TablerInput
-                                v-model='edit.name'
-                                label='Task Name'
-                            />
-                        </div>
-                        <div class='col-md-6 col-12'>
-                            <TablerInput
-                                v-model='edit.prefix'
-                                :disabled='edit.id'
-                                label='Container Prefix'
-                            />
-                        </div>
-                        <div class='col-12'>
-                            <TablerToggle
-                                v-model='edit.favorite'
-                                label='Favorited'
-                            />
-                        </div>
-
-                        <UploadLogo
-                            v-model='edit.logo'
-                            label='Task Logo'
-                        />
-                        <TablerInput
-                            v-model='edit.repo'
-                            label='Task Code Repository URL'
-                        />
-
-                        <TablerInput
-                            v-model='edit.readme'
-                            label='Task Markdown Readme URL'
-                        />
-
-                        <div class='col-12 d-flex py-2'>
-                            <button
-                                class='btn btn-secondary'
-                                @click='edit = false'
-                            >
-                                Cancel
-                            </button>
-                            <div class='ms-auto btn-list mx-3'>
-                                <button
-                                    class='btn btn-primary'
-                                    @click='saveTask'
-                                >
-                                    Save
-                                </button>
-                            </div>
-                        </div>
-                    </div>
-                </template>
-            </template>
-            <template v-else>
-                <TablerLoading
-                    v-if='loading'
-                    desc='Loading Tasks'
-                />
-                <TablerAlert
-                    v-else-if='error'
-                    :err='error'
-                />
-                <TablerNone
-                    v-else-if='!list.items.length'
-                    label='No Tasks'
-                    :create='false'
-                />
-                <div
-                    v-else
-                    class='table-responsive'
-                >
-                    <table class='table card-table table-hover table-vcenter datatable'>
-                        <TableHeader
-                            v-model:sort='paging.sort'
-                            v-model:order='paging.order'
-                            v-model:header='header'
-                        />
-                        <tbody>
-                            <tr
-                                v-for='layer in list.items'
-                                :key='layer.id'
-                                class='cursor-pointer'
-                                @click='edit = layer'
-                            >
-                                <template v-for='h in header'>
-                                    <template v-if='h.display'>
-                                        <td>
-                                            <template v-if='h.name === "logo"'>
-                                                <img
-                                                    v-if='layer[h.name]'
-                                                    :src='layer[h.name]'
-                                                    alt='Logo Preview'
-                                                    class='img-thumbnail'
-                                                    style='height: 50px;'
-                                                >
-                                                <span v-else>No Logo</span>
-                                            </template>
-                                            <template v-else-if='h.name === "name"'>
-                                                <div class='d-flex align-items-center'>
-                                                    <IconStar
-                                                        v-if='layer.favorite'
-                                                    />
-                                                    <span
-                                                        class='ms-2'
-                                                        v-text='layer[h.name]'
-                                                    />
-                                                </div>
-                                            </template>
-                                            <template v-else>
-                                                <span v-text='layer[h.name]' />
-                                            </template>
-                                        </td>
-                                    </template>
-                                </template>
-                            </tr>
-                        </tbody>
-                    </table>
-                </div>
-                <div
-                    class='position-absolute bottom-0 w-100'
-                    style='height: 61px;'
-                >
-                    <TableFooter
-                        :limit='paging.limit'
-                        :total='list.total'
-                        @page='paging.page = $event'
-                    />
-                </div>
-            </template>
-        </div>
-    </div>
-</template>
-
-<script setup>
-import { ref, watch, onMounted } from 'vue'
-import { std, stdurl } from '/src/std.ts';
-import TableHeader from '../../util/TableHeader.vue'
-import TableFooter from '../../util/TableFooter.vue'
-import UploadLogo from '../../util/UploadLogo.vue';
-import {
-    TablerNone,
-    TablerInput,
-    TablerAlert,
-    TablerToggle,
-    TablerLoading,
-    TablerIconButton,
-    TablerRefreshButton,
-    TablerDelete
-} from '@tak-ps/vue-tabler';
-import {
-    IconStar,
-    IconPlus,
-} from '@tabler/icons-vue'
-
-const error = ref();
-const loading = ref(true);
-const header = ref([]);
-const edit = ref();
-const paging = ref({
-    filter: '',
-    sort: 'name',
-    order: 'asc',
-    limit: 100,
-    page: 0
-});
-const list = ref({
-    total: 0,
-    items: []
-});
-
-watch(paging.value, async () => {
-    await fetchList();
-});
-
-onMounted(async () => {
-    await listLayerSchema();
-    await fetchList();
-});
-
-async function listLayerSchema() {
-    const schema = await std('/api/schema?method=GET&url=/task');
-    header.value = ['logo', 'name', 'prefix'].map((h) => {
-        return { name: h, display: true };
-    });
-
-    header.value.push(...schema.query.properties.sort.enum.map((h) => {
-        return {
-            name: h,
-            display: false
-        }
-    }).filter((h) => {
-        for (const hknown of header.value) {
-            if (hknown.name === h.name) return false;
-        }
-        return true;
-    }));
-}
-
-async function saveTask() {
-    loading.value = true;
-
-    if (edit.value.id) {
-        await std(`/api/task/${edit.value.id}`, {
-            method: 'PATCH',
-            body: edit.value
-        });
-    } else {
-        await std('/api/task', {
-            method: 'POST',
-            body: edit.value
-        });
-    }
-
-    edit.value = false
-
-    await fetchList();
-}
-
-async function deleteTask(task) {
-    loading.value = true;
-    const url = stdurl(`/api/task/${task.id}`);
-    await std(url, {
-        method: 'DELETE'
-    });
-
-    edit.value = undefined;
-    await fetchList();
-
-    loading.value = false;
-}
-
-async function fetchList() {
-    loading.value = true;
-    const url = stdurl('/api/task');
-    if (paging.value.filter) url.searchParams.append('filter', paging.value.filter);
-    url.searchParams.append('limit', paging.value.limit);
-    url.searchParams.append('page', paging.value.page);
-    list.value = await std(url);
-    loading.value = false;
-}
-</script>

package/src/components/Admin/Videos/AdminVideoLeases.vue

@@ -1,198 +0,0 @@
-<template>
-    <div>
-        <div class='card-header'>
-            <h1 class='card-title'>
-                Video Lease
-            </h1>
-
-            <div class='ms-auto btn-list'>
-                <TablerRefreshButton
-                    :loading='loading'
-                    @click='fetchList'
-                />
-            </div>
-        </div>
-        <div style='min-height: 20vh; margin-bottom: 61px'>
-            <div class='row g-0 py-2'>
-                <div class='col-md-12 px-2'>
-                    <TablerInput
-                        v-model='paging.filter'
-                        icon='search'
-                        placeholder='Filter...'
-                    />
-                </div>
-            </div>
-
-            <TablerLoading
-                v-if='loading'
-                desc='Loading Video Leases'
-            />
-            <TablerAlert
-                v-else-if='error'
-                :err='error'
-            />
-            <TablerNone
-                v-else-if='!list.items.length'
-                label='No Video Leases'
-                :create='false'
-            />
-            <div
-                v-else
-                class='table-responsive'
-            >
-                <table class='table card-table table-hover table-vcenter datatable'>
-                    <TableHeader
-                        v-model:sort='paging.sort'
-                        v-model:order='paging.order'
-                        v-model:header='header'
-                    />
-                    <tbody>
-                        <tr
-                            v-for='lease in list.items'
-                            :key='lease.id'
-                            class='cursor-pointer'
-                            @click='modal = lease'
-                        >
-                            <template v-for='h in header'>
-                                <template v-if='h.display'>
-                                    <td>
-                                        <template v-if='h.name === "expiration"'>
-                                            <span
-                                                v-if='expired(lease.expiration)'
-                                                class='badge bg-red text-white'
-                                            >Expired</span>
-                                            <span
-                                                v-else-if='lease.expiration === null'
-                                                class='badge bg-blue text-white'
-                                            >Permanent</span>
-                                            <span
-                                                v-else
-                                                class='subheader'
-                                                v-text='lease.expiration'
-                                            />
-                                        </template>
-                                        <template v-else>
-                                            <span v-text='lease[h.name]' />
-                                        </template>
-                                    </td>
-                                </template>
-                            </template>
-                        </tr>
-                    </tbody>
-                </table>
-            </div>
-            <div
-                class='position-absolute bottom-0 w-100'
-                style='height: 61px;'
-            >
-                <TableFooter
-                    :limit='paging.limit'
-                    :total='list.total'
-                    @page='paging.page = $event'
-                />
-            </div>
-        </div>
-    </div>
-
-    <VideoLeaseModal
-        v-if='modal'
-        :lease='modal'
-        :is-system-admin='true'
-        @close='modal = undefined'
-        @refresh='fetchList'
-    />
-</template>
-
-<script setup lang='ts'>
-import { ref, watch, onMounted } from 'vue';
-import { std, stdurl } from '../../../../src/std.ts';
-import type { VideoLease, VideoLeaseList } from '../../../../src/types.ts';
-import TableHeader from '../../util/TableHeader.vue';
-import TableFooter from '../../util/TableFooter.vue';
-import VideoLeaseModal from '../../CloudTAK/Menu/Videos/VideoLeaseModal.vue';
-import {
-    TablerNone,
-    TablerInput,
-    TablerAlert,
-    TablerLoading,
-    TablerRefreshButton
-} from '@tak-ps/vue-tabler';
-
-type Header = { name: keyof VideoLease, display: boolean };
-
-const error = ref<Error | undefined>();
-const loading = ref(true);
-const header = ref<Array<Header>>([]);
-const modal = ref<VideoLease | undefined>()
-const paging = ref({
-    filter: '',
-    sort: 'name',
-    order: 'asc',
-    limit: 100,
-    page: 0
-});
-
-const list = ref<VideoLeaseList>({
-    total: 0,
-    items: []
-});
-
-watch(paging.value, async () => {
-    await fetchList();
-});
-
-onMounted(async () => {
-    await listLayerSchema();
-    await fetchList();
-});
-
-async function listLayerSchema() {
-    const schema = await std('/api/schema?method=GET&url=/video/lease');
-
-    const defaults: Array<keyof VideoLease> = ['id', 'name', 'username', 'channel', 'path', 'expiration'];
-    header.value = defaults.map((h) => {
-        return { name: h, display: true };
-    });
-
-    // @ts-expect-error Worth trying to type at some point maybe but not now
-    header.value.push(...schema.query.properties.sort.enum.map((h) => {
-        return {
-            name: h,
-            display: false
-        } as Header
-    }).filter((h: Header) => {
-        for (const hknown of header.value) {
-            if (hknown.name === h.name) return false;
-        }
-        return true;
-    }));
-}
-
-function expired(expiration: string | null): boolean {
-    if (!expiration) return false;
-    return +new Date(expiration) < +new Date();
-}
-
-async function fetchList() {
-    error.value = undefined;
-    modal.value = undefined;
-    loading.value = true;
-
-    try {
-        const url = stdurl('/api/video/lease');
-        url.searchParams.append('impersonate', String(true));
-        url.searchParams.append('expired', 'all');
-        url.searchParams.append('filter', paging.value.filter);
-        url.searchParams.append('limit', String(paging.value.limit));
-        url.searchParams.append('sort', paging.value.sort);
-        url.searchParams.append('order', paging.value.order);
-        url.searchParams.append('page', String(paging.value.page));
-
-        list.value = await std(url) as VideoLeaseList;
-    } catch (err) {
-        error.value = err instanceof Error ? err : new Error(String(err));
-    }
-
-    loading.value = false;
-}
-</script>

package/src/components/Admin/Videos/AdminVideoService.vue

@@ -1,67 +0,0 @@
-<template>
-    <div class='card-header'>
-        <div class='card-title'>
-            Video Service
-        </div>
-        <div class='ms-auto btn-list'>
-            <TablerRefreshButton
-                title='Refresh'
-                :loading='loading'
-                @click='fetchService'
-            />
-        </div>
-    </div>
-    <div class='card-body'>
-        <TablerLoading v-if='loading' />
-        <TablerAlert
-            v-else-if='error'
-            :err='error'
-        />
-        <TablerNone
-            v-else-if='!service'
-            label='No Video ECS Service'
-            :create='false'
-        />
-        <VideoConfig
-            v-else
-            :service='service'
-        />
-    </div>
-</template>
-
-<script setup lang='ts'>
-import { ref, onMounted } from 'vue';
-import type { VideoService } from '../../../types.ts';
-import { std, stdurl } from '../../../std.ts';
-import VideoConfig from './VideoConfig.vue';
-import {
-    TablerNone,
-    TablerAlert,
-    TablerLoading,
-    TablerRefreshButton,
-} from '@tak-ps/vue-tabler';
-
-const error = ref<Error | undefined>();
-const loading = ref(true);
-
-const service = ref<VideoService | undefined>();
-
-onMounted(async () => {
-    loading.value = true;
-    await fetchService()
-    loading.value = false;
-});
-
-async function fetchService() {
-    loading.value = true;
-
-    try {
-        const url = stdurl('/api/video/service');
-        service.value = await std(url) as VideoService;
-        loading.value = false;
-    } catch (err) {
-        error.value = err instanceof Error ? err : new Error(String(err));
-        loading.value = false;
-    }
-}
-</script>

package/src/components/Admin/Videos/VideoConfig.vue

@@ -1,132 +0,0 @@
-<template>
-    <div class='col-12 py-2 g-2'>
-        <TablerLoading v-if='loading' />
-        <template v-else>
-            <div class='row pb-3 g-3 d-flex align-items-center justify-content-center'>
-                <VideoConfigPort
-                    name='API'
-                    :enabled='config.api'
-                    :port='config.apiAddress'
-                />
-
-                <VideoConfigPort
-                    name='Metrics'
-                    :enabled='config.metrics'
-                    :port='config.metricsAddress'
-                />
-
-                <VideoConfigPort
-                    name='Perf'
-                    :enabled='config.pprof'
-                    :port='config.pprofAddress'
-                />
-
-                <VideoConfigPort
-                    name='Playback'
-                    :enabled='config.playback'
-                    :port='config.playbackAddress'
-                />
-            </div>
-
-            <div class='row g-3 d-flex align-items-center justify-content-center'>
-                <VideoConfigPort
-                    name='RTMP'
-                    :enabled='config.rtmp'
-                    :port='config.rtmpAddress'
-                />
-
-                <VideoConfigPort
-                    name='RTSP'
-                    :enabled='config.rtsp'
-                    :port='config.rtspAddress'
-                />
-
-                <VideoConfigPort
-                    name='HLS'
-                    :enabled='config.hls'
-                    :port='config.hlsAddress'
-                />
-
-                <VideoConfigPort
-                    name='WebRTC'
-                    :enabled='config.webrtc'
-                    :port='config.webrtcAddress'
-                />
-
-                <VideoConfigPort
-                    name='SRT'
-                    :enabled='config.srt'
-                    :port='config.srtAddress'
-                />
-            </div>
-        </template>
-
-        <div class='row g-0 py-3'>
-            <label class='subheader mx-2'>Server Paths</label>
-            <div class='col-12 border rounded mx-2'>
-                <TablerNone
-                    v-if='(service.paths || []).length === 0'
-                    :create='false'
-                    :compact='true'
-                    label='No Server Paths'
-                />
-                <template v-else>
-                    <div
-                        v-for='path in service.paths'
-                        class='hover px-2 py-2 cursor-pointer d-flex align-items-center'
-                        @click='pathid = path.name'
-                    >
-                        <StatusDot
-                            :title='path.ready ? "Streaming" : "Not Streaming"'
-                            :status='path.ready ? "success" : "fail"'
-                        />
-                        <span
-                            class='mx-2'
-                            v-text='path.name'
-                        />
-
-                        <div class='ms-auto'>
-                            <IconUsersGroup
-                                :size='32'
-                                stroke='1'
-                            />
-                            <span
-                                class='mx-2'
-                                v-text='`${path.readers.length} Viewers`'
-                            />
-                        </div>
-                    </div>
-                </template>
-            </div>
-        </div>
-    </div>
-
-    <VideoConfigPath
-        v-if='pathid'
-        :pathid='pathid'
-        @close='pathid = undefined'
-    />
-</template>
-
-<script setup lang='ts'>
-import { ref } from 'vue';
-import type { VideoService } from '../../../types.ts';
-import VideoConfigPath from './VideoConfigPath.vue';
-import VideoConfigPort from './VideoConfigPort.vue';
-import StatusDot from '../../util/StatusDot.vue';
-import {
-    TablerNone,
-    TablerLoading,
-} from '@tak-ps/vue-tabler';
-import {
-    IconUsersGroup
-} from '@tabler/icons-vue'
-
-const props = defineProps<{
-    service: VideoService,
-}>()
-
-const loading = ref(false);
-const pathid = ref<string | undefined>();
-const config = ref(JSON.parse(JSON.stringify(props.service.config)))
-</script>