70 lines
2.6 KiB
Vue
70 lines
2.6 KiB
Vue
<template>
|
|
<div class="content-l">
|
|
<h2>Add Monitoring Config</h2>
|
|
<div class="content-l">
|
|
<div class="col-3 tile-l">
|
|
<UiInput label="Name">
|
|
<input type="text" v-model="config.configName">
|
|
</UiInput>
|
|
<UiInput label="Type">
|
|
<select v-model="config.type">
|
|
<option :value="MonitoringType.VOLUME">Volume</option>
|
|
<option :value="MonitoringType.WORKLOAD">Workload</option>
|
|
<option :value="MonitoringType.HEALTHCHECK">Healthcheck</option>
|
|
</select>
|
|
</UiInput>
|
|
<UiInput label="Interval (e.g. 30s, 5m)">
|
|
<input type="text" v-model="config.interval">
|
|
</UiInput>
|
|
</div>
|
|
<div v-if="config.type === MonitoringType.VOLUME" class="tile-l col-2">
|
|
<UiInput label="Mount Path">
|
|
<input type="text" v-model="config.volumeConfig.mountPath">
|
|
</UiInput>
|
|
<UiInput label="Container Name">
|
|
<input type="text" v-model="config.volumeConfig.containerName">
|
|
</UiInput>
|
|
</div>
|
|
<div class="col-2 tile-l">
|
|
<UiInput label="Target Typ">
|
|
<select v-model="config.targetConfig.type">
|
|
<option :value="TargetType.LABEL">Label</option>
|
|
<option :value="TargetType.STATEFUL_SET">Stateful Set</option>
|
|
<option :value="TargetType.DEPLOYENT">Deployment</option>
|
|
</select>
|
|
</UiInput>
|
|
<UiInput label="Target Namespace">
|
|
<input type="text" v-model="config.targetConfig.namespace">
|
|
</UiInput>
|
|
</div>
|
|
<div v-if="config.targetConfig.type === TargetType.LABEL" class="col-2 tile-l">
|
|
<UiInput label="Key">
|
|
<input type="text" v-model="config.targetConfig.labelKey">
|
|
</UiInput>
|
|
<UiInput label="Value">
|
|
<input type="text" v-model="config.targetConfig.labelValue">
|
|
</UiInput>
|
|
</div>
|
|
<div class="center">
|
|
<UiButton @click="() => create()">Add</UiButton>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { MonitoringConfig, MonitoringConfigCreation } from '~/classes/monitoring/MonitoringConfig';
|
|
import { MonitoringType } from '~/classes/monitoring/MonitoringType';
|
|
import { TargetType } from '~/classes/monitoring/TargetType';
|
|
|
|
const config = ref(new MonitoringConfigCreation());
|
|
|
|
function create()
|
|
{
|
|
MonitoringConfig.create(config.value);
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
</style> |