<template>
    <div v-loading="loading" element-loading-text="数据加载中">
        <div v-show="view" >
            <el-form :inline="true" :model="formInline" class="demo-form-inline">
                <!-- <el-form-item>
                  <el-switch
                    v-if="this.quyunames != undefined"
                    class="tableScopeSwitch"
                    :active-value="2"
                    :inactive-value="1"
                    @change="handleStatusChange"
                    :active-text="quyuname"
                    :inactive-text="quyunames"
                    inactive-color="#007878"
                    active-color="#666666"
                    v-model="formData.monitorFlag"
                  >
                  </el-switch>
                </el-form-item> -->
                <!-- <div style="display: flex;justify-content: space-between;flex-grow:1;"> -->
                <el-form-item>
                    <timepicker ref="timelist" :interval="interval"></timepicker>
                    <!-- <el-button class="el-icon-d-arrow-right"  type="primary" round @click="timechange">时间选择</el-button> -->
                </el-form-item>
                <el-form-item>
                    <el-button @click="querfromdata" type="primary" icon="el-icon-search">查询</el-button>
                </el-form-item>
                <el-form-item v-show="falg1">
                    <el-button type="primary" :disabled="bxfalg" class="el-icon-download" @click="download">
                        波形文件
                    </el-button>
                </el-form-item>
                <el-form-item>
                    <el-button type="text" @click="closeHandle">
                        条件筛选
                        <i :class="!view3 ? 'el-icon-arrow-down' : 'el-icon-arrow-right'"></i>
                    </el-button>
                </el-form-item>
                <!-- </div> -->
                <!-- </div> -->
                <!-- <el-form-item style="margin-left:-2.6%">
                            
                             <el-button type="primary">波形下载</el-button>
                          </el-form-item> -->
            </el-form>
            <div class="container" id="container">
                <i @click="closeHandle" class="el-icon-circle-close coles"></i>
                <el-form :inline="true" :model="formData" label-width="90px" class="">
                    <!-- <div style="display: flex;"> -->
                    <el-form-item label="统计类型:">
                        <el-select
                            v-model="formData.statisticalType"
                            @change="changeclasss"
                            placeholder="请选择统计类型"
                            style="width: 100%"
                        >
                            <el-option
                                v-for="item in classificationData"
                                :key="item.id"
                                :label="item.name"
                                :value="{
                                    label: item.name,
                                    value: item.id,
                                    name: item.name,
                                    id: item.id,
                                    code: item.code,
                                    sort: item.sort
                                }"
                            ></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="区域选择:">
                        <el-select v-model="deptName" placeholder="请选择所属部门区域" style="width: 100%">
                            <el-option :value="deptIndex" style="height: auto">
                                <el-tree
                                    ref="tree"
                                    :data="treeData"
                                    node-key="id"
                                    accordion
                                    :default-expanded-keys="idArr"
                                    :props="defaultProps"
                                    @node-click="handleNodeClick"
                                >
                                    <span class="span-ellipsis" slot-scope="{ node, data }">
                                        <span :title="data.name">{{ data.name }}</span>
                                    </span>
                                </el-tree>
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="电压等级:">
                        <el-select
                            v-model="formData.scale"
                            multiple
                            collapse-tags
                            clearable
                            placeholder="请选择电压等级"
                            style="width: 100%"
                        >
                            <el-option
                                v-for="item in voltageleveloption"
                                :key="item.id"
                                :label="item.name"
                                :value="{
                                    label: item.name,
                                    value: item.id,
                                    code: item.code,
                                    name: item.name,
                                    id: item.id,
                                    sort: item.sort
                                }"
                            ></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="终端厂家:">
                        <el-select
                            v-model="formData.manufacturer"
                            multiple
                            collapse-tags
                            clearable
                            placeholder="请选择终端厂家"
                            style="width: 100%"
                        >
                            <el-option
                                v-for="item in terminaloption"
                                :key="item.id"
                                :label="item.name"
                                :value="{
                                    label: item.name,
                                    value: item.id,
                                    code: item.code,
                                    name: item.name,
                                    id: item.id,
                                    sort: item.sort
                                }"
                            ></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="干扰源类型:">
                        <el-select
                            v-model="formData.loadType"
                            multiple
                            collapse-tags
                            clearable
                            placeholder="请选择干扰源类型"
                            style="width: 100%"
                        >
                            <el-option
                                v-for="item in interfereoption"
                                :key="item.id"
                                :label="item.name"
                                :value="{
                                    label: item.name,
                                    value: item.id,
                                    code: item.code,
                                    name: item.name,
                                    id: item.id,
                                    sort: item.sort
                                }"
                            ></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="数据筛选:">
                        <el-input
                            style="width: 100%"
                            v-model="formData.searchValue"
                            clearable
                            placeholder="根据监测点，IP/MAC地址等信息查询"
                        ></el-input>
                    </el-form-item>
                </el-form>
            </div>
            <!-- <el-form :inline="true" class="demo-form-inline">
                       
                      </el-form> -->
            <el-row :gutter="20">
                <el-col :span="24">
                    <el-table
                        stripe
                        id="rebateSetTable"
                        ref="multipleTable"
                        highlight-current-row
                        height="calc(100vh - 170px)"
                        :data="tableData"
                        class="xshou"
                        header-cell-class-name="table_header"
                        @selection-change="handleSelectionChange"
                        border
                        @sort-change="sortchange"
                    >
                        <el-table-column align="center" type="selection" width="65"></el-table-column>
                        <!-- <el-table-column align="center" sortable  prop="sort"  label="序号"  width="120"  ></el-table-column> -->
                        <el-table-column
                            align="center"
                            sortable
                            prop="startTime"
                            label="暂降发生时刻"
                            :show-overflow-tooltip="true"
                            min-width="210"
                            fixed="left"
                            column-key="date"
                        ></el-table-column>
                        <el-table-column
                            sortable
                            align="center"
                            prop="lineName"
                            label="监测点名称"
                            :show-overflow-tooltip="true"
                            min-width="180"
                        ></el-table-column>
                        <el-table-column
                            sortable
                            align="center"
                            prop="gdName"
                            label="供电公司"
                            min-width="160"
                            :show-overflow-tooltip="true"
                        ></el-table-column>
                        <el-table-column
                            sortable
                            align="center"
                            prop="subName"
                            label="变电站"
                            :show-overflow-tooltip="true"
                            width="180"
                        ></el-table-column>
                        <el-table-column
                            sortable
                            align="center"
                            prop="ip"
                            label="网络参数"
                            min-width="180"
                        ></el-table-column>
                        <el-table-column
                            sortable
                            align="center"
                            prop="scale"
                            label="电压等级"
                            min-width="110"
                            :show-overflow-tooltip="true"
                        ></el-table-column>
                        <el-table-column
                            sortable
                            align="center"
                            prop="advanceType"
                            label="暂降类型"
                            min-width="120"
                        ></el-table-column>
                        <el-table-column
                            sortable
                            align="center"
                            prop="advanceReason"
                            label="暂降原因"
                            min-width="120"
                        ></el-table-column>
                        <el-table-column
                            sortable
                            align="center"
                            prop="eventType"
                            :formatter="formFilter"
                            label="暂态统计类型"
                            min-width="150"
                        ></el-table-column>
                        <el-table-column
                            align="center"
                            sortable
                            prop="featureAmplitude"
                            label="暂降幅值(%)"
                            fixed="right"
                            min-width="180"
                        >
                            <template slot-scope="scope">
                                <span>{{ (scope.row.featureAmplitude * 100).toFixed(2) }}</span>
                            </template>
                        </el-table-column>
                        <el-table-column
                            align="center"
                            sortable
                            prop="firstMs"
                            label="暂降深度(%)"
                            fixed="right"
                            width="180"
                            :show-overflow-tooltip="true"
                        >
                            <template slot-scope="scope">
                                <span v-if="(100 - scope.row.featureAmplitude * 100).toFixed(2) > 0">
                                    {{ (100 - scope.row.featureAmplitude * 100).toFixed(2) }}
                                </span>
                                <span v-if="(100 - scope.row.featureAmplitude * 100).toFixed(2) < 0">{{ '/' }}</span>
                            </template>
                        </el-table-column>
                        <el-table-column
                            align="center"
                            fixed="right"
                            sortable
                            prop="duration"
                            label="持续时间(s)"
                            width="150"
                        >
                            <!-- <template slot-scope="scope">
                              <span>{{ (scope.row.duration / 100).toFixed(2) }}</span>
                            </template> -->
                        </el-table-column>
                        <el-table-column align="center" prop="severity" label="严重度">
                            <template slot-scope="scope">
                                <span v-if="scope.row.severity > 0">{{ scope.row.severity.toFixed(2) }}</span>
                                <span v-if="scope.row.severity <= 0">{{ '/' }}</span>
                            </template>
                        </el-table-column>
                        <el-table-column align="center" fixed="right" label="操作" width="150">
                            <template slot-scope="scope">
                                <el-button
                                    v-if="scope.row.fileFlag == 0"
                                    type="primary"
                                    style="color: #000; background: #ccc !important"
                                    size="mini"
                                    icon="el-icon-share"
                                >
                                    暂无波形
                                </el-button>
                                <el-button
                                    v-if="scope.row.fileFlag == 1"
                                    @click="handleClicktransient(scope.row)"
                                    v-loading.fullscreen.lock="fullscreenLoading"
                                    type="primary"
                                    icon="el-icon-share"
                                    size="mini"
                                >
                                    波形分析
                                </el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                    <el-pagination
                        background
                        align="right"
                        class="mt10"
                        @size-change="changePageSize"
                        @current-change="changePageNum"
                        :current-page="pageData.pageNum"
                        :page-sizes="[20, 30, 50, 100, 200]"
                        :page-size="pageData.pageSize"
                        layout="total, sizes, prev, pager, next, jumper"
                        :total="pageData.total"
                    ></el-pagination>
                </el-col>
            </el-row>
        </div>
        <el-row>
            <el-row>
                <el-col :span="12">
                    <span v-if="view2" style="font-size: 14px; font-weight: ; line-height: 30px">值类型选择:</span>
                    <el-select v-if="view2" @change="changeView" v-model="value" placeholder="请选择值类型">
                        <el-option
                            v-for="item in options"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                        ></el-option>
                    </el-select>
                </el-col>
                <el-col :span="12">
                    <el-button
                        v-if="view2"
                        @click="backbxlb"
                        type="primary"
                        class="el-icon-refresh-right"
                        style="float: right"
                    >
                        返回
                    </el-button>
                </el-col>
            </el-row>
            <el-tabs v-if="view2" v-model="bxactiveName" @tab-click="bxhandleClick">
                <el-tab-pane label="瞬时波形" name="ssbx" :style="'height:' + bxecharts + ';overflow-y: scroll;'">
                    <shushiboxi
                        v-if="bxactiveName == 'ssbx' && showBoxi"
                        :value="value"
                        :boxoList="boxoList"
                        :wp="wp"
                    ></shushiboxi>
                </el-tab-pane>
                <el-tab-pane label="RMS波形" name="rmsbx" :style="'height:' + bxecharts + ';overflow-y: scroll;'">
                    <rmsboxi
                        v-if="bxactiveName == 'rmsbx' && showBoxi"
                        :value="value"
                        :boxoList="boxoList"
                        :wp="wp"
                    ></rmsboxi>
                </el-tab-pane>
            </el-tabs>
        </el-row>

        <el-dialog
            :close-on-click-modal="false"
            title="条件查询配置"
            :visible.sync="dialogVisible"
            width="30%"
            :before-close="handleClose"
        >
            <el-form :inline="true" :model="formInline" label-width="120px" class="demo-ruleForm">
                <el-form-item label="暂态幅值(%):">
                    <el-input v-model="formInline.ztfz1" placeholder="0" style="width: 160px"></el-input>
                    <span>幅值</span>
                    <el-input v-model="formInline.ztfz2" placeholder="200" style="width: 160px"></el-input>
                </el-form-item>
                <el-form-item label="暂态持续时间:">
                    <el-input v-model="formInline.cxsj1" placeholder="X毫秒" style="width: 160px"></el-input>
                    <span><时间<</span>
                    <el-input v-model="formInline.cxsj2" placeholder="X毫秒" style="width: 160px"></el-input>
                </el-form-item>
                <el-form-item label="事件严重度:">
                    <el-input v-model="formInline.yzd1" placeholder="正负数" style="width: 160px"></el-input>
                    <span><程度<</span>
                    <el-input v-model="formInline.yzd2" placeholder="正负数" style="width: 160px"></el-input>
                </el-form-item>
                <el-form-item label="触发类型:">
                    <el-select
                        v-model="formInline.trigger"
                        multiple
                        collapse-tags
                        style="width: 370px"
                        placeholder="请选择"
                    >
                        <el-option
                            v-for="item in triggeroptions"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                        ></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="是否存在波形:">
                    <el-select v-model="formInline.waveform" style="width: 370px" placeholder="请选择是否存在波形">
                        <el-option
                            v-for="item in waveformoptions"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value"
                        ></el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="dialogVisible = false">取 消</el-button>
                <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
            </span>
        </el-dialog>
    </div>
</template>
<script>
import { dicData } from '@/assets/commjs/dictypeData'
import api2 from '@/api/harmonic/harmonic'
import timepicker from '../../components/TimePicker/index4'
import api from '../../../api/integraliy/integraliy'
import rmsboxi from '@/views/cgy-components/echarts/rmsboxi'
import shushiboxi from '@/views/cgy-components/echarts/shushiboxi'

export default {
    name: 'transienteventlist',
    components: {
        timepicker,
        rmsboxi,
        shushiboxi
    },
    data() {
        return {
            value: 1,
            options: [
                {
                    value: 1,
                    label: '一次值'
                },
                {
                    value: 2,
                    label: '二次值'
                }
            ],
            wp: {},
            boxoList: {},
            bxecharts: null,
            quyuname: undefined,
            quyunames: undefined,
            bxactiveName: 'ssbx',
            dd: false,
            vh: null,
            showBoxi: true,
            view: true,
            view2: false,
            bxfalg: true,
            falg3: false,
            falg1: true,
            fullscreenLoading: false,
            asideheight: undefined,
            tableheight: undefined,
            dialogVisible: false,
            height: undefined,
            device: 1,
            input: '',
            formInline: {
                ztfz1: '',
                ztfz2: '',
                cxsj1: '',
                cxsj2: '',
                yzd1: '',
                yzd2: '',
                trigger: [],
                waveform: undefined
            },
            triggeroptions: [
                {
                    value: 1,
                    label: '其他'
                },
                {
                    value: 2,
                    label: '扰动'
                },
                {
                    value: 3,
                    label: '暂降'
                },
                {
                    value: 4,
                    label: '暂升'
                },
                {
                    value: 5,
                    label: '中断'
                },
                {
                    value: 6,
                    label: '录波'
                }
            ],
            waveformoptions: [
                {
                    value: 1,
                    label: '是'
                },
                {
                    value: 2,
                    label: '否'
                }
            ],
            falg: true,
            falg2: false,
            bxshuju: undefined,
            id: 1,
            title: '电网拓扑',
            xdata: [],
            ydata: [],
            classvalue: 0,
            activeName: 'tab1',
            panindexOptions: [],
            classificationData: [],
            terminal: [],
            terminaloption: [],
            date: [],
            row: undefined,
            pageData: {
                pageNum: 1,
                pageSize: 20,
                total: 0
            },
            loading: true,
            tableData: [],
            asideheight: undefined,
            timeValue: [],
            id: 1,
            copent: 0,
            classt: 'Power_Network',
            tablename: 'tab1',
            treeData: [],
            idArr: [],
            defaultProps: {
                children: 'children',
                label: 'name'
            },
            deptName: '',
            deptIndex: '',
            voltageleveloption: [],
            terminal: '',
            terminaloption: [],
            interfere: '',
            interfereoption: [],
            classificationData: [],
            dictypeData: undefined,
            deptIndex: '',
            formData: {
                //后面需要修改
                deptIndex: '',
                monitorFlag: 2,
                powerFlag: 2,
                loadType: [],
                manufacturer: [],
                searchBeginTime: '',
                searchEndTime: '',
                statisticalType: '',
                isType: 0,
                scale: [],
                serverName: '',
                searchValue: '',
                statFlag: true,
                sortName:'',
                orderBy:'',
                sortBy:''
            },
            tableheight: undefined,
            interval: 3,
            multipleSelection: [],
            lineIds: [],
            timeIds: [],
            EventStatislist: [],
            view3: false
        }
    },
    computed: {
        // 实时监听表格
        // tables: function() {
        //     const search = this.search
        //     if (search) {
        //         return this.tableData.filter(dataNews => {
        //             return Object.keys(dataNews).some(key => {
        //                 return String(dataNews[key]).toLowerCase().indexOf(search) > -1
        //             })
        //         })
        //     }
        //     return this.tableData
        // }
        vth() {
            return window.sessionStorage.getItem('appheight') - 95
        }
    },
    created() {
        let data = window.sessionStorage.getItem('sysData')
        let yudata = eval('(' + data + ')')
        let str = yudata.dataReport.split('，')
        this.quyuname = str[1]
        var info = window.sessionStorage.getItem('Info')
        info = eval('(' + info + ')')
        this.formData.deptIndex = info.deptId
        this.getAreaDept()
        this.getclassificationData()
        this.getVoltage()
        this.getManufacturer()
        this.getLoadType()
    },
    mounted() {
        this.setHeight()
        window.addEventListener('resize', this.setHeight)
        let data = window.sessionStorage.getItem('sysData')
        let yudata = eval('(' + data + ')')
        let str = yudata.dataReport.split('，')
        this.quyuname = str[0]
        this.quyunames = str[1]

      

        this.querfromdata()
      
    },
    beforeDestroy() {
        window.removeEventListener('resize', this.setHeight)
    },
    methods: {
        setHeight() {
            this.bxecharts = window.sessionStorage.getItem('appheight') - 80 + 'px'
            this.vh = window.sessionStorage.getItem('appheight') - 95 + 'px'

          
        },
        changeView() {
            this.showBoxi = false
            setTimeout(() => {
                this.showBoxi = true
            }, 0)
        },
        timechange() {
            this.dd = true
        },
        closeHandle() {
            if (this.view3) {
                this.view3 = false
            } else {
                this.view3 = true
            }
            //console.log('关闭和展开');
            const dom = document.getElementById('container')
            const closeDom = document.getElementsByClassName('close')[0]
            if (!dom.className.match(/(?:^|\s)expend(?!\S)/)) {
                dom.className = 'container expend'
            } else {
                dom.className = 'container close-container'
            }
        },
        // 数据过滤
        formFilter(row, column) {
            if (column.property == 'eventType') {
                let title = ''
                dicData('Event_Statis', []).forEach(item => {
                    if (item.id == row.eventType) {
                        title = item.name
                    }
                })
                return title
            }
        },
        multipleconditions() {
            this.formInline = {}
            this.dialogVisible = true
        },
        handleClose() {
            //
            this.dialogVisible = false
        },
        transientevent(data) {
            this.row = data
            this.falg = false
            this.falg1 = false
            this.falg3 = false
            this.falg2 = true
            alert('父组件单行列表触发方法' + this.row)
        },
        back() {
            this.falg2 = false
            this.falg = true
            this.falg1 = true
            this.falg3 = false
        },
        //里层波形tab标签页触发事件
        bxhandleClick(tab, event) {
            if (tab.name == 'ssbx') {
                this.bxactiveName = 'ssbx'
            } else if (tab.name == 'rmsbx') {
                this.bxactiveName = 'rmsbx'
            }
            //  console.log(tab, event);
        },
        //返回触发事件
        backbxlb() {
            this.view = true
            this.view2 = false
        },
        //部门绑定区域触发区域树节点
        handleNodeClick(data, node) {
            this.deptName = data.name
            this.deptId = data.id
            this.formData.deptIndex = data.id
        },
        //时间格式转化
        dateFormat(dateData1, dateData2) {
            var timearr = []
            var date = new Date(dateData1)
            var y = date.getFullYear()
            var m = date.getMonth() + 1
            m = m < 10 ? '0' + m : m
            var d = date.getDate()
            d = d < 10 ? '0' + d : d
            var h = date.getHours()
            h = h < 10 ? '0' + h : h
            var f = date.getMinutes()
            f = f < 10 ? '0' + f : f
            var s = date.getSeconds()
            s = s < 10 ? '0' + s : s
            this.formData.searchBeginTime = y + '-' + m + '-' + d
            timearr.push(this.formData.startTime)
            var date = new Date(dateData2)
            var y = date.getFullYear()
            var m = date.getMonth() + 1
            m = m < 10 ? '0' + m : m
            var d = date.getDate()
            d = d < 10 ? '0' + d : d
            var h = date.getHours()
            h = h < 10 ? '0' + h : h
            var f = date.getMinutes()
            f = f < 10 ? '0' + f : f
            var s = date.getSeconds()
            s = s < 10 ? '0' + s : s
            this.formData.searchEndTime = y + '-' + m + '-' + d
            timearr.push(this.formData.endTime)
            return timearr
        },
        queryData() {
            //this.closeHandle()
            this.loading = true
            //   this.dateFormat(this.timeValue[0], this.timeValue[1]);
            if (this.$refs.timelist.intervald == 3) {
                let timedate = this.$refs.timelist.timeValue[1]
                let timedate1 = timedate.split('-')

                if (timedate1[2] == '01' || timedate1[2] == '02' || timedate1[2] == '03') {
                    let strTime = this.$refs.timelist.timeValue[0]
                    let strTime1 = this.$refs.timelist.timeValue[1]
                    let str1 = strTime.split('-')
                    let str2 = strTime1.split('-')
                    var now = new Date()
                    let month = now.getMonth()
                    if (month == 0) {
                        month = 12
                        str1[0] = str1[0] - 1
                        str2[0] = str2[0] - 1
                    }
                    if (month < 10) {
                        month = '0' + month
                    }
                    this.formData.searchBeginTime = str1[0] + '-' + month + '-' + str1[2]
                    if (
                        month == 1 ||
                        month == 3 ||
                        month == 5 ||
                        month == 7 ||
                        month == 8 ||
                        month == 10 ||
                        month == 12
                    ) {
                        this.formData.searchEndTime = str2[0] + '-' + month + '-31'
                    } else {
                        this.formData.searchEndTime = str2[0] + '-' + month + '-30'
                    }
                } else {
                    this.formData.searchBeginTime = this.$refs.timelist.timeValue[0]
                    this.formData.searchEndTime = this.$refs.timelist.timeValue[1]
                }
            } else if (this.$refs.timelist.intervald == 4) {
                let timedate = this.$refs.timelist.timeValue[1]
                let timedate1 = timedate.split('-')
                if (timedate1[2] == '01' || timedate1[2] == '02' || timedate1[2] == '03') {
                    // 获取前七天的日期
                    var previousDates = []
                    for (var i = 6; i >= 0; i--) {
                        //var previousDate = new Date(currentDate);
                        let strTime = this.$refs.timelist.timeValue[0]
                        var currentDate = new Date(strTime)
                        let previousDate = new Date(Date.parse(strTime.replace(/-/g, '/')))
                        previousDate.setDate(currentDate.getDate() - i)
                        previousDates.push(previousDate)
                    }
                    // 格式化日期
                    var formattedDates = previousDates.map(function (date) {
                        var year = date.getFullYear()
                        var month = (date.getMonth() + 1).toString().padStart(2, '0')
                        var day = date.getDate().toString().padStart(2, '0')

                        let d = year + '-' + month + '-' + day
                        // console.log("+++++++++++",d)
                        // 输出前七天的日期数组
                        return d
                    })
                    this.formData.searchBeginTime = formattedDates[0]
                    this.formData.searchEndTime = formattedDates[formattedDates.length - 1]
                    //  console.log(formattedDates);
                } else {
                    this.formData.searchBeginTime = this.$refs.timelist.timeValue[0]
                    this.formData.searchEndTime = this.$refs.timelist.timeValue[1]
                }
            } else if (this.$refs.timelist.intervald == 5) {
                let timedate = this.$refs.timelist.timeValue[1]
                let timedate1 = timedate.split('-')
                if (timedate1[2] == '01' || timedate1[2] == '02' || timedate1[2] == '03') {
                    let strTime = this.$refs.timelist.timeValue[0]
                    let currentDate = new Date(Date.parse(strTime.replace(/-/g, '/')))
                    // console.log('当前日期（中国标准时间）：', currentDate);
                    //  console.log("++++",currentDate)

                    // 向前推一天
                    currentDate.setDate(currentDate.getDate() - 1)

                    // 格式化日期字符串
                    const formatDate = date => {
                        const year = date.getFullYear()
                        const month = String(date.getMonth() + 1).padStart(2, '0')
                        const day = String(date.getDate()).padStart(2, '0')
                        return `${year}-${month}-${day}`
                    }
                    let strTime2 = this.$refs.timelist.timeValue[1]
                    let currentDate2 = new Date(Date.parse(strTime2.replace(/-/g, '/')))
                    // console.log('当前日期（中国标准时间）：', currentDate);
                    //  console.log("++++",currentDate)

                    // 向前推一天
                    currentDate.setDate(currentDate.getDate() - 1)

                    // 格式化日期字符串
                    const formatDate2 = date => {
                        const year = date.getFullYear()
                        const month = String(date.getMonth() + 1).padStart(2, '0')
                        const day = String(date.getDate()).padStart(2, '0')
                        return `${year}-${month}-${day}`
                    }
                    // console.log('当前日期：', formatDate(new Date())); // 当前日期
                    //  console.log('向前推一天：', formatDate(currentDate)); // 一天前的日期
                    this.formData.searchBeginTime = formatDate(currentDate)
                    this.formData.searchEndTime = formatDate(currentDate2)
                } else {
                    this.formData.searchBeginTime = this.$refs.timelist.timeValue[0]
                    this.formData.searchEndTime = this.$refs.timelist.timeValue[1]
                }

                //let estr = this.$refs.fff.timeValue[1]
            } else {
                this.formData.searchBeginTime = this.$refs.timelist.timeValue[0]
                this.formData.searchEndTime = this.$refs.timelist.timeValue[1]
            }

            this.formData.pageSize = this.pageData.pageSize
            this.formData.pageNum = this.pageData.pageNum
            if (this.formData.searchValue !== '') {
                this.formData.pageNum = 1
            } else {
                this.formData.pageNum = this.pageData.pageNum
            }
            api2.getTransientData(this.formData).then(res => {
                if (res.code == 'A0000') {
                    this.pageData.total = res.data.total
                    let data = res.data.records
                    this.tableData = data
                    this.loading = false
                }
            })
        },
        //2次组件触发事件
        querfromdata() {
            //this.closeHandle()
            this.dd = false
            this.interval = this.$refs.timelist.intervald

            this.loading = true
            this.timeValue = this.$refs.timelist.timeValue
            this.formData.searchBeginTime = this.$refs.timelist.timeValue[0]
            this.formData.searchEndTime = this.$refs.timelist.timeValue[1]
            this.formData.pageSize = this.pageData.pageSize
            if (this.formData.searchValue !== '') {
                this.formData.pageNum = 1
            } else {
                this.formData.pageNum = this.pageData.pageNum
            }
            this.formData.pageNum = this.pageData.pageNum
            api2.getTransientData(this.formData).then(res => {
                if (res.code == 'A0000') {
                    if (res.data.total > 0 && res.data.records.length == 0) {
                        this.punmData()
                    } else {
                        this.pageData.total = res.data.total
                        let data = res.data.records
                        this.tableData = data
                        this.loading = false
                    }
                }
            })
        },
        punmData() {
            this.formData.pageNum = 1
            this.pageData.pageNum = 1
            this.dd = false
            this.interval = this.$refs.timelist.intervald
            this.loading = true
            this.timeValue = this.$refs.timelist.timeValue
            this.dateFormat(this.timeValue[0], this.timeValue[1])
            this.formData.pageSize = this.pageData.pageSize
            api2.getTransientData(this.formData).then(res => {
                if (res.code == 'A0000') {
                    this.pageData.total = res.data.total
                    let data = res.data.records
                    this.tableData = data
                    this.loading = false
                }
            })
        },
        changePageNum(data) {
            this.pageData.pageNum = data
            this.queryData()
        },
        changePageSize(data) {
            this.pageData.pageSize = data
            this.queryData()
        },
        //开关触发
        handleStatusChange(val) {
            this.formData.monitorFlag = val
            //this.fiveTreeData()
        },
        //获取区域
        getAreaDept() {
            api.getAreaDept().then(res => {
                if (res.code == 'A0000') {
                    var data = res.data
                    this.deptName = res.data[0].name
                    data.forEach(element => {
                        this.idArr.push(element.id)
                    })
                    this.treeData = data
                }
            })
        },
        //字典暂降指标类型
        getEventStatis() {
            var code = 'Event_Statis'
            this.EventStatislist = dicData(code, [])
            /// this.formData.scale = this.voltageleveloption
        },
        //字典获取数据电压等级
        getVoltage() {
            var code = 'Dev_Voltage_Stand'
            this.voltageleveloption = dicData(code, [])
            this.formData.scale = this.voltageleveloption
        },
        //字典获取数据终端厂家
        getManufacturer() {
            var code = 'Dev_Manufacturers'
            this.terminaloption = dicData(code, [])
            this.formData.manufacturer = this.terminaloption
        },
        //字典获取数据干扰源类型
        getLoadType() {
            var code = 'Interference_Source'
            this.interfereoption = dicData(code, [])
            this.formData.loadType = this.interfereoption
        },
        //获取统计类型
        getclassificationData() {
            var code = 'Statistical_Type'
            this.classificationData = dicData(code, ['Report_Type'])
            this.formData.statisticalType = this.classificationData[0]
        },
        //导出
        exportExcel() {},
        //排序触发
        sortchange({ column, field, order }) {
           /* console.log("ddddd"+column.property)
            //this.formData.sortName = column.property
            this.formData.sortBy = column.property == 'startTime' ? 'start_time' : column.property == 'featureAmplitude' ? 'feature_amplitude' : column.property == 'firstMs' ? 'first_ms': column.property == 'duration' ? 'duration':column.property
            console.log(this.formData.sortBy)
            this.formData.orderBy = order == 'descending' ? 'desc':order == 'ascending' ? 'asc':order
            this.punmData()*/
        },
        //切换统计类型
        changeclasss(val) {
            this.classt = val.code
        },

        //波形下载
        download() {
            let data = {
                lineId: this.lineIds
                // timeId: this.timeIds,
            }
            api.downloadWaveFile(data).then(response => {
                let blob = new Blob([response], { type: 'application/zip' })

                const url = window.URL.createObjectURL(blob)
                const link = document.createElement('a') // 创建a标签
                link.href = url
                link.download = '波形分析下载' // 设置下载的文件名
                document.body.appendChild(link)
                link.click() //执行下载
                document.body.removeChild(link) //释放标签
            })
        },
        //多选
        handleSelectionChange(val) {
            if (val.length > 0) {
                this.bxfalg = false
                this.falg3 = true
                //this.falg = false
                this.falg1 = true
            } else {
                this.bxfalg = true
                this.falg3 = true
                // this.falg = true
                this.falg1 = true
            }
            this.multipleSelection = []
            this.lineIds = []
            this.timeIds = []
            val.forEach(item => {
                this.lineIds.push(item.eventId)
                this.timeIds.push(item.startTime)
            })
            this.multipleSelection = val
        },
        //波形
        async handleClicktransient(row) {
            this.loading=true
            let data = {
                id: row.eventId,
                // id: '8e2d31762fc25e2918bf48f409b95c93',
                systemType: 0,
                type: 0
            }
            await api.getTransientAnalyseWave(data).then(res => {
                if (res != undefined) {
                    this.wp = res.data
                    this.boxoList = row
                    this.view = false
                    this.view2 = true
                }
            })
            this.loading=false

            // this.$refs.child.getRmsBoXinFenXi()
        }
    }
}
</script>
<style lang="less" scoped>
@import url('../../../styles/comStyle.less');

.xshou {
    cursor: pointer;
}

.container {
    /* margin: auto; */
    top: 0px;
    right: 0;
    width: 40%;
    height: 0px;
    z-index: 2000;
    position: absolute;
    background-color: #e4e7ebb9;
    overflow: auto;
    scroll-behavior: smooth;
    -radius: 20px;
}

/* 隐藏滚动条 */
::-webkit-scrollbar {
    display: block;
}

.expend {
    animation: expend ease 5s forwards;
}

.close-container {
    animation: no-expend ease 1s forwards;
}

@keyframes expend {
    from {
        top: 0px;
        height: auto;
    }
    to {
        height: auto;
        top: 0px;
    }
}

@keyframes no-expend {
    from {
        height: 20%;
        top: 0px;
    }
    to {
        top: 0px;
        height: 0px;
    }
}

.coles {
    position: absolute;
    right: 0;
    font-size: 20px;
    cursor: pointer;
}
</style>
<style lang="scss" scoped>
::v-deep.el-table__fixed {
    // 左固定列
    height: auto !important;
    bottom: 10px; // 改为自动高度后，设置与父容器的底部距离，高度会动态改变，值可以设置比滚动条的高度稍微大一些
    right: 10px !important;
}

::v-deep .el-table__fixed-right {
    // 右固定列
    height: auto !important;
    bottom: 10px; // 改为自动高度后，设置与父容器的底部距离，高度会动态改变，值可以设置比滚动条的高度稍微大一些
    margin-right: 8px;
}

::v-deep .el-table__fixed,
.el-table__fixed-right {
    height: calc(100% - 10px) !important;
}

::v-deep.el-table__fixed-body-wrapper {
    height: 100% !important;
}

::v-deep.el-table__fixed-body-wrapper .el-table__body {
    /*滚动条高度*/
    padding-bottom: 50px !important;
}

// ::v-deep .el-table.el-table--enable-row-hover .el-table__body tr:hover>td {
//     background: $themeColor-8 !important;
//     color: #fff !important;
// }

// ::v-deep .el-table--d .el-table__body tr.el-table__row--d.current-row td {
//     background-color: $themeColor !important;
//     color: #fff !important;
// }
</style>
