frontend/components/InspectSidebar.vue
2025-10-26 18:56:20 +01:00

51 lines
2.0 KiB
Vue

<template>
<SidebarTemplate>
<div class="content-l">
<h2>Kubooboo</h2>
<div class="nav">
<NuxtLink class="resources" to="/account/inspect/nodes">Nodes</NuxtLink>
<NuxtLink class="resources" to="/account/inspect/ingresses">Ingresses</NuxtLink>
<NuxtLink class="resources" to="/account/inspect/services">Services</NuxtLink>
<NuxtLink class="resources" to="/account/inspect/deployments">Deployments</NuxtLink>
<NuxtLink class="resources" to="/account/inspect/pods">Pods</NuxtLink>
</div>
<div class="divider" :class="{ hide: !inNamespaceScopedResource }"></div>
<div :class="{ hide: !inNamespaceScopedResource }">
<div class="namespace" :class="{ active: currentNamespace === undefined }" @click="() => namespaceStore.selectNamespace(undefined)">
<p>Alle</p>
</div>
<div class="namespace" v-for="namespace in namespaces" @click="() => namespaceStore.selectNamespace(namespace)" :class="{ active: namespace.metadata?.name === currentNamespace?.metadata?.name }">
<p v-if="namespace.metadata">{{ namespace.metadata.name }}</p>
</div>
</div>
</div>
<div class="left-center" v-if="user" @click="() => accountPopup.open()">
<UiIcon>account_circle</UiIcon>
<p>{{ user.username }}</p>
</div>
</SidebarTemplate>
</template>
<script setup lang="ts">
import SidebarTemplate from './SidebarTemplate.vue';
import { useNamespaceStore } from '#imports';
const namespaceStore = useNamespaceStore();
const namespaces = computed(namespaceStore.getNamespaces);
const currentNamespace = computed(namespaceStore.getCurrentNamespace)
const user = getUser();
const accountPopup = ref();
const inNamespaceScopedResource: ComputedRef<boolean> = computed(() => {
if(useRoute().fullPath.startsWith('/account/inspect/nodes'))
{
return false;
}
return true;
});
</script>