import {Component, Emit, Vue} from 'vue-property-decorator';
import template from "./manageRight.component.html"
import {lineChartData,lineChartData1} from "./chartData";
import TitleComponent from "@/components/title.component.vue"
import * as echarts from 'echarts';

import("@/assets/style/pageCommon.component.scss")


Component.registerHooks([
    'beforeRouteLeave',
]);
@Component({
    template,
    components: {
        TitleComponent,
    },
})
export default class ManageRightComponent extends Vue {
    //标题图片
    imgSrc = require("@/assets/icons/png/env/env-title-icon.png");
    //定时器
    timer: any = null;
    //折线图数据
    option: any = {}
    //折线图实例
    lineChart: any = {}
    //折线图2数据
    lineData1: any = {}
    //折线图实例
    lineChart1: any = {}
    //球数据
    public parkData = [{
        count:345,
        total:500

    },{
        count:400,
        total:500

    }]



    //获取图表实例
    getEcharts(e, type) {
        console.log(e,'e')
        console.log(type,'type')

        this[type] = e
        if (type === 'lineChart'){
            this.initLineData()
        }else{
            this.lineData1 = lineChartData1()
        }

    }

    //图表自适应
    resize() {
        setTimeout(() => {
            this.lineChart.resize();
            this.lineChart1.resize();
        }, 300)
    }

    timerForLineData: any = null;

    //自动切换line图表数据
    autoChangeLineData() {
        this.timerForLineData = setInterval(() => {
            this.lineChart?.clear()
            this.lineChart?.setOption(this.option)
            this.lineChart1?.clear()
            this.lineChart1?.setOption(this.lineData1)
        }, 5000)
    }

    //获取范围内随机数
    getRandomInt(min: number, max: number) {
        min = Math.ceil(min);
        max = Math.floor(max);
        return Math.floor(Math.random() * (max - min)) + min; //不含最大值，含最小值
    }

    mounted() {
        this.autoChangeLineData()
        window.addEventListener("resize", this.resize);
    }

    //初始化line图表
    initLineData() {
        this.option = lineChartData()
    }

    beforeDestroy() {
        clearInterval(this.timer)
        clearInterval(this.timerForLineData)
    }

    destroyed() {
        window.removeEventListener("resize", this.resize)
    }


}