summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorVitalii Lysak <v.lysak@dunice.net>2022-07-27 10:01:53 +0300
committerVitalii Lysak <v.lysak@dunice.net>2022-07-27 10:01:53 +0300
commit6dbbe5b305be2263af559392f6efacfc961dc858 (patch)
tree61b69469c8ab0aaf3bc0b7dfdf32861461e2fc45
parent1e7f107440c06ab4ecad888731cd56189627fd36 (diff)
downloadwebui-vue-6dbbe5b305be2263af559392f6efacfc961dc858.tar.xz
upd logic for fans
-rw-r--r--src/store/modules/_sila/HardwareStatus/FanStore.js21
-rw-r--r--src/views/_sila/Fans/Dynamic/FanSpeed.vue177
-rw-r--r--src/views/_sila/Fans/Dynamic/FansDynamicPage.vue175
3 files changed, 190 insertions, 183 deletions
diff --git a/src/store/modules/_sila/HardwareStatus/FanStore.js b/src/store/modules/_sila/HardwareStatus/FanStore.js
index c7b30099..d0804b80 100644
--- a/src/store/modules/_sila/HardwareStatus/FanStore.js
+++ b/src/store/modules/_sila/HardwareStatus/FanStore.js
@@ -45,19 +45,16 @@ const FanStore = {
},
},
actions: {
- async getFansDynamic({ commit }) {
+ async getFansDynamic({ commit }, { lastHour }) {
+ let url = null;
+ if (lastHour) {
+ url =
+ '/redfish/v1/TelemetryService/MetricReports/hour_data&id=fans&period=last_hour';
+ } else {
+ url = '/redfish/v1/TelemetryService/MetricReports/hour_data&id=fans';
+ }
return await api
- .get('/redfish/v1/TelemetryService/MetricReports/hour_data&id=fans')
- .then(({ data: { MetricValues = [] } }) =>
- commit('setFansDynamic', MetricValues)
- )
- .catch((error) => console.log(error));
- },
- async getFansDynamicHour({ commit }) {
- return await api
- .get(
- '/redfish/v1/TelemetryService/MetricReports/hour_data&id=fans&period=last_hour'
- )
+ .get(url)
.then(({ data: { MetricValues = [] } }) =>
commit('setFansDynamic', MetricValues)
)
diff --git a/src/views/_sila/Fans/Dynamic/FanSpeed.vue b/src/views/_sila/Fans/Dynamic/FanSpeed.vue
new file mode 100644
index 00000000..9db06c02
--- /dev/null
+++ b/src/views/_sila/Fans/Dynamic/FanSpeed.vue
@@ -0,0 +1,177 @@
+<template>
+ <div class="custom-divider" style="margin-top: 0">
+ <b-button
+ variant="collapse"
+ class="d-flex flex-nowrap justify-content-start"
+ >
+ <img src="@/assets/images/_sila/collapsed/fan.svg" />
+ {{ $t('pageFans.speed') }}
+ </b-button>
+ <b-row class="align-items-end p-4">
+ <b-col xs="12" md="4" class="pt-2">
+ <b-form-group :label="$t('pageFans.labels.warning')">
+ <b-form-input v-model="warning" type="number" :min="0" :max="3150">
+ </b-form-input>
+ </b-form-group>
+ </b-col>
+ <b-col xs="12" md="4" class="pt-2">
+ <b-form-group :label="$t('pageFans.labels.shutdown')">
+ <b-form-input
+ v-model="shutdown"
+ :min="warning"
+ :max="4000"
+ type="number"
+ ></b-form-input>
+ </b-form-group>
+ </b-col>
+ <b-col xs="12" md="4" class="pt-2">
+ <b-button variant="primary" style="height: 35px">
+ {{ 'Сохранить' }}
+ </b-button>
+ </b-col>
+ </b-row>
+ <b-col class="pl-4 pr-4">
+ <chart
+ type="fans"
+ :colors="colors"
+ :time-scale="timeScale"
+ :data="filteredSensors"
+ :warning="warning"
+ :shutdown="shutdown"
+ ></chart>
+
+ <b-table
+ v-if="items && items.length > 0"
+ responsive="md"
+ show-empty
+ table-variant="accessory"
+ hover
+ :items="items"
+ :fields="fields"
+ :empty-text="$t('global.table.emptyMessage')"
+ >
+ <template #cell(name)="{ value, index }">
+ <div
+ class="item-color"
+ :style="`background-color: ${colors[index]}`"
+ ></div>
+ {{ value }}
+ </template>
+ <template #cell(minDate)="{ value }">
+ <span style="color: rgb(12, 28, 41)">
+ {{ value.time }}
+ </span>
+ <span>
+ {{ value.date }}
+ </span>
+ </template>
+ <template #cell(maxDate)="{ value }">
+ <span style="color: rgb(12, 28, 41)">
+ {{ value.time }}
+ </span>
+ <span>
+ {{ value.date }}
+ </span>
+ </template>
+ </b-table>
+ </b-col>
+ </div>
+</template>
+<script>
+import Chart from '@/components/_sila/Global/Chart';
+
+import DataFormatterMixin from '@/components/_sila/Mixins/DataFormatterMixin';
+import LoadingBarMixin from '@/components/_sila/Mixins/LoadingBarMixin';
+import TableFilterMixin from '@/components/_sila/Mixins/TableFilterMixin';
+
+import { getItems } from '@/utilities/_sila/metricProperties';
+
+export default {
+ components: { Chart },
+ mixins: [DataFormatterMixin, LoadingBarMixin, TableFilterMixin],
+ props: {
+ timeScale: {
+ type: String,
+ default: 'hour',
+ },
+ },
+ data() {
+ return {
+ warning: 72,
+ shutdown: 3150,
+ fields: [
+ {
+ key: 'name',
+ label: this.$t('pageFans.table.name'),
+ },
+ {
+ key: 'current',
+ label: this.$t('pageFans.table.current'),
+ },
+ {
+ key: 'middle',
+ label: this.$t('pageFans.table.middle'),
+ },
+ {
+ key: 'min',
+ label: this.$t('pageFans.table.min'),
+ },
+ {
+ key: 'minDate',
+ label: this.$t('pageFans.table.minDate'),
+ },
+ {
+ key: 'max',
+ label: this.$t('pageFans.table.max'),
+ },
+ {
+ key: 'maxDate',
+ label: this.$t('pageFans.table.maxDate'),
+ },
+ ],
+ };
+ },
+
+ computed: {
+ items() {
+ return getItems(this.filteredSensors);
+ },
+
+ allSensors() {
+ return this.$store.getters['fan/fans'];
+ },
+
+ filteredSensors() {
+ return this.getFilteredTableData(this.allSensors, this.activeFilters);
+ },
+
+ colors() {
+ return this.$randomColor({
+ count: this.items?.length,
+ hue: 'random',
+ luminosity: 'random',
+ });
+ },
+ },
+
+ methods: {
+ onOpened(state) {
+ if (state) {
+ this.loadData();
+ }
+ },
+
+ loadData() {
+ let payload = null;
+ if (this.timeScale === 'hour') {
+ payload = { lastHour: true };
+ }
+
+ this.startLoader();
+ this.$store.dispatch('fan/getFansDynamic', payload).finally(() => {
+ this.endLoader();
+ });
+ },
+ },
+};
+</script>
diff --git a/src/views/_sila/Fans/Dynamic/FansDynamicPage.vue b/src/views/_sila/Fans/Dynamic/FansDynamicPage.vue
index c27f1cf5..4e128089 100644
--- a/src/views/_sila/Fans/Dynamic/FansDynamicPage.vue
+++ b/src/views/_sila/Fans/Dynamic/FansDynamicPage.vue
@@ -6,199 +6,32 @@
:time-scale="timeScale"
style="margin: -2rem -2rem 0 -2rem"
/>
- <div class="custom-divider" style="margin-top: 0">
- <b-button
- variant="collapse"
- class="d-flex flex-nowrap justify-content-start"
- >
- <img src="@/assets/images/_sila/collapsed/fan.svg" />
- {{ $t('pageFans.speed') }}
- </b-button>
- <b-row class="align-items-end p-4">
- <b-col xs="12" md="4" class="pt-2">
- <b-form-group :label="$t('pageFans.labels.warning')">
- <b-form-input
- v-model="fanSpeedWarninigInput"
- type="number"
- :min="0"
- :max="fanSpeedShutdownInput"
- >
- </b-form-input>
- </b-form-group>
- </b-col>
- <b-col xs="12" md="4" class="pt-2">
- <b-form-group :label="$t('pageFans.labels.shutdown')">
- <b-form-input
- v-model="fanSpeedShutdownInput"
- :min="fanSpeedWarninigInput"
- :max="4000"
- type="number"
- ></b-form-input>
- </b-form-group>
- </b-col>
- <b-col xs="12" md="4" class="pt-2">
- <b-button variant="primary" style="height: 35px">
- {{ 'Сохранить' }}
- </b-button>
- </b-col>
- </b-row>
- <b-col class="pl-4 pr-4">
- <chart
- type="fans"
- :colors="colors"
- :time-scale="timeScale"
- :data="filteredSensors"
- :warning="fanSpeedWarninig"
- :shutdown="fanSpeedShutdown"
- ></chart>
-
- <b-table
- v-if="items && items.length > 0"
- responsive="md"
- show-empty
- table-variant="accessory"
- hover
- :items="items"
- :fields="fields"
- :empty-text="$t('global.table.emptyMessage')"
- >
- <template #cell(name)="{ value, index }">
- <div
- class="item-color"
- :style="`background-color: ${colors[index]}`"
- ></div>
- {{ value }}
- </template>
- <template #cell(minDate)="{ value }">
- <span style="color: rgb(12, 28, 41)">
- {{ value.time }}
- </span>
- <span>
- {{ value.date }}
- </span>
- </template>
- <template #cell(maxDate)="{ value }">
- <span style="color: rgb(12, 28, 41)">
- {{ value.time }}
- </span>
- <span>
- {{ value.date }}
- </span>
- </template>
- </b-table>
- </b-col>
- </div>
+ <fan-speed :time-scale="timeScale"></fan-speed>
</b-container>
</template>
<script>
import PageTitle from '@/components/_sila/Global/PageTitle';
-import Chart from '@/components/_sila/Global/Chart';
import TableDatePicker from '@/components/_sila/Global/TableDatePicker';
import DataFormatterMixin from '@/components/_sila/Mixins/DataFormatterMixin';
import LoadingBarMixin from '@/components/_sila/Mixins/LoadingBarMixin';
import TableFilterMixin from '@/components/_sila/Mixins/TableFilterMixin';
-import { getItems } from '@/utilities/_sila/metricProperties';
+
+import FanSpeed from './FanSpeed';
export default {
- components: { PageTitle, Chart, TableDatePicker },
+ components: { FanSpeed, PageTitle, TableDatePicker },
mixins: [DataFormatterMixin, LoadingBarMixin, TableFilterMixin],
data() {
return {
- activeFilters: [],
timeScale: 'hour',
- fanSpeedWarninigInput: 2450,
- fanSpeedShutdownInput: 3150,
- fanSpeedWarninig: 2450,
- fanSpeedShutdown: 3150,
- fields: [
- {
- key: 'name',
- label: this.$t('pageFans.table.name'),
- },
- {
- key: 'current',
- label: this.$t('pageFans.table.current'),
- },
- {
- key: 'middle',
- label: this.$t('pageFans.table.middle'),
- },
- {
- key: 'min',
- label: this.$t('pageFans.table.min'),
- },
- {
- key: 'minDate',
- label: this.$t('pageFans.table.minDate'),
- },
- {
- key: 'max',
- label: this.$t('pageFans.table.max'),
- },
- {
- key: 'maxDate',
- label: this.$t('pageFans.table.maxDate'),
- },
- ],
- items: [],
};
},
- computed: {
- allSensors() {
- let sensors = this.$store.getters['fan/fans'];
- return sensors;
- },
-
- filteredSensors() {
- return this.getFilteredTableData(this.allSensors, this.activeFilters);
- },
-
- colors() {
- return this.$randomColor({
- count: this.items?.length,
- hue: 'random',
- luminosity: 'random',
- });
- },
- },
-
- watch: {
- filteredSensors(data) {
- this.items = getItems(data);
- },
- },
-
- created() {
- this.loadData('hour');
- },
-
methods: {
switchTimeScale(period) {
this.timeScale = period;
- this.loadData(period);
- },
-
- updateTemperature() {
- this.temperatureWarning = +this.temperatureWarningInput;
- this.temperatureNonNormal = +this.temperatureNonNormalInput;
- this.temperatureCritical = +this.temperatureCriticalInput;
- },
-
- loadData(period) {
- if (period === 'hour') {
- this.startLoader();
- this.$store.dispatch('fan/getFansDynamicHour').finally(() => {
- this.endLoader();
- });
- } else {
- this.startLoader();
- this.$store.dispatch('fan/getFansDynamic').finally(() => {
- this.endLoader();
- });
- }
},
},
};