1 files changed, 82 insertions, 0 deletions
diff --git a/src/views/_sila/SILA/AnalyticalPanel/PowerTable.vue b/src/views/_sila/SILA/AnalyticalPanel/PowerTable.vue
new file mode 100644
index 00000000..27bb4efa
--- /dev/null
+++ b/src/views/_sila/SILA/AnalyticalPanel/PowerTable.vue
@@ -0,0 +1,82 @@
+<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',
+    },
+  },
+  computed: {
+    chartOptions() {
+      return {
+        line: {
+          chart: {
+            type: 'areaspline',
+            margin: [12, 50, 32, 60],
+            height: '320px',
+          },
+          title: null,
+          xAxis: {
+            categories: setTime(6, this.timeScale),
+            title: null,
+            labels: {
+              step: 1,
+            },
+            minorGridLineColor: '#1A3E5B1A',
+          },
+          yAxis: {
+            categories: setCategories(2.5, 'A'),
+            min: 0,
+            max: 4,
+            title: null,
+            tickInterval: 1,
+            minorGridLineColor: '#1A3E5B1A',
+          },
+          series: Series['power'].map((item) => ({
+            ...item,
+            marker: {
+              enabled: false,
+            },
+          })),
+          legend: {
+            enabled: false,
+          },
+          tooltip: {
+            enabled: false,
+            crosshairs: false,
+          },
+          plotOptions: {
+            series: {
+              showInLegend: true,
+            },
+            areaspline: {
+              fillOpacity: 0,
+            },
+          },
+        },
+      };
+    },
+  },
+};
+</script>
+<style lang="scss">
+.highcharts-credits {
+  display: none;
+}
+
+.highcharts-plot-line-label {
+  transform: translate(-15px, 0) !important;
+}
+</style>