<template>
    <div style="padding: 0px">
        <el-col :span="24">
            <el-table
                stripe
                :data="tableData"
                border
                v-loading="konzhi"
                header-cell-class-name="table_header"
                element-loading-text="拼命加载中"
                :height="vh"
            >
                <el-table-column align="center" prop="name" label="名称/(监测点个数)"></el-table-column>
                <el-table-column align="center" prop="data" :label="changeName">
                    <template slot-scope="scope">
                        <span v-if="scope.row.data == 3.14159" type="primary" size="small">暂无数据</span>
                        <span v-else type="primary" size="small">{{ scope.row.data }}</span>
                    </template>
                </el-table-column>
                <el-table-column align="center" prop="data" label="评估">
                    <template slot-scope="scope">
                        <span v-if="scope.row.data == 3.14159" type="primary" size="small">暂无评估</span>
                        <span v-else-if="0 <= scope.row.data && scope.row.data < 1" type="primary" size="small">
                            无污染
                        </span>
                        <span v-else-if="1 <= scope.row.data && scope.row.data < 1.2" type="success" size="small">
                            轻微污染
                        </span>
                        <span v-else-if="1.2 <= scope.row.data && scope.row.data < 1.6" type="primary" size="small">
                            轻度污染
                        </span>
                        <span v-else-if="1.6 <= scope.row.data && scope.row.data < 2" type="success" size="small">
                            中度污染
                        </span>
                        <span v-else-if="2 <= scope.row.data && scope.row.data" type="primary" size="small">
                            重度污染
                        </span>
                        <span v-else-if="scope.row.data == -1" type="primary" size="small">暂无评估</span>
                    </template>
                </el-table-column>
            </el-table>
        </el-col>
    </div>
</template>
<script>
import api from '@/api/pollution/pollution'
import { dicData } from '@/assets/commjs/dictypeData'
export default {
    props: {
        item: {
            type: Object,
            default: null
        },
        item2: {
            type: Object,
            default: null
        },
        height: {
            type: Number,
            default: null
        },
        height2: {
            type: Number,
            default: null
        }
    },
    watch: {
        height2(a, b) {
            if (a == 24) {
                this.vh = document.getElementById('conmentId').offsetHeight - 50
                this.queryData()
            } else {
                return
            }
        },
        height(a, b) {
            if (a == 6 || a == 8 || a == 9 || a == 16) {
                setTimeout(() => {
                    let str = document.getElementById('zwqyzbwqt').style.height
                    let strsec = str.split('p')
                    let height = parseInt(strsec) - 50
                    this.vh = height + 10
                    this.queryData()
                }, 200)
            } else {
                return
            }
        }
    },
    data() {
        return {
            konzhi: false,
            changeName: '谐波电压(%)',
            tableData: [],
            vh: null,
            time: this.timefamt(),
            formData: {
                deptIndex: '',
                id: '',
                monitorFlag: 2,
                powerFlag: 2,
                reportFlag: 3,
                searchBeginTime: '',
                searchEndTime: '',
                statisticalType: [],
                type: 1
            }
        }
    },
    created() {
        this.getIndexType()
        this.formData.deptIndex = JSON.parse(window.sessionStorage.getItem('Info')).deptId
        this.queryData()
    },
    mounted() {
        setTimeout(() => {
            let str = document.getElementById('zwqyzbwqt').style.height
            let strsec = str.split('p')
            let height = parseInt(strsec) - 50
            this.vh = height + 10
        }, 200)
    },
    methods: {
        //字典获取数据指标类型
        getIndexType() {
            var code = 'Pollution_Statis'
            this.classificationData = dicData(code, [
                'Freq_Dev',
                'V_Dev',
                'V_Unbalance',
                'V_Unbalance',
                'I_Neg',
                'V_Inharm',
                'Plt'
            ])
            // console.log("🚀 ~ file: zwqyzbwqt.vue:131 ~ getIndexType ~ this.classificationData:", this.classificationData)
            this.formData.statisticalType = this.classificationData[1]
        },
        // 字典数据过滤
        formFilter(row, column) {
            if (column.property == 'voltageLevel') {
                let title = ''
                dicData('Dev_Voltage', []).forEach(item => {
                    if (item.id == row.voltageLevel) {
                        title = item.name
                    }
                })
                return title
            }
        },
        timefamt() {
            var date = new Date()
            var year = date.getFullYear()
            var month = date.getMonth() + 1
            var day = date.getDate()
            month = month > 9 ? month : '0' + month
            day = day < 10 ? '0' + day : day
            var arr = []
            var time1 = year + '-' + month + '-01'
            arr.push(time1)
            var time2 = year + '-' + month + '-' + day
            arr.push(time2)
            return arr
        },
        queryData() {
            this.konzhi = true
            this.formData.searchBeginTime = this.time[0]
            this.formData.searchEndTime = this.time[1]

            api.deptSubstationRelations(this.formData).then(res => {
                if (res.code == 'A0000') {
                    this.tableData = res.data
                    this.konzhi = false
                }
                // this.powerquality()
            })
        }
    }
}
</script>
<style>
.xshou {
    cursor: pointer;
}
</style>
