<template>
  <Chart :cdata="cdata" />
</template>

<script>
  import Chart from './Chart'
  import work from "@/api/work";
  export default {
    data () {
      return {
        cdata: {
          timer: null,
          legendItem: ['接入', '上报', '登簿'],
          color: [
            "#02D9FD",
            "#FF7962",
            "#F5C03D  "
          ],
          echartData: []
        }
      }
    },
    components: {
      Chart
    },
    created () {
      this.dataTrend()
      this.timer = setInterval(() => {
        this.dataTrend()
      }, 10000) // 10s
    },
    mounted () {
      window.addEventListener("resize", () => {
        this.dataTrend()
      });
    },
    methods: {
      async dataTrend () {
        try {
          let { result: res } = await work.dataTrend();
          this.cdata.echartData = [];
          this.cdata.echartData = res,
            this.cdata.echartData.reverse()
        } catch (error) {
          console.log(error);
        }
      },
    },
    destroyed () {
      clearInterval(this.timer)
    }
  }
</script>