0.1.6

sebt3 · Feb 22, 2024 · 20068cb · 20068cb
1 parent 445aacd
commit 20068cb
Show file tree

Hide file tree

Showing 31 changed files with 1,204 additions and 1,076 deletions.
diff --git a/.gitignore b/.gitignore
@@ -30,7 +30,6 @@
 !/front/libs/*/custom.ts
 !/front/libs/core/*
 /front/pages/**/*.vue
-!/front/pages/automation/fluxcd/automationDashboard.vue
 !/front/pages/install/vynil/DistribView.vue
 !/front/pages/install/vynil/InstallView.vue
 !/front/pages/install/vynil/InstallEdit.vue

diff --git a/back/resolvers/core/Event.ts b/back/resolvers/core/Event.ts
@@ -23,7 +23,7 @@ export const lists = {
     if (lst==undefined) {
       try {
         const res = await k8sApi.listEventForAllNamespaces()
-        lst = ((res as object)['body']['items'] as Array<object>)
+        lst = ((res as object)['body']['items'] as Array<object>).sort((a,b) => new Date(a['metadata']['creationTimestamp'])<new Date(b['metadata']['creationTimestamp'])?1:-1)
         cache.set('coreEvent', lst, 2);
       } catch (err) {
         if (typeof err === 'object' && (err as object)['body'] !=undefined) {
@@ -34,7 +34,7 @@ export const lists = {
               const nss = await listNamespace.k8sNamespace(parent, args)
               const lst = (await Promise.all(nss.map(n=>n['metadata']['name']).map(async (ns)=>{
                 return (await k8sApi.listNamespacedEvent(ns)).body.items
-              }))).flat().filter((v)=>v!=null)
+              }))).flat().filter((v)=>v!=null).sort((a,b) => new Date((a['metadata'] as object)['creationTimestamp'])<new Date((b['metadata'] as object)['creationTimestamp'])?1:-1)
               cache.set('coreEvent', lst, 2);
               return lst.filter(o=>typeof parent != 'object' || parent==null || (
                           o['involvedObject']!=undefined && o['involvedObject']['name'] == parent['metadata']['name'] && o['involvedObject']['namespace'] == parent['metadata']['namespace']

diff --git a/front/App.vue b/front/App.vue
@@ -1,14 +1,21 @@
 <script setup>
 import MainMenu from './components/navigation/MainMenu.vue';
 import BreadCrumbs from './components/navigation/BreadCrumbs.vue';
+import { useNavigationStore } from './stores';
+const { getTransition } = useNavigationStore();
 </script>
 <template>
   <q-layout view="hHh lpR fFf">
     <MainMenu />
     <q-page-container>
       <BreadCrumbs />
       <router-view v-slot="{ Component, route }">
+        <Transition     name="custom-classes"
+            :enter-active-class="getTransition(route,'enter')"
+            :leave-active-class="getTransition(route,'leave')"
+        >
           <component :is="Component" :key="`${route.name}-${route.params.name}`" />
+        </Transition>
       </router-view>
     </q-page-container>
   </q-layout>

diff --git a/front/components/core/EventList.vue b/front/components/core/EventList.vue
@@ -1,41 +1,31 @@
 <script setup lang="ts">
+import { watch,ref } from 'vue';
+
 defineEmits(['refresh','on-delete']);
-const props=withDefaults(defineProps<{model: object[], useAction?:boolean, useRefresh?: boolean, showNamespace?:boolean}>(),{
+const props=withDefaults(defineProps<{model: object[], useAction?:boolean, useRefresh?: boolean, showNamespace?:boolean, showKind?:boolean}>(),{
   useAction: false,
   useRefresh: true,
   showNamespace: false,
+  showKind: true,
 });
 console.log('EventList',props.model)
 </script>
 <template>
   <q-timeline dense>
-    <q-timeline-entry  v-for="(item, key) in model" v-bind:key="key"
-      :title="item['reason']"
-      :subtitle="item['metadata']['creationTimestamp']"
-      :color="item['type']=='Warning'?'warning':'secondary'"
-      :icon="item['type']=='Warning'?'warning_amber':undefined"
-      :body="item['message']"
-    />
-
-    <q-timeline-entry
-      title="Event Title"
-      subtitle="February 21, 1986"
-      icon="delete"
-    >
-      <div>
-        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
-      </div>
-    </q-timeline-entry>
-
-    <q-timeline-entry
-      title="Event Title"
-      subtitle="February 22, 1986"
-      color="orange"
-      icon="done_all"
-    >
-      <div>
-        Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
-      </div>
-    </q-timeline-entry>
+    <TransitionGroup enterActiveClass="animate__animated animate__backInRight" leaveActiveClass="animate__animated animate__backOutDown">
+      <q-timeline-entry v-for="(item,num) in props.model" v-bind:key="`${item['metadata']['uid']}-${item['involvedObject']['uid']}`"
+        :title="`${item['involvedObject']['name']} ${item['reason']}`"
+        :subtitle="`${(new Date(item['metadata']['creationTimestamp'])).toLocaleTimeString()} ${showKind?item['involvedObject']['kind']:''} ${showNamespace?item['involvedObject']['namespace']:''} ${item['involvedObject']['name']}`"
+        :color="item['type']=='Warning'?'warning':'secondary'"
+        :icon="item['type']=='Warning'?'warning_amber':undefined"
+        :body="item['message']"
+      />
+    </TransitionGroup>
   </q-timeline>
 </template>
+<style scoped>
+ul {
+  display: flex;
+  flex-direction: column;
+}
+</style>
diff --git a/front/components/core/OpenApiEditUndefObject.vue b/front/components/core/OpenApiEditUndefObject.vue
@@ -32,7 +32,7 @@ function onAdd() {
 }
 </script>
 <template>
-  <q-dialog v-model="prompt" persistent>
+  <q-dialog v-model="prompt" persistent v-if="!readOnly">
     <q-card style="min-width: 350px">
       <q-card-section>
         <div class="text-subtitle">New property name</div>

diff --git a/front/components/navigation/MainMenu.vue b/front/components/navigation/MainMenu.vue
@@ -47,7 +47,18 @@ function toggleLeftDrawer() {
     <q-toolbar>
       <q-btn dense flat round icon="menu" @click="toggleLeftDrawer" />
       <q-toolbar-title>
-        <img src="/icon.svg" loading="lazy" class="q-mt-sm" />
+        <q-circular-progress
+          show-value
+          :indeterminate="navigation.isLoading.value"
+          rounded
+          size="30px"
+          class=""
+          :thickness="0.5"
+          color="orange"
+          track-color="primary"
+        >
+          <img src="/icon.svg" loading="lazy" />
+        </q-circular-progress>
         Gramo
       </q-toolbar-title>
       <q-select v-if="isNamespaced" v-model="model" @update:model-value="onChangeNamespace()" :options="navigation.namespaces.value" label="Namespace" standout style="width: 250px" options-dense>

diff --git a/front/components/navigation/MainMenuLinks.vue b/front/components/navigation/MainMenuLinks.vue
@@ -41,7 +41,7 @@ const toNS = props.targetNS!=undefined?{ name: props.targetNS }:props.target!=un
 </script>
 <template>
     <div v-if="children != undefined && children.length > 0"  :class="`${getLevel0Color(props.name)==''?'':'bg-'+getLevel0Color(props.name)+'-1'}`">
-      <q-expansion-item ref="expansionItem"
+      <q-expansion-item ref="expansionItem" class="column"
           expand-separator
           :header-inset-level="level"
           :key="`${isNamespaced()}-first`"
@@ -57,7 +57,9 @@ const toNS = props.targetNS!=undefined?{ name: props.targetNS }:props.target!=un
             <q-item-label v-if="caption != ''" caption>{{elude(caption, maxCaptionLength)}}</q-item-label>
           </q-item-section>
         </template>
-          <MainMenuLinks v-for="child in children" :key="`${child.title}`" v-bind="child" :level="level+1" />
+        <div class="column">
+          <MainMenuLinks v-for="child in children" :key="`${child.title}`" v-bind="child" :level="level+1"  :style="child.order?`order: ${child.order}`:undefined" />
+        </div>
       </q-expansion-item>
     </div>
     <div v-else>

diff --git a/front/index.ts b/front/index.ts
@@ -6,6 +6,7 @@ import { useNavigationStore } from './stores/navigation'
 import { useConfigStore } from './stores/config'
 import { usePermissionStore } from './stores/permission'
 import { useCRDStore } from './stores/crds'
+import { beforeEach } from './stores/navigation'
 import editorWorker from 'monaco-editor/esm/vs/editor/editor.worker?worker'
 import jsonWorker from 'monaco-editor/esm/vs/language/json/json.worker?worker'
 import cssWorker from 'monaco-editor/esm/vs/language/css/css.worker?worker'
@@ -61,6 +62,7 @@ async function createApp() {
 }
 async function useRoute(app) {
     const { router } = await import('./routes/index')
+    router.beforeEach(beforeEach);
     app.use(router);
     return app;
 }

diff --git a/front/libs/fluxcd/custom.ts b/front/libs/fluxcd/custom.ts
@@ -93,14 +93,14 @@ export const extraOCIRepositoryColumns:Array<QTableColumn> = [
   {name: 'Age', label: 'Age', field: row => row.metadata.creationTimestamp, sortable: true, align: tableColumnAlign.left},
 ];
 export const extraImageUpdateAutomationColumns:Array<QTableColumn> = [
-  {name: 'Last run', label: 'Last run', field: row => row.status.lastAutomationRunTime, sortable: true, align: tableColumnAlign.left},
+  {name: 'Last run', label: 'Last run', field: row => row.status?.lastAutomationRunTime, sortable: true, align: tableColumnAlign.left},
 ];
 export const extraImagePolicyColumns:Array<QTableColumn> = [
-  {name: 'LatestImage', label: 'LatestImage', field: row => row.status.latestImage, sortable: true, align: tableColumnAlign.left},
+  {name: 'LatestImage', label: 'LatestImage', field: row => row.status?.latestImage, sortable: true, align: tableColumnAlign.left},
 ];
 export const extraImageRepositoryColumns:Array<QTableColumn> = [
-  {name: 'Last scan', label: 'Last scan', field: row => row.status.lastScanResult.scanTime, sortable: true, align: tableColumnAlign.left},
-  {name: 'Tags', label: 'Tags', field: row => row.status.lastScanResult.tagCount, sortable: true, align: tableColumnAlign.left},
+  {name: 'Last scan', label: 'Last scan', field: row => row.status.lastScanResult?.scanTime, sortable: true, align: tableColumnAlign.left},
+  {name: 'Tags', label: 'Tags', field: row => row.status?.lastScanResult?.tagCount, sortable: true, align: tableColumnAlign.left},
 ];
 export const extraHelmReleaseColumns:Array<QTableColumn> = [
   {name: 'Age', label: 'Age', field: row => row.metadata.creationTimestamp, sortable: true, align: tableColumnAlign.left},