<template>
    <el-dialog :model-value="visible" :title="dialogTitle" width="640px" @update:model-value="emit('update:visible', $event)">
        <el-descriptions :column="2" border>
            <el-descriptions-item v-for="item in measurementPointItems" :key="item.prop" :label="item.label">
                {{ resolveText(data?.[item.prop]) }}
            </el-descriptions-item>
        </el-descriptions>
    </el-dialog>
</template>

<script setup lang="ts">
import type { ChecksquareMeasurementPointDetail } from '../utils/checksquareLedger'

defineOptions({
    name: 'ChecksquareMeasurementPointDialog'
})

defineProps<{
    visible: boolean
    data: ChecksquareMeasurementPointDetail | null
}>()

const emit = defineEmits<{
    'update:visible': [value: boolean]
}>()

const dialogTitle = '监测点信息'
const measurementPointItems: { label: string; prop: keyof ChecksquareMeasurementPointDetail }[] = [
    { label: '工程名称', prop: 'engineeringName' },
    { label: '项目名称', prop: 'projectName' },
    { label: '设备名称', prop: 'equipmentName' },
    { label: '网络参数', prop: 'networkParam' },
    { label: '监测点名称', prop: 'lineName' }
]

const resolveText = (value: unknown) => {
    if (value === null || value === undefined || value === '') return '--'
    return String(value)
}
</script>
