<template>
    <el-container style="height: calc(100vh - 80px)" v-loading="konzhi" element-loading-text="拼命加载中">
        <el-main class="main">
            <el-row :gutter="20">
                <el-col :span="18">
                    <el-form :inline="true" class="demo-form-inline">
                        <el-form-item label="指标类型:">
                            <el-select
                                v-model="formData.statisticalType"
                                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>
                            <el-button type="primary" size="small" @click="tensort">排名前10监测点</el-button>
                        </el-form-item>
                        <el-form-item>
                            <timepicker
                                :id="id"
                                ref="fkf"
                                @querfromdata="querfromdata"
                                :interval="interval"
                                :name="name"
                                :path="path"
                            ></timepicker>
                        </el-form-item>
                    </el-form>
                </el-col>
            </el-row>
            <el-row :gutter="20">
                <el-col :span="24">
                    <el-row :gutter="10">
                        <el-col :span="12">
                            <span style="margin-left: 0%; font-weight: bold; font-size: 14px">超标占比描述:</span>

                            <el-tag style="background: #339966; color: #fff" size="mini">优</el-tag>
                            <span>:优秀<60%</span>
                            <el-tag style="background: #ffcc33; color: #fff" size="mini">良</el-tag>
                            <span>:60%良好<90%</span>
                            <el-tag style="background: #cc0000; color: #fff" size="mini">差</el-tag>
                            <span>:极差>90%</span>
                            <el-tag style="background: #999999; color: #fff" size="mini">无</el-tag>
                            <span>:无数据</span>
                            <div
                                style="
                                    overflow-y: auto;
                                    overflow-x: hidden;
                                    cursor: pointer;
                                    padding-top: 10px;
                                    height: calc(100vh - 140px);
                                    display: grid;
                                    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
                                    grid-template-rows: subgrid;
                                    grid-gap: 10px;
                                "
                            >
                                <div
                                    v-for="(item, index) in listcard"
                                    :key="index"
                                    class="box-card3"
                                    style="border-radius: 4px; overflow: hidden; min-height: 300px"
                                    :style="
                                        'background-image: linear-gradient(' +
                                        settings.themeColor +
                                        ',#ccc);color:#fff;opacity:0.8;'
                                    "
                                >
                                    <div
                                        slot="header"
                                        class="clearfix"
                                        :style="
                                            'background:' +
                                            settings.themeColor +
                                            ';padding:5px;cursor: pointer;'
                                        "
                                        @click="queryStation(item)"
                                    >
                                        <span
                                            style="
                                                line-height: 20px;
                                                color: #fff;
                                                font-weight: bold;
                                                float: right;
                                                font-size: 14px;
                                            "
                                        >
                                            {{ item.name }}
                                        </span>
                                        <el-tag
                                            v-if="item.data < 60 && item.data >= 0"
                                            style="
                                                line-height: 10px;
                                                padding: 5px;
                                                float: left;
                                                color: #fff;
                                                background: #339966;
                                            "
                                            type=""
                                            icon=""
                                            size="mini"
                                        >
                                            优
                                        </el-tag>
                                        <el-tag
                                            v-if="60 <= item.data && item.data < 90"
                                            style="
                                                line-height: 10px;
                                                padding: 5px;
                                                float: left;
                                                color: #fff;
                                                background: #ffcc33;
                                            "
                                            type=""
                                            icon=""
                                            size="mini"
                                        >
                                            良
                                        </el-tag>
                                        <el-tag
                                            v-if="90 <= item.data && item.data"
                                            style="
                                                line-height: 10px;
                                                padding: 5px;
                                                float: left;
                                                color: #fff;
                                                background: #cc0000;
                                            "
                                            type=""
                                            icon=""
                                            size="mini"
                                        >
                                            差
                                        </el-tag>
                                        <el-tag
                                            v-if="item.data == 3.14159"
                                            style="
                                                line-height: 10px;
                                                padding: 5px;
                                                float: left;
                                                color: #fff;
                                                background: #999999;
                                            "
                                            type=""
                                            icon=""
                                            size="mini"
                                        >
                                            无
                                        </el-tag>
                                    </div>
                                    <div style="height: calc(100% - 30px); overflow-y: auto; overflow-x: hidden">
                                        <el-col :span="12" v-for="(item1, index1) in item.children" :key="index1">
                                            <div
                                                style="height: 30px; margin-top: 5px; cursor: pointer"
                                                @click="queryline(item1.id, item1.pid, item1.name)"
                                            >
                                                <span
                                                    style="
                                                        line-height: 22px;
                                                        color: #000;
                                                        font-weight: bold;
                                                        margin-left: 2%;
                                                        font-size: 12px;
                                                    "
                                                >
                                                    <el-tooltip
                                                        class="item"
                                                        effect="dark"
                                                        :content="item1.name"
                                                        placement="top"
                                                    >
                                                        <span
                                                            size="mini"
                                                            type="text"
                                                            style="color: #000; font-weight: bold"
                                                        >
                                                            {{ item1.name.substr(0, 6) }}
                                                        </span>
                                                    </el-tooltip>
                                                </span>
                                                <el-tag
                                                    v-if="item1.data < 60 && item1.data >= 0"
                                                    style="float: left; color: #fff; background: #339966"
                                                    type=""
                                                    icon=""
                                                    size="mini"
                                                >
                                                    优
                                                </el-tag>
                                                <el-tag
                                                    v-if="60 <= item1.data && item1.data < 90"
                                                    style="float: left; color: #fff; background: #ffcc33"
                                                    type=""
                                                    icon=""
                                                    size="mini"
                                                >
                                                    良
                                                </el-tag>
                                                <el-tag
                                                    v-if="90 <= item1.data && item1.data"
                                                    style="float: left; color: #fff; background: #cc0000"
                                                    type=""
                                                    icon=""
                                                    size="mini"
                                                >
                                                    差
                                                </el-tag>
                                                <el-tag
                                                    v-if="item1.data == 3.14159"
                                                    style="float: left; color: #fff; background: #999999"
                                                    type=""
                                                    icon=""
                                                    size="mini"
                                                >
                                                    无
                                                </el-tag>
                                            </div>
                                        </el-col>
                                    </div>
                                </div>
                            </div>
                        </el-col>
                        <el-col :span="12">
                            <el-row>
                                <el-col :span="24">
                                    <harmonictjechart
                                        :title="title"
                                        :xdata="xdata1"
                                        :ydata="ydata1"
                                        ref="child"
                                    ></harmonictjechart>
                                </el-col>
                                <el-col :span="24">
                                    <el-table
                                        stripe
                                        :data="tableData"
                                        border
                                        height="calc(55vh - 127px)"
                                        class="xshou"
                                        header-cell-class-name="table_header"
                                        style="width: 100%"
                                    >
                                        <el-table-column align="center" prop="name" label="部门"></el-table-column>
                                        <el-table-column
                                            align="center"
                                            prop="onlineCount"
                                            label="在线监测点数"
                                        ></el-table-column>
                                        <el-table-column
                                            align="center"
                                            prop="overLineCount"
                                            label="超标监测点数"
                                        ></el-table-column>
                                        <el-table-column align="center" prop="averageOverDay" label="平均超标天数">
                                            <template slot-scope="scope">
                                                <span v-if="scope.row.averageOverDay == 3.14159">暂无数据</span>
                                                <span v-if="scope.row.averageOverDay !== 3.14159">
                                                    {{ scope.row.averageOverDay }}
                                                </span>
                                            </template>
                                        </el-table-column>
                                        <el-table-column align="center" prop="lineRatio" label="监测点超标占比(%)">
                                            <template slot-scope="scope">
                                                <span v-if="scope.row.lineRatio == 3.14159">暂无数据</span>
                                                <span v-if="scope.row.lineRatio !== 3.14159">
                                                    {{ scope.row.lineRatio.toFixed(2) }}
                                                </span>
                                            </template>
                                        </el-table-column>
                                    </el-table>
                                </el-col>
                            </el-row>
                        </el-col>
                    </el-row>
                    <!--变电站-->
                    <el-dialog
                        :close-on-click-modal="false"
                        :title="stationNmae + '详情'"
                        class="eldialot"
                        width="70%"
                        :visible.sync="dialogTableVisible"
                    >
                        <el-table
                            stripe
                            :data="stationData"
                            border
                            height="60vh"
                            v-loading="konzhi"
                            header-cell-class-name="table_header"
                            element-loading-text="拼命加载中"
                        >
                            <el-table-column
                                align="center"
                                prop="name"
                                label="名称"
                                width="280"
                                :show-overflow-tooltip="true"
                            ></el-table-column>
                            <el-table-column align="center" prop="onlineCount" label="在线监测点数">
                                <template slot-scope="scope">
                                    <span v-if="scope.row.onlineCount == 3.14159">暂无数据</span>
                                    <span v-if="scope.row.onlineCount !== 3.14159">{{ scope.row.onlineCount }}</span>
                                </template>
                            </el-table-column>
                            <el-table-column align="center" prop="overLineCount" label="超标监测点数">
                                <template slot-scope="scope">
                                    <span v-if="scope.row.overLineCount == 3.14159">暂无数据</span>
                                    <span v-if="scope.row.overLineCount !== 3.14159">
                                        {{ scope.row.overLineCount }}
                                    </span>
                                </template>
                            </el-table-column>
                            <el-table-column align="center" prop="averageOverDay" label="平均超标天数">
                                <template slot-scope="scope">
                                    <span v-if="scope.row.averageOverDay == 3.14159">暂无数据</span>
                                    <span v-if="scope.row.averageOverDay !== 3.14159">
                                        {{ scope.row.averageOverDay }}
                                    </span>
                                </template>
                            </el-table-column>
                            <el-table-column align="center" prop="lineRatio" label="超标占比(%)">
                                <template slot-scope="scope">
                                    <span v-if="scope.row.lineRatio == 3.14159">暂无数据</span>
                                    <span v-if="scope.row.lineRatio !== 3.14159">{{ scope.row.lineRatio }}</span>
                                </template>
                            </el-table-column>
                            <el-table-column align="center" prop="warningFreq" label="告警频次">
                                <template slot-scope="scope">
                                    <span v-if="scope.row.warningFreq == 3.14159">暂无数据</span>
                                    <span v-if="scope.row.warningFreq !== 3.14159">{{ scope.row.warningFreq }}</span>
                                </template>
                            </el-table-column>
                        </el-table>
                    </el-dialog>
                    <!--监测点-->
                    <el-dialog
                        :close-on-click-modal="false"
                        :title="lineName + '所属详情'"
                        class="eldialot"
                        width="70%"
                        :visible.sync="dialogTableVisible1"
                    >
                        <el-table
                            stripe
                            :data="lineData"
                            border
                            height="60vh"
                            header-cell-class-name="table_header"
                            v-loading="konzhi"
                            element-loading-text="拼命加载中"
                        >
                            <el-table-column
                                align="center"
                                prop="name"
                                label="名称"
                                :show-overflow-tooltip="true"
                            ></el-table-column>
                            <!-- <el-table-column align="center" prop="count" label="超限监测点数" ></el-table-column> -->
                            <el-table-column align="center" prop="overDays" label="超标天数"></el-table-column>
                            <el-table-column align="center" prop="" label="各指标超标次数">
                                <el-table-column align="center" prop="overThreeTimes" label="3次">
                                    <template slot-scope="scope">
                                        <span v-if="scope.row.overThreeTimes == 3.14159">暂无数据</span>
                                        <span v-if="scope.row.overThreeTimes !== 3.14159">
                                            {{ scope.row.overThreeTimes }}
                                        </span>
                                    </template>
                                </el-table-column>
                                <el-table-column align="center" prop="overFiveTimes" label="5次">
                                    <template slot-scope="scope">
                                        <span v-if="scope.row.overFiveTimes == 3.14159">暂无数据</span>
                                        <span v-if="scope.row.overFiveTimes !== 3.14159">
                                            {{ scope.row.overFiveTimes }}
                                        </span>
                                    </template>
                                </el-table-column>
                                <el-table-column align="center" prop="overSevenTimes" label="7次">
                                    <template slot-scope="scope">
                                        <span v-if="scope.row.overSevenTimes == 3.14159">暂无数据</span>
                                        <span v-if="scope.row.overSevenTimes !== 3.14159">
                                            {{ scope.row.overSevenTimes }}
                                        </span>
                                    </template>
                                </el-table-column>
                                <el-table-column align="center" prop="overElevenTimes" label="11次">
                                    <template slot-scope="scope">
                                        <span v-if="scope.row.overElevenTimes == 3.14159">暂无数据</span>
                                        <span v-if="scope.row.overElevenTimes !== 3.14159">
                                            {{ scope.row.overElevenTimes }}
                                        </span>
                                    </template>
                                </el-table-column>
                                <el-table-column align="center" prop="overThirteenTimes" label="13次">
                                    <template slot-scope="scope">
                                        <span v-if="scope.row.overThirteenTimes == 3.14159">暂无数据</span>
                                        <span v-if="scope.row.overThirteenTimes !== 3.14159">
                                            {{ scope.row.overThirteenTimes }}
                                        </span>
                                    </template>
                                </el-table-column>
                                <el-table-column align="center" prop="overTwentyThreeTimes" label="23次">
                                    <template slot-scope="scope">
                                        <span v-if="scope.row.overTwentyThreeTimes == 3.14159">暂无数据</span>
                                        <span v-if="scope.row.overTwentyThreeTimes !== 3.14159">
                                            {{ scope.row.overTwentyThreeTimes }}
                                        </span>
                                    </template>
                                </el-table-column>
                                <el-table-column align="center" prop="overTwentyFiveTimes" label="25次">
                                    <template slot-scope="scope">
                                        <span v-if="scope.row.overTwentyFiveTimes == 3.14159">暂无数据</span>
                                        <span v-if="scope.row.overTwentyFiveTimes !== 3.14159">
                                            {{ scope.row.overTwentyFiveTimes }}
                                        </span>
                                    </template>
                                </el-table-column>
                                <el-table-column align="center" prop="otherTimes" label="其他次">
                                    <template slot-scope="scope">
                                        <span v-if="scope.row.otherTimes == 3.14159">暂无数据</span>
                                        <span v-if="scope.row.otherTimes !== 3.14159">{{ scope.row.otherTimes }}</span>
                                    </template>
                                </el-table-column>
                            </el-table-column>
                        </el-table>
                    </el-dialog>
                    <!--排名前十监测点-->
                    <el-dialog
                        :close-on-click-modal="false"
                        title="排名前10的监测点"
                        class="eldialot"
                        width="70%"
                        :visible.sync="dialogTableVisible2"
                    >
                        <div id="tenline" :style="'width:100%;height:calc(100vh - 400px);zoom:' + device"></div>
                    </el-dialog>
                </el-col>
            </el-row>
        </el-main>
    </el-container>
</template>
<script>
import { mapActions } from 'vuex'
import defaultSettings from '@/settings'
import timepicker from '@/views/cgy-components/TimePicker/index4'
import harmonictjechart from '@/views/cgy-components/echarts/harmonictjechart'
import { dicData } from '../../../assets/commjs/dictypeData'
import api from '@/api/harmonic/harmonic'

export default {
    components: {
        timepicker,
        harmonictjechart
    },
    watch: {},
    computed: {
        settings() {
            return this.$store.state.settings
        },
        ...mapActions({
            changeSetting: 'settings/changeSetting'
        })
    },
    data() {
        return {
            tenheight: undefined,
            h: undefined,
            vh: null,
            konzhi: true,
            zdname: '',
            stationData: [],
            lineData: [],
            tenlineData: [],
            tableheight: undefined,
            echartsheight: undefined,
            dialogTableVisible: false,
            dialogTableVisible1: false,
            dialogTableVisible2: false,
            interval: 3,
            path: '/harmonic-boot/qydetailedAnalysis/pollutionqy',
            name: 'wtzhpg',
            asideheight: undefined,
            rightheight: undefined,
            changeName: '谐波电压',
            voltage: 0,
            voltageoption: [],
            classvalue: 0,
            fanwei: 0,
            fanweioption: [],
            copent: 0,
            copentoption: [],
            id: 1,
            title: '部门',
            activeName: 'tab1',
            classificationData: [],
            flag: false,
            stationNmae: '',
            lineName: '',
            formData: {
                deptIndex: '',
                id: '',
                monitorFlag: 2,
                powerFlag: 2,
                searchBeginTime: '',
                searchEndTime: '',
                statisticalType: []
            },
            device: 1,
            listcard: [],
            tableData: [],
            xdata: [],
            ydata: [],
            xdata1: [],
            ydata1: [],
            tre: null
        }
    },
    created() {
        var data = window.sessionStorage.getItem('Info')
        data = eval('(' + data + ')')
        this.formData.deptIndex = data.deptId
        this.getIndexType()
    },
    mounted() {
        this.vh = window.sessionStorage.getItem('appheight') - 50 + 'px'
        this.device = window.devicePixelRatio
    },
    methods: {
        guanzhou() {
            var data = {
                token: this.$route.query.token
            }
            api.guanzhou(data).then(res => {
                if (res.code == 'A0000') {
                    return
                } else {
                    this.$router.push('/error/massege/403')
                }
            })
            data = null
        },
        //获取指标类型
        //字典获取数据指标类型
        getIndexType() {
            var code = 'Indicator_Type'
            this.classificationData = dicData(code, ['PLPC', 'DYPC', 'SXDYBPHD', 'CSSB', 'FXDL', 'JXBDY'])
            this.formData.statisticalType = this.classificationData[0]
            code = null
        },
        //变电站详情
        queryStation(i) {
            this.stationData = []
            this.formData.deptIndex = i.id
            this.stationNmae = i.name
            this.flag = true
            this.dialogTableVisible = true
            this.konzhi = true
            api.getxbSubInfoById(this.formData).then(res => {
                if (res.code == 'A0000') {
                    this.stationData = res.data
                    this.konzhi = false
                    // var msg = new SpeechSynthesisUtterance(res.message);
                    // window.speechSynthesis.speak(msg);
                } else {
                    this.stationData = []
                    this.konzhi = false
                }
            })
        },
        //监测点详情
        queryline(id, pid, name) {
            this.lineData = []
            this.formData.deptIndex = pid
            this.formData.serverName = 'harmonic-boot'
            this.formData.statFlag = true
            this.formData.id = id
            this.flag = false
            this.lineName = name
            this.dialogTableVisible1 = true
            this.konzhi = true
            api.getXbLineInfoById(this.formData).then(res => {
                if (res.code == 'A0000') {
                    this.lineData = res.data
                    this.konzhi = false
                }
            })
        },
        //排名前十监测点
        //排名前十监测点
        tensort() {
            this.dialogTableVisible2 = true
            api.getLineRank(this.formData).then(res => {
                if (res.code == 'A0000') {
                    var data = res.data
                    var xarr = []
                    var yarr = []
                    data.forEach(element => {
                        xarr.push(element.name)
                        yarr.push(element.overDays)
                    })
                    this.xdata = xarr
                    this.ydata = yarr
                }
                this.tenline()
                ;(data = null), (xarr = null), (yarr = null)
            })
        },
        //时间格式转化
        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
        },
        //查询触发//获取部门变电站数据
        querfromdata(data, timehbValue, interval) {
            this.konzhi = true
            this.interval = interval
            this.tableData = []
            this.timeValue = data
            //this.dateFormat(this.timeValue[0], this.timeValue[1]);
            // if (this.$refs.fkf.intervald == 3) {
            //     let timedate = this.$refs.fkf.timeValue[1]
            //     let timedate1 = timedate.split('-')
            //     if (timedate1[2] == '01' || timedate1[2] == '02' || timedate1[2] == '03') {
            //         let strTime = this.$refs.fkf.timeValue[0]
            //         let strTime1 = this.$refs.fkf.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]
                   
            //             this.formData.searchEndTime = str2[0] + '-' + month + '-' + new Date(str2[0], month, 0).getDate()
                    
            //     } else {
            //         this.formData.searchBeginTime = this.$refs.fkf.timeValue[0]
            //         this.formData.searchEndTime = this.$refs.fkf.timeValue[1]
            //     }
            // } else if (this.$refs.fkf.intervald == 4) {
            //     let timedate = this.$refs.fkf.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.fkf.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.fkf.timeValue[0]
            //         this.formData.searchEndTime = this.$refs.fkf.timeValue[1]
            //     }
            // } else if (this.$refs.fkf.intervald == 5) {
            //     let timedate = this.$refs.fkf.timeValue[1]
            //     let timedate1 = timedate.split('-')
            //     if (timedate1[2] == '01' || timedate1[2] == '02' || timedate1[2] == '03') {
            //         let strTime = this.$refs.fkf.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.fkf.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.fkf.timeValue[0]
            //         this.formData.searchEndTime = this.$refs.fkf.timeValue[1]
            //     }

            //     //let estr = this.$refs.fff.timeValue[1]
            // } else {
            //     this.formData.searchBeginTime = this.$refs.fkf.timeValue[0]
            //     this.formData.searchEndTime = this.$refs.fkf.timeValue[1]
            // }
  this.formData.searchBeginTime = this.$refs.fkf.timeValue[0]
                this.formData.searchEndTime = this.$refs.fkf.timeValue[1]
            var data = window.sessionStorage.getItem('Info')
            data = eval('(' + data + ')')
            this.formData.deptIndex = data.deptId

            api.deptSubstationRelations(this.formData).then(res => {
                if (res.code == 'A0000') {
                    this.listcard = res.data

                    // var xarr = [];
                    // var yarr = [];
                    // res.data.forEach((element) => {
                    //   xarr.push(element.name);
                    //   yarr.push(element.data);
                    // });
                    // this.xdata = xarr;

                    // for (var i = 0; i < yarr.length; i++) {
                    //   if (yarr[i] == 3.14159) {
                    //     yarr[i] = 1.33333;
                    //   }
                    // }
                    // this.ydata = yarr;
                }
            })
            api.deptInfolins(this.formData).then(res => {
                if (res.code === 'A0000') {
                    var xarr = []
                    var yarr = []
                    this.tableData = res.data
                    res.data.forEach(element => {
                        xarr.push(element.name)
                        yarr.push(element.lineRatio)
                    })
                    this.xdata1 = xarr
                    for (var i = 0; i < yarr.length; i++) {
                        if (yarr[i] == 3.14159) {
                            yarr[i] = 1.33333
                        }
                    }
                    this.ydata1 = yarr
                    this.konzhi = false
                    this.$nextTick(() => {
                        this.$refs.child.qualifiedechart()
                    })
                    ;(xarr = null), (yarr = null)
                }
            })

            //alert('父组件条件查询触发方法'+ data)
        },
        tenline() {
            const echarts = require('echarts')
            var myChartes = echarts.init(document.getElementById('tenline'))
            var option = {
                title: {
                    //text: this.title,
                    //  subtext: '单位(污染值)'
                },
                tooltip: {
                    trigger: 'axis',
                    formatter: function (params) {
                        var tips = ''
                        tips += '<span style="font-weight:bold;color:#0099CC">' + params[0].name + '</span></br/>'
                        for (var i = 0; i < params.length; i++) {
                            //  if(params[i].value==222){
                            //   tips +=params[i].seriesName + ":暂无数据<br/>";
                            //  }else{
                            if (params[i].value == undefined) {
                                tips += params[i].seriesName + ':无数据<br/>'
                            } else {
                                tips += params[i].seriesName + ':' + params[i].value + '天<br/>'
                            }

                            // }
                        }
                        return tips
                    }
                },
                grid: {
                    left: '3%',
                    right: '3%',
                    bottom: '3%',
                    containLabel: true
                },
                xAxis: [
                    {
                        type: 'category',
                        data: this.xdata,
                        splitLine: {
                            show: false
                        },
                        axisTick: {
                            alignWithLabel: true
                        },
                        axisLine: {
                            show: true,
                            symbol: ['none', 'arrow']
                        },
                        axisLabel: {
                            textStyle: {
                                fontFamily: 'dinproRegular',
                                color: '#000'
                            },
                            rotate: 39
                        }
                    }
                ],
                toolbox: {
                    show: true,
                    feature: {
                        // saveAsImage: { show: true },
                        //restore: {},
                        mark: { show: true }
                    }
                },
                yAxis: {
                    name: '超标天数(天)',
                    type: 'value',
                    min: 0,
                    //max:500,
                    //interval: 20,
                    axisLabel: {
                        show: true,
                        textStyle: {
                            color: '#00'
                        }
                    },
                    axisLine: {
                        show: true,
                        symbol: ['none', 'arrow']
                    }
                },
                series: [
                    {
                        name: '超标天数',
                        barMaxWidth: 45,
                        type: 'bar',
                        label: {
                            normal: {
                                show: true,
                                position: 'top'
                            }
                        },
                        itemStyle: {
                            normal: {
                                color: '#0099CC'
                            }
                        },

                        data: this.ydata
                    }
                ]
            }
            myChartes.setOption(option)
            window.echartsArr.push(myChartes)
            option = null
            this.tre = setTimeout(() => {
                myChartes.resize()
            }, 100)
        }
    },
    beforeDestroy() {
        this.$destroy()
        clearTimeout(this.tre)
        this.listcard = null
        this.tableData = null
        this.xdata = null
        this.ydata = null
        this.xdata1 = null
        this.ydata1 = null
        this.formData = null
        this.classificationData = null
        this.fanweioption = null
        this.copentoption = null
        this.voltageoption = null
        this.tenlineData = null
        this.stationData = null
        this.lineData = null
        window.gc()
    }
}
</script>
<style>
@import url('../../../styles/common.less');

.wr {
    margin-left: 0%;
    font-weight: bold;
    font-size: 14px;
}

.zd {
    background: #ff3300;
    color: #fff;
}

.zzd {
    background: #ff9900;
    color: #fff;
}

.qd {
    background: #ffcc00;
    color: #fff;
}

.qw {
    background: #3399ff;
    color: #fff;
}

.wd {
    background: #339933;
    color: #fff;
}

.ws {
    background: #999999;
    color: #fff;
}

.main {
    overflow: hidden;
}

.box-car3 {
    /* height: 80vh; */
}

.conent {
    padding: 5px;
}

.bg-purple-dark {
    background: #d3dce6;
}

.bg-purple {
    background: #d3dce6;
}

.bg-purple-light {
    /* background: #e5e9f2; */
}

.grid-content {
    border-radius: 4px;
    min-height: 36px;
}

.right-top {
    border-style: solid hidden hidden hidden;
    color: rgb(7, 131, 161);
    border: 1.5px solid rgb(7, 131, 161);
}

.el-card__header {
    padding: 0px 0px;
    border-bottom: 1px solid #ebeef5;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
</style>
<style lang="less" scoped>
::v-deep .el-table.el-table--enable-row-hover .el-table__body tr:hover > td {
    cursor: pointer;
}

::v-deep .demo-form-inline {
    height: 46px;
    overflow-y: hidden !important;
}

::v-deep .el-table__body-wrapper::-webkit-scrollbar-track {
    background-color: #79878769;
}

::v-deep .el-tabs--border-card > .el-tabs__content {
    padding: 10px;
}

::v-deep .el-dialog .el-dialog__body {
    max-height: 70vh;
    padding: 10px;
    overflow-y: auto;
}

.xshou {
    cursor: pointer;
}

/* 隐藏滚动条 */
::-webkit-scrollbar {
    display: block;
    width: 8px !important;
}
</style>
