<template>
  <!-- 复烤公司数量弹窗 -->
  <el-dialog center ref="dialog" :title="dataTitle" :show-close="false" modal :destory-on-close="true"
    class="dialogClass" :append-to-body="true" width="871px" custom-class="custom-dialog" v-model="isShow">
    <section class="button">
      <el-button @click="exportExcels" :loading="excelLoading">导出</el-button>
      <el-button @click="closeDialog">关闭</el-button>
    </section>
    <div class="itemTrading">
      <el-table v-loading="tableloading" show-summary stripe :summary-method="getSummaries" ref="detailTable"
        height="450px" border :data="fkcList" id="out-table">
        <el-table-column property="orgName" label="企业名称" width="250"></el-table-column>
        <el-table-column label="动力保障设备">
          <el-table-column property="boilerTotal" label="锅炉数量"></el-table-column>
          <el-table-column property="airCompressor" label="空压设备数量"></el-table-column>
          <el-table-column label="高压配电柜数量" property="distributionBox"></el-table-column>
          <el-table-column label="变压器数量" property="transformer"></el-table-column>
        </el-table-column>

      </el-table>
    </div>
  </el-dialog>
</template>
<script setup>
// import { TableColumnCtx } from "element-plus";
import { ref, defineProps, reactive, onMounted, defineEmits } from "vue";
import { getApi, postApi } from "@/api/tobAcco_api.js";
import { getSummaries } from "@/utils/tools";
import { exportXlsx } from "@/excel/Export2Excel.js";
const props = defineProps({
  title: String,
  isShow: Boolean
});
const tableloading = ref(false)
const excelLoading = ref(false)
const fkcList = ref([]);
const emit = defineEmits(['changeVi'])
const isShow = ref(false);
const dataTitle = props.title;
const detailTable = ref();


onMounted(() => {
  isShow.value = true;
  getRebakingData();

});

// 复烤公司数量列表
const getRebakingData = () => {
  fkcList.value = []
  tableloading.value = true
  getApi({}, '/mosty-jcgl/basicData/fkListDisplay').then((res) => {
    fkcList.value = res ? res : []
  }).finally(() => {
    tableloading.value = false
  })
}

//关闭弹窗事件
function closeDialog() {
  emit('changeVi', false)
}

const exportExcels = () => {
  excelLoading.value = true
  let title = {
    orgName: '企业名称',
    boilerTotal: "锅炉数量",
    airCompressor: "空压设备数量",
    distributionBox: "高压配电柜数量",
    transformer: "变压器数量",
  };
  getApi({}, "/mosty-jcgl/basicData/fkListDisplay").then((res) => {
    if (res) {
      let data = res;
      let obj = {
        orgName: '合计',
        boilerTotal: 0,
        airCompressor: 0,
        distributionBox: 0,
        transformer: 0,
      }
      if (data) {
        for (let i = 0; i < data.length; i++) {
          obj.boilerTotal += data[i].boilerTotal;
          obj.airCompressor += data[i].airCompressor;
          obj.distributionBox += data[i].distributionBox;
          obj.transformer += data[i].transformer;
        }
        data.push(obj)
        let tablename = "复烤公司台账.xlsx";
        exportXlsx(title, data, '复烤公司台账', tablename);
        excelLoading.value = false
      }
      excelLoading.value = false
    }
  }).catch(() => {
    excelLoading.value = false
  });
};
</script>
<style lang="scss" scoped>
@import "~@/assets/css/element-plus.scss";
</style>
