<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
          label="中压用户平均停电时长目标（小时）"
          align="center"
          prop="stopTimeAvg"
          :show-overflow-tooltip="true"
          width="100"
          fixed
        /> -->
        <!-- <el-table-column
          label="等效总用户数"
          align="center"
          prop="userTotal"
          :show-overflow-tooltip="true"
          width="80"
          fixed
        /> -->
        <el-table-column
          label="中压用户停电总时长目标（小时）"
          align="center"
          prop="stopTimeTotal"
          width="100"
          fixed
        />
        <!-- <el-table-column
          label="近三年占比"
          align="center"
          prop="threeYearRatio"
          fixed
        /> -->
        <el-table-column
          label="中压用户预安排停电总时长目标（小时）"
          align="center"
          prop="planStopTimeTotal"
          width="100"
          fixed
        />
        <!-- <el-table-column
          label="中压用户预安排停电平均时长目标（小时）"
          align="center"
          prop="planStopTimeAvg"
          width="100"
          fixed
        /> -->
        <el-table-column
          label="中压用户故障停电总时长目标（小时）"
          align="center"
          width="100"
          prop="errorStopTimeTotal"
          fixed
        />
        <!-- <el-table-column
          label="中压用户故障停电平均时长目标（小时）"
          align="center"
          prop="errorStopTimeAvg"
          width="100"
          fixed
        >
        </el-table-column> -->
        <el-table-column label="中压用户停电月度总时长目标" align="center">
          <el-table-column
            v-for="(ite, i) in 12"
            :key="i"
            :label="`${ite}月`"
            align="center"
            :prop="`stopTimeMonth${i + 1 < 10 ? '0' + (i + 1) : i + 1}`"
          >
          </el-table-column>
        </el-table-column>
        <el-table-column
          label="中压用户预安排停电月度总时长目标"
          align="center"
        >
          <el-table-column
            v-for="(ite, i) in 12"
            :key="i"
            :label="`${ite}月`"
            align="center"
            :prop="`planStopTimeMonth${i + 1 < 10 ? '0' + (i + 1) : i + 1}`"
          >
          </el-table-column>
        </el-table-column>
        <el-table-column label="中压用户故障停电月度总时长目标" align="center">
          <el-table-column
            v-for="(ite, i) in 12"
            :key="i"
            :label="`${ite}月`"
            align="center"
            :prop="`errorStopTimeMonth${i + 1 < 10 ? '0' + (i + 1) : i + 1}`"
          >
          </el-table-column>
        </el-table-column>
      </el-table>
    </div>
    <!-- <el-divider></el-divider>
    <div class="table">
      <el-table ref="renewalTable" v-loading="loading" :data="dataList1">
        <el-table-column
          label="月度占比"
          align="center"
          prop="companyName"
          width="150"
          :show-overflow-tooltip="true"
          fixed
        >
        </el-table-column>
        <el-table-column
          v-for="(ite, i) in 12"
          :key="i"
          :label="`${ite}月`"
          align="center"
          :prop="`stopTimeMonthPer${i + 1 < 10 ? '0' + (i + 1) : i + 1}`"
        >
        </el-table-column>
      </el-table>
    </div>
    <el-divider></el-divider>
    <div class="table">
      <el-table ref="renewalTable" v-loading="loading" :data="dataList2">
        <el-table-column
          label="月度预安排占比"
          align="center"
          prop="companyName"
          width="150"
          :show-overflow-tooltip="true"
          fixed
        >
        </el-table-column>
        <el-table-column
          v-for="(ite, i) in 12"
          :key="i"
          :label="`${ite}月`"
          align="center"
          :prop="`planStopTimeMonthPer${i + 1 < 10 ? '0' + (i + 1) : i + 1}`"
        >
        </el-table-column>
      </el-table>
    </div>
    <el-divider></el-divider>
    <div class="table">
      <el-table ref="renewalTable" v-loading="loading" :data="dataList3">
        <el-table-column
          label="月度故障占比"
          align="center"
          prop="companyName"
          width="150"
          :show-overflow-tooltip="true"
          fixed
        >
        </el-table-column>
        <el-table-column
          v-for="(ite, i) in 12"
          :key="i"
          :label="`${ite}月`"
          align="center"
          :prop="`errorStopTimeMonthPer${i + 1 < 10 ? '0' + (i + 1) : i + 1}`"
        >
        </el-table-column>
      </el-table>
    </div> -->
  </div>
</template>

<script>
export default {
  props: {
    dataList: {
      type: Array,
      default: () => [],
    },
    dataList1: {
      type: Array,
      default: () => [],
    },
    dataList2: {
      type: Array,
      default: () => [],
    },
    dataList3: {
      type: Array,
      default: () => [],
    },
    loading: {
      type: Boolean,
      default: false,
    },
  },
};
</script>

<style></style>
