import { fs, dialog } from '@tauri-apps/api';
import * as echarts from 'echarts';
import { invoke } from "@tauri-apps/api/tauri";
import { exit } from '@tauri-apps/api/process';





export default {
    async handlekeydown(event) {

        if (event.code == "Space") {
            //datatosave 保存
            console.log(this.datatosave)
            var data = this.datatosave;
            var xValues = []

            var yValues = []
            var lenthofdata = data.length
            for (var i = 0; i < lenthofdata; i++) {
                xValues.push(data[i][0]);
                yValues.push(data[i][1]);
            }

            var lenth = xValues.length;
            var strcsv = ""
            for (var i = 0; i < lenth; i++) {
                strcsv += xValues[i] + "," + yValues[i] + "\r\n";


            }
            await fs.writeFile(this.Pathtosave, strcsv);
            // fs.writeFileSync(this.Pathtosave, strcsv);
            this.nowNumber++;
            this.Pathtosave = this.pathofdir + "/" + this.Filename + this.nowNumber + ".csv";
            alert("保存" + this.Pathtosave + "成功")


        }
    },
    setwavelength(data) {

        this.option.xAxis.max = data.max;
        this.option.xAxis.min = data.min;

        const chartDom = this.$refs.chart;
        let chart = echarts.getInstanceByDom(chartDom);
        chart.setOption(this.option);
    },
    setplotname(params){
        this.option.series[0].name=params.up;
        this.option.legend.data[0]=params.up;
        if (typeof params.donw!="undefined")
        {
            this.option.series[1].name=params.donw;
            this.option.legend.data[1]=params.donw;
        }else{
            //如果大于1个数据 则删最后一个
            if (this.option.series.length>1)
            {
                this.option.series.pop();
                this.option.legend.data.pop();
            }

        }
      
        const chartDom = this.$refs.chart;
        let chart = echarts.getInstanceByDom(chartDom);
        chart.setOption(this.option);

    },
    plotGraph(data, index) {

        if (index>=1&&this.option.series.length < 2) {
            this.option.series.push({
                data: [], // 使用二维数组表示数据点的坐标
                type: 'line',
                name: 'DOWN',
                symbol: 'none', // 不显示数据点
                smooth: false, // 不使用平滑处理
                //step: 'start' // 设置 step 类型的起始位置
            });
        }


        this.option.series[index].data = data;
        

        const chartDom = this.$refs.chart;

        let chart = echarts.getInstanceByDom(chartDom);
        chart.setOption(this.option);
    },
    setprogressbar(message) {

        if (typeof message === 'undefined') return;
        if (typeof message === 'object') {
            if (typeof message.percent === 'undefined') message.percent = this.percent;
            if (typeof message.info === 'undefined') message.info = this.progressinfo;

            this.percent = message.percent;
            this.progressinfo = message.info;
        }

        let percent = this.percent;
        //如果percent >0 且小于100
        if (percent > 0 && percent < 100) {
            this.progressstate = true;
        } else {
            this.progressstate = false;
        }



    },
    initChart() {
        const chartDom = this.$refs.chart;
        // chartDom.style.width = '100%';
        // chartDom.style.height = '100%';
        let chart = echarts.init(chartDom,null,{renderer: 'svg'});


        this.option = {
            legend: {
                data: ['UP', 'DOWN'], // 图例名称
                show: true,// 显示图例
                selectedMode: 'multiple', // 图例的选择模式。默认开启图例开关，可选single，multiple
            },
            // ECharts 配置选项
            xAxis: {
                type: 'value',
                boundaryGap: false,// 显示连续的刻度
                min: 0,
                max: 1100,
                dataZoom: [
                    {
                        type: 'inside', // 内置数据区域缩放
                        start: 0, // 初始缩放范围的起始位置（0%）
                        end: 100 // 初始缩放范围的结束位置（100%）
                    }
                ],
                triggerEvent: true
            },
            animation: false,
            yAxis: {
                type: 'value',
                //min:0,
            },
            tooltip:{
                trigger:'axis',




            },
            axisPointer: {
                link: { xAxisIndex: 'all' },
                label: {
                    backgroundColor: '#777'
                }
            },
            grid: {
                left: '5%',
                right: '5%',
                bottom: '5%',
                top: '5%',

            },
            // visualMap: [
            //     {
            //         type: 'continuous',
            //     }
            // ],
            dataZoom: [
                {
                    type: 'slider', // 内置数据区域缩放，包括滚轮缩放
                    xAxisIndex: [0], // 对应 x 轴
                    filterMode: 'none' // 不过滤数据

                },
                {
                    type: 'slider', // 内置数据区域缩放，包括滚轮缩放
                    yAxisIndex: [0], // 对应 y 轴
                    filterMode: 'none', // 不过滤数据
                    //width :15

                }
            ],


            // legend: {
            //   data: ['曲线'], // 图例名称
            //   show: true ,// 显示图例
            //   //selectedMode: 'multiple', // 图例的选择模式。默认开启图例开关，可选single，multiple
            // },
            series: [
                {
                    data: [], // 使用二维数组表示数据点的坐标
                    type: 'line',
                    name: 'UP',
                    symbol: 'none', // 不显示数据点
                    smooth: false, // 不使用平滑处理
                   // step: 'start' // 设置 step 类型的起始位置
                },
                {
                    data: [], // 使用二维数组表示数据点的坐标
                    type: 'line',
                    name: 'DOWN',
                    symbol: 'none', // 不显示数据点
                    smooth: false, // 不使用平滑处理
                    //step: 'start' // 设置 step 类型的起始位置
                }
            ]
        };



        window.onresize=function () {
            chart.resize()
        }
        chart.setOption(this.option);
        chart.on('click', function (params) {
            console.log(params);
        });
        chart.on('legendselectchanged', function (params) {
            console.log(params);
        });

        chart.on('click', 'series.line', function (params) {
            console.log(params);
        });

        chart.on('mouseover', {seriesIndex: 1, name: 'xx'}, function (params) {
            console.log(params);
        });
        //this.echartresize()
    },
    echartresize(){
        console.log("resize")
        const chartDom = this.$refs.chart;
        let chart = echarts.getInstanceByDom(chartDom);
        chart.resize();
        let width=chartDom.clientWidth;
        if (width<800)
        {
            let option =this.option;
            option.grid.left="10%";
            chart.setOption(option);
        }else{
            let option =this.option;
            option.grid.left="5%";
            chart.setOption(option);
        }
    },


    GetSenSorInfo() {
        var Command = { command: "get_sensor_info" };
        let data = {
            data: Command.toString(),
            datatype: "json"
        }
        SerilPort.SendtoPort(data)
        console.log(SerilPort.ReadData(0x01));
    }

}