<template>
  <div class="w-full h-full">
    <div class="table">
      <el-table ref="renewalTable" v-loading="loading" :data="dataList">
        <el-table-column
          label="单位"
          align="center"
          prop="companyName"
          width="150"
          :show-overflow-tooltip="true"
          fixed
        >
        </el-table-column>
        <el-table-column
          v-if="dataType == 1"
          label="中压用户停电总时长目标（小时）"
          align="center"
          width="300"
          fixed
        >
          <el-table-column
            label="目标值"
            align="center"
            prop="stopTimeTotal"
            width="100"
          />
          <el-table-column
            label="实际值"
            align="center"
            prop="stopTotalActual"
            width="100"
          />
          <el-table-column
            label="执行率"
            align="center"
            prop="stopTotalRatio"
            width="100"
          />
        </el-table-column>
        <el-table-column
          v-if="dataType == 2"
          label="中压用户预安排停电总时长目标（小时）"
          align="center"
          prop="planStopTimeTotal"
          width="300"
          fixed
        >
          <el-table-column
            label="目标值"
            align="center"
            prop="planStopTimeTotal"
            width="100"
          />
          <el-table-column
            label="实际值"
            align="center"
            prop="planStopTotalActual"
            width="100"
          />
          <el-table-column
            label="执行率"
            align="center"
            prop="planStopTotalRatio"
            width="100"
          />
        </el-table-column>
        <el-table-column
          v-if="dataType == 3"
          label="中压用户故障停电总时长目标（小时）"
          align="center"
          width="300"
          prop="errorStopTimeTotal"
          fixed
        >
          <el-table-column
            label="目标值"
            align="center"
            prop="errorStopTimeTotal"
            width="100"
          />
          <el-table-column
            label="实际值"
            align="center"
            prop="errorStopTotalActual"
            width="100"
          />
          <el-table-column
            label="执行率"
            align="center"
            prop="errorStopTotalRatio"
            width="100"
          />
        </el-table-column>
        <el-table-column
          label="中压用户停电月度总时长目标"
          align="center"
          v-if="dataType == 1"
        >
          <el-table-column
            v-for="(ite, i) in 12"
            :key="i"
            :label="`${ite}月`"
            align="center"
            width="300"
          >
            <el-table-column
              label="目标值"
              align="center"
              :prop="`stopTimeMonth${i + 1 < 10 ? '0' + (i + 1) : i + 1}`"
              width="100"
            />
            <el-table-column
              label="实际值"
              align="center"
              :prop="`stopMonth${i + 1 < 10 ? '0' + (i + 1) : i + 1}Actual`"
              width="100"
            />
            <el-table-column
              label="执行率"
              align="center"
              :prop="`stopMonth${i + 1 < 10 ? '0' + (i + 1) : i + 1}Ratio`"
              width="100"
            />
          </el-table-column>
        </el-table-column>
        <el-table-column
          label="中压用户预安排停电月度总时长目标"
          align="center"
          v-if="dataType == 2"
        >
          <el-table-column
            v-for="(ite, i) in 12"
            :key="i"
            :label="`${ite}月`"
            align="center"
            width="300"
          >
            <el-table-column
              label="目标值"
              align="center"
              :prop="`planStopTimeMonth${i + 1 < 10 ? '0' + (i + 1) : i + 1}`"
              width="100"
            />
            <el-table-column
              label="实际值"
              align="center"
              :prop="`planStopMonth${i + 1 < 10 ? '0' + (i + 1) : i + 1}Actual`"
              width="100"
            />
            <el-table-column
              label="执行率"
              align="center"
              :prop="`planStopMonth${i + 1 < 10 ? '0' + (i + 1) : i + 1}Ratio`"
              width="100"
            />
          </el-table-column>
        </el-table-column>
        <el-table-column
          label="中压用户故障停电月度总时长目标"
          align="center"
          v-if="dataType == 3"
        >
          <el-table-column
            v-for="(ite, i) in 12"
            :key="i"
            :label="`${ite}月`"
            align="center"
            width="300"
            :prop="`errorStopTimeMonth${i + 1 < 10 ? '0' + (i + 1) : i + 1}`"
          >
            <el-table-column
              label="目标值"
              align="center"
              :prop="`errorStopTimeMonth${i + 1 < 10 ? '0' + (i + 1) : i + 1}`"
              width="100"
            />
            <el-table-column
              label="实际值"
              align="center"
              :prop="`errorStopMonth${
                i + 1 < 10 ? '0' + (i + 1) : i + 1
              }Actual`"
              width="100"
            />
            <el-table-column
              label="执行率"
              align="center"
              :prop="`errorStopMonth${i + 1 < 10 ? '0' + (i + 1) : i + 1}Ratio`"
              width="100"
            />
          </el-table-column>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    dataList: {
      type: Array,
      default: () => [],
    },
    loading: {
      type: Boolean,
      default: false,
    },
    dataType: {
      type: Number,
      default: 1,
    },
  },
};
</script>

<style></style>
