@tak-ps/cloudtak 12.54.0 → 12.94.0

package/src/components/CloudTAK/Menu/Mission/MissionLayerTree.vue

@@ -1,194 +0,0 @@
-<template>
-    <TablerLoading v-if='loading' />
-    <template v-else>
-        <template
-            v-for='layer in layers'
-            :key='layer.uid'
-        >
-            <div class='col-12 hover d-flex align-items-center px-3 py-2'>
-                <IconChevronRight
-                    v-if='layer.type === "GROUP" && !opened.has(layer.uid)'
-                    :size='20'
-                    stroke='1'
-                    class='cursor-pointer'
-                    @click='opened.add(layer.uid)'
-                />
-                <IconChevronDown
-                    v-else-if='layer.type === "GROUP" && opened.has(layer.uid)'
-                    :size='20'
-                    stroke='1'
-                    class='cursor-pointer'
-                    @click='opened.delete(layer.uid)'
-                />
-
-                <IconFiles
-                    v-if='layer.type === "CONTENTS"'
-                    :size='20'
-                    stroke='1'
-                />
-                <IconMapPins
-                    v-else-if='layer.type === "UID"'
-                    :size='20'
-                    stroke='1'
-                />
-                <IconFolder
-                    v-else-if='layer.type === "GROUP"'
-                    :size='20'
-                    stroke='1'
-                />
-                <IconMap
-                    v-else-if='layer.type === "MAPLAYER"'
-                    :size='20'
-                    stroke='1'
-                />
-                <IconPin
-                    v-else-if='layer.type === "ITEM"'
-                    :size='20'
-                    stroke='1'
-                />
-
-                <span
-                    class='mx-2'
-                    v-text='layer.name'
-                />
-
-                <div class='ms-auto btn-list d-flex align-items-center'>
-                    <span
-                        v-if='layer.type === "UID"'
-                        class='mx-3 ms-auto badge border text-white'
-                        :class='{
-                            "bg-blue": layer.uids && layer.uids.length > 0,
-                            "bg-gray": !layer.uids || layer.uids.length === 0
-                        }'
-                        v-text='`${layer.uids ? layer.uids.length : 0} Features`'
-                    />
-
-                    <TablerIconButton
-                        v-if='props.subscription.role.permissions.includes("MISSION_WRITE")'
-                        title='Edit Name'
-                        :size='24'
-                        @click='edit.add(layer.uid)'
-                    >
-                        <IconPencil stroke='1' />
-                    </TablerIconButton>
-
-                    <TablerDelete
-                        v-if='props.subscription.role.permissions.includes("MISSION_WRITE")'
-                        displaytype='icon'
-                        :size='24'
-                        @delete='deleteLayer(layer)'
-                    />
-                </div>
-            </div>
-
-            <MissionLayerEdit
-                v-if='edit.has(layer.uid)'
-                :subscription='props.subscription'
-                :layer='layer'
-                @cancel='edit.delete(layer.uid)'
-                @layer='emit("refresh")'
-            />
-
-            <div
-                v-else-if='opened.has(layer.uid) && layer.type === "UID"'
-                class='mx-2'
-            >
-                <FeatureRow
-                    v-for='cot of cots(layer)'
-                    :key='cot.id'
-                    :delete-button='false'
-                    :feature='cot'
-                />
-                <MissionLayerTree
-                    v-if='layer.mission_layers && layer.mission_layers.length'
-                    :layers='layer.mission_layers as Array<MissionLayer>'
-                    :feats='feats'
-                    :subscription='subscription'
-                    @refresh='emit("refresh")'
-                />
-                <TablerNone
-                    v-if='!layer.uids || !layer.uids.length'
-                    :create='false'
-                    :compact='true'
-                    class='py-2'
-                />
-            </div>
-        </template>
-
-        <FeatureRow
-            v-for='feat of orphanedFeats'
-            :key='feat.id'
-            :delete-button='false'
-            :feature='feat'
-        />
-    </template>
-</template>
-
-<script setup lang='ts'>
-import { ref, computed } from 'vue';
-import type { MissionLayer, Feature } from '../../../../types.ts';
-import Subscription from '../../../../base/subscription.ts';
-import MissionLayerTree from './MissionLayerTree.vue';
-import {
-    IconChevronRight,
-    IconChevronDown,
-    IconFiles,
-    IconMapPins,
-    IconFolder,
-    IconPencil,
-    IconMap,
-    IconPin,
-} from '@tabler/icons-vue';
-import {
-    TablerNone,
-    TablerDelete,
-    TablerLoading,
-    TablerIconButton,
-} from '@tak-ps/vue-tabler';
-import FeatureRow from '../../util/FeatureRow.vue';
-import MissionLayerEdit from './MissionLayerEdit.vue';
-
-const emit = defineEmits([
-    'refresh'
-])
-
-const props = defineProps<{
-    layers: Array<MissionLayer>,
-    feats: Map<string, Feature>,
-    subscription: Subscription,
-    orphaned?: Set<string>,
-}>();
-
-const opened = ref<Set<string>>(new Set());
-const edit = ref<Set<string>>(new Set());
-const loading = ref(false);
-
-const orphanedFeats = computed<Feature[]>(() => {
-    const feats = [];
-    for (const uid of props.orphaned || []) {
-        const feat = props.feats.get(uid);
-        if (feat) feats.push(feat);
-    }
-
-    return feats;
-})
-
-function cots(layer: MissionLayer): Array<Feature> {
-    const cots = [];
-    for (const cot of (layer.uids || [])) {
-        const feat = props.feats.get(cot.data)
-        if (feat) cots.push(feat);
-    }
-    return cots;
-}
-
-async function deleteLayer(layer: MissionLayer) {
-    loading.value = true;
-
-    await props.subscription.layerDelete(layer.uid);
-
-    emit('refresh')
-
-    loading.value = false;
-}
-</script>

package/src/components/CloudTAK/Menu/Mission/MissionLayers.vue

@@ -1,157 +0,0 @@
-<template>
-    <MenuTemplate
-        v-if='props.menu !== false'
-        name='Mission Layers'
-        :zindex='0'
-        :back='false'
-        :border='false'
-    >
-        <template #buttons>
-            <TablerIconButton
-                v-if='!createLayer && !loading && subscription.role && subscription.role.permissions.includes("MISSION_WRITE")'
-                title='New Mission Layer'
-                :size='24'
-                @click='createLayer = true'
-            >
-                <IconFolderPlus
-                    :size='32'
-                    stroke='1'
-                />
-            </TablerIconButton>
-            <TablerRefreshButton
-                :loading='loading'
-                @click='refresh'
-            />
-        </template>
-
-        <div
-            v-if='createLayer'
-            class='col-12 px-2 pb-4'
-        >
-            <MissionLayerCreate
-                :subscription='props.subscription'
-                @layer='refresh'
-                @cancel='createLayer = false'
-            />
-        </div>
-
-        <div class='col-12'>
-            <TablerLoading
-                v-if='loading'
-                class='mx-2'
-                desc='Loading Layers...'
-            />
-            <TablerNone
-                v-else-if='!layers.length && !orphaned.size'
-                :create='false'
-                :compact='true'
-                label='Layers'
-            />
-            <template v-else>
-                <MissionLayerTree
-                    :orphaned='orphaned'
-                    :layers='layers'
-                    :feats='feats'
-                    :subscription='props.subscription'
-                    @refresh='refresh'
-                />
-            </template>
-        </div>
-    </MenuTemplate>
-    <template v-else>
-        <TablerLoading
-            v-if='loading'
-            class='mx-2'
-            desc='Loading Layers...'
-        />
-        <TablerNone
-            v-else-if='!layers.length && !orphaned.size'
-            :create='false'
-            :compact='true'
-            label='Layers'
-        />
-        <MissionLayerTree
-            v-else
-            :orphaned='orphaned'
-            :layers='layers'
-            :feats='feats'
-            :subscription='subscription'
-            @refresh='refresh'
-        />
-    </template>
-</template>
-
-<script setup lang='ts'>
-import { ref, onMounted } from 'vue';
-import {
-    IconFolderPlus,
-} from '@tabler/icons-vue';
-import {
-    TablerNone,
-    TablerLoading,
-    TablerIconButton,
-    TablerRefreshButton,
-} from '@tak-ps/vue-tabler';
-import type {
-    MissionLayer
-} from '../../../../types.ts';
-import Subscription from '../../../../base/subscription.ts';
-import MenuTemplate from '../../util/MenuTemplate.vue';
-import MissionLayerTree from './MissionLayerTree.vue';
-import MissionLayerCreate from './MissionLayerCreate.vue';
-
-const props = defineProps<{
-    menu: boolean,
-    subscription: Subscription
-}>()
-
-const createLayer = ref(false)
-const loading = ref(true);
-const feats = ref(new Map());
-const orphaned = ref<Set<string>>(new Set());
-const layers = ref<Array<MissionLayer>>([]);
-
-onMounted(async () => {
-    await refresh();
-});
-
-async function refresh() {
-    createLayer.value = false;
-    loading.value = true;
-    await fetchFeats();
-    await fetchLayers();
-    loading.value = false;
-}
-
-async function fetchFeats() {
-    const features = await props.subscription.feature.list();
-
-    for (const feat of features) {
-        feats.value.set(feat.id, feat);
-        orphaned.value.add(String(feat.id));
-    }
-}
-
-function removeFeatures(mlayers: MissionLayer[]): void {
-    for (const layer of mlayers) {
-        if (layer.type === 'UID' && layer.uids && layer.uids.length) {
-            for (const cot of layer.uids) {
-                orphaned.value.delete(cot.data);
-            }
-        }
-
-        if (layer.mission_layers) {
-            // @ts-expect-error Due to recursive type limits this is unknown
-            removeFeatures(layer.mission_layers);
-        }
-    }
-}
-
-async function fetchLayers(): Promise<void> {
-    layers.value = (await props.subscription.layerList()).data;
-
-    if (layers.value) {
-        removeFeatures(layers.value);
-    }
-}
-</script>

package/src/components/CloudTAK/Menu/Mission/MissionLog.vue

@@ -1,170 +0,0 @@
-<template>
-    <div class='col-12'>
-        <TablerLoading
-            v-if='loading'
-            desc='Updating Log'
-        />
-        <template v-else>
-            <div
-                class='card bg-dark bg-opacity-50 border border-white border-opacity-25 rounded text-white w-100 p-2 d-flex gap-3 align-items-start flex-row shadow-sm'
-                role='menuitem'
-                tabindex='0'
-            >
-                <div class='d-flex flex-column w-100'>
-                    <div class='d-flex align-items-center flex-wrap w-100 gap-2'>
-                        <div class='fw-semibold'>
-                            {{ log.creatorUid || 'Unknown Author' }}
-                        </div>
-                        <TablerDropdown
-                            v-if='canWrite'
-                            class='ms-auto'
-                        >
-                            <template #default>
-                                <span class='text-white-50 small text-nowrap cursor-pointer'>{{ formatDtg(log.dtg) }}</span>
-                            </template>
-                            <template #dropdown>
-                                <div
-                                    class='p-2'
-                                    style='min-width: 300px;'
-                                >
-                                    <TablerInput
-                                        label='Log Time'
-                                        type='datetime-local'
-                                        :model-value='dtgEdit ?? toDatetimeLocal(log.dtg)'
-                                        @update:model-value='dtgEdit = $event'
-                                    />
-                                    <div class='d-flex justify-content-end gap-2 mt-2'>
-                                        <button
-                                            class='btn btn-sm btn-secondary'
-                                            @click='cancelEdit'
-                                        >
-                                            Cancel
-                                        </button>
-                                        <button
-                                            class='btn btn-sm btn-primary'
-                                            @click='saveDtg'
-                                        >
-                                            Save
-                                        </button>
-                                    </div>
-                                </div>
-                            </template>
-                        </TablerDropdown>
-                        <span
-                            v-else
-                            class='text-white-50 small text-nowrap'
-                        >{{ formatDtg(log.dtg) }}</span>
-                    </div>
-                    <CopyField
-                        class='w-100'
-                        mode='text'
-                        :edit='canWrite'
-                        :deletable='canWrite'
-                        :hover='canWrite'
-                        :rows='Math.max(4, log.content.split("\n").length)'
-                        :model-value='log.content || ""'
-                        @submit='updateLog({ content: $event })'
-                        @delete='deleteLog()'
-                    />
-
-                    <Keywords :keywords='log.keywords' />
-                </div>
-            </div>
-        </template>
-    </div>
-</template>
-
-<script setup lang="ts">
-import { ref, computed } from 'vue';
-import type { MissionLog } from '../../../../types.ts';
-import Subscription from '../../../../base/subscription.ts';
-import CopyField from '../../util/CopyField.vue';
-import Keywords from '../../util/Keywords.vue';
-import {
-    TablerLoading,
-    TablerDropdown,
-    TablerInput
-} from '@tak-ps/vue-tabler';
-
-const props = defineProps<{
-    log: MissionLog;
-    subscription: Subscription;
-}>();
-
-const loading = ref(false);
-const dtgEdit = ref<string | null>(null);
-
-const canWrite = computed(() => {
-    return props.subscription.role.permissions.includes("MISSION_WRITE");
-});
-
-function toDatetimeLocal(iso?: string) {
-    if (!iso) return '';
-    const d = new Date(iso);
-    if (isNaN(d.getTime())) return '';
-    const offset = d.getTimezoneOffset() * 60000;
-    return (new Date(d.getTime() - offset)).toISOString().slice(0, 16);
-}
-
-function fromDatetimeLocal(local: string) {
-    if (!local) return '';
-    const d = new Date(local);
-    return d.toISOString();
-}
-
-function formatDtg(dtg?: string) {
-    if (!dtg) return 'No DTG';
-
-    const parsed = new Date(dtg);
-
-    if (Number.isNaN(parsed.getTime())) {
-        return dtg;
-    }
-
-    return parsed.toLocaleString(undefined, {
-        dateStyle: 'medium',
-        timeStyle: 'short'
-    });
-}
-
-function cancelEdit() {
-    dtgEdit.value = null;
-    document.body.click();
-}
-
-async function saveDtg() {
-    if (dtgEdit.value) {
-        const iso = fromDatetimeLocal(dtgEdit.value);
-        if (iso !== props.log.dtg) {
-            await updateLog({ dtg: iso });
-        }
-    }
-
-    cancelEdit();
-}
-
-async function updateLog(body: { content?: string; dtg?: string; keywords?: string[] }) {
-    loading.value = true;
-    try {
-        await props.subscription.log.update(
-            props.log.id,
-            {
-                content: body.content ?? props.log.content,
-                dtg: body.dtg ?? props.log.dtg,
-                keywords: body.keywords ?? props.log.keywords
-            }
-        );
-    } finally {
-        loading.value = false;
-    }
-}
-
-async function deleteLog() {
-    loading.value = true;
-    try {
-        await props.subscription.log.delete(props.log.id);
-    } finally {
-        loading.value = false;
-    }
-}
-</script>