import {
    mapState
} from "vuex";

export default {
    data() {
        return {
            option1: {
                title: {
                    text: "暂无数据",
                    show: true,
                    left: "center",
                    top: "center",
                },
                tooltip: {
                    //提示框，可以在全局也可以在
                    trigger: "item", //提示框的样式
                    formatter: "{b}: {c}",
                    color: "#000", //提示框的背景色
                    textStyle: {
                        //提示的字体样式
                        color: "#ffffff",
                    },
                    confine: true,
                },
                xAxis: {
                    name: this.xName,
                    type: "value",
                    // type: "category",
                    nameLocation: "center",
                    boundaryGap: false,
                    data: [],
                    axisTick: {
                        inside: true
                    },
                },
                yAxis: {
                    name: this.yName,
                    type: "value",
                    axisTick: {
                        inside: true
                    },
                    nameTextStyle: {
                        align: 'left'
                    },
                },
                series: [{
                    data: [],
                    type: "line",
                    smooth: false,
                    symbol: "circle",
                    symbolSize: 6,
                    lineStyle: {
                        normal: {
                            width: 1.5,
                            // color: this.themeColor,
                        },
                    },
                    itemStyle: {
                        normal: {
                            // color: this.themeColor,
                        },
                    },
                }, ],
                grid: {
                    top: "30px",
                    left: "30px",
                    right: "30px",
                    bottom: "10%",
                    containLabel: true,
                },
            },
        }
    },

    computed: {
        ...mapState(["themeColor"]),
    },

    methods: {
        isSorted(arr = []) {
            return arr.every((x, i) => i === 0 || +x > +arr[i - 1]);
        },
    },

    mounted() {
        this.charts = this.$echarts.init(document.getElementById(this.id));

        this.initStateList();

        this.$nextTick(() => {
            window.addEventListener("resize", () => {
                this.charts.resize();
            });
        });
    },

    destroyed() {
        this.charts.dispose();
    },
}