<template>
    <el-dialog
        v-model="dialogVisible"
        title="限值查看"
        width="800px"
        :close-on-click-modal="false"
        destroy-on-close
    >
        <!-- 基本信息 -->
        <div class="basic-info" style="margin-bottom: 20px; padding: 16px; background: #f5f7fa; border-radius: 4px;">
            <el-row :gutter="20">
                <el-col :span="8">
                    <div><strong>监测点名称：</strong>{{ currentRow?.lineName || '-' }}</div>
                </el-col>
                <el-col :span="8">
                    <div><strong>监测对象名称：</strong>{{ currentRow?.objName || '-' }}</div>
                </el-col>
                <el-col :span="8">
                    <div><strong>所属变电站：</strong>{{ currentRow?.bdName || '-' }}</div>
                </el-col>
            </el-row>
            <el-row :gutter="20" style="margin-top: 10px;">
                <el-col :span="8">
                    <div><strong>电压等级：</strong>{{ currentRow?.scale || '-' }}</div>
                </el-col>
                <el-col :span="8">
                    <div><strong>干扰源类型：</strong>{{ currentRow?.loadType || '-' }}</div>
                </el-col>
                <el-col :span="8">
                    <div><strong>终端厂家：</strong>{{ currentRow?.manufacturer || '-' }}</div>
                </el-col>
            </el-row>
        </div>

        <el-tabs v-model="activeTab">
            <el-tab-pane label="电能质量限值" name="powerQuality">
                <el-table :data="limitData" border style="width: 100%" max-height="400">
                    <el-table-column prop="name" label="参数名称" width="300" fixed />
                    <el-table-column prop="value" label="限值" width="300">
                        <template #default="{ row }">
                            <span>{{ row.value !== null && row.value !== undefined ? row.value + '%' : '-' }}</span>
                        </template>
                    </el-table-column>
                </el-table>
            </el-tab-pane>

            <el-tab-pane label="谐波电压限值" name="harmonicVoltage">
                <el-table :data="harmonicVoltageData" border style="width: 100%" max-height="400">
                    <el-table-column prop="harmonic" label="谐波次数" width="300" />
                    <el-table-column prop="limit" label="限值(%)" width="300">
                        <template #default="{ row }">
                            <span>{{ row.limit || '-' }}</span>
                        </template>
                    </el-table-column>
                </el-table>
            </el-tab-pane>

            <el-tab-pane label="谐波电流限值" name="harmonicCurrent">
                <el-table :data="harmonicCurrentData" border style="width: 100%" max-height="400">
                    <el-table-column prop="harmonic" label="谐波次数" width="300" />
                    <el-table-column prop="limit" label="限值(%)" width="300">
                        <template #default="{ row }">
                            <span>{{ row.limit || '-' }}</span>
                        </template>
                    </el-table-column>
                </el-table>
            </el-tab-pane>
        </el-tabs>

        <template #footer>
            <span class="dialog-footer">
                <el-button @click="dialogVisible = false">关闭</el-button>
            </span>
        </template>
    </el-dialog>
</template>

<script setup lang="ts">
import { ref } from 'vue'

const dialogVisible = ref(false)
const activeTab = ref('powerQuality')
const currentRow = ref<any>(null)

// 电能质量限值数据
const limitData = ref([
    { name: '频率偏差', value: 0.2 },
    { name: '电压偏差上限', value: null },
    { name: '电压偏差下限', value: null },
    { name: '电压不平衡度', value: 2 },
    { name: '闪变', value: 1 },
    { name: '电压波变', value: 3 },
    { name: '间谐波电压', value: 0.16 },
    { name: '负序电流', value: null },
])

// 谐波电压数据（2-25次）
const harmonicVoltageData = ref(
    Array.from({ length: 24 }, (_, i) => {
        const harmonicNumber = i + 2
        let limit = 0
        if (harmonicNumber <= 3) limit = 2.4
        else if (harmonicNumber <= 5) limit = 1.2
        else if (harmonicNumber <= 7) limit = 0.8
        else if (harmonicNumber <= 9) limit = 0.6
        else if (harmonicNumber <= 11) limit = 0.5
        else if (harmonicNumber <= 13) limit = 0.4
        else if (harmonicNumber <= 15) limit = 0.3
        else if (harmonicNumber <= 17) limit = 0.2
        else if (harmonicNumber <= 19) limit = 0.18
        else limit = 0.15

        return {
            harmonic: `${harmonicNumber}次`,
            limit: limit
        }
    })
)

// 谐波电流数据（2-25次）
const harmonicCurrentData = ref(
    Array.from({ length: 24 }, (_, i) => {
        const harmonicNumber = i + 2
        const limits = {
            2: 16, 3: 13, 4: 8.1, 5: 13, 6: 5.4, 7: 9.3, 8: 4.1, 9: 4.3,
            10: 3.3, 11: 5.9, 12: 2.7, 13: 5, 14: 2.3, 15: 2.6, 16: 2, 17: 3.8,
            18: 1.8, 19: 3.4, 20: 1.6, 21: 1.9, 22: 1.5, 23: 2.8, 24: 1.4, 25: 2.6
        }
        return {
            harmonic: `${harmonicNumber}次`,
            limit: limits[harmonicNumber as keyof typeof limits] || 0
        }
    })
)

// 打开弹框
const open = (row: any) => {
    currentRow.value = row
    // 更新电能质量限值数据
    limitData.value.forEach(item => {
        if (item.name === '电压偏差上限') {
            item.value = row.voltageDev !== undefined ? row.voltageDev : null
        } else if (item.name === '电压偏差下限') {
            item.value = row.uvoltageDev !== undefined ? row.uvoltageDev : null
        } else if (item.name === '负序电流') {
            item.value = row.ineg !== undefined ? row.ineg : null
        }
    })

    dialogVisible.value = true
}

defineExpose({
    open
})
</script>

<style scoped lang="scss">
.dialog-footer {
    display: flex;
    justify-content: flex-end;
}
</style>