From 6facd12596ec8b55bab4be04b473de65e1f22018 Mon Sep 17 00:00:00 2001
From: Maksim Zakharov <m.zakharov@IBS.RU>
Date: Tue, 24 May 2022 09:43:34 +0300
Subject: Add depend: highcarts. Pages: power, analytical motherboard, memory,
 fans, event logs, Fix styles, add global components.

---
 .../Fans/DynamicInformation/FansDynamicPage.vue    | 127 ++++
 .../Fans/DynamicInformation/FansDynamicTable.vue   | 126 ++++
 .../Fans/DynamicInformation/IndicatorsTable.vue    | 191 +++++
 src/views/Fans/DynamicInformation/helpers.js       | 820 +++++++++++++++++++++
 src/views/Fans/DynamicInformation/index.js         |   2 +
 5 files changed, 1266 insertions(+)
 create mode 100644 src/views/Fans/DynamicInformation/FansDynamicPage.vue
 create mode 100644 src/views/Fans/DynamicInformation/FansDynamicTable.vue
 create mode 100644 src/views/Fans/DynamicInformation/IndicatorsTable.vue
 create mode 100644 src/views/Fans/DynamicInformation/helpers.js
 create mode 100644 src/views/Fans/DynamicInformation/index.js

(limited to 'src/views/Fans/DynamicInformation')

diff --git a/src/views/Fans/DynamicInformation/FansDynamicPage.vue b/src/views/Fans/DynamicInformation/FansDynamicPage.vue
new file mode 100644
index 00000000..c56d2f83
--- /dev/null
+++ b/src/views/Fans/DynamicInformation/FansDynamicPage.vue
@@ -0,0 +1,127 @@
+<template>
+  <b-container
+    :style="{ display: 'flex', 'flex-direction': 'column' }"
+    fluid="xxl pt-0 m-0"
+  >
+    <page-title />
+    <div class="main-container">
+      <date-switch
+        :switch-time-scale="switchTimeScale"
+        :time-scale="timeScale"
+      />
+      <div class="speed-description">
+        <img src="@/assets/images/fans-page/fans-icon.svg" />
+        <span class="bold-16px">{{ $t('fansPage.speedDescription') }}</span>
+      </div>
+      <div class="limit-speed-container">
+        <div class="speed-limt">
+          <img src="@/assets/images/labels/warning.svg" />
+          <span class="semi-bold-12px">{{ $t('fansPage.speedWarhihg') }}</span>
+          <b-form-input
+            v-model="fanSpeedWarninigInput"
+            type="number"
+            :min="0"
+            :max="fanSpeedShutdownInput"
+            class="form-control medium-12px"
+          >
+          </b-form-input>
+        </div>
+        <div class="speed-limt">
+          <img src="@/assets/images/labels/shutdown.svg" />
+          <span class="semi-bold-12px">{{ $t('fansPage.speedShutdown') }}</span>
+          <b-form-input
+            v-model="fanSpeedShutdownInput"
+            :min="fanSpeedWarninigInput"
+            :max="4000"
+            type="number"
+            class="form-control medium-12px"
+          >
+          </b-form-input>
+        </div>
+        <b-button
+          class="save-button"
+          variant="primary"
+          @click="updateFansSpeed"
+        >
+          {{ $t('global.action.save') }}
+        </b-button>
+      </div>
+
+      <fans-dynamic-table
+        :speed-warninig="fanSpeedWarninig"
+        :speed-shutdown="fanSpeedShutdown"
+        :time-scale="timeScale"
+      />
+      <indicators-table />
+    </div>
+  </b-container>
+</template>
+
+<script>
+import PageTitle from '@/components/Global/PageTitle';
+import DateSwitch from '@/components/Global/SilaComponents/DateSwitch';
+import FansDynamicTable from './FansDynamicTable';
+import IndicatorsTable from './IndicatorsTable';
+
+export default {
+  components: { PageTitle, DateSwitch, FansDynamicTable, IndicatorsTable },
+  data() {
+    return {
+      timeScale: 'hour',
+      fanSpeedWarninigInput: 2450,
+      fanSpeedShutdownInput: 3150,
+      fanSpeedWarninig: 2450,
+      fanSpeedShutdown: 3150,
+    };
+  },
+  methods: {
+    switchTimeScale(period) {
+      this.timeScale = period;
+    },
+    updateFansSpeed() {
+      this.fanSpeedWarninig = +this.fanSpeedWarninigInput;
+      this.fanSpeedShutdown = +this.fanSpeedShutdownInput;
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.speed-description {
+  height: 56px;
+  padding-left: 36px;
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  border-bottom: 1px solid $faint-secondary-primary-10;
+}
+
+.limit-speed-container {
+  height: 85px;
+  padding: 0 0 10px 32px;
+  display: flex;
+  align-items: flex-end;
+  gap: 24px;
+}
+
+.speed-limt {
+  height: 60px;
+  max-width: 312px;
+  display: flex;
+  align-items: baseline;
+  flex-flow: row wrap;
+  gap: 8px;
+}
+
+.save-button {
+  width: 151px;
+  height: 36px;
+}
+
+.form-control {
+  height: 36px;
+}
+
+.main-container {
+  overflow: auto;
+}
+</style>
diff --git a/src/views/Fans/DynamicInformation/FansDynamicTable.vue b/src/views/Fans/DynamicInformation/FansDynamicTable.vue
new file mode 100644
index 00000000..b0818255
--- /dev/null
+++ b/src/views/Fans/DynamicInformation/FansDynamicTable.vue
@@ -0,0 +1,126 @@
+<template>
+  <div>
+    <highcharts :options="chartOptions.line" />
+  </div>
+</template>
+
+<script>
+import { setTime, Series, setSpeed } from './helpers';
+import { Chart } from 'highcharts-vue';
+
+export default {
+  components: {
+    highcharts: Chart,
+  },
+  props: {
+    timeScale: {
+      type: String,
+      default: 'hour',
+    },
+    speedWarninig: {
+      type: Number,
+      default: 2450,
+    },
+    speedShutdown: {
+      type: Number,
+      default: 3150,
+    },
+  },
+  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: setSpeed(4000),
+            min: 0,
+            title: null,
+            minRange: 4000,
+            minTickInterval: 1000,
+            minorGridLineColor: '#1A3E5B1A',
+            plotLines: [
+              {
+                color: '#E11717',
+                dashStyle: 'solid',
+                value: this.speedWarninig,
+                zIndex: '1000',
+                width: 2,
+                label: {
+                  text: 'Пороговое значения предупреждение',
+                  align: 'right',
+                  style: {
+                    fontFamily: 'Inter, sans-serif',
+                    fontSize: '12px',
+                    fontStyle: 'normal',
+                    fontWeight: '400',
+                    lineHeight: '16px',
+                    color: '#0C1C2999',
+                  },
+                },
+              },
+              {
+                color: '#1A3E5B',
+                dashStyle: 'solid',
+                value: this.speedShutdown,
+                width: 2,
+                label: {
+                  text: 'Пороговое значения отказ',
+                  align: 'right',
+                  style: {
+                    fontFamily: 'Inter, sans-serif',
+                    fontSize: '12px',
+                    fontStyle: 'normal',
+                    fontWeight: '400',
+                    lineHeight: '16px',
+                    color: '#0C1C2999',
+                  },
+                },
+              },
+            ],
+          },
+          series: Series[this.timeScale].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>
diff --git a/src/views/Fans/DynamicInformation/IndicatorsTable.vue b/src/views/Fans/DynamicInformation/IndicatorsTable.vue
new file mode 100644
index 00000000..de0823c0
--- /dev/null
+++ b/src/views/Fans/DynamicInformation/IndicatorsTable.vue
@@ -0,0 +1,191 @@
+<template>
+  <page-section class="bootstrap-table__section">
+    <span class="bold-12px__caps">
+      {{ $t('fansPage.valueIndicators') }}
+    </span>
+    <b-table
+      responsive="md"
+      class="bootstrap-fans-table bootstrap-fans-table__stripes"
+      :items="items"
+      :fields="fields"
+    >
+      <template #cell(name)="{ value, index }">
+        <div
+          class="fans-colors"
+          :style="`background-color: ${colors[index]}`"
+        ></div>
+        <span class="regular-12px tretiatry">
+          {{ value }}
+        </span>
+      </template>
+      <template #cell(minSpeedDate)="{ value }">
+        <span class="regular-12px">
+          {{ value.time }}
+        </span>
+        <span class="regular-12px tretiatry">
+          {{ value.date }}
+        </span>
+      </template>
+      <template #cell(maxSpeedDate)="{ value }">
+        <span class="regular-12px">
+          {{ value.time }}
+        </span>
+        <span class="regular-12px tretiatry">
+          {{ value.date }}
+        </span>
+      </template>
+    </b-table>
+  </page-section>
+</template>
+
+<script>
+import PageSection from '@/components/Global/PageSection';
+import { colors } from './helpers';
+
+export default {
+  components: { PageSection },
+  data() {
+    return {
+      colors,
+      fields: [
+        {
+          key: 'name',
+          label: 'Имя модуля',
+          formatter: this.dataFormatter,
+          thClass: 'bootstrap-fans-table__th medium-12px',
+          tdClass: 'bootstrap-fans-table__td light-12px',
+        },
+        {
+          key: 'currentSpeed',
+          label: 'Текущая',
+          formatter: this.dataFormatter,
+          thClass: 'bootstrap-fans-table__th medium-12px',
+          tdClass: 'bootstrap-fans-table__td light-12px',
+        },
+        {
+          key: 'middleSpeed',
+          label: 'Средняя',
+          formatter: this.dataFormatter,
+          thClass: 'bootstrap-fans-table__th medium-12px',
+          tdClass: 'bootstrap-fans-table__td light-12px',
+        },
+        {
+          key: 'minSpeed',
+          label: 'Минимальная',
+          formatter: this.dataFormatter,
+          thClass: 'bootstrap-fans-table__th medium-12px',
+          tdClass: 'bootstrap-fans-table__td light-12px',
+        },
+        {
+          key: 'minSpeedDate',
+          label: 'Дата минимальной',
+          formatter: this.dataFormatter,
+          thClass: 'bootstrap-fans-table__th medium-12px',
+          tdClass: 'bootstrap-fans-table__td light-12px',
+        },
+        {
+          key: 'maxSpeed',
+          label: 'Максимальная',
+          formatter: this.dataFormatter,
+          thClass: 'bootstrap-fans-table__th medium-12px',
+          tdClass: 'bootstrap-fans-table__td light-12px',
+        },
+        {
+          key: 'maxSpeedDate',
+          label: 'Дата максимальной',
+          formatter: this.dataFormatter,
+          thClass: 'bootstrap-fans-table__th medium-12px',
+          tdClass: 'bootstrap-fans-table__td light-12px',
+        },
+      ],
+      items: [
+        {
+          name: 'Вентилятор 1',
+          currentSpeed: 1900,
+          middleSpeed: 1200,
+          minSpeed: 950,
+          minSpeedDate: { time: '15:15', date: '11.11.2021' },
+          maxSpeed: 2100,
+          maxSpeedDate: { time: '10:26', date: '15.11.2021' },
+        },
+        {
+          name: 'Вентилятор 2',
+          currentSpeed: 1850,
+          middleSpeed: 1450,
+          minSpeed: 850,
+          minSpeedDate: { time: '15:45', date: '11.11.2021' },
+          maxSpeed: 2150,
+          maxSpeedDate: { time: '16:59', date: '16.11.2021' },
+        },
+        {
+          name: 'Вентилятор 3',
+          currentSpeed: 1870,
+          middleSpeed: 1450,
+          minSpeed: 1000,
+          minSpeedDate: { time: '15:23', date: '11.11.2021' },
+          maxSpeed: 2050,
+          maxSpeedDate: { time: '15:26', date: '15.11.2021' },
+        },
+        {
+          name: 'Вентилятор 4',
+          currentSpeed: 1790,
+          middleSpeed: 780,
+          minSpeed: 950,
+          minSpeedDate: { time: '16:45', date: '25.11.2021' },
+          maxSpeed: 1800,
+          maxSpeedDate: { time: '11:26', date: '16.11.2021' },
+        },
+        {
+          name: 'Вентилятор 5',
+          currentSpeed: 1950,
+          middleSpeed: 1260,
+          minSpeed: 880,
+          minSpeedDate: { time: '15:23', date: '11.11.2021' },
+          maxSpeed: 1950,
+          maxSpeedDate: { time: '15:26', date: '17.11.2021' },
+        },
+        {
+          name: 'Вентилятор 6',
+          currentSpeed: 1900,
+          middleSpeed: 1300,
+          minSpeed: 960,
+          minSpeedDate: { time: '16:45', date: '25.11.2021' },
+          maxSpeed: 2000,
+          maxSpeedDate: { time: '15:26', date: '15.11.2021' },
+        },
+      ],
+    };
+  },
+};
+</script>
+<style lang="scss">
+.bootstrap-fans-table__th {
+  background-color: transparent !important;
+  color: $text-primary !important;
+  border-top: none !important;
+  padding: 10px 5px !important;
+  border-bottom: 1px solid $faint-secondary-primary-10;
+}
+
+.bootstrap-fans-table__td {
+  padding: 5px !important;
+  border-top: none !important;
+}
+</style>
+
+<style lang="scss" scoped>
+.fans-colors {
+  display: inline-block;
+  width: 8px;
+  height: 8px;
+  border-radius: 2px;
+}
+.row {
+  align-items: center;
+  flex-wrap: nowrap;
+  justify-content: flex-end;
+}
+.medium-12px {
+  color: $text-primary !important;
+}
+</style>
diff --git a/src/views/Fans/DynamicInformation/helpers.js b/src/views/Fans/DynamicInformation/helpers.js
new file mode 100644
index 00000000..1268d34a
--- /dev/null
+++ b/src/views/Fans/DynamicInformation/helpers.js
@@ -0,0 +1,820 @@
+export const colors = [
+  '#CB32F1',
+  '#F18638',
+  '#139BB9',
+  '#E1AB17',
+  '#175AE1',
+  '#13B937',
+];
+
+export const Series = {
+  hour: [
+    {
+      name: 'Sean',
+      data: [
+        526,
+        526,
+        526,
+        526,
+        526,
+        1100,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        2100,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        1526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        1526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+      ],
+      color: '#CB32F1',
+    },
+    {
+      name: 'Ivan',
+      data: [
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        1315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        2200,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        1100,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        1600,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        1400,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+      ],
+      color: '#175AE1',
+    },
+    {
+      name: 'Brendan',
+      data: [
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        1359,
+        359,
+        359,
+        359,
+        359,
+        2000,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        2100,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        1400,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+      ],
+      color: '#B98D13',
+    },
+    {
+      name: 'Matteo',
+      data: [
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        1350,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        1590,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        1490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+      ],
+      color: '#13B937',
+    },
+    {
+      name: 'Joan',
+      data: [
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        1487,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        794,
+        467,
+        467,
+        467,
+        467,
+        467,
+        1924,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        1924,
+        467,
+        467,
+        794,
+        467,
+        467,
+        467,
+        467,
+        467,
+        1924,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        794,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+      ],
+      color: '#F18638',
+    },
+    {
+      name: 'Avinash',
+      data: [
+        410,
+        410,
+        410,
+        410,
+        1300,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        2110,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        1410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        1410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+      ],
+      color: '#139BB9',
+    },
+  ],
+  day: [
+    {
+      name: 'Sean',
+      data: [
+        526,
+        526,
+        526,
+        526,
+        626,
+        626,
+        626,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        726,
+        1026,
+        726,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+        1326,
+        1526,
+        1326,
+        526,
+        526,
+        526,
+        526,
+        526,
+        526,
+      ],
+      color: '#CB32F1',
+    },
+    {
+      name: 'Ivan',
+      data: [
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        815,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        1100,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        800,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        900,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        900,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+        315,
+      ],
+      color: '#175AE1',
+    },
+    {
+      name: 'Brendan',
+      data: [
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        1500,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        1500,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        500,
+        1200,
+        500,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+        359,
+      ],
+      color: '#B98D13',
+    },
+    {
+      name: 'Matteo',
+      data: [
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        950,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        890,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        990,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+        490,
+      ],
+      color: '#13B937',
+    },
+    {
+      name: 'Joan',
+      data: [
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        1087,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        794,
+        467,
+        467,
+        467,
+        467,
+        467,
+        1424,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        1424,
+        467,
+        467,
+        794,
+        467,
+        467,
+        467,
+        467,
+        467,
+        1224,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        794,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+        467,
+      ],
+      color: '#F18638',
+    },
+    {
+      name: 'Avinash',
+      data: [
+        410,
+        1410,
+        410,
+        410,
+        1300,
+        410,
+        410,
+        410,
+        410,
+        1410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        2110,
+        410,
+        410,
+        1410,
+        410,
+        410,
+        410,
+        410,
+        1410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        1410,
+        410,
+        410,
+        410,
+        410,
+        1410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        410,
+        1410,
+        410,
+        410,
+        410,
+        410,
+        1410,
+        410,
+        410,
+        410,
+        410,
+        1410,
+        410,
+        410,
+        410,
+        1410,
+        410,
+        410,
+      ],
+      color: '#139BB9',
+    },
+  ],
+};
+
+export const setTime = (count) => {
+  const arr = [...new Array(count)].map(() => '');
+  for (let i = 0; i < arr.length; i++) {
+    arr[i] = `15:${String(i).padStart(2, '0')}`;
+  }
+  return arr;
+};
+
+export const setSpeed = (count) => {
+  const arr = [...new Array(count)].map((i, k) => `${k}`);
+  return arr;
+};
diff --git a/src/views/Fans/DynamicInformation/index.js b/src/views/Fans/DynamicInformation/index.js
new file mode 100644
index 00000000..a3dadd5a
--- /dev/null
+++ b/src/views/Fans/DynamicInformation/index.js
@@ -0,0 +1,2 @@
+import FansDynamicPage from './FansDynamicPage.vue';
+export default FansDynamicPage;
-- 
cgit v1.2.3