<template>
  <div class="department-data">
    <diy-el-form ref="formRef"  v-bind="{'span-attrs':{span:4}}"   v-model:model-form="forms" :forms="formConfig">
      <template #searchBtn>
        <el-button  type="primary" :icon="Search" @click="getTableData()">查询</el-button>
      </template>
    </diy-el-form>
    <div class="department-content">
      <div class="left-echarts" ref="leftEcharts">

      </div>
      <div class="right-table">
        <my-table border
                  :has-operation="false"
                  :table-data="tableData"
                  :headers="HousingAndConstructionAreaStaticsHeader">
        </my-table>
      </div>
    </div>
  </div>
</template>

<script>
import MyTable from "@/components/common/MyTable.vue";
import DiyElForm from "@/components/common/DiyElForm.vue";
import {Close, Delete, Document, Search, SuccessFilled} from "@element-plus/icons-vue";
import {nextTick, onMounted, ref} from "vue";
import {HousingAndConstructionAreaStatics} from "@/data/all-form";
import {departmentDataImputationEcharts, housingAndConstructionAreaStaticsEcharts} from "@/echarts/option";
import {getFullYear} from "@/units/use-method/veritification-tools";
import {HousingAndConstructionAreaStaticsHeader} from "@/data/all-table-header";
import {
  proSelectXyxxJctj
} from "@/service/credit-data/combined-rewards-and-punishments/combined-rewards-and-punishments";
import {InsertSyslog} from "@/units/use-method/user-log";

export default {
  name: "HousingAndConstructionAreaStatics",
  components:{MyTable, DiyElForm},
  computed: {
    Delete() {
      return Delete
    },
    Search() {
      return Search
    },
    Document() {
      return Document
    },
    SuccessFilled() {
      return SuccessFilled
    },
    Close() {
      return Close
    }
  },
  setup(){
    const forms = ref({});
    const formRef = ref(null);
    const formConfig = ref({...HousingAndConstructionAreaStatics});
    const tableData = ref([]);
    const leftEcharts = ref(null);
    function getTableData(){
      let startTime =  forms.value.START_DATE + "-01";
      let endTime =  forms.value.END_DATE;
      if(endTime == "2"){
        endTime = forms.value.END_DATE + "-28"
      }else{
        endTime = forms.value.END_DATE + "-30"
      }
      proSelectXyxxJctj({
        start_time:startTime,
        //startC:"2019-01",
        end_time:endTime,
        pageSize:10000,
        pageIndex:1
      }).then(res =>{
        InsertSyslog(localStorage.getItem("xyxx_usercode"),localStorage.getItem("xyxx_unitcode"), "信息查询", "联合奖惩查询成功", "联合奖惩", "")
        getEchartsAndTable(res);
      })
    }
    function getEchartsAndTable(data){
      tableData.value = [];
      let date = data.msg[0]
      //数据内容
      let dataTitle = [];
      let dataTitleT = [];
      //数据内容
      let dataLeft_bin = [];
      let dataRight_bin = [];
      let dataMiddle_bin = [];
      if(date.Rows != null && date.Rows != "null"){
        let totalLeft=0;
        let totalRight = 0;
        let totalMiddle = 0;
        for (let i = 0; i < date.Rows.length; i++) {
          date.Rows[i].比较次数 = date.Rows[i].比较次数 * 1;
          date.Rows[i].限制惩戒 = date.Rows[i].限制惩戒 * 1;
          totalLeft += date.Rows[i].比较次数 * 1;
          totalRight += date.Rows[i].限制惩戒 * 1;
          totalMiddle += date.Rows[i].单位数 * 1;
          if (date.Rows[i].限制惩戒 == "") {
            date.Rows[i].限制惩戒 = 0;
          }
          if (date.Rows[i].单位数 == "") {
            date.Rows[i].单位数 = 0;
          }
        }
        let sortTwoCate = function (a, b) {
          let srcDataNew = ["对建筑工程施工的许可", "对建筑施工企业安全生产的许可", "建设工程企业资质许可", "建设工程注册从业人员资格许可", "投标企业基本情况表", "联动奖惩黑名单查询"];
          if (srcDataNew.indexOf(a.SXMC) === srcDataNew.indexOf(b.SXMC)) {
            return 0;
          } else {
            if (srcDataNew.indexOf(a.SXMC) > srcDataNew.indexOf(b.SXMC)) {
              return 1;
            } else {
              return -1;
            }
          }

        }
        date.Rows.sort(sortTwoCate);

        for (let i = 0; i < date.Rows.length; i++) {
          if (date.Rows[i].SXMC == "联动奖惩黑名单查询") {
            dataTitle.push("公积金贷款");
            tableData.value
            let obj = {
              XXLY:"公积金贷款",
              JCDBCS:date.Rows[i].比较次数.toLocaleString(),
              XZCJCS:date.Rows[i].限制惩戒.toLocaleString(),
              JZCJDXS:date.Rows[i].单位数.toLocaleString()
            }
            tableData.value.push(obj)
            dataLeft_bin.push(date.Rows[i].比较次数);
            dataRight_bin.push(date.Rows[i].限制惩戒);
            dataMiddle_bin.push(date.Rows[i].单位数);
          } else {
            let obj = {
              XXLY:date.Rows[i].SXMC,
              JCDBCS:date.Rows[i].比较次数.toLocaleString(),
              XZCJCS:date.Rows[i].限制惩戒.toLocaleString(),
              JZCJDXS:date.Rows[i].单位数.toLocaleString()
            }
            tableData.value.push(obj)
            dataTitle.push(date.Rows[i].SXMC);
            dataLeft_bin.push(date.Rows[i].比较次数);
            dataRight_bin.push(date.Rows[i].限制惩戒);
            dataMiddle_bin.push(date.Rows[i].单位数);
          }
        }
      }else{
        dataTitle = ['投标企业基本情况表', '建设工程企业资质许可', '建设工程注册从业人员资格许可', '对建筑工程施工的许可', '对建筑施工企业安全生产的许可', '公积金贷款', '总计']
        dataLeft_bin = [0,0,0,0,0,0,0];
        dataRight_bin = [0, 0, 0, 0, 0, 0, 0];
        dataMiddle_bin = [0, 0, 0, 0, 0, 0, 0];
      }
      debugger
      nextTick(() => {
        debugger
        housingAndConstructionAreaStaticsEcharts(leftEcharts.value,dataTitle,dataLeft_bin,dataMiddle_bin,dataRight_bin);
      })
    }
    onMounted(()=>{
      forms.value.START_DATE = getFullYear("year") + "-01";
      forms.value.END_DATE = getFullYear("month");
      getTableData()
    })
    return {
      forms,
      formRef,
      formConfig,
      getTableData,
      tableData,
      HousingAndConstructionAreaStaticsHeader,
      leftEcharts
    }
  }
}
</script>

<style scoped>
.department-data{
  padding: 20px;
}
.department-content{
  display: flex;
  justify-content: space-between;
}
.left-echarts{
  height: 600px;
  width: 55%;
  padding-right: 50px;
  margin-right: 50px;
  border-right: 1px #DCDCDC solid;
}
.right-table{
  height: 100%;
  width: 40%;
}
</style>