frontend/components/monitorings/volumes/VolumeMonitoringConfigComponent.vue

37 lines
1.2 KiB
Vue

<template>
<div class="content-m">
<div class="left-center">
<h3>{{ monitoring.configName }}</h3>
<p v-if="monitoring.type === 'VOLUME'" class="label">Volume: {{ monitoring.volumeConfig.mountPath }}</p>
</div>
<div class="col-3">
<MonitoredPodComponent class="tile-l" v-for="pod in pods" :pod="pod" :period="period"></MonitoredPodComponent>
</div>
</div>
</template>
<script setup lang="ts">
import MonitoredPodComponent from './VolumeMonitoredPodComponent.vue';
import { MonitoredResource } from '../MonitoredResource';
import type { Pod } from '~/classes/Pod';
import type { MonitoringConfig } from '~/classes/monitoring/MonitoringConfig';
import type { Period } from '../Period';
const props = defineProps<{
monitoring: MonitoringConfig,
period: Period
}>();
const pods: Ref<MonitoredResource<Pod>[] | undefined> = ref(undefined);
onMounted(() => {
MonitoredResource.getMonitorings(props.monitoring.id, props.period.from, props.period.to, (_pods: MonitoredResource<Pod>[]) => {
pods.value = _pods;
});
});
function createLabel(input: string)
{
return input.at(0)?.toUpperCase() + input.substring(1, input.length).toLowerCase();
}
</script>