<template>
    <div class="default-main">
        <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
            <el-tab-pane label="暂态总体概况" name="1">
                <el-tabs v-model="activeName1" tab-position="left" :style="{ height: height }" type="border-card">
                    <el-tab-pane label="表格" name="1">
                        <OverviewTab v-if="activeName1 == '1'" />
                    </el-tab-pane>
                    <el-tab-pane label="图形" name="2">
                        <OverviewTabEch v-if="activeName1 == '2'" />
                    </el-tab-pane>
                </el-tabs>
            </el-tab-pane>
            <el-tab-pane label="暂降原因统计" name="2"><CauseStatistics /></el-tab-pane>
            <el-tab-pane v-for="item in list" :label="item.name" :name="item.id" :key="item.id">
                <Table :info="item"></Table>
            </el-tab-pane>
        </el-tabs>
    </div>
</template>
<script setup lang="tsx">
import { ref, onMounted, provide } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from './components/table.vue'
import OverviewTab from './components/overviewTab.vue'
import OverviewTabEch from './components/overviewTabEch.vue'
import CauseStatistics from './components/causeStatistics.vue'
import { useDictData } from '@/stores/dictData'
import { mainHeight } from '@/utils/layout'
defineOptions({
    name: 'TransientReport/weekly'
})
const dictData = useDictData()
const height = mainHeight(80).height
const activeName = ref('1')
const activeName1 = ref('1')
const list = ref([
    {
        name: '暂态严重度统计',
        id: '3',
        isGroup: true,
        url: '/event-boot/report/getSeverity',
        column: [
            {
                title: '暂态事件严重度(前二十)',
                children: [
                    {
                        field: 'index',
                        title: '序号',
                        width: '80',
                        formatter: (row: any) => {
                            return (
                                (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize +
                                row.rowIndex +
                                1
                            )
                        }
                    },
                    { field: 'startTime', title: '暂态发生时刻', width: '200',sortable: true, },
                    {
                        field: 'featureAmplitude',
                        title: '暂降(骤升)幅值(%)',sortable: true,width: '160',
                        formatter: ({ row }: any) => (row.featureAmplitude * 100).toFixed(2)
                    },
                    { field: 'duration', title: '持续时间(s)',sortable: true,width: '120', },
                    { field: 'gdName', title: '供电公司' ,minWidth: '120'},
                    { field: 'subName', title: '变电站' ,minWidth: '120'},
                    { field: 'lineName', title: '监测点' ,minWidth: '120'},
                    { field: 'voltageScale', title: '监测点电压等级' ,minWidth: '120'},
                    { field: 'loadType', title: '干扰源类型' ,minWidth: '120'},

                    { field: 'severity', title: '暂态事件严重度' ,minWidth: '120'}
                ]
            }
        ]
    },
    {
        name: '暂降事件列表',
        id: '4',
        url: '/event-boot/report/getContinueTime',
        column: [
            {
                field: 'index',
                title: '序号',
                width: '80',
                formatter: (row: any) => {
                    return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
                }
            },
            { field: 'startTime', title: '暂降发生时刻', width: '200',sortable: true, },
             {
                field: 'featureAmplitude',
                title: '暂降(骤升)幅值(%)',
                width: '160',sortable: true,
                formatter: (row: any) => {
                    return Math.floor(row.cellValue * 10000) / 100
                }
            },
            { field: 'duration', title: '持续时间(s)', width: '120',sortable: true, },
            { field: 'gdName', title: '供电公司', width: '150' },
            { field: 'subName', title: '变电站', minWidth: '150' },
            { field: 'lineName', title: '监测点', minWidth: '150' },
            {
                field: 'objName',
                title: '监测点对象名称',
                minWidth: '150',
                formatter: (row: any) => (row.cellValue ? row.cellValue : '/')
            },
            { field: 'voltageScale', title: '电压等级', width: '80' },
            { field: 'loadType', title: '干扰源类型', width: '150' },

           
            { field: 'advanceType', title: '暂降类型(机器判断)', width: '150' }
        ]
    },
    {
        name: '暂降次数统计',
        id: '5',
        url: '/event-boot/report/getSagTimes',
        column: [
            {
                field: 'index',
                title: '序号',
                width: '80',
                formatter: (row: any) => {
                    return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
                }
            },
            { field: 'lineName', title: '监测点' },
            { field: 'loadType', title: '干扰源类型' },
            {
                field: 'objName',
                title: '监测点对象名称',
                formatter: ({ row }: any) => (row.objName ? row.objName : '/')
            },
            { field: 'subName', title: '变电站' },
            { field: 'gdName', title: '供电公司', width: '150' },
            { field: 'times', title: '暂降次数', width: '150' }
        ]
    },
    {
        name: '暂升次数统计',
        id: '6',
        url: '/event-boot/report/getUpTimes',
        column: [
            {
                field: 'index',
                title: '序号',
                width: '80',
                formatter: (row: any) => {
                    return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
                }
            },
            { field: 'lineName', title: '监测点' },
            { field: 'loadType', title: '干扰源类型' },
            {
                field: 'objName',
                title: '监测点对象名称',
                formatter: ({ row }: any) => (row.objName ? row.objName : '/')
            },
            { field: 'voltageScale', title: '监测点电压等级' },
            { field: 'subName', title: '变电站' },
            { field: 'subScale', title: '变电站电压等级' },
            { field: 'gdName', title: '供电公司', width: '150' },
            { field: 'times', title: '暂升次数', width: '130' }
        ]
    },
    {
        name: '短时中断次数统计',
        id: '7',
        url: '/event-boot/report/getBreakTimes',
        column: [
            {
                field: 'index',
                title: '序号',
                width: '80',
                formatter: (row: any) => {
                    return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
                }
            },
            { field: 'lineName', title: '监测点' },
            { field: 'loadType', title: '干扰源类型' },
            {
                field: 'objName',
                title: '监测点对象名称',
                formatter: ({ row }: any) => (row.objName ? row.objName : '/')
            },
            { field: 'voltageScale', title: '监测点电压等级' },
            { field: 'subName', title: '变电站' },
            { field: 'subScale', title: '变电站电压等级' },
            { field: 'gdName', title: '供电公司' },
            { field: 'times', title: '短时中断次数' }
        ]
    }
])
const tableStore = new TableStore({
    url: '',
    method: 'POST',
    column: []
})

tableStore.table.params.waveType = 0
provide('tableStore', tableStore)

onMounted(() => {
    // tableStore.index()
})

const handleClick = () => {}
</script>

<style lang="scss">
.el-tabs__content {
    height: 100%;
    .el-tab-pane {
        height: 100%;
    }
}
</style>
