@tak-ps/cloudtak 12.54.0

package/src/components/ServerAdmin.vue

@@ -0,0 +1,408 @@
+<template>
+    <div style='overflow: auto;'>
+        <div class='page-body'>
+            <div class='container-xl'>
+                <div class='row row-deck row-cards'>
+                    <div class='col-lg-12'>
+                        <div class='card'>
+                            <TablerLoading
+                                v-if='isAdmin === undefined'
+                                desc='Loading Profile'
+                            />
+                            <TablerAlert
+                                v-else-if='!isAdmin'
+                                :err='new Error("Insufficient Access")'
+                            />
+                            <div
+                                v-else
+                                style='height: 100%;'
+                                class='row g-0'
+                            >
+                                <div
+                                    class='border-end'
+                                    :style='nest ? "width: 64px;" : ""'
+                                    :class='{
+                                        "col-12 col-md-3": !nest
+                                    }'
+                                >
+                                    <div class='card-body'>
+                                        <h4
+                                            v-if='!nest'
+                                            class='subheader user-select-none'
+                                        >
+                                            CloudTAK Admin
+                                        </h4>
+                                        <div
+                                            role='menu'
+                                            class='list-group list-group-transparent'
+                                        >
+                                            <span
+                                                tabindex='0'
+                                                role='menuitem'
+                                                class='list-group-item list-group-item-action d-flex align-items-center user-select-none'
+                                                :class='{
+                                                    "active": String(route.name).startsWith("admin-server"),
+                                                    "cursor-pointer": !String(route.name).startsWith("admin-server")
+                                                }'
+                                                @keyup.enter='router.push(`/admin/server`)'
+                                                @click='router.push(`/admin/server`)'
+                                            >
+                                                <IconServer
+                                                    v-tooltip='nest ? "TAK Server Connection" : false'
+                                                    :size='32'
+                                                    stroke='1'
+                                                />
+                                                <span
+                                                    v-if='!nest'
+                                                    class='mx-3'
+                                                >TAK Server Connection</span>
+                                            </span>
+                                            <span
+                                                tabindex='0'
+                                                role='menuitem'
+                                                class='list-group-item list-group-item-action d-flex align-items-center user-select-none'
+                                                :class='{
+                                                    "active": String(route.name) === "admin-config",
+                                                    "cursor-pointer": String(route.name) !== "admin-config"
+                                                }'
+                                                @keyup.enter='router.push(`/admin/config`)'
+                                                @click='router.push(`/admin/config`)'
+                                            >
+                                                <IconSettings
+                                                    v-tooltip='nest ? "CloudTAK Settings" : false'
+                                                    :size='32'
+                                                    stroke='1'
+                                                />
+                                                <span
+                                                    v-if='!nest'
+                                                    class='mx-3'
+                                                >CloudTAK Settings</span>
+                                            </span>
+                                        </div>
+                                        <h4
+                                            v-if='!nest'
+                                            class='subheader user-select-none py-2 my-0'
+                                        >
+                                            Map Settings
+                                        </h4>
+                                        <div class='list-group list-group-transparent'>
+                                            <span
+                                                tabindex='0'
+                                                role='menuitem'
+                                                class='list-group-item list-group-item-action d-flex align-items-center user-select-none'
+                                                :class='{
+                                                    "active": String(route.name).startsWith("admin-user"),
+                                                    "cursor-pointer": !String(route.name).startsWith("admin-user")
+                                                }'
+                                                @keyup.enter='router.push(`/admin/user`)'
+                                                @click='router.push(`/admin/user`)'
+                                            >
+                                                <IconUsers
+                                                    v-tooltip='nest ? "Users" : false'
+                                                    :size='32'
+                                                    stroke='1'
+                                                />
+                                                <span
+                                                    v-if='!nest'
+                                                    class='mx-3'
+                                                >Users</span>
+                                            </span>
+                                            <span
+                                                tabindex='0'
+                                                role='menuitem'
+                                                class='list-group-item list-group-item-action d-flex align-items-center user-select-none'
+                                                :class='{
+                                                    "active": String(route.name).startsWith("admin-import"),
+                                                    "cursor-pointer": !String(route.name).startsWith("admin-import")
+                                                }'
+                                                @keyup.enter='router.push(`/admin/import`)'
+                                                @click='router.push(`/admin/import`)'
+                                            >
+                                                <IconFileImport
+                                                    v-tooltip='nest ? "User Imports" : false'
+                                                    :size='32'
+                                                    stroke='1'
+                                                />
+                                                <span
+                                                    v-if='!nest'
+                                                    class='mx-3'
+                                                >User Imports</span>
+                                            </span>
+                                            <span
+                                                tabindex='0'
+                                                role='menuitem'
+                                                class='list-group-item list-group-item-action d-flex align-items-center user-select-none'
+                                                :class='{
+                                                    "active": String(route.name).includes("admin-overlays"),
+                                                    "cursor-pointer": !String(route.name).includes("admin-overlays")
+                                                }'
+                                                @keyup.enter='router.push(`/admin/overlay`)'
+                                                @click='router.push(`/admin/overlay`)'
+                                            >
+                                                <IconMap
+                                                    v-tooltip='nest ? "Basemaps & Overlays" : false'
+                                                    :size='32'
+                                                    stroke='1'
+                                                />
+                                                <span
+                                                    v-if='!nest'
+                                                    class='mx-3'
+                                                >Basemaps &amp; Overlays</span>
+                                            </span>
+                                            <span
+                                                tabindex='0'
+                                                role='menuitem'
+                                                class='list-group-item list-group-item-action d-flex align-items-center user-select-none'
+                                                :class='{
+                                                    "active": String(route.name).startsWith("admin-palette"),
+                                                    "cursor-pointer": !String(route.name).startsWith("admin-palette")
+                                                }'
+                                                @keyup.enter='router.push(`/admin/palette`)'
+                                                @click='router.push(`/admin/palette`)'
+                                            >
+                                                <IconBrush
+                                                    v-tooltip='nest ? "Draw Palette" : false'
+                                                    :size='32'
+                                                    stroke='1'
+                                                />
+                                                <span
+                                                    v-if='!nest'
+                                                    class='mx-3'
+                                                >Draw Palette</span>
+                                            </span>
+                                            <span
+                                                tabindex='0'
+                                                role='menuitem'
+                                                class='list-group-item list-group-item-action d-flex align-items-center user-select-none'
+                                                :class='{
+                                                    "active": String(route.name).startsWith("admin-mission-mission-template"),
+                                                    "cursor-pointer": !String(route.name).startsWith("admin-mission-template")
+                                                }'
+                                                @keyup.enter='router.push(`/admin/templates`)'
+                                                @click='router.push(`/admin/templates`)'
+                                            >
+                                                <IconClipboardList
+                                                    v-tooltip='nest ? "Mission Templates" : false'
+                                                    :size='32'
+                                                    stroke='1'
+                                                />
+                                                <span
+                                                    v-if='!nest'
+                                                    class='mx-3'
+                                                >Mission Templates</span>
+                                            </span>
+                                        </div>
+                                        <h4
+                                            v-if='!nest'
+                                            class='subheader user-select-none py-2 my-0'
+                                        >
+                                            ETL Settings
+                                        </h4>
+                                        <div class='list-group list-group-transparent'>
+                                            <span
+                                                tabindex='0'
+                                                role='menuitem'
+                                                class='list-group-item list-group-item-action d-flex align-items-center user-select-none'
+                                                :class='{
+                                                    "active": String(route.name) === "admin-connection",
+                                                    "cursor-pointer": String(route.name) !== "admin-connection"
+                                                }'
+                                                @keyup.enter='router.push(`/admin/connection`)'
+                                                @click='router.push(`/admin/connection`)'
+                                            >
+                                                <IconNetwork
+                                                    v-tooltip='nest ? "Connections" : false'
+                                                    :size='32'
+                                                    stroke='1'
+                                                />
+                                                <span
+                                                    v-if='!nest'
+                                                    class='mx-3'
+                                                >Connections</span>
+                                            </span>
+                                            <span
+                                                tabindex='0'
+                                                role='menuitem'
+                                                class='list-group-item list-group-item-action d-flex align-items-center user-select-none'
+                                                :class='{
+                                                    "active": String(route.name) === "admin-layers",
+                                                    "cursor-pointer": String(route.name) !== "admin-layers"
+                                                }'
+                                                @keyup.enter='router.push(`/admin/layer`)'
+                                                @click='router.push(`/admin/layer`)'
+                                            >
+                                                <IconBuildingBroadcastTower
+                                                    v-tooltip='nest ? "Layers" : false'
+                                                    :size='32'
+                                                    stroke='1'
+                                                />
+                                                <span
+                                                    v-if='!nest'
+                                                    class='mx-3'
+                                                >Layers</span>
+                                            </span>
+                                            <span
+                                                tabindex='0'
+                                                role='menuitem'
+                                                class='list-group-item list-group-item-action d-flex align-items-center user-select-none'
+                                                :class='{
+                                                    "active": String(route.name).startsWith("admin-tasks"),
+                                                    "cursor-pointer": !String(route.name).startsWith("admin-tasks")
+                                                }'
+                                                @keyup.enter='router.push(`/admin/tasks`)'
+                                                @click='router.push(`/admin/tasks`)'
+                                            >
+                                                <IconBrandDocker
+                                                    v-tooltip='nest ? "ETL Task Runners" : false'
+                                                    :size='32'
+                                                    stroke='1'
+                                                />
+                                                <span
+                                                    v-if='!nest'
+                                                    class='mx-3'
+                                                >ETL Task Runners</span>
+                                            </span>
+                                            <span
+                                                tabindex='0'
+                                                role='menuitem'
+                                                class='list-group-item list-group-item-action d-flex align-items-center user-select-none'
+                                                :class='{
+                                                    "active": String(route.name) === "admin-data",
+                                                    "cursor-pointer": String(route.name) !== "admin-data"
+                                                }'
+                                                @keyup.enter='router.push(`/admin/data`)'
+                                                @click='router.push(`/admin/data`)'
+                                            >
+                                                <IconDatabase
+                                                    v-tooltip='nest ? "Data Syncs" : false'
+                                                    :size='32'
+                                                    stroke='1'
+                                                />
+                                                <span
+                                                    v-if='!nest'
+                                                    class='mx-3'
+                                                >Data Syncs</span>
+                                            </span>
+                                        </div>
+                                        <h4
+                                            v-if='!nest'
+                                            class='subheader user-select-none py-2 my-0'
+                                        >
+                                            External Services
+                                        </h4>
+                                        <div class='list-group list-group-transparent'>
+                                            <span
+                                                tabindex='0'
+                                                role='menuitem'
+                                                class='list-group-item list-group-item-action d-flex align-items-center user-select-none'
+                                                :class='{
+                                                    "active": String(route.name).includes("admin-video"),
+                                                    "cursor-pointer": !String(route.name).includes("admin-video")
+                                                }'
+                                                @keyup.enter='router.push(`/admin/video`)'
+                                                @click='router.push(`/admin/video`)'
+                                            >
+                                                <IconVideo
+                                                    v-tooltip='nest ? "Video Services" : false'
+                                                    :size='32'
+                                                    stroke='1'
+                                                />
+                                                <span
+                                                    v-if='!nest'
+                                                    class='mx-3'
+                                                >Video Services</span>
+                                            </span>
+                                            <span
+                                                tabindex='0'
+                                                role='menuitem'
+                                                class='list-group-item list-group-item-action d-flex align-items-center user-select-none'
+                                                :class='{
+                                                    "active": String(route.name).includes("admin-export"),
+                                                    "cursor-pointer": !String(route.name).includes("admin-export")
+                                                }'
+                                                @keyup.enter='router.push(`/admin/export`)'
+                                                @click='router.push(`/admin/export`)'
+                                            >
+                                                <IconDatabaseExport
+                                                    v-tooltip='nest ? "Export" : false'
+                                                    :size='32'
+                                                    stroke='1'
+                                                />
+                                                <span
+                                                    v-if='!nest'
+                                                    class='mx-3'
+                                                >Export</span>
+                                            </span>
+                                        </div>
+                                    </div>
+                                </div>
+                                <div
+                                    class='col-12 position-relative'
+                                    style='height: 100%;'
+                                    :style='nest ? "width: calc(100% - 64px);" : ""'
+                                    :class='{
+                                        "col-md-9": !nest,
+                                    }'
+                                >
+                                    <Suspense>
+                                        <router-view />
+
+                                        <template #fallback>
+                                            <TablerLoading />
+                                        </template>
+                                    </Suspense>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <PageFooter />
+    </div>
+</template>
+
+<script setup lang='ts'>
+import { onMounted, ref, computed } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import type { Profile } from '../types.ts';
+import { std } from '../std.ts';
+import PageFooter from './PageFooter.vue';
+import {
+    TablerAlert,
+    TablerLoading,
+} from '@tak-ps/vue-tabler'
+import {
+    IconBrush,
+    IconNetwork,
+    IconVideo,
+    IconUsers,
+    IconFileImport,
+    IconSettings,
+    IconServer,
+    IconDatabase,
+    IconDatabaseExport,
+    IconBrandDocker,
+    IconBuildingBroadcastTower,
+    IconMap,
+    IconClipboardList,
+} from '@tabler/icons-vue'
+
+const route = useRoute();
+const router = useRouter();
+const isAdmin = ref<boolean | undefined>(undefined)
+
+const nest = computed(() => {
+    if (String(route.name).startsWith('admin-server')) {
+        return true;
+    } else {
+        return false;
+    }
+});
+
+onMounted(async () => {
+    const profile = await std('/api/profile') as Profile;
+    isAdmin.value = profile.system_admin;
+});
+</script>

package/src/components/VideoWall/Main.vue

@@ -0,0 +1,79 @@
+<template>
+    <div class='h-full w-full bg-dark text-white'>
+        <div
+            v-if='loading'
+        >
+            <TablerLoading />
+        </div>
+        <div
+            v-else-if='error'
+        >
+            <TablerAlert
+                :err='error'
+            />
+        </div>
+        <div
+            v-else-if='list.total === 0'
+        >
+            <TablerNone
+                label='No Video Sources Configured'
+                :create='false'
+            />
+        </div>
+        <template v-else>
+            <span v-text='list' />
+        </template>
+    </div>
+</template>
+
+<script setup lang='ts'>
+import { ref, onMounted } from 'vue';
+import { server } from '../../std.ts';
+import type { ProfileVideoList } from '../../types.ts';
+import {
+    TablerNone,
+    TablerLoading,
+    TablerAlert,
+} from '@tak-ps/vue-tabler';
+
+const loading = ref(true);
+const error = ref<Error | undefined>();
+
+const list = ref<ProfileVideoList>({
+    total: 0,
+    items: []
+});
+
+const paging = ref<{
+    page: number;
+    limit: number;
+    order: 'asc' | 'desc';
+}>({
+    page: 0,
+    limit: 20,
+    order: 'desc'
+});
+
+onMounted(async () => {
+    await listVideos();
+});
+
+async function listVideos() {
+    try {
+        const res = await server.GET('/api/profile/video', {
+            params: {
+                query: paging.value
+            }
+        })
+
+        loading.value = false;
+        if (res.error) throw new Error(res.error.message);
+
+        list.value = res.data;
+    } catch (err) {
+        error.value = err instanceof Error ? err : new Error(String(err));
+    }
+}
+
+
+</script>

package/src/components/VideoWall.vue

@@ -0,0 +1,17 @@
+<template>
+    <VideoWall
+        v-if='user'
+        :user='user'
+    />
+</template>
+
+<script setup lang='ts'>
+import VideoWall from './VideoWall/Main.vue';
+
+defineProps({
+    user: {
+        type: Object,
+        required: true
+    }
+});
+</script>

package/src/components/util/DataSelect.vue

@@ -0,0 +1,148 @@
+<template>
+    <div class='w-100'>
+        <TablerLoading
+            v-if='loading'
+            :inline='true'
+        />
+        <template v-else>
+            <div class='d-flex align-items-center mx-2'>
+                <template v-if='selected.id'>
+                    <span
+                        class='cursor-pointer'
+                        @click='$router.push(`/connection/${selected.connection}/data/${selected.id}`)'
+                        v-text='selected.name'
+                    />
+                </template>
+                <template v-else>
+                    <span>No Data Sync Selected - Data will output as CoTs directly to the Connection</span>
+                </template>
+
+                <div
+                    v-if='!disabled'
+                    class='btn-list ms-auto'
+                >
+                    <IconTrash
+                        v-if='selected.id'
+                        :size='32'
+                        stroke='1'
+                        class='cursor-pointer'
+                        @click='update'
+                    />
+                    <TablerDropdown>
+                        <template #default>
+                            <IconSettings
+                                :size='32'
+                                stroke='1'
+                                class='cursor-pointer dropdown-toggle'
+                            />
+                        </template>
+                        <template #dropdown>
+                            <div class='table-resposive'>
+                                <table class='table table-hover'>
+                                    <thead>
+                                        <tr>
+                                            <th>(Status) Name</th>
+                                        </tr>
+                                    </thead>
+                                    <tbody class='table-tbody'>
+                                        <tr
+                                            v-for='d of data.items'
+                                            :key='d.id'
+                                            class='cursor-pointer'
+                                            @click='update(d)'
+                                        >
+                                            <td>
+                                                <div class='d-flex align-items-center'>
+                                                    <span
+                                                        class='mt-2'
+                                                        v-text='d.name'
+                                                    />
+                                                </div>
+                                            </td>
+                                        </tr>
+                                    </tbody>
+                                </table>
+                            </div>
+                        </template>
+                    </TablerDropdown>
+                </div>
+            </div>
+        </template>
+    </div>
+</template>
+
+<script setup>
+import { ref, watch, onMounted } from 'vue';
+import { std } from '/src/std.ts';
+import {
+    IconTrash,
+    IconSettings
+} from '@tabler/icons-vue';
+import {
+    TablerLoading,
+    TablerDropdown
+} from '@tak-ps/vue-tabler';
+
+const props = defineProps({
+    connection: {
+        type: Number,
+        default: undefined
+    },
+    modelValue: {
+        type: Number,
+        default: undefined
+    },
+    disabled: {
+        type: Boolean,
+        default: false
+    }
+});
+
+const emit = defineEmits(['update:modelValue']);
+
+const loading = ref(true);
+const selected = ref({
+    id: '',
+    name: ''
+});
+const data = ref({
+    total: 0,
+    items: []
+});
+
+watch(() => selected.value.id, () => {
+    if (selected.value.id) {
+        emit('update:modelValue', selected.value.id);
+    } else {
+        emit('update:modelValue', null);
+    }
+});
+
+watch(() => props.modelValue, () => {
+    if (props.modelValue) fetch();
+});
+
+onMounted(async () => {
+    if (props.modelValue) await fetch();
+    await listData();
+    loading.value = false;
+});
+
+function update(d) {
+    if (d) {
+        selected.value.id = d.id;
+        selected.value.name = d.name;
+    } else {
+        selected.value.id = '';
+        selected.value.name = '';
+    }
+}
+
+async function fetch() {
+    selected.value = await std(`/api/connection/${props.connection}/data/${props.modelValue}`);
+}
+
+async function listData() {
+    data.value = await std(`/api/connection/${props.connection}/data`);
+}
+</script>