summaryrefslogtreecommitdiff
path: root/src/views/_sila/PowerSupplies/DynamicInfo/PowerTable.vue
diff options
context:
space:
mode:
Diffstat (limited to 'src/views/_sila/PowerSupplies/DynamicInfo/PowerTable.vue')
-rw-r--r--src/views/_sila/PowerSupplies/DynamicInfo/PowerTable.vue126
1 files changed, 126 insertions, 0 deletions
diff --git a/src/views/_sila/PowerSupplies/DynamicInfo/PowerTable.vue b/src/views/_sila/PowerSupplies/DynamicInfo/PowerTable.vue
new file mode 100644
index 00000000..4ccb8aac
--- /dev/null
+++ b/src/views/_sila/PowerSupplies/DynamicInfo/PowerTable.vue
@@ -0,0 +1,126 @@
+<template>
+ <div>
+ <highcharts :options="chartOptions.line" />
+ </div>
+</template>
+
+<script>
+import { setTime, Series, setCategories } from './helpers';
+import { Chart } from 'highcharts-vue';
+
+export default {
+ components: {
+ highcharts: Chart,
+ },
+ props: {
+ timeScale: {
+ type: String,
+ default: 'hour',
+ },
+ warning: {
+ type: Number,
+ default: 66,
+ },
+ shutdown: {
+ type: Number,
+ default: 88,
+ },
+ },
+ computed: {
+ chartOptions() {
+ return {
+ line: {
+ chart: {
+ type: 'line',
+ margin: [12, 50, 32, 60],
+ height: '320px',
+ },
+ title: null,
+ xAxis: {
+ categories: setTime(60, this.timeScale),
+ title: null,
+ labels: {
+ step: 6,
+ },
+ minorGridLineColor: '#1A3E5B1A',
+ },
+ yAxis: {
+ categories: setCategories(101, 'Вт'),
+ min: 0,
+ max: 100,
+ title: null,
+ minTickInterval: 25,
+ minorGridLineColor: '#1A3E5B1A',
+ plotLines: [
+ {
+ color: '#E11717',
+ dashStyle: 'solid',
+ value: this.warning,
+ zIndex: '1000',
+ width: 2,
+ label: {
+ text: 'Пороговое значения предупреждение',
+ align: 'right',
+ style: {
+ fontFamily: 'Inter',
+ fontSize: '12px',
+ fontStyle: 'normal',
+ fontWeight: '400',
+ lineHeight: '16px',
+ color: '#0C1C2999',
+ },
+ },
+ },
+ {
+ color: '#1A3E5B',
+ dashStyle: 'solid',
+ value: this.shutdown,
+ width: 2,
+ label: {
+ text: 'Пороговое значения отказ',
+ align: 'right',
+ style: {
+ fontFamily: 'Inter',
+ fontSize: '12px',
+ fontStyle: 'normal',
+ fontWeight: '400',
+ lineHeight: '16px',
+ color: '#0C1C2999',
+ },
+ },
+ },
+ ],
+ },
+ series: Series['power'].map((item) => ({
+ ...item,
+ marker: {
+ enabled: false,
+ },
+ })),
+ legend: {
+ enabled: false,
+ },
+ tooltip: {
+ enabled: false,
+ crosshairs: false,
+ },
+ plotOptions: {
+ series: {
+ showInLegend: true,
+ },
+ },
+ },
+ };
+ },
+ },
+};
+</script>
+<style lang="scss">
+.highcharts-credits {
+ display: none;
+}
+
+.highcharts-plot-line-label {
+ transform: translate(-15px, 0) !important;
+}
+</style>