<template>
    <div v-loading="loading">
        <div v-for="(item, index) in Data" :key="index" style="position: relative">
            <div :id="`boxr` + index">
                <div :id="`rmsp` + index" :style="`height:${vh};overflow: hidden;`">
                    <div class="bx" :id="`rms` + index" ref="fg"></div>
                </div>
            </div>
            <el-button
                style="position: absolute; right: 60px; top: 0px; z-index: 50"
                type="text"
                icon="el-icon-download"
                title="生成图片"
                @click="download(index)"
            >
                下载
            </el-button>
            <el-button
                style="position: absolute; right: 10px; top: 0px; z-index: 50"
                type="text"
                icon="el-icon-view"
                title="全屏查看"
                @click="fullscreen(index)"
            >
                全屏
            </el-button>
        </div>
        <transition name="draw">
            <div class="box" ref="box" id="box" @click="contract" v-show="box">
                <i class="box1"></i>
            </div>
        </transition>
        <transition name="draw">
            <div class="check" ref="check" id="check" v-show="check">
                <div style="margin: 10px 0px; font-size: 24px">
                    <span>发生时刻</span>
                    <i class="box2" @click="close"></i>
                </div>
                <el-checkbox-group v-model="checkList" :min="1" @change="changeFn">
                    <el-checkbox
                        v-for="(item, index) in boxData"
                        :key="index"
                        :label="item.startTime"
                        style="margin-top: 5px"
                    ></el-checkbox>
                </el-checkbox-group>
            </div>
        </transition>
    </div>
</template>
<script>
import { getMonitorEventAnalyseWave } from '@/api/monitoringpointStatistics/echart'
import html2canvas from 'html2canvas'
import $ from 'jquery'
export default {
    props: {
        value: {
            type: Number,
            default: 2
        },
        flag: {
            type: [String, Number, Boolean],
            default: 3
        },
        DColor: {
            type: Boolean,
            default: false
        },
        boxoList: {
            type: [Object, Array]
        },
        wpData: {
            type: [Object, Array]
        }
    },
    data() {
        return {
            zoom: '',
            loading: true,
            tabvalue: this.value,
            url: require('@/assets/point.png'),
            url2: require('@/assets/dw.png'),
            valA: 0,
            valB: 0,
            isOpen: false,
            check: false,
            box: true,
            time: '',
            checkList: [],
            type: '',
            severity: '',
            iphasic: '',
            eventValue: '',
            persistTime: '',
            lineName: '',
            subName: '',
            waveDatas: [],
            Data: '',
            ptpass: '',
            waveHeight: undefined,
            rmsHeight: undefined,
            $wave: undefined,
            $rms: undefined,
            color: '#006565',
            charts: {},
            wp: {},
            arrpoints: [],
            fz: '',
            titles: '',
            vh: null,
            vw: null,
            boxData: [],
            arrData: [],
            myChartes: []
        }
    },
    watch: {
        // value: function (a, b) {
        //   if (a == 2) {
        //     //alert(a)
        //     this.initWaves();
        //   } else {
        //     //alert(a)
        //     this.initWaves();
        //   }
        // },
    },
    created() {},
    mounted() {
        // this.$wave = $("#wave").eq(0);
        this.zoom = 1 / document.body.style.zoom

        this.setHeight()
        window.addEventListener('resize', this.setHeight)
        this.$nextTick(() => {
            this.Data = this.wpData
            this.boxData = this.boxoList
            this.boxData.forEach(item => {
                this.checkList.push(item.startTime)
                this.arrData.push(item.startTime)
            })
            this.Data.forEach((item, index) => {
                // console.log(item);
                this.$rms = $('#rms' + index).eq(0)
            })
            this.query()
        })
    },
    beforeDestroy() {
        window.removeEventListener('resize', this.setHeight)
    },
    methods: {
        setHeight() {
            if (this.flag == 1) {
                this.vh = (window.sessionStorage.getItem('appheight') - 200) / 2 + 'px'
            } else if (this.flag == 2) {
                this.vh = (window.sessionStorage.getItem('appheight') - 100) / 2 + 'px'
            } else {
                this.vh = (window.sessionStorage.getItem('appheight') - 160) / 2 + 'px'
            }
            this.vw = window.sessionStorage.getItem('appwidth') - 60 + 'px'
            this.zoom = 1 / document.body.style.zoom
            if (this.myChartes !== []) {
                this.myChartes.resize()
            }
        },
        contract() {
            this.box = false
            this.check = true
            // this.$refs["box"].style.width = 0;
            // this.$refs["check"].style.width = '200px';
            // document.querySelector('.check').style.display = 'block';
        },
        close() {
            this.box = true
            this.check = false
            // this.$refs["check"].style.width = 0;
            // this.$refs["box"].style.width = '50px';
            // document.querySelector('.check').style.display = 'none';
        },
        getArrDifference: function (arr1, arr2) {
            return arr1.concat(arr2).filter(function (value, i, arr) {
                return arr.indexOf(value) === arr.lastIndexOf(value)
            })
        },
        changeFn(val) {
            console.log(this.getArrDifference(val, this.arrData))
            let data = this.getArrDifference(val, this.arrData)
            let data1 = this.getArrDifference(data, this.arrData)
            if (val.length < 1) {
                this.$message({
                    showClose: true,
                    message: '请至少保留一个图表!!!',
                    type: 'warning'
                })
            } else {
                if (data.length != 0) {
                    for (let i = 0; i < data.length; i++) {
                        for (let j = 0; j < this.boxData.length; j++) {
                            if (data[i] == this.boxData[j].startTime) {
                                if (document.getElementById('boxr' + j).style.display != 'none') {
                                    document.getElementById('boxr' + j).style.display = 'none'
                                }
                            }
                        }
                    }
                }
                if (data1.length != 0) {
                    for (let i = 0; i < data1.length; i++) {
                        for (let j = 0; j < this.boxData.length; j++) {
                            if (data1[i] == this.boxData[j].startTime) {
                                if (document.getElementById('boxr' + j).style.display == 'none') {
                                    document.getElementById('boxr' + j).style.display = 'block'
                                }
                            }
                        }
                    }
                }
            }
        },
        download(index) {
            // 转换成canvas
            html2canvas(document.getElementById('boxr' + index), {
                scale: 2
            }).then(function (canvas) {
                // 创建a标签，实现下载
                var creatIMg = document.createElement('a')
                creatIMg.download = 'rms波形.png' // 设置下载的文件名，
                creatIMg.href = canvas.toDataURL() // 下载url
                creatIMg.click()
                creatIMg.remove() // 下载之后把创建的元素删除
            })
        },
        fullscreen(index) {
            document.getElementById('rms' + index).style.backgroundColor = 'white'
            let element = document.getElementById('rms' + index)
            element.webkitRequestFullScreen()
            // element.mozRequestFullScreen();
            // element.requestFullScreen();
        },
        query() {
            this.loading = true
            setTimeout(() => {
                console.log(this.Data)
                this.boxData = this.boxoList
                this.Data.forEach((item, index) => {
                    // console.log(item);
                    this.wp = item
                    this.initWaves(index)
                })
            }, 0)
        },
        //波形总体数据构造函数
        waveData(
            instantF,
            instantS,
            RMSF,
            RMSS,
            RMSFMinDetail,
            RMSSMinDetail,
            shunshiF,
            shunshiS,
            RMSFWave,
            RMSSWave,
            title,
            unit
        ) {
            /*瞬时一次值最大最小值*/
            this.instantF = instantF
            /*瞬时二次值最大最小值*/
            this.instantS = instantS
            /*RMS一次值最大最小值*/
            this.RMSF = RMSF
            /*RMS二次值最大最小值*/
            this.RMSS = RMSS
            /*RMS一次值最小值具体的X Y周的位置，已经具体的相别*/
            this.RMSFMinDetail = RMSFMinDetail
            /*RMS二次值最小值具体的X Y周的位置，已经具体的相别*/
            this.RMSSMinDetail = RMSSMinDetail
            /*瞬时值一次值3相详细数据*/
            this.shunshiF = shunshiF
            /*瞬时值二次值3相详细数据*/
            this.shunshiS = shunshiS
            /*RMS一次值3相详细数据*/
            this.RMSFWave = RMSFWave
            /*RMS二次值3相详细数据*/
            this.RMSSWave = RMSSWave
            /*三相名称*/
            this.title = title
            /*电压还是电流*/
            this.unit = unit
        },
        //根据后台查询的数据，清洗数据
        initWaves(index) {
            if (null != this.wp) {
                if (this.boxData[index].systemType == 'pms') {
                    this.titles =
                        ' 监测点：' +
                        this.boxData[index].measurementPointName +
                        ' 发生时刻：' +
                        this.boxData[index].startTime +
                        ' 持续时间：' +
                        this.boxData[index].duration +
                        's'
                } else {
                    this.titles =
                        ' 监测点：' +
                        this.boxData[index].lineName +
                        ' 发生时刻：' +
                        this.boxData[index].startTime +
                        ' 持续时间：' +
                        this.boxData[index].duration +
                        's'
                }

                // this.eventValue = this.boxoList.eventValue;
                // this.persistTime = this.boxoList.persistTime;
                // this.lineName = this.boxoList.lineName; //监测点名称：
                // this.isOpen = this.boxoList.openTri;
                // this.subName = this.boxoList.subName; //变电站名称：
                //首先根据标题的长度，计算出需要绘制几份图（常见的有1张或2张，后期如果出现双路电压电流，便是4张波形图），考虑到波形的相数，实际情况更复杂些
                //相的数量
                this.iphasic = this.wp.iphasic
                if (this.iphasic === 0) {
                    this.iphasic = 1
                }
                var picCounts = (this.wp.waveTitle.length - 1) / this.iphasic
                this.waveDatas = []
                //循环筛选需求的数据
                for (var i = 0; i < picCounts; i++) {
                    this.waveDatas.push(this.fliteWaveData(this.wp, i))
                }
                this.time = this.wp.time
                this.type = this.wp.waveType
                this.severity = this.wp.yzd
                //严重度为负，事件为暂升事件
                if (this.severity < 0) {
                    this.severity = '/'
                    this.type = '/'
                }
                this.initWave(this.waveDatas, this.time, this.type, this.severity, this.isOpen, index)
                this.resizeEchartMonth(index)
            } else {
                this.initWave(null, null, null, null, null, index)
                this.resizeEchartMonth(index)
            }
        },
        //获取横向一个波形的全部数据，包括瞬时波形的一次、二次值，RMS波形的一次、二次值，如果是电压的话，还需要计算出对应的最大最小值
        fliteWaveData(wp, step) {
            var shunData = wp.listWaveData
            var rmsData = wp.listRmsData
            // console.log(
            //   rmsData
            // );
            var pt = Number(wp.pt) / 1000
            var ct = Number(wp.ct)
            var titleList = wp.waveTitle
            //首先判断当前绘制的是电压还是电流
            var xishu = pt //默认电压，二次值转一次值乘以pt
            //三相名称
            var aTitle = '',
                bTitle = '',
                cTitle = '',
                unit = '电压'
            //RMS最小值横、纵坐标、相别名称
            var rmsvFirstX = 0,
                rmsvFirstY = 0,
                rmsvSecondX = 0,
                rmsvSecondY = 0,
                firstZhou = 'a',
                secondeZhou = 'a'
            //每个波形对应的最大最小值
            var ifmax, ifmin, ismax, ismin, rfmax, rfmin, rsmax, rsmin
            var shunshiFA = [],
                shunshiFB = [],
                shunshiFC = [],
                shunshiSA = [],
                shunshiSB = [],
                shunshiSC = [],
                rmsFA = [],
                rsmFB = [],
                rmsFC = [],
                rmsSA = [],
                rsmSB = [],
                rmsSC = []
            //给瞬时赋个初始值
            if (shunData.length > 0) {
                if (titleList[this.iphasic * step + 1].substring(0, 1) !== 'U') {
                    xishu = ct
                    unit = '电流'
                }
                for (var i = 1; i <= this.iphasic; i++) {
                    switch (i) {
                        case 1:
                            aTitle = titleList[this.iphasic * step + i].substring(1)
                            break
                        case 2:
                            bTitle = titleList[this.iphasic * step + i].substring(1)
                            break
                        case 3:
                            cTitle = titleList[this.iphasic * step + i].substring(1)
                            break
                    }
                }
                if (shunData[0][this.iphasic * step + 1] !== undefined) {
                    ifmax = shunData[0][this.iphasic * step + 1] * xishu
                    ifmin = shunData[0][this.iphasic * step + 1] * xishu
                    ismax = shunData[0][this.iphasic * step + 1]
                    ismin = shunData[0][this.iphasic * step + 1]
                }

                if (rmsData[0][this.iphasic * step + 1] !== undefined) {
                    rfmax = rmsData[0][this.iphasic * step + 1] * xishu
                    rfmin = rmsData[0][this.iphasic * step + 1] * xishu
                    rmsvFirstY = rmsData[0][this.iphasic * step + 1] * xishu
                    rmsvFirstX = rmsData[0][0]
                    rsmax = rmsData[0][this.iphasic * step + 1]
                    rsmin = rmsData[0][this.iphasic * step + 1]
                    rmsvSecondY = rmsData[0][this.iphasic * step + 1]
                    rmsvSecondX = rmsData[0][0]
                }
                //瞬时值--同时还需要获取出瞬时值的一次、二次的最大最小值
                for (var shun = 0; shun < shunData.length; shun++) {
                    if (shunData[shun][this.iphasic * step + 1] === undefined) {
                        break
                    }
                    //根据波形数据相的数量来筛选数据
                    switch (this.iphasic) {
                        case 1:
                            var shunFirstA = shunData[shun][this.iphasic * step + 1] * xishu
                            shunshiFA.push([shunData[shun][0], shunFirstA])
                            ifmax = ifmax > shunFirstA ? ifmax : shunFirstA
                            ifmin = ifmin < shunFirstA ? ifmin : shunFirstA

                            var shunSecondA = shunData[shun][this.iphasic * step + 1]
                            shunshiSA.push([shunData[shun][0], shunSecondA])
                            ismax = ismax > shunSecondA ? ismax : shunSecondA
                            ismin = ismin < shunSecondA ? ismin : shunSecondA
                            break
                        case 2:
                            var shunFirstA = shunData[shun][this.iphasic * step + 1] * xishu
                            var shunFirstB = shunData[shun][this.iphasic * step + 2] * xishu
                            shunshiFA.push([shunData[shun][0], shunFirstA])
                            shunshiFB.push([shunData[shun][0], shunFirstB])
                            ifmax = this.getMaxTwo(ifmax, shunFirstA, shunFirstB)
                            ifmin = this.getMinOpen(ifmin, shunFirstA, shunFirstB)

                            var shunSecondA = shunData[shun][this.iphasic * step + 1]
                            var shunSecondB = shunData[shun][this.iphasic * step + 2]
                            shunshiSA.push([shunData[shun][0], shunSecondA])
                            shunshiSB.push([shunData[shun][0], shunSecondB])
                            ismax = this.getMaxTwo(ismax, shunSecondA, shunSecondB)
                            ismin = this.getMinOpen(ismin, shunSecondA, shunSecondB)
                            break
                        case 3:
                            var shunFirstA = shunData[shun][this.iphasic * step + 1] * xishu

                            var shunFirstB = shunData[shun][this.iphasic * step + 2] * xishu
                            var shunFirstC = shunData[shun][this.iphasic * step + 3] * xishu
                            shunshiFA.push([shunData[shun][0], shunFirstA])
                            shunshiFB.push([shunData[shun][0], shunFirstB])
                            shunshiFC.push([shunData[shun][0], shunFirstC])
                            ifmax = this.getMax(ifmax, shunFirstA, shunFirstB, shunFirstC)
                            //如果接线方式是V
                            if (this.isOpen) {
                                ifmin = this.getMinOpen(ifmin, shunFirstA, shunFirstC)
                            } else {
                                ifmin = this.getMin(ifmin, shunFirstA, shunFirstB, shunFirstC)
                            }

                            var shunSecondA = shunData[shun][this.iphasic * step + 1]
                            var shunSecondB = shunData[shun][this.iphasic * step + 2]
                            var shunSecondC = shunData[shun][this.iphasic * step + 3]
                            shunshiSA.push([shunData[shun][0], shunSecondA])
                            shunshiSB.push([shunData[shun][0], shunSecondB])
                            shunshiSC.push([shunData[shun][0], shunSecondC])
                            ismax = this.getMax(ismax, shunSecondA, shunSecondB, shunSecondC)
                            //如果接线方式是V
                            if (this.isOpen) {
                                ismin = this.getMinOpen(ismin, shunSecondA, shunSecondC)
                            } else {
                                ismin = this.getMin(ismin, shunSecondA, shunSecondB, shunSecondC)
                            }
                            break
                    }
                }

                //RMS值--同时还需要获取出RMS值的一次、二次的最大最小值
                for (var rms = 0; rms < rmsData.length; rms++) {
                    if (rmsData[rms][this.iphasic * step + 1] === undefined) {
                        break
                    }
                    //根据波形数据相的数量来筛选数据
                    switch (this.iphasic) {
                        case 1:
                            var rmsFirstA = rmsData[rms][this.iphasic * step + 1] * xishu
                            rmsFA.push([rmsData[rms][0], rmsFirstA])
                            rfmax = rfmax > rmsFirstA ? rfmax : rmsFirstA
                            rfmin = rfmin < rmsFirstA ? rfmin : rmsFirstA
                            if (rfmin < rmsvFirstY) {
                                rmsvFirstY = rfmin
                                firstZhou = 'a'
                                rmsvFirstX = rmsData[rms][0]
                            }

                            var rmsSecondA = rmsData[rms][this.iphasic * step + 1]
                            rmsSA.push([rmsData[rms][0], rmsSecondA])
                            rsmax = rsmax > rmsSecondA ? rsmax : rmsSecondA
                            rsmin = rsmin < rmsSecondA ? rsmin : rmsSecondA
                            if (rsmin < rmsvSecondY) {
                                rmsvSecondY = rsmin
                                secondeZhou = 'a'
                                rmsvSecondX = rmsData[rms][0]
                            }
                            break
                        case 2:
                            var rmsFirstA = rmsData[rms][this.iphasic * step + 1] * xishu
                            var rmsFirstB = rmsData[rms][this.iphasic * step + 2] * xishu
                            rmsFA.push([rmsData[rms][0], rmsFirstA])
                            rsmFB.push([rmsData[rms][0], rmsFirstB])
                            rfmax = this.getMaxTwo(rfmax, rmsFirstA, rmsFirstB)
                            rfmin = this.getMinOpen(rfmin, rmsFirstA, rmsFirstB)
                            if (rfmin < rmsvFirstY) {
                                rmsvFirstY = rfmin
                                if (rfmin === rmsFirstA) {
                                    firstZhou = 'a'
                                } else if (rfmin === rmsFirstB) {
                                    firstZhou = 'b'
                                }
                                rmsvFirstX = rmsData[rms][0]
                            }

                            var rmsSecondA = rmsData[rms][this.iphasic * step + 1]
                            var rmsSecondB = rmsData[rms][this.iphasic * step + 2]
                            rmsSA.push([rmsData[rms][0], rmsSecondA])
                            rsmSB.push([rmsData[rms][0], rmsSecondB])
                            rsmax = this.getMaxTwo(rsmax, rmsSecondA, rmsSecondB)
                            rsmin = this.getMinOpen(rsmin, rmsSecondA, rmsSecondB)
                            if (rsmin < rmsvSecondY) {
                                rmsvSecondY = rsmin
                                if (rsmin === rmsSecondA) {
                                    secondeZhou = 'a'
                                } else if (rsmin === rmsSecondB) {
                                    secondeZhou = 'b'
                                }
                                rmsvSecondX = rmsData[rms][0]
                            }
                            break
                        case 3:
                            var rmsFirstA = rmsData[rms][this.iphasic * step + 1] * xishu
                            var rmsFirstB = rmsData[rms][this.iphasic * step + 2] * xishu
                            var rmsFirstC = rmsData[rms][this.iphasic * step + 3] * xishu
                            rmsFA.push([rmsData[rms][0], rmsFirstA])
                            rsmFB.push([rmsData[rms][0], rmsFirstB])
                            rmsFC.push([rmsData[rms][0], rmsFirstC])
                            rfmax = this.getMax(rfmax, rmsFirstA, rmsFirstB, rmsFirstC)
                            if (this.isOpen) {
                                rfmin = this.getMinOpen(rfmin, rmsFirstA, rmsFirstC)
                            } else {
                                rfmin = this.getMin(rfmin, rmsFirstA, rmsFirstB, rmsFirstC)
                            }
                            if (rfmin < rmsvFirstY) {
                                rmsvFirstY = rfmin
                                if (rfmin === rmsFirstA) {
                                    firstZhou = 'a'
                                } else if (rfmin === rmsFirstB) {
                                    firstZhou = 'b'
                                } else {
                                    firstZhou = 'c'
                                }
                                rmsvFirstX = rmsData[rms][0]
                            }

                            var rmsSecondA = rmsData[rms][this.iphasic * step + 1]
                            var rmsSecondB = rmsData[rms][this.iphasic * step + 2]
                            var rmsSecondC = rmsData[rms][this.iphasic * step + 3]
                            rmsSA.push([rmsData[rms][0], rmsSecondA])
                            rsmSB.push([rmsData[rms][0], rmsSecondB])
                            rmsSC.push([rmsData[rms][0], rmsSecondC])
                            rsmax = this.getMax(rsmax, rmsSecondA, rmsSecondB, rmsSecondC)
                            if (this.isOpen) {
                                rsmin = this.getMinOpen(rsmin, rmsSecondA, rmsSecondC)
                            } else {
                                rsmin = this.getMin(rsmin, rmsSecondA, rmsSecondB, rmsSecondC)
                            }
                            if (rsmin < rmsvSecondY) {
                                rmsvSecondY = rsmin
                                if (rsmin === rmsSecondA) {
                                    secondeZhou = 'a'
                                } else if (rsmin === rmsSecondB) {
                                    secondeZhou = 'b'
                                } else {
                                    secondeZhou = 'c'
                                }
                                rmsvSecondX = rmsData[rms][0]
                            }
                            break
                    }
                }
            }
            //瞬时一次值最大最小值
            var instantFAn = {}
            var instantSAn = {}
            //var color;

            var instantF = {}
            var instantS = {}
            var RMSF = {}
            var RMSS = {}
            var RMSFMinDetail = {}
            var RMSSMinDetail = {}
            var shunshiF = {}
            var shunshiS = {}
            var RMSFWave = {}
            var RMSSWave = {}
            var title = {}

            //三相名称
            title.aTitle = aTitle
            title.bTitle = bTitle
            title.cTitle = cTitle

            //电流还是电压
            title.unit = unit

            //每个波形对应的三相数据
            shunshiFA = shunshiFA.slice(0)
            shunshiFB = shunshiFB.slice(0)
            shunshiFC = shunshiFC.slice(0)
            rmsFA = rmsFA.slice(0)
            rsmFB = rsmFB.slice(0)
            rmsFC = rmsFC.slice(0)

            shunshiSA = shunshiSA.slice(0)
            shunshiSB = shunshiSB.slice(0)
            shunshiSC = shunshiSC.slice(0)
            rmsSA = rmsSA.slice(0)
            rsmSB = rsmSB.slice(0)
            rmsSC = rmsSC.slice(0)

            shunshiF.shunshiFA = shunshiFA
            shunshiF.shunshiFB = shunshiFB
            shunshiF.shunshiFC = shunshiFC

            shunshiS.shunshiSA = shunshiSA
            shunshiS.shunshiSB = shunshiSB
            shunshiS.shunshiSC = shunshiSC

            RMSFWave.rmsFA = rmsFA
            RMSFWave.rmsFB = rsmFB
            RMSFWave.rmsFC = rmsFC

            RMSSWave.rmsSA = rmsSA
            RMSSWave.rmsSB = rsmSB
            RMSSWave.rmsSC = rmsSC

            //赋值对应的最大最小值
            instantF.max = ifmax
            instantF.min = ifmin
            instantS.max = ismax
            instantS.min = ismin
            if (step === 0) {
                instantFAn.max = ifmax
                instantFAn.min = ifmin
                instantSAn.max = ismax
                instantSAn.min = ismin
            }
            RMSF.max = rfmax
            RMSF.min = rfmin
            RMSS.max = rsmax
            RMSS.min = rsmin
            //精确到小数位2位
            rmsvFirstY = rmsvFirstY
            rmsvSecondY = rmsvSecondY
            RMSFMinDetail.rmsvFirstX = rmsvFirstX
            RMSFMinDetail.rmsvFirstY = rmsvFirstY
            RMSFMinDetail.firstZhou = firstZhou

            RMSSMinDetail.rmsvSecondX = rmsvSecondX
            RMSSMinDetail.rmsvSecondY = rmsvSecondY
            RMSSMinDetail.secondeZhou = secondeZhou
            return new this.waveData(
                instantF,
                instantS,
                RMSF,
                RMSS,
                RMSFMinDetail,
                RMSSMinDetail,
                shunshiF,
                shunshiS,
                RMSFWave,
                RMSSWave,
                title,
                unit
            )
        },
        //开始画图
        initWave(waveDatas, time, type, severity, isOpen, index) {
            //清除之前增加的div
            // $("#wave ~ .bx").remove();
            $('#rms ~ .bx').remove()
            //设置暂降触发点的位置 一次值与二次值Y轴不同（不是计算出来的）
            var height = $(window).height() - 90
            var picHeight
            var show = true
            if (isOpen) {
                show = false
            }
            //var v = $("#interval").val();
            var isvisible = false
            var cu = [],
                rmscu = [],
                rmscm = [],
                title,
                unit,
                max,
                min
            var a = '',
                b = '',
                c = ''
            var adata = [],
                bdata = [],
                cdata = []
            var radata = [],
                rbdata = [],
                rcdata = []
            var rmsvX = 0,
                rmsvY = 0,
                zhou = 0
            // if (null == waveDatas || waveDatas.length === 1) {
            //   picHeight = height;
            // } else if (waveDatas.length > 1) {
            //   picHeight = height * 0.45;
            // }
            picHeight = this.vh
            //this.waveHeight = picHeight
            // this.waveHeight = picHeight
            this.rmsHeight = picHeight
            this.$rms.css('height', picHeight)
            this.$rms.css('width', this.vw)
            // this.rmsHeight = picHeight
            // $wave.css("height", picHeight);
            // $rms.css("height", picHeight);
            var colors = []
            if (null == waveDatas) {
                cu = []
                rmscu = []
                rmscm = []
                title = '该事件暂无波形图'
            } else if (waveDatas.length > 0) {
                title = this.titles

                if (Number(this.eventValue) <= 90) {
                    isvisible = true
                }
                switch (this.iphasic) {
                    case 1:
                        a = waveDatas[0].title.aTitle
                        if (this.value === 1) {
                            cu = [[0, waveDatas[0].instantF.min]]
                            rmscu = [[0, waveDatas[0].RMSF.min]]
                            rmscm = [[0, waveDatas[0].RMSF.max]]
                            max = waveDatas[0].instantF.max
                            min = waveDatas[0].instantF.min
                            adata = waveDatas[0].shunshiF.shunshiFA

                            radata = waveDatas[0].RMSFWave.rmsFA

                            rmsvX = waveDatas[0].RMSFMinDetail.rmsvFirstX
                            rmsvY = waveDatas[0].RMSFMinDetail.rmsvFirstY
                            zhou = waveDatas[0].RMSFMinDetail.firstZhou
                        } else {
                            cu = [[0, waveDatas[0].instantS.min]]
                            rmscu = [[0, waveDatas[0].RMSS.min]]
                            rmscm = [[0, waveDatas[0].RMSS.max]]
                            max = waveDatas[0].instantS.max
                            min = waveDatas[0].instantS.min
                            adata = waveDatas[0].shunshiS.shunshiSA

                            radata = waveDatas[0].RMSSWave.rmsSA

                            rmsvX = waveDatas[0].RMSSMinDetail.rmsvSecondX
                            rmsvY = waveDatas[0].RMSSMinDetail.rmsvSecondY
                            zhou = waveDatas[0].RMSSMinDetail.secondeZhou
                        }

                        colors.push('#FFCC00')
                        colors.push('#fff')
                        colors.push('#fff')
                        break
                    case 2:
                        a = waveDatas[0].title.aTitle
                        b = waveDatas[0].title.bTitle
                        if (this.value === 1) {
                            cu = [[0, waveDatas[0].instantF.min]]
                            rmscu = [[0, waveDatas[0].RMSF.min]]
                            rmscm = [[0, waveDatas[0].RMSF.max]]
                            max = waveDatas[0].instantF.max
                            min = waveDatas[0].instantF.min
                            adata = waveDatas[0].shunshiF.shunshiFA
                            bdata = waveDatas[0].shunshiF.shunshiFB

                            radata = waveDatas[0].RMSFWave.rmsFA
                            rbdata = waveDatas[0].RMSFWave.rmsFB

                            rmsvX = waveDatas[0].RMSFMinDetail.rmsvFirstX
                            rmsvY = waveDatas[0].RMSFMinDetail.rmsvFirstY
                            zhou = waveDatas[0].RMSFMinDetail.firstZhou
                        } else {
                            cu = [[0, waveDatas[0].instantS.min]]
                            rmscu = [[0, waveDatas[0].RMSS.min]]
                            rmscm = [[0, waveDatas[0].RMSS.max]]
                            max = waveDatas[0].instantS.max
                            min = waveDatas[0].instantS.min
                            adata = waveDatas[0].shunshiS.shunshiSA
                            bdata = waveDatas[0].shunshiS.shunshiSB

                            radata = waveDatas[0].RMSSWave.rmsSA
                            rbdata = waveDatas[0].RMSSWave.rmsSB

                            rmsvX = waveDatas[0].RMSSMinDetail.rmsvSecondX
                            rmsvY = waveDatas[0].RMSSMinDetail.rmsvSecondY
                            zhou = waveDatas[0].RMSSMinDetail.secondeZhou
                        }
                        colors.push('#FFCC00')
                        colors.push('#009900')
                        colors.push('#fff')
                        break
                    case 3:
                        a = waveDatas[0].title.aTitle
                        b = waveDatas[0].title.bTitle
                        c = waveDatas[0].title.cTitle
                        if (this.value === 1) {
                            cu = [[0, waveDatas[0].instantF.min]]
                            rmscu = [[0, waveDatas[0].RMSF.min]]
                            rmscm = [[0, waveDatas[0].RMSF.max]]
                            max = waveDatas[0].instantF.max
                            min = waveDatas[0].instantF.min
                            adata = waveDatas[0].shunshiF.shunshiFA
                            bdata = waveDatas[0].shunshiF.shunshiFB
                            cdata = waveDatas[0].shunshiF.shunshiFC
                            radata = waveDatas[0].RMSFWave.rmsFA
                            rbdata = waveDatas[0].RMSFWave.rmsFB
                            rcdata = waveDatas[0].RMSFWave.rmsFC
                            rmsvX = waveDatas[0].RMSFMinDetail.rmsvFirstX
                            rmsvY = waveDatas[0].RMSFMinDetail.rmsvFirstY
                            zhou = waveDatas[0].RMSFMinDetail.firstZhou
                        } else {
                            cu = [[0, waveDatas[0].instantS.min]]
                            rmscu = [[0, waveDatas[0].RMSS.min]]
                            rmscm = [[0, waveDatas[0].RMSS.max]]
                            max = waveDatas[0].instantS.max
                            min = waveDatas[0].instantS.min
                            adata = waveDatas[0].shunshiS.shunshiSA
                            bdata = waveDatas[0].shunshiS.shunshiSB
                            cdata = waveDatas[0].shunshiS.shunshiSC
                            radata = waveDatas[0].RMSSWave.rmsSA
                            rbdata = waveDatas[0].RMSSWave.rmsSB
                            rcdata = waveDatas[0].RMSSWave.rmsSC
                            rmsvX = waveDatas[0].RMSSMinDetail.rmsvSecondX
                            rmsvY = waveDatas[0].RMSSMinDetail.rmsvSecondY
                            zhou = waveDatas[0].RMSSMinDetail.secondeZhou
                        }
                        colors.push('#FFCC00')
                        colors.push('#009900')
                        colors.push('#CC0000')
                        break
                }
                if (waveDatas[0].unit === '电压') {
                    var xdata = this.wp.listRmsData[0][0]
                    if (this.value === 1) {
                        this.fz = [
                            this.wp.listRmsMinData[0][0],
                            ((this.wp.listRmsMinData[0][1] * Number(this.wp.pt)) / 1000).toFixed(2)
                        ]
                        //  (this.fz * Number(this.wp.pt)) / 1000;
                        unit = 'kV'
                    } else {
                        this.fz = [this.wp.listRmsMinData[0][0], this.wp.listRmsMinData[0][1]]
                        unit = 'V'
                    }
                } else {
                    unit = 'A'
                }
                //把剩余的DIV先拼接好
                // for (var step = 1; step < waveDatas.length; step++) {
                //   var rmsId = "rms" + step;
                //   var newDivRms = $(
                //     ` <div style="height:${
                //       this.vh
                //     };overflow: hidden;"><div class='bx' id='${rmsId}'  style="zoom:${
                //       this.zoom
                //     };transform:scale(${
                //       1 / this.zoom
                //     });transform-origin:0 0;"></div></div>`
                //   );
                //   newDivRms.insertAfter($("#rmsp"));
                //   $("#" + rmsId).css("height", picHeight);
                //   $("#" + rmsId).css("width", this.vw);
                // }
            } else {
                cu = []
                // rmscu = [];
                title = title =
                    ' 监测点：' + this.lineName + ' 发生时刻：' + this.time + ' 持续时间：' + this.persistTime + 's'
            }
            //绘制横向第一个波形图
            //绘制瞬时波形图
            // 绘制RMS波形图
            let _this = this
            const echarts = require('echarts')
            let wave = document.getElementById('rms' + index)
            _this.myChartes[index] = echarts.init(wave)
            // console.log("==========", radata);
            setTimeout(() => {
                wave.style.width = window.sessionStorage.getItem('boxr' + index) + 'px'
                wave.style.height = (window.sessionStorage.getItem('appheight') - 160) / 2 + 'px'
            }, 0)
            let echartsColor = JSON.parse(window.localStorage.echartsColor)
            _this.myChartes[index].clear()
            var option = {
                tooltip: {
                    top: '10px',
                    trigger: 'axis',
                    borderColor: 'grey',
                    formatter: function (params) {
                        var tips = ''
                        tips += '时刻:' + params[0].data[0] + '</br/>'

                        for (var i = 0; i < params.length; i++) {
                            if (params[i].seriesName != '暂降触发点') {
                                tips += params[i].seriesName + ':' + (params[i].value[1] - 0).toFixed(2) + '<br/>'
                            }
                        }
                        return tips
                    },
                    // axisPointer: {
                    //   type: "cross",
                    //   label: {

                    //     color: "#fff",
                    //      fontSize: '0.8rem',
                    //   },
                    // },
                    textStyle: {
                        color: '#fff',
                        fontStyle: 'normal',
                        opacity: 0.35,
                        fontSize: 14
                    },
                    backgroundColor: 'rgba(0,0,0,0.35)',
                    borderWidth: 0
                },
                title: {
                    left: 'center',
                    text: title,
                    subtitle: {
                        text: '电压',
                        align: 'left'
                    },
                    textStyle: {
                        fontSize: '0.8rem',
                        color: _this.DColor ? '#fff' : echartsColor.WordColor
                    }
                },
                legend: {
                    left: '70px',
                    top: '20',
                    verticalAlign: 'top',
                    enabled: true,
                    itemDistance: 5,
                    textStyle: {
                        fontSize: '0.6rem',
                        color: _this.DColor ? '#fff' : echartsColor.WordColor,
                        rich: {
                            a: {
                                verticalAlign: 'middle'
                            }
                        },

                        padding: [0, 0, 0, 0] //[上、右、下、左]
                    }
                },
                // toolbox: {
                //   show: step != 1 ? true : false,
                //   feature: {
                //     //restore: {},
                //     saveAsImage: {
                //       iconStyle: {
                //         borderColor: _this.DColor ? "#fff" : echartsColor.WordColor,
                //       },
                //     },
                //   },
                // },
                xAxis: {
                    type: 'value',
                    name: '时间',
                    min: _this.wp.listRmsData[0][0],
                    max: _this.wp.listRmsData[_this.wp.listRmsData.length - 1][0] + 1,
                    boundaryGap: false,
                    title: {
                        text: 'ms',
                        textStyle: {
                            fontSize: '0.6rem',
                            color: _this.DColor ? '#fff' : echartsColor.WordColor
                        },
                        enabled: true,
                        align: 'high'
                    },
                    nameTextStyle: {
                        fontSize: '0.6rem'
                    },
                    labels: {
                        formatter: function () {
                            return this.value
                        }
                    },
                    splitLine: {
                        show: false
                    },
                    axisTick: {
                        alignWithLabel: true
                    },
                    axisLine: {
                        lineStyle: {
                            color: _this.DColor ? '#fff' : echartsColor.thread
                        },
                        onZero: false //-----------重点
                    },
                    axisLabel: {
                        fontSize: '0.6rem',
                        color: _this.DColor ? '#fff' : echartsColor.WordColor,
                        // interval: 50,
                        formatter: function (value, index) {
                            if (_this.valA != (value - 0).toFixed(0)) {
                                _this.valA = (value - 0).toFixed(0)
                                return (value - 0).toFixed(0)
                            }
                        }
                        //rotate:39
                    }
                    // data: this.syncExtremes,
                },
                yAxis: {
                    type: 'value',
                    name: unit,
                    title: {
                        align: 'high',
                        offset: 0,
                        text: unit,
                        rotation: 0,
                        y: -10
                    },
                    max: rmscm[0][1] * 1.06,
                    min: rmscu[0][1] - rmscu[0][1] * 0.04,
                    boundaryGap: [0, '100%'],
                    showLastLabel: true,
                    // max: max.toFixed(2),
                    // min: min.toFixed(2),
                    opposite: false,
                    nameTextStyle: {
                        fontSize: '0.6rem',
                        color: _this.DColor ? '#fff' : echartsColor.WordColor
                    },
                    //minInterval: 1,
                    type: 'value',
                    axisLine: {
                        show: true,
                        lineStyle: {
                            color: _this.DColor ? '#fff' : echartsColor.thread
                        },
                        onZero: false //-----------重点
                    },
                    axisLabel: {
                        fontSize: '0.6rem',
                        color: _this.DColor ? '#fff' : echartsColor.WordColor,
                        formatter: function (value, index) {
                            return (value - 0).toFixed(2)
                        }
                    },
                    splitLine: {
                        lineStyle: {
                            // 使用深浅的间隔色
                            color: [_this.DColor ? '#fff' : echartsColor.thread],
                            type: 'dashed',
                            opacity: 0.5
                        }
                    }
                },
                grid: {
                    left: '1%',
                    right: '40px',
                    bottom: '40px',
                    top: '15%',
                    containLabel: true
                },
                dataZoom: [
                    {
                        type: 'inside',
                        height: 13,
                        start: 0,
                        bottom: '20px',
                        end: 100
                    },
                    {
                        start: 0,
                        height: 13,
                        bottom: '20px',
                        end: 100
                    }
                ],
                series: [
                    {
                        name: a,
                        type: 'line',
                        smooth: true,
                        symbol: 'none',
                        sampling: 'lttb',
                        itemStyle: {
                            color: '#FFCC00'
                        },
                        data: radata
                    },
                    {
                        name: b,
                        type: 'line',
                        smooth: true,
                        symbol: 'none',
                        sampling: 'lttb',
                        itemStyle: {
                            color: '#009900'
                        },
                        data: rbdata
                    },
                    {
                        name: c,
                        type: 'line',
                        smooth: true,
                        symbol: 'none',
                        sampling: 'lttb',
                        itemStyle: {
                            color: '#CC0000'
                        },
                        data: rcdata
                    },
                    {
                        name: '暂降触发点',
                        type: 'scatter',
                        symbol: 'image://' + this.url,
                        itemStyle: {
                            width: 18,
                            height: 18
                        },
                        data: rmscu
                    },
                    //   {
                    //     type: 'flags',
                    //     color: '#34c0e2',
                    //     name: '最小暂降幅值',
                    //     cursor: 'pointer',
                    //     visible: isvisible,
                    //     showInLegend: isvisible,
                    //     data: [{
                    //         x: rmsvX,
                    //         title: rmsvY
                    //     }],
                    //     onSeries: zhou,
                    //     shape: 'flag'
                    // }
                    {
                        name: '最小暂降幅值',
                        type: 'scatter',
                        symbol: 'image://' + this.url2,
                        itemStyle: {
                            width: 45,
                            height: 45
                        },
                        label: {
                            show: true,
                            position: [5, -20],
                            color: '#000',
                            fontSize: '14px',
                            fontWeight: 'bold',
                            borderType: 'solid',
                            borderWidth: 0.5,
                            backgroundColor: '#ffff',
                            borderColor: '#0099FF'
                        },
                        data: [this.fz]
                    }
                ]
            }
            _this.myChartes[index].setOption(option)
            window.echartsArr.push(_this.myChartes[index])
            _this.$erd.listenTo(_this.$refs.fg, element => {
                _this.$nextTick(() => {
                    //  domID1.style.width = document.getElementById("drag-dept-right").offsetWidth - 30 + "px",
                    ;(wave.style.width = document.getElementById('boxr' + index).offsetWidth - 0 + 'px'),
                        _this.myChartes[index].resize()
                    _this.loading = false
                })
            })
            //第一个波形图数据绘制完毕后，绘制后续的波形图
            // if (waveDatas !== null && waveDatas.length > 1) {
            //   var waveDatasTemp = waveDatas.slice(1);
            //   waveDatasTemp.reverse();
            //   for (var step = 0; step < waveDatasTemp.length; step++) {
            //     var waveDataTemp = waveDatasTemp[step];

            //     this.drawPics(waveDataTemp, picHeight, step, show, myChartes,rmscm,rmscu);
            //   }
            // }
        },
        resizeEchartMonth(index) {
            var elementResizeDetectorMaker = require('element-resize-detector')
            var erd = elementResizeDetectorMaker()
            erd.listenTo(document.getElementById('boxr' + index), element => {
                let domeId = document.getElementById('boxr' + index)
                let domeId2 = document.getElementById('rms' + index)
                domeId2.style.width = domeId.offsetWidth - 0 + 'px'
                // this.$nextTick(() => {
                if (this.myChartes[index] !== '') {
                    this.myChartes[index].resize()
                }
                // });
            })
        },
        //绘制剩余横向的波形图
        // drawPics(waveDataTemp, picHeight, step, show, myChartes1,rmscm,rmscu) {
        //   step = step + 1;
        //   //新建瞬时DIV和RMS波形DIV
        //   // var waveId = 'wave' + step;
        //   var rmsId = "rms" + step;
        //   // var v = $("#interval").val();
        //   var a = "",
        //     b = "",
        //     c = "";
        //   var max, min, unit;
        //   var adata = [],
        //     bdata = [],
        //     cdata = [];
        //   var radata = [],
        //     rbdata = [],
        //     rcdata = [];
        //   var colors = [];
        //   switch (this.iphasic) {
        //     case 1:
        //       a = waveDataTemp.title.aTitle;
        //       colors.push("yellow");
        //       colors.push("#fff");
        //       colors.push("#fff");
        //       break;
        //     case 2:
        //       a = waveDataTemp.title.aTitle;
        //       b = waveDataTemp.title.bTitle;
        //       colors.push("yellow");
        //       colors.push("green");
        //       colors.push("#fff");
        //       break;
        //     case 3:
        //       a = waveDataTemp.title.aTitle;
        //       b = waveDataTemp.title.bTitle;
        //       c = waveDataTemp.title.cTitle;
        //       colors.push("yellow");
        //       colors.push("green");
        //       colors.push("red");
        //       break;
        //   }

        //   if (this.value === 1) {
        //     max = waveDataTemp.instantF.max;
        //     min = waveDataTemp.instantF.min;
        //     adata = waveDataTemp.shunshiF.shunshiFA;
        //     bdata = waveDataTemp.shunshiF.shunshiFB;
        //     cdata = waveDataTemp.shunshiF.shunshiFC;
        //     radata = waveDataTemp.RMSFWave.rmsFA;
        //     rbdata = waveDataTemp.RMSFWave.rmsFB;
        //     rcdata = waveDataTemp.RMSFWave.rmsFC;
        //   } else {
        //     max = waveDataTemp.instantS.max;
        //     min = waveDataTemp.instantS.min;
        //     adata = waveDataTemp.shunshiS.shunshiSA;
        //     bdata = waveDataTemp.shunshiS.shunshiSB;
        //     cdata = waveDataTemp.shunshiS.shunshiSC;
        //     radata = waveDataTemp.RMSSWave.rmsSA;
        //     rbdata = waveDataTemp.RMSSWave.rmsSB;
        //     rcdata = waveDataTemp.RMSSWave.rmsSC;
        //   }
        //   if (waveDataTemp.unit === "电压") {
        //     if (this.value === 1) {
        //       unit = "kV";
        //     } else {
        //       unit = "V";
        //     }
        //   } else {
        //     unit = "A";
        //   }
        //   //绘制rms波形
        //   let _this = this;
        //   const echarts = require("echarts");
        //   var myChartes = echarts.init(document.getElementById(rmsId));
        //   let echartsColor = JSON.parse(window.localStorage.echartsColor);
        //   var option = {
        //     tooltip: {
        //       trigger: "axis",
        //       borderColor: "grey",
        //       backgroundColor: "#fff",
        //       style: {
        //         color: "#000",
        //         fontSize: "15px",
        //         padding: 10,
        //       },
        //       formatter: function (params) {
        //         // console.log(params)
        //         var tips = "";
        //         tips += "时刻:" + params[0].data[0] + "</br/>";

        //         for (var i = 0; i < params.length; i++) {
        //           if (params[i].seriesName != "暂降触发点") {
        //             tips +=
        //               params[i].seriesName + ":" + (params[i].value[1]-0).toFixed(2) + "<br/>";
        //           }
        //         }
        //         return tips;
        //       },
        //       // axisPointer: {
        //       //   type: "cross",
        //       //   label: {
        //       //     color: "#fff",
        //       //      fontSize: '0.8rem',
        //       //   },
        //       // },
        //       textStyle: {
        //         color: "#fff",
        //         fontStyle: "normal",
        //         opacity: 0.35,
        //         fontSize: 14,
        //       },
        //       backgroundColor: "rgba(0,0,0,0.35)",
        //       borderWidth: 0,
        //     },
        //     title: {
        //       left: "center",
        //       //text: title,
        //       textStyle: {
        //         fontSize: "0.8rem",
        //         color: _this.DColor ? "#fff" : echartsColor.WordColor,
        //       },
        //     },
        //     legend: {
        //       left: "70px",
        //       top: "20",
        //       verticalAlign: "top",
        //       enabled: true,
        //       itemDistance: 5,
        //       textStyle: {
        //         fontSize: "0.6rem",
        //         color: _this.DColor ? "#fff" : echartsColor.WordColor,
        //         rich: {
        //           a: {
        //             verticalAlign: "middle",
        //           },
        //         },

        //         padding: [0, 0, 0, 0], //[上、右、下、左]
        //       },
        //     },
        //     toolbox: {
        //       show: step != 1 ? true : false,
        //       feature: {
        //         //restore: {},
        //         saveAsImage: {
        //           iconStyle: {
        //             borderColor: _this.DColor ? "#fff" : echartsColor.WordColor,
        //           },
        //         },
        //       },
        //     },
        //     xAxis: {
        //       type: "value",
        //       name: "时间",
        //       min: _this.wp.listRmsData[0][0],
        //       max: _this.wp.listRmsData[_this.wp.listRmsData.length - 1][0] + 1,
        //       boundaryGap: false,
        //       title: {
        //         text: "ms",
        //         textStyle: {
        //           fontSize: "0.6rem",
        //           color: _this.DColor ? "#fff" : echartsColor.WordColor,
        //         },
        //         enabled: true,
        //         align: "high",
        //       },
        //       labels: {
        //         formatter: function () {
        //           return this.value;
        //         },
        //       },
        //       nameTextStyle: {
        //         fontSize: "0.6rem",
        //       },
        //       splitLine: {
        //         show: false,
        //       },
        //       axisTick: {
        //         alignWithLabel: true,
        //       },
        //       axisLine: {
        //         lineStyle: {
        //           color: _this.DColor ? "#fff" : echartsColor.thread,
        //         },
        //         onZero: false, //-----------重点
        //       },
        //       axisLabel: {
        //         fontSize: "0.6rem",
        //         color: _this.DColor ? "#fff" : echartsColor.WordColor,
        //         // interval: 50,
        //         formatter: function (value, index) {
        //           if (_this.valB != (value - 0).toFixed(0)) {
        //             _this.valB = (value - 0).toFixed(0);
        //             return (value - 0).toFixed(0);
        //           }
        //         },
        //         //rotate:39
        //       },
        //       // data: this.syncExtremes,
        //     },
        //     yAxis: {
        //       type: "value",
        //       name: unit,
        //       title: {
        //         align: "high",
        //         offset: 0,
        //         text: unit,
        //         rotation: 0,
        //         y: -10,
        //       },
        //       // max: rmscm[0][1] * 1.01,
        //       // min: rmscu[0][1] - rmscu[0][1] * 0.01,
        //       boundaryGap: [0, "100%"],
        //       showLastLabel: true,
        //       // max: max.toFixed(2),
        //       // min: min.toFixed(2),
        //       opposite: false,
        //       // axisLabel: {
        //       //   formatter: "{value}",
        //       // },
        //       nameTextStyle: {
        //         fontSize: "0.6rem",
        //         color: _this.DColor ? "#fff" : echartsColor.WordColor,
        //       },
        //       //minInterval: 1,
        //       type: "value",
        //       axisLine: {
        //         show: true,
        //         lineStyle: {
        //           color: _this.DColor ? "#fff" : echartsColor.thread,
        //         },
        //         onZero: false, //-----------重点
        //       },
        //       axisLabel: {
        //         fontSize: "0.6rem",
        //         color: _this.DColor ? "#fff" : echartsColor.WordColor,
        //         formatter: function (value, index) {
        //           return (value - 0).toFixed(2);
        //         },
        //       },
        //       splitLine: {
        //         lineStyle: {
        //           // 使用深浅的间隔色
        //           color: [_this.DColor ? "#fff" : echartsColor.thread],
        //           type: "dashed",
        //           opacity: 0.5,
        //         },
        //       },
        //     },
        //     grid: {
        //       left: "1%",
        //       right: "40px",
        //       bottom: "40px",
        //       top: "15%",
        //       containLabel: true,
        //     },
        //     dataZoom: [
        //       {
        //         type: "inside",
        //         height: 13,
        //         start: 0,
        //         bottom: "20px",
        //         end: 100,
        //       },
        //       {
        //         start: 0,
        //         height: 13,
        //         bottom: "20px",
        //         end: 100,
        //       },
        //     ],
        //     series: [
        //       {
        //         name: a,
        //         type: "line",
        //         smooth: true,
        //         symbol: "none",
        //         sampling: "lttb",
        //         itemStyle: {
        //           color: "#FFCC00",
        //         },
        //         data: radata,
        //       },
        //       {
        //         name: b,
        //         type: "line",
        //         smooth: true,
        //         symbol: "none",
        //         sampling: "lttb",
        //         itemStyle: {
        //           color: "#009900",
        //         },
        //         data: rbdata,
        //       },
        //       {
        //         name: c,
        //         type: "line",
        //         smooth: true,
        //         symbol: "none",
        //         sampling: "lttb",
        //         itemStyle: {
        //           color: "#CC0000",
        //         },
        //         data: rcdata,
        //       },
        //     ],
        //   };

        //   setTimeout(() => {
        //     myChartes.resize();
        //     this.loading = false;
        //   }, 500);
        //   echarts.connect([myChartes1, myChartes]);
        // },
        //根据多个值的比较返回其中最大值
        getMax(temp, tempA, tempB, tempC) {
            temp = temp > tempA ? temp : tempA
            temp = temp > tempB ? temp : tempB
            temp = temp > tempC ? temp : tempC
            return temp
        },
        //根据多个值的比较返回其中最大值
        getMaxTwo(temp, tempA, tempB) {
            temp = temp > tempA ? temp : tempA
            temp = temp > tempB ? temp : tempB
            return temp
        },
        //根据多个值的比较返回其中最小值
        getMin(temp, tempA, tempB, tempC) {
            temp = temp < tempA ? temp : tempA
            temp = temp < tempB ? temp : tempB
            temp = temp < tempC ? temp : tempC
            return temp
        },
        getMinOpen(temp, tempA, tempB) {
            temp = temp < tempA ? temp : tempA
            temp = temp < tempB ? temp : tempB
            return temp
        }
    }
}
</script>
<style lang="less" scoped>
@import url('../../../../styles/comStyle.less');
.box {
    background: #fbfbfb;
    border: 2px solid #e1e1e1;
    width: 50px;
    height: 50px;
    padding: 7px 4px 4px 6px;
    z-index: 99;
    position: fixed;
    top: 500px;
    right: 10px;
    transition: width 0.3s;
}
.check {
    background: #fbfbfb;
    border: 2px solid #e1e1e1;
    width: 200px;
    height: 300px;
    padding: 7px 4px 4px 6px;
    z-index: 99;
    position: fixed;
    top: 400px;
    right: 10px;
    transition: width 0.3s;
}
.box1 {
    display: block;
    height: 32px;
    opacity: 0.6;
    filter: alpha(opacity=60);
    text-indent: 100%;
    white-space: nowrap;
    width: 32px;
    background: url(../components/ml-open-demo.png) no-repeat left top;
    // position: fixed;
}
.box2 {
    display: inline-block;
    margin-left: 45px;
    height: 32px;
    opacity: 0.6;
    filter: alpha(opacity=60);
    text-indent: 100%;
    white-space: nowrap;
    width: 32px;
    background: url(../components/nav-close.png) no-repeat left top;
    // position: fixed;
}
.box1:hover {
    opacity: 1;
    cursor: pointer;
}
.box2:hover {
    opacity: 1;
    cursor: pointer;
}
::v-deep .el-checkbox {
    display: block;
}
.draw-enter-active,
.draw-leave-active {
    transition: all 0.5s ease;
}
.draw-enter, .draw-leave-to /* .fade-leave-active below version 2.1.8 */ {
    width: 0;
}
</style>
