<template>
    <div>
        <el-row>
            <el-col :span="24">
                <el-table
                    stripe
                    :data="temporaryriseData"
                    :height="height"
                    border
                    style="width: 100%"
                    header-cell-class-name="table_header"
                    highlight-current-row
                    :row-class-name="rowClassName"
                >
                    <el-table-column prop="number" label="序号" width="70">
                        <template scope="scope">
                            <span>{{ (form.pageNum - 1) * form.pageSize + scope.$index + 1 }}</span>
                        </template>
                    </el-table-column>
                    <el-table-column
                        prop="lineName"
                        label="监测点"
                        min-width="200"
                        show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column prop="loadType" label="干扰源类型" min-width="140"></el-table-column>
                    <el-table-column
                        prop="objName"
                        label="监测点对象名称"
                        min-width="140"
                        show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column
                        prop="voltageScale"
                        label="监测点电压等级"
                        min-width="150"
                        :sort-method="sortJ"
                        sortable
                    ></el-table-column>
                    <el-table-column
                        prop="subName"
                        label="变电站"
                        min-width="180"
                        show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column
                        prop="subScale"
                        label="变电站电压等级"
                        min-width="150"
                        show-overflow-tooltip
                        :sort-method="sortB"
                        sortable
                    ></el-table-column>
                    <el-table-column prop="gdName" label="供电公司" min-width="150"></el-table-column>
                    <el-table-column prop="times" label="暂升次数" min-width="150" sortable></el-table-column>
                </el-table>
                <el-pagination
                    background
                    align="right"
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="form.pageNum"
                    :page-sizes="[10, 20, 30, 40, 50]"
                    :page-size="form.pageSize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="total"
                    class="mt10"
                ></el-pagination>
            </el-col>
        </el-row>
    </div>
</template>

<script>
// import { getTemporaryriseData} from "@/api/generaloverview";
import { getUpTimesData } from '@/api/generaloverview'
import { dicData } from '@/assets/commjs/dictypeData'
export default {
    props: {
        item: {
            type: Array,
            default: undefined
        }
    },
    data() {
        return {
            vh: '',
            height: null,
            isLoading: false,
            temporaryriseData: [],
            total: 0, // currentPage: 1, // 当前页码
            // total: 20, // 总条数
            // pageSize: 18, // 每页的数据条数
            form: {
                deptIndex: '',
                monitorFlag: 2,
                powerFlag: 2,
                pageNum: 1,
                pageSize: 20,
                serverName: 'event-boot',
                searchBeginTime: this.getCurrentMonthFirst(),
                searchEndTime: this.getNowFormatDate(),
                statisticalType: {}
            }
        }
    },
    created() {},
    mounted() {
        this.setHeight()
        window.addEventListener('resize', this.setHeight)

        this.form.deptIndex = JSON.parse(window.sessionStorage.getItem('Info')).deptId
        this.getclassificationData()
        this.temporaryrise()
    },
    beforeDestroy() {
        window.removeEventListener('resize', this.setHeight)
    },
    methods: {
        setHeight() {
            this.height = window.sessionStorage.getItem('appheight') - 160
        },
        sortJ(a, b) {
            return (
                a.voltageScale.slice(0, a.voltageScale.length - 2) - b.voltageScale.slice(0, b.voltageScale.length - 2)
            )
        },
        sortB(a, b) {
            return a.subScale.slice(0, a.subScale.length - 2) - b.subScale.slice(0, b.subScale.length - 2)
        },
        rowClassName({ row, rowIndex }) {
            row.number = rowIndex + 1
        },
        //获取统计类型
        getclassificationData() {
            // debugger
            var code = 'Statistical_Type'
            this.classificationData = dicData(code, ['Load_Type'])
            this.form.statisticalType = this.classificationData[0]
        },
        //获取当前月第一天日期
        getCurrentMonthFirst() {
            var date = new Date()
            var year = date.getFullYear()
            date.setDate(1)
            var month = parseInt(date.getMonth() + 1)
            var day = date.getDate()
            if (month < 10) {
                month = '0' + month
            }
            if (day < 10) {
                day = '0' + day
            }
            return year + '-' + month + '-' + day
        },
        //获取当天日期
        getNowFormatDate() {
            var date = new Date()
            var year = date.getFullYear()
            var month = date.getMonth() + 1
            var day = date.getDate()
            if (month < 10) {
                month = '0' + month
            }
            if (day < 10) {
                day = '0' + day
            }
            return year + '-' + month + '-' + day
        },
        //方法调用暂态严重度统计数据接口
        temporaryrise() {
            this.$emit('Loading', true)
            this.form.pageNum = 1
            this.form.searchBeginTime = this.item[0]
            this.form.searchEndTime = this.item[1]
            getUpTimesData(this.form).then(res => {
                this.$emit('Loading', false)
                this.temporaryriseData = res.data.records
                this.total = res.data.total
                this.temporaryriseData.forEach(item => {
                    if (item.objName == null) {
                        item.objName = '/'
                    }
                })
            })
        },
        //分页查询用
        temporaryrise1() {
            this.$emit('Loading', true)
            this.form.searchBeginTime = this.item[0]
            this.form.searchEndTime = this.item[1]
            getUpTimesData(this.form).then(res => {
                this.$emit('Loading', false)
                this.temporaryriseData = res.data.records
                this.total = res.data.total
                this.temporaryriseData.forEach(item => {
                    if (item.objName == null) {
                        item.objName = '/'
                    }
                })
            })
        },

        //每页条数改变时触发 选择一页显示多少行
        handleSizeChange(val) {
            this.form.pageSize = val
            this.temporaryrise1()
        },
        //当前页改变时触发 跳转其他页
        handleCurrentChange(val) {
            this.form.pageNum = val
            this.temporaryrise1()
        }
    }
}
</script>
<style lang="less" scoped>
@import url('../../../../../styles/comStyle.less');
::v-deep .el-table .cell {
    text-align: center;
}
::v-deep .el-tabs--border-card > .el-tabs__content {
    padding: 10px;
}
</style>
