diff options
Diffstat (limited to 'src/views/_sila')
-rw-r--r-- | src/views/_sila/Memory/Dynamic/MemoryTemp.vue | 113 | ||||
-rw-r--r-- | src/views/_sila/Motherboard/Dynamic/MotherboardTemp.vue | 78 | ||||
-rw-r--r-- | src/views/_sila/Power/Dynamic/PowerTemp.vue | 115 | ||||
-rw-r--r-- | src/views/_sila/Processors/Dynamic/CpuTemp.vue | 115 |
4 files changed, 313 insertions, 108 deletions
diff --git a/src/views/_sila/Memory/Dynamic/MemoryTemp.vue b/src/views/_sila/Memory/Dynamic/MemoryTemp.vue index f69e797a..2bc9f06f 100644 --- a/src/views/_sila/Memory/Dynamic/MemoryTemp.vue +++ b/src/views/_sila/Memory/Dynamic/MemoryTemp.vue @@ -4,34 +4,61 @@ <img src="@/assets/images/_sila/collapsed/temperature.svg" /> {{ $t('pageMemory.temperature') }} </b-col> - <b-row class="align-items-end limit-container"> - <b-col xs="12" sm="6" xl="3" class="pt-4"> - <b-form-group :label="$t('pageMemory.labels.warning')"> - <b-form-input - v-model.number="warning" - type="number" - :min="0" - :max="critical" - ></b-form-input> - </b-form-group> - </b-col> - <b-col xs="12" sm="6" xl="3" class="pt-4"> - <b-form-group :label="$t('pageMemory.labels.critical')"> - <b-form-input - v-model.number="critical" - type="number" - :min="warning" - :max="100" + <b-form novalidate> + <b-row class="align-items-end limit-container"> + <b-col xs="12" sm="6" xl="3" class="pt-4"> + <b-form-group :label="$t('pageMemory.labels.warning')"> + <b-form-input + v-model.number="warning" + type="number" + :min="1" + :max="critical" + :state="getValidationState($v.warning)" + @blur="$v.warning.$touch()" + ></b-form-input> + <b-form-invalid-feedback class="absolute" role="alert"> + <div v-if="!$v.warning.between"> + {{ $t('global.form.invalidValue') }} + </div> + <div v-if="!$v.warning.required"> + {{ $t('global.form.fieldRequired') }} + </div> + </b-form-invalid-feedback> + </b-form-group> + </b-col> + <b-col xs="12" sm="6" xl="3" class="pt-4"> + <b-form-group :label="$t('pageMemory.labels.critical')"> + <b-form-input + v-model.number="critical" + type="number" + :min="warning" + :max="100" + :state="getValidationState($v.critical)" + @blur="$v.critical.$touch()" + > + </b-form-input> + <b-form-invalid-feedback class="absolute" role="alert"> + <div v-if="!$v.critical.between"> + {{ $t('global.form.invalidValue') }} + </div> + <div v-if="!$v.critical.required"> + {{ $t('global.form.fieldRequired') }} + </div> + </b-form-invalid-feedback> + </b-form-group> + </b-col> + <b-col xs="12" sm="6" xl="3" class="pt-4"> + <b-button + variant="primary" + style="height: 35px" + :disabled="loading" + @click="saveLimit" > - </b-form-input> - </b-form-group> - </b-col> - <b-col xs="12" sm="6" xl="3" class="pt-4"> - <b-button variant="primary" style="height: 35px" @click="saveLimit"> - {{ $t('global.action.save') }} - </b-button> - </b-col> - </b-row> + {{ $t('global.action.save') }} + </b-button> + </b-col> + </b-row> + </b-form> <chart type="memory" :colors="colors" @@ -80,15 +107,25 @@ import Chart from '@/components/_sila/Global/Chart'; import DataFormatterMixin from '@/components/_sila/Mixins/DataFormatterMixin'; -import LoadingBarMixin from '@/components/_sila/Mixins/LoadingBarMixin'; +import LoadingBarMixin, { + loading, +} from '@/components/_sila/Mixins/LoadingBarMixin'; import TableFilterMixin from '@/components/_sila/Mixins/TableFilterMixin'; import BVToastMixin from '@/components/_sila/Mixins/BVToastMixin'; +import VuelidateMixin from '@/components/_sila/Mixins/VuelidateMixin.js'; import { getGroups, getItems } from '@/utilities/_sila/metricProperties'; +import { between, required } from 'vuelidate/lib/validators'; export default { components: { Chart }, - mixins: [DataFormatterMixin, LoadingBarMixin, TableFilterMixin, BVToastMixin], + mixins: [ + DataFormatterMixin, + LoadingBarMixin, + TableFilterMixin, + BVToastMixin, + VuelidateMixin, + ], props: { timeScale: { type: String, @@ -97,6 +134,7 @@ export default { }, data() { return { + loading, warning: null, critical: null, isBusy: true, @@ -133,6 +171,19 @@ export default { }; }, + validations() { + return { + warning: { + required, + between: between(1, this.critical), + }, + critical: { + required, + between: between(this.warning, 100), + }, + }; + }, + computed: { groups() { return getGroups(this.filteredSensors); @@ -193,10 +244,14 @@ export default { methods: { saveLimit() { + this.$v.$touch(); + if (this.$v.$invalid) return; + this.startLoader(); this.$store .dispatch('memory/patchLimits', { warning: this.warning, + critical: this.critical, groups: this.groups, }) .catch(({ message }) => this.errorToast(message)) diff --git a/src/views/_sila/Motherboard/Dynamic/MotherboardTemp.vue b/src/views/_sila/Motherboard/Dynamic/MotherboardTemp.vue index 5fac0a89..fc962f11 100644 --- a/src/views/_sila/Motherboard/Dynamic/MotherboardTemp.vue +++ b/src/views/_sila/Motherboard/Dynamic/MotherboardTemp.vue @@ -5,23 +5,40 @@ {{ $t('pageMotherboard.temperature') }} </b-col> - <b-row class="align-items-end limit-container"> - <b-col xs="12" sm="6" xl="3" class="pt-4"> - <b-form-group :label="$t('pageMotherboard.labels.warning')"> - <b-form-input - v-model.number="warning" - type="number" - :min="0" - :max="100" - ></b-form-input> - </b-form-group> - </b-col> - <b-col xs="12" sm="6" class="pt-4"> - <b-button variant="primary" style="height: 35px" @click="saveLimit"> - {{ $t('global.action.save') }} - </b-button> - </b-col> - </b-row> + <b-form novalidate> + <b-row class="align-items-end limit-container"> + <b-col xs="12" sm="6" xl="3" class="pt-4"> + <b-form-group :label="$t('pageMotherboard.labels.warning')"> + <b-form-input + v-model.number="warning" + type="number" + :min="1" + :max="100" + :state="getValidationState($v.warning)" + @blur="$v.warning.$touch()" + ></b-form-input> + <b-form-invalid-feedback class="absolute" role="alert"> + <div v-if="!$v.warning.between"> + {{ $t('global.form.invalidValue') }} + </div> + <div v-if="!$v.warning.required"> + {{ $t('global.form.fieldRequired') }} + </div> + </b-form-invalid-feedback> + </b-form-group> + </b-col> + <b-col xs="12" sm="6" class="pt-4"> + <b-button + variant="primary" + style="height: 35px" + :disabled="loading" + @click="saveLimit" + > + {{ $t('global.action.save') }} + </b-button> + </b-col> + </b-row> + </b-form> <chart type="motherboard" :time-scale="timeScale" @@ -69,15 +86,25 @@ import Chart from '@/components/_sila/Global/Chart'; import DataFormatterMixin from '@/components/_sila/Mixins/DataFormatterMixin'; -import LoadingBarMixin from '@/components/_sila/Mixins/LoadingBarMixin'; +import LoadingBarMixin, { + loading, +} from '@/components/_sila/Mixins/LoadingBarMixin'; import TableFilterMixin from '@/components/_sila/Mixins/TableFilterMixin'; import BVToastMixin from '@/components/_sila/Mixins/BVToastMixin'; +import VuelidateMixin from '@/components/_sila/Mixins/VuelidateMixin.js'; import { getItems, getGroups } from '@/utilities/_sila/metricProperties'; +import { between, required } from 'vuelidate/lib/validators'; export default { components: { Chart }, - mixins: [DataFormatterMixin, LoadingBarMixin, TableFilterMixin, BVToastMixin], + mixins: [ + DataFormatterMixin, + LoadingBarMixin, + TableFilterMixin, + BVToastMixin, + VuelidateMixin, + ], props: { timeScale: { type: String, @@ -86,6 +113,7 @@ export default { }, data() { return { + loading, warning: null, isBusy: true, fields: [ @@ -121,6 +149,15 @@ export default { }; }, + validations() { + return { + warning: { + required, + between: between(1, 100), + }, + }; + }, + computed: { groups() { return getGroups(this.filteredSensors); @@ -174,6 +211,9 @@ export default { methods: { saveLimit() { + this.$v.$touch(); + if (this.$v.$invalid) return; + this.startLoader(); this.$store .dispatch('motherboard/patchLimits', { diff --git a/src/views/_sila/Power/Dynamic/PowerTemp.vue b/src/views/_sila/Power/Dynamic/PowerTemp.vue index 1d18e8b1..18c2cc53 100644 --- a/src/views/_sila/Power/Dynamic/PowerTemp.vue +++ b/src/views/_sila/Power/Dynamic/PowerTemp.vue @@ -8,35 +8,62 @@ <img src="@/assets/images/_sila/collapsed/temperature.svg" /> </template> <page-section> - <b-row class="align-items-end limit-container"> - <b-col xs="12" sm="6" xl="3" class="pt-4"> - <b-form-group :label="$t('pagePowerSup.labels.warning')"> - <b-form-input - v-model.number="warning" - type="number" - :min="0" - :max="100" + <b-form novalidate> + <b-row class="align-items-end limit-container"> + <b-col xs="12" sm="6" xl="3" class="pt-4"> + <b-form-group :label="$t('pagePowerSup.labels.warning')"> + <b-form-input + v-model.number="warning" + type="number" + :min="1" + :max="critical" + :state="getValidationState($v.warning)" + @blur="$v.warning.$touch()" + > + </b-form-input> + <b-form-invalid-feedback class="absolute" role="alert"> + <div v-if="!$v.warning.between"> + {{ $t('global.form.invalidValue') }} + </div> + <div v-if="!$v.warning.required"> + {{ $t('global.form.fieldRequired') }} + </div> + </b-form-invalid-feedback> + </b-form-group> + </b-col> + <b-col xs="12" sm="6" xl="3" class="pt-4"> + <b-form-group :label="$t('pagePowerSup.labels.critical')"> + <b-form-input + v-model.number="critical" + type="number" + :min="warning" + :max="100" + :state="getValidationState($v.critical)" + @blur="$v.critical.$touch()" + > + </b-form-input> + <b-form-invalid-feedback class="absolute" role="alert"> + <div v-if="!$v.critical.between"> + {{ $t('global.form.invalidValue') }} + </div> + <div v-if="!$v.critical.required"> + {{ $t('global.form.fieldRequired') }} + </div> + </b-form-invalid-feedback> + </b-form-group> + </b-col> + <b-col xs="12" sm="6" xl="3" class="pt-4"> + <b-button + variant="primary" + style="height: 35px" + :disabled="loading" + @click="saveLimit" > - </b-form-input> - </b-form-group> - </b-col> - <b-col xs="12" sm="6" xl="3" class="pt-4"> - <b-form-group :label="$t('pagePowerSup.labels.critical')"> - <b-form-input - v-model.number="critical" - type="number" - :min="0" - :max="100" - > - </b-form-input> - </b-form-group> - </b-col> - <b-col xs="12" sm="6" xl="3" class="pt-4"> - <b-button variant="primary" style="height: 35px" @click="saveLimit"> - {{ $t('global.action.save') }} - </b-button> - </b-col> - </b-row> + {{ $t('global.action.save') }} + </b-button> + </b-col> + </b-row> + </b-form> <chart type="processors" :time-scale="timeScale" @@ -87,16 +114,26 @@ import Chart from '@/components/_sila/Global/Chart'; import PageSection from '@/components/Global/PageSection'; import DataFormatterMixin from '@/components/_sila/Mixins/DataFormatterMixin'; +import LoadingBarMixin, { + loading, +} from '@/components/_sila/Mixins/LoadingBarMixin'; import TableFilterMixin from '@/components/_sila/Mixins/TableFilterMixin'; -import LoadingBarMixin from '@/components/_sila/Mixins/LoadingBarMixin'; import BVToastMixin from '@/components/_sila/Mixins/BVToastMixin'; +import VuelidateMixin from '@/components/_sila/Mixins/VuelidateMixin.js'; import Collapse from '@/components/_sila/Global/Collapse'; import { getGroups, getItems } from '@/utilities/_sila/metricProperties'; +import { between, required } from 'vuelidate/lib/validators'; export default { components: { PageSection, Chart, Collapse }, - mixins: [DataFormatterMixin, TableFilterMixin, LoadingBarMixin, BVToastMixin], + mixins: [ + DataFormatterMixin, + TableFilterMixin, + LoadingBarMixin, + BVToastMixin, + VuelidateMixin, + ], props: { timeScale: { type: String, @@ -105,6 +142,7 @@ export default { }, data() { return { + loading, warning: null, critical: null, isBusy: true, @@ -142,6 +180,19 @@ export default { }; }, + validations() { + return { + warning: { + required, + between: between(1, this.critical), + }, + critical: { + required, + between: between(this.warning, 100), + }, + }; + }, + computed: { groups() { return getGroups(this.allSensors); @@ -196,10 +247,14 @@ export default { }, methods: { saveLimit() { + this.$v.$touch(); + if (this.$v.$invalid) return; + this.startLoader(); this.$store .dispatch('powerSupply/patchLimitsTemp', { warning: this.warning, + critical: this.critical, groups: this.groups, }) .catch(({ message }) => this.errorToast(message)) diff --git a/src/views/_sila/Processors/Dynamic/CpuTemp.vue b/src/views/_sila/Processors/Dynamic/CpuTemp.vue index e3185aaa..0a630367 100644 --- a/src/views/_sila/Processors/Dynamic/CpuTemp.vue +++ b/src/views/_sila/Processors/Dynamic/CpuTemp.vue @@ -8,35 +8,62 @@ <img src="@/assets/images/_sila/collapsed/temperature.svg" /> </template> <page-section> - <b-row class="align-items-end limit-container"> - <b-col xs="12" sm="6" xl="3" class="pt-4"> - <b-form-group :label="$t('pageProcessors.labels.warning')"> - <b-form-input - v-model.number="warning" - type="number" - :min="0" - :max="100" + <b-form novalidate> + <b-row class="align-items-end limit-container"> + <b-col xs="12" sm="6" xl="3" class="pt-4"> + <b-form-group :label="$t('pageProcessors.labels.warning')"> + <b-form-input + v-model.number="warning" + type="number" + :min="1" + :max="critical" + :state="getValidationState($v.warning)" + @blur="$v.warning.$touch()" + > + </b-form-input> + <b-form-invalid-feedback class="absolute" role="alert"> + <div v-if="!$v.warning.between"> + {{ $t('global.form.invalidValue') }} + </div> + <div v-if="!$v.warning.required"> + {{ $t('global.form.fieldRequired') }} + </div> + </b-form-invalid-feedback> + </b-form-group> + </b-col> + <b-col xs="12" sm="6" xl="3" class="pt-4"> + <b-form-group :label="$t('pageProcessors.labels.critical')"> + <b-form-input + v-model.number="critical" + type="number" + :min="warning" + :max="100" + :state="getValidationState($v.critical)" + @blur="$v.critical.$touch()" + > + </b-form-input> + <b-form-invalid-feedback class="absolute" role="alert"> + <div v-if="!$v.critical.between"> + {{ $t('global.form.invalidValue') }} + </div> + <div v-if="!$v.critical.required"> + {{ $t('global.form.fieldRequired') }} + </div> + </b-form-invalid-feedback> + </b-form-group> + </b-col> + <b-col xs="12" sm="6" xl="3" class="pt-4"> + <b-button + variant="primary" + style="height: 35px" + :disabled="loading" + @click="saveLimit" > - </b-form-input> - </b-form-group> - </b-col> - <b-col xs="12" sm="6" xl="3" class="pt-4"> - <b-form-group :label="$t('pageProcessors.labels.critical')"> - <b-form-input - v-model.number="critical" - type="number" - :min="0" - :max="100" - > - </b-form-input> - </b-form-group> - </b-col> - <b-col xs="12" sm="6" xl="3" class="pt-4"> - <b-button variant="primary" style="height: 35px" @click="saveLimit"> - {{ $t('global.action.save') }} - </b-button> - </b-col> - </b-row> + {{ $t('global.action.save') }} + </b-button> + </b-col> + </b-row> + </b-form> <chart type="processors" :time-scale="timeScale" @@ -87,16 +114,26 @@ import Chart from '@/components/_sila/Global/Chart'; import PageSection from '@/components/Global/PageSection'; import DataFormatterMixin from '@/components/_sila/Mixins/DataFormatterMixin'; -import LoadingBarMixin from '@/components/_sila/Mixins/LoadingBarMixin'; +import LoadingBarMixin, { + loading, +} from '@/components/_sila/Mixins/LoadingBarMixin'; import TableFilterMixin from '@/components/_sila/Mixins/TableFilterMixin'; import BVToastMixin from '@/components/_sila/Mixins/BVToastMixin'; +import VuelidateMixin from '@/components/_sila/Mixins/VuelidateMixin.js'; import Collapse from '@/components/_sila/Global/Collapse'; import { getGroups, getItems } from '@/utilities/_sila/metricProperties'; +import { between, required } from 'vuelidate/lib/validators'; export default { components: { PageSection, Chart, Collapse }, - mixins: [DataFormatterMixin, LoadingBarMixin, TableFilterMixin, BVToastMixin], + mixins: [ + DataFormatterMixin, + LoadingBarMixin, + TableFilterMixin, + BVToastMixin, + VuelidateMixin, + ], props: { timeScale: { type: String, @@ -105,6 +142,7 @@ export default { }, data() { return { + loading, warning: null, critical: null, isBusy: true, @@ -142,6 +180,19 @@ export default { }; }, + validations() { + return { + warning: { + required, + between: between(1, this.critical), + }, + critical: { + required, + between: between(this.warning, 100), + }, + }; + }, + computed: { groups() { return getGroups(this.filteredSensors); @@ -201,10 +252,14 @@ export default { }, methods: { saveLimit() { + this.$v.$touch(); + if (this.$v.$invalid) return; + this.startLoader(); this.$store .dispatch('processors/patchLimitsTemp', { warning: this.warning, + critical: this.critical, groups: this.groups, }) .catch(({ message }) => this.errorToast(message)) |