<template>
    <div class="default-main">
        <div v-show="view">
            <TableHeader datePicker ref="TableHeaderRef" showExport showCustomColumn>
                <template #select>
                    <el-form-item label="筛选数据:">
                        <el-input
                            v-model="tableStore.table.params.searchValue"
                            clearable
                            placeholder="请输入监测点名称"
                        />
                    </el-form-item>
                    <el-form-item label="触发类型">
                        <el-select v-model.trim="tableStore.table.params.dicData" placeholder="请选择" clearable filterable>
                            <el-option
                                v-for="item in triggerType"
                                :key="item.id"
                                :label="item.name"
                                :value="item.id"
                            ></el-option>
                        </el-select>
                    </el-form-item>
                </template>
                <template #operation></template>
            </TableHeader>
            <Table ref="tableRef" />
        </div>
        <div :style="{ height: pageHeight.height }" style="padding: 10px; overflow: hidden" v-if="!view">
            <waveForm ref="waveFormRef" senior :boxoList="boxoList" :wp="wp" @backbxlb="backbxlb" />
        </div>
    </div>
</template>
<script setup lang="ts">
import { ref, onMounted, provide, nextTick } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import { useDictData } from '@/stores/dictData'
import { mainHeight } from '@/utils/layout'
import waveForm from '@/components/echarts/waveForm.vue'
import { ElMessage, ElMessageBox, ElDatePicker } from 'element-plus'
import { cableList, batchDel } from '@/api/advance-boot/assess'
import { useRouter } from 'vue-router'
const pageHeight = mainHeight(20)
defineOptions({
    name: 'Descentsystem/transientList'
})
const TableHeaderRef = ref()

const { push } = useRouter()
const dictData = useDictData()
const view = ref(true)
const boxoList = ref({})
const wp = ref({})
const view2 = ref(false)
const linetypeList = ref([])
const waveFormRef = ref()
//字典获取电压等级
const triggerType = dictData.getBasicData('Event_Statis')
const reasonList = dictData.getBasicData('Event_Reason')
const tableStore: any = new TableStore({
    url: '/event-boot/rmpEventDetail/getEventByLineIdsCount',
    method: 'POST',
    column: [
        // { width: '60', type: 'checkbox' },
        {
            field: 'index',
            title: '序号',
            width: '60',
            formatter: (row: any) => {
                return (tableStore.table.params.pageNum - 1) * tableStore.table.params.pageSize + row.rowIndex + 1
            }
        },
        { field: 'startTime', title: '暂降发生时刻', minWidth: '180' },
        { field: 'lineName', title: '监测点名称', minWidth: '180' },
        { field: 'gdName', title: '供电公司', minWidth: '120' },
        { field: 'subName', title: '变电站', minWidth: '150' },
        { field: 'loadType', title: '干扰源', minWidth: '150' },
        { field: 'objName', title: '监测对象', minWidth: '170' },
        // {
        //     field: 'advanceType',
        //     title: '触发类型',
        //     minWidth: '90',
        //     formatter: (row: any) => {
        //         return row.cellValue || '其他'
        //     }
        // },
        {
            field: 'advanceReason',
            title: '暂降原因',
            minWidth: '90',
            formatter: (row: any) => {
                return reasonList.filter(item => item.id === row.cellValue)[0]?.name
            }
        },
        {
            field: 'eventType',
            title: '触发类型',
            minWidth: '120',
            formatter: (row: any) => {
                return triggerType.filter(item => item.id === row.cellValue)[0]?.name
            }
        },
        // {
        //     field: 'severity', title: '严重度', minWidth: "80", formatter: (row: any) => {
        //         return row.cellValue.toFixed(2)
        //     }
        // },
        {
            field: 'featureAmplitude',
            title: '暂降幅值(%)',
            minWidth: '110',
            formatter: (row: any) => {
                return Math.round(row.cellValue * 10000) / 100
            }
        },

        { field: 'duration', title: '持续时间(s)', minWidth: '100' },

        {
             title: '操作',fixed: 'right',
            width: '120',
            render: 'buttons',
            buttons: [
                {
                    name: 'edit',
                    title: '波形分析',
                    type: 'primary',
                    disabled: row => {
                        return row.fileFlag == 0
                    },
                    icon: 'el-icon-Plus',
                    render: 'basicButton',
                    click: async row => {
                        view.value = false
                        setTimeout(() => {
                            waveFormRef.value.open(row)
                        }, 100)
                    }
                },
                {
                    name: 'edit',
                    title: '暂无波形',
                    type: '',
                    disabled: row => {
                        return row.fileFlag != 0
                    },
                    icon: 'el-icon-Plus',
                    render: 'basicButton'
                }
            ]
        }
    ],
    beforeSearchFun: () => {},

    loadCallback: () => {}
})
tableStore.table.params.dicData = ''
tableStore.table.params.searchValue = ''
tableStore.table.params.deptIndex = dictData.state.area[0].id

provide('tableStore', tableStore)
const route = useRoute()

watch(
    () => route.query.t,
    async (newValue, oldValue) => {
        if (route.fullPath.includes('Descentsystem/transientList')) {
            let type = (route.query.type as string) || 'null'
            if (type == 'null') {
            } else if (type == '1') {
                setTimeout(() => {
                    tableStore.table.params.searchValue = (route.query.name as string) || ''
                    if (route.query.dicData) {
                        tableStore.table.params.dicData = triggerType.filter(item =>
                            item.name.includes(route.query.dicData as string)
                        )[0]?.id
                    } else {
                        tableStore.table.params.dicData = ''
                    }
                    tableStore.index()
                }, 500)
            }
        }
    },
    { deep: true, immediate: true }
)
const backbxlb = () => {
    view.value = true
    view2.value = false
}
onMounted(() => {
    // tableStore.index()
    TableHeaderRef.value.setTheDate(1)
    nextTick(() => {
        TableHeaderRef.value.onComSearch()
    })
})
</script>
