63 lines
2.1 KiB
Vue
63 lines
2.1 KiB
Vue
<template>
|
|
<PopupTemplate :heading="'Logs: ' + pod.metadata?.namespace + '/' + pod.metadata?.name" ref="base" @close="emits('close')">
|
|
<div class="log-container">
|
|
<div class="left-center">
|
|
<UiButton @click="() => config.timestamps = true" v-if="!config.timestamps"><span>Show Timestamp</span> <UiIcon>visibility</UiIcon></UiButton>
|
|
<UiButton @click="() => config.timestamps = false" v-if="config.timestamps"><span>Hide Timestamp</span> <UiIcon>visibility_off</UiIcon></UiButton>
|
|
<UiButton @click="() => config.lineWrap = true" v-if="!config.lineWrap"><span>Wrap Line</span> <UiIcon>format_text_wrap</UiIcon></UiButton>
|
|
<UiButton @click="() => config.lineWrap = false" v-if="config.lineWrap"><span>Unwrap Line</span> <UiIcon>format_text_overflow</UiIcon></UiButton>
|
|
</div>
|
|
<Console :logs="logs" :config="config"></Console>
|
|
</div>
|
|
</PopupTemplate>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { LogRepo } from '~/classes/LogRepo';
|
|
import type { Pod } from '~/classes/Pod';
|
|
import { Log } from '~/requests/logs';
|
|
import Console from "~/components/inspect/console/Console.vue";
|
|
import UiIcon from "~/components/ui/UiIcon.vue";
|
|
import { ConsoleConfig } from '~/components/inspect/console/ConsoleConfig'
|
|
import {usePopup} from "~/components/popup/Popup";
|
|
|
|
const config = ref(ConsoleConfig.default(true, false, false));
|
|
|
|
const base = ref();
|
|
|
|
const logs: Ref<Log[]> = ref([]);
|
|
|
|
const pod = usePopup().data() as Pod;
|
|
|
|
const emits = defineEmits<{
|
|
(e: 'close'): void
|
|
}>()
|
|
|
|
const logRepo = new LogRepo();
|
|
onMounted(() => {
|
|
logRepo.listen("pods", pod.metadata.namespace, pod.metadata.name,(_logs: Log[]) => {
|
|
logs.value.push(..._logs);
|
|
});
|
|
});
|
|
onUnmounted(() => {
|
|
logRepo.clear();
|
|
});
|
|
|
|
onMounted(() => {
|
|
document.addEventListener('keydown', (event) => {
|
|
if(event.key === 'Escape')
|
|
{
|
|
emits('close');
|
|
}
|
|
});
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
.log-container {
|
|
height: 100%;
|
|
display: grid;
|
|
grid-template-rows: auto 1fr;
|
|
gap: 0.5rem;
|
|
}
|
|
</style> |