diff options
author | Vitalii Lysak <v.lysak@dunice.net> | 2022-08-25 12:16:17 +0300 |
---|---|---|
committer | Vitalii Lysak <v.lysak@dunice.net> | 2022-08-25 12:16:17 +0300 |
commit | 0847eaf4cc4b050fc6f297940013a3e7e4c1cb81 (patch) | |
tree | d30763106339ce9f0b2c1ea3d7b594915257755a /src/views/_sila/Power/Dynamic | |
parent | dc974638f3ea285f8da00a1a084d08ce3ede8949 (diff) | |
download | webui-vue-0847eaf4cc4b050fc6f297940013a3e7e4c1cb81.tar.xz |
SILABMC-256: add limits for Voltage
Diffstat (limited to 'src/views/_sila/Power/Dynamic')
-rw-r--r-- | src/views/_sila/Power/Dynamic/VoltInput.vue | 124 | ||||
-rw-r--r-- | src/views/_sila/Power/Dynamic/VoltOutput.vue | 202 |
2 files changed, 259 insertions, 67 deletions
diff --git a/src/views/_sila/Power/Dynamic/VoltInput.vue b/src/views/_sila/Power/Dynamic/VoltInput.vue index 38f7c077..b343ddbe 100644 --- a/src/views/_sila/Power/Dynamic/VoltInput.vue +++ b/src/views/_sila/Power/Dynamic/VoltInput.vue @@ -8,34 +8,61 @@ <img src="@/assets/images/_sila/collapsed/voltage.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="245" - ></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="warning" - :max="250" + <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" + :disabled="$store.getters['authentication/role'] === 'ReadOnly'" + type="number" + :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" + :disabled="$store.getters['authentication/role'] === 'ReadOnly'" + type="number" + :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 || $store.getters['authentication/role'] === 'ReadOnly' + " + @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="voltage-input" :time-scale="timeScale" @@ -43,6 +70,7 @@ :colors="colors" :warning="warningLimit" :critical="criticalLimit" + :max="maxLimit" ></chart> <b-table responsive="md" @@ -86,17 +114,27 @@ 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'; import { psuFilter } from '@/utilities/_sila/psuFilter'; export default { components: { PageSection, Chart, Collapse }, - mixins: [DataFormatterMixin, LoadingBarMixin, TableFilterMixin, BVToastMixin], + mixins: [ + DataFormatterMixin, + LoadingBarMixin, + TableFilterMixin, + BVToastMixin, + VuelidateMixin, + ], props: { timeScale: { type: String, @@ -105,6 +143,7 @@ export default { }, data() { return { + loading, warning: null, critical: null, isBusy: true, @@ -137,6 +176,20 @@ export default { ], }; }, + + validations() { + return { + warning: { + required, + between: between(1, this.critical), + }, + critical: { + required, + between: between(this.warning, this.maxLimit), + }, + }; + }, + computed: { groups() { return getGroups(this.filteredItems); @@ -147,6 +200,10 @@ export default { }, limits() { + console.log( + 'limits input!!!', + this.$store.getters['powerSupply/limitsVol'] + ); return this.$store.getters['powerSupply/limitsVol']; }, @@ -167,6 +224,12 @@ export default { })?.UpperThresholdCritical; }, + maxLimit() { + return this.limits.find((limit) => { + return limit?.MaxReadingRange && this.groups.includes(limit.MemberId); + })?.MaxReadingRange; + }, + filteredItems() { return psuFilter(this.allSensors, 'Input'); }, @@ -195,6 +258,9 @@ export default { }, methods: { saveLimit() { + this.$v.$touch(); + if (this.$v.$invalid) return; + this.startLoader(); this.$store .dispatch('powerSupply/patchLimitsVol', { diff --git a/src/views/_sila/Power/Dynamic/VoltOutput.vue b/src/views/_sila/Power/Dynamic/VoltOutput.vue index f657b064..e03c04b6 100644 --- a/src/views/_sila/Power/Dynamic/VoltOutput.vue +++ b/src/views/_sila/Power/Dynamic/VoltOutput.vue @@ -8,41 +8,69 @@ <img src="@/assets/images/_sila/collapsed/voltage.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="warning" - type="number" - :min="0" - :max="shutdown" - ></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.shutdown')"> - <b-form-input - v-model="shutdown" - 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('pagePowerSup.labels.warning')"> + <b-form-input + v-model.number="warning" + :disabled="$store.getters['authentication/role'] === 'ReadOnly'" + type="number" + :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" + :disabled="$store.getters['authentication/role'] === 'ReadOnly'" + type="number" + :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 || $store.getters['authentication/role'] === 'ReadOnly' + " + @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"> - {{ $t('global.action.save') }} - </b-button> - </b-col> - </b-row> --> + {{ $t('global.action.save') }} + </b-button> + </b-col> + </b-row> + </b-form> <chart type="voltage-output" :time-scale="timeScale" :data="filteredItems" :colors="colors" - :warning="+warning" - :shutdown="+shutdown" + :warning="warningLimit" + :critical="criticalLimit" + :max="maxLimit" ></chart> <b-table responsive="md" @@ -86,16 +114,27 @@ 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 VuelidateMixin from '@/components/_sila/Mixins/VuelidateMixin.js'; import Collapse from '@/components/_sila/Global/Collapse'; -import { getItems } from '@/utilities/_sila/metricProperties'; +import { getGroups, getItems } from '@/utilities/_sila/metricProperties'; +import { between, required } from 'vuelidate/lib/validators'; import { psuFilter } from '@/utilities/_sila/psuFilter'; +import BVToastMixin from '@/components/_sila/Mixins/BVToastMixin'; export default { components: { PageSection, Chart, Collapse }, - mixins: [DataFormatterMixin, LoadingBarMixin, TableFilterMixin], + mixins: [ + DataFormatterMixin, + LoadingBarMixin, + TableFilterMixin, + BVToastMixin, + VuelidateMixin, + ], props: { timeScale: { type: String, @@ -104,8 +143,9 @@ export default { }, data() { return { - warning: Infinity, - shutdown: Infinity, + loading, + warning: null, + critical: null, isBusy: true, fields: [ { @@ -137,11 +177,59 @@ export default { }; }, + validations() { + return { + warning: { + required, + between: between(1, this.critical), + }, + critical: { + required, + between: between(this.warning, this.maxLimit), + }, + }; + }, + computed: { + groups() { + return getGroups(this.filteredItems); + }, + items() { return getItems(this.filteredItems); }, + limits() { + console.log( + 'limits!!!****', + this.$store.getters['powerSupply/limitsVol'] + ); + return this.$store.getters['powerSupply/limitsVol']; + }, + + warningLimit() { + return this.limits.find((limit) => { + return ( + limit?.UpperThresholdNonCritical && + this.groups.includes(limit.MemberId) + ); + })?.UpperThresholdNonCritical; + }, + + criticalLimit() { + return this.limits.find((limit) => { + return ( + limit?.UpperThresholdCritical && this.groups.includes(limit.MemberId) + ); + })?.UpperThresholdCritical; + }, + + maxLimit() { + return this.limits.find((limit) => { + return limit?.MaxReadingRange && this.groups.includes(limit.MemberId); + })?.MaxReadingRange; + }, + filteredItems() { return psuFilter(this.allSensors, 'Output'); }, @@ -162,10 +250,44 @@ export default { }, watch: { items() { - this.items.length ? (this.isBusy = false) : (this.isBusy = true); + if (this.items && this.items.length > 0) { + this.isBusy = false; + this.endLoader(); + } + }, + + limits() { + if (this.limits && this.limits.length > 0) { + this.warning = this.warningLimit; + this.critical = this.criticalLimit; + } + }, + + timeScale() { + this.loadData(); }, }, + + /*created() { + this.loadData(); + },*/ + methods: { + saveLimit() { + this.$v.$touch(); + if (this.$v.$invalid) return; + + this.startLoader(); + this.$store + .dispatch('powerSupply/patchLimitsVol', { + warning: this.warning, + critical: this.critical, + groups: this.groups, + }) + .catch(({ message }) => this.errorToast(message)) + .finally(() => this.endLoader()); + }, + onOpened(state) { if (state) { this.loadData(); @@ -179,9 +301,13 @@ export default { this.startLoader(); this.$store.dispatch('powerSupply/getPsu', payload).finally(() => { - this.$root.$emit('psu-volt'); - this.isBusy = false; - this.endLoader(); + this.$store.dispatch('powerSupply/getLimitsVol').finally(() => { + this.warning = this.warningLimit; + this.critical = this.criticalLimit; + this.$root.$emit('psu-volt'); + this.isBusy = false; + this.endLoader(); + }); }); }, }, |