<template>
  <BarMulti
    :chartData="dataSource"
    xAxisPropType="strname"
    :propTypeArr="propTypeArr"
    height="40vh"
    :option="{
      yAxis: {
        name: '单位(m/min)',
      },
    }"
  />
  <MonitorTable columnsType="window_monitor" :dataSource="dataSource" design-scope="window-monitor" title="风窗监测" />
</template>

<script setup lang="ts">
  import BarMulti from '/@/components/chart/BarMulti.vue';
  import { onBeforeMount, computed } from 'vue';
  import MonitorTable from '../comment/MonitorTable.vue';
  import { initWebSocket, getRecordList, closeWebSocket } from '/@/hooks/web/useVentWebSocket';
  const dataSource = computed(() => {
    return [...getRecordList()].reverse() || [];
  });
  const propTypeArr = new Map([
    ['frontPresentValue', '前窗风速'],
    ['rearPresentValue', '后窗风速'],
  ]);
  onBeforeMount(() => {
    const sendVal = JSON.stringify({ pagetype: 'normal', devicetype: 'window', orgcode: '', ids: '', systemID: '' });
    initWebSocket(sendVal);
  });
</script>
<style scoped lang="scss"></style>
