<template>
  <Dialog title="能源消耗记录详情" v-model="dialogVisible" :width="800">
    <el-descriptions :column="2" border v-loading="loading">
      <el-descriptions-item label="编号">
        {{ detailData.code || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="工单编号">
        {{ detailData.workOrderCode || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="消耗时间">
        {{ formatDate(detailData.consumptionTime) || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="审核状态">
        <dict-tag :type="DICT_TYPE.MES_ENERGY_AUDIT_STATUS" :value="detailData.auditStatus" />
      </el-descriptions-item>
      <el-descriptions-item label="煤消耗量">
        {{ detailData.coalConsumption }} 吨
      </el-descriptions-item>
      <el-descriptions-item label="蒸汽产量">
        {{ detailData.steamOutput }} 吨
      </el-descriptions-item>
      <el-descriptions-item label="用电量">
        {{ detailData.electricityConsumption }} 千瓦时
      </el-descriptions-item>
      <el-descriptions-item label="用水量">
        {{ detailData.waterConsumption }} 立方米
      </el-descriptions-item>
      <el-descriptions-item label="备注" :span="2">
        {{ detailData.remark || '-' }}
      </el-descriptions-item>
      
      <!-- 审核信息 -->
      <template v-if="detailData.auditStatus !== 0">
        <el-descriptions-item label="审核人">
          {{ detailData.auditorName || '-' }}
        </el-descriptions-item>
        <el-descriptions-item label="审核时间">
          {{ formatDate(detailData.auditTime) || '-' }}
        </el-descriptions-item>
        <el-descriptions-item label="审核意见" :span="2">
          {{ detailData.auditRemark || '-' }}
        </el-descriptions-item>
      </template>
      
      <el-descriptions-item label="创建时间">
        {{ formatDate(detailData.createTime) || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="更新时间">
        {{ formatDate(detailData.updateTime) || '-' }}
      </el-descriptions-item>
    </el-descriptions>
    
    <template #footer>
      <el-button @click="dialogVisible = false">关 闭</el-button>
    </template>
  </Dialog>
</template>

<script setup lang="ts">
import { DICT_TYPE } from '@/utils/dict'
import { formatDate } from '@/utils/formatTime'
import { getEnergyConsumption } from '@/api/mes/energy/consumption'

const dialogVisible = ref(false)
const loading = ref(false)
const detailData = ref({
  id: undefined,
  code: '',
  workOrderCode: '',
  consumptionTime: '',
  coalConsumption: 0,
  steamOutput: 0,
  electricityConsumption: 0,
  waterConsumption: 0,
  auditStatus: 0,
  auditorName: '',
  auditTime: '',
  auditRemark: '',
  remark: '',
  createTime: '',
  updateTime: ''
})

/** 打开弹窗 */
const open = async (id: number) => {
  dialogVisible.value = true
  loading.value = true
  try {
    const data = await getEnergyConsumption(id)
    detailData.value = data
  } finally {
    loading.value = false
  }
}

defineExpose({ open })
</script>
