<script setup>
import {useRoute} from "vue-router";
import {getMostDetailByUniCode} from "@/api/basicData/mostdetail";
import {onMounted, ref} from "vue";
import {fieldMap} from "@/views/CEEnterprise/qydfmx/map";

import * as echarts from 'echarts';

const chartsRef = ref(null);
let route = useRoute();
const data = ref(new Map);
const tempData1 = ref([]);
const tempData2 = ref([]);
const tempData3 = ref([]);
const tempData4 = ref([]);
const tempData5 = ref([]);
const tempData6 = ref([]);
const tableData1 = ref([]);
const tableData2 = ref([]);
const tableData3 = ref([]);
const tableData4 = ref([]);
const tableData5 = ref([]);
const tableData6 = ref([]);
const sum1 = ref(0);
const sum2 = ref(0);
const sum3 = ref(10);
const sum4 = ref(20);
const sum5 = ref(20);
const sum6 = ref(0);
const init = async () => {
  const res = await getMostDetailByUniCode(route.query.unifiedSocialCreditCode);
  if (res.code == 200) {
    for (const resKey in res.data) {
      data.value.set(fieldMap[resKey], res.data[resKey]);
    }
  }
  let count = 0;
  for (const entry of data.value) {
    if (count <= 17) {
      tempData1.value.push(entry);
      count++
    } else if (count <= 29) {
      tempData2.value.push(entry);
      count++
    } else if (count <= 34) {
      tempData3.value.push(entry);
      count++
    } else if (count <= 74) {
      tempData4.value.push(entry);
      count++
    } else if (count <= 83) {
      tempData5.value.push(entry);
      count++
    } else if (count <= 91) {
      tempData6.value.push(entry);
      count++
    } else {
      break;
    }
  }
  setTableDataValueAndSum(tableData1, tempData1, sum1);
  setTableDataValueAndSum(tableData2, tempData2, sum2);
  setTableDataValueAndSum(tableData3, tempData3, sum3);
  setTableDataValueAndSum(tableData4, tempData4, sum4);
  setTableDataValueAndSum(tableData5, tempData5, sum5);
  setTableDataValueAndSum(tableData6, tempData6, sum6);
}
const setTableDataValueAndSum = (tableData, tempData, sum) => {
  tableData.value = tempData.value.reduce((acc, cur) => {
    acc[0][cur[0]] = cur[1];
    return acc;
  }, [{}])
  for (const k in tableData.value[0]) {
    sum.value += tableData.value[0][k];
  }
}
init()
// onMounted(()=>{
//   console.log(chartsRef.value);
//
//   const chartDom = chartsRef.value;
//   const myChart = echarts.init(chartDom);
//   let option;
//
//   option = {
//     tooltip: {
//       formatter: '{a} <br/>{b} : {c}%'
//     },
//     series: [
//       {
//         name: '得分',
//         type: 'gauge',
//         progress: {
//           show: true
//         },
//         detail: {
//           valueAnimation: true,
//           formatter: '{value}'
//         },
//         data: [
//           {
//             value: route.query.total,
//             name: route.query.grade,
//           }
//         ]
//       }
//     ]
//   };
//
//   option && myChart.setOption(option);
// })
</script>

<template>
  <div>
    <div>企业名称：{{ route.query.enterpriseName }}</div>
    <div>当前查询的社会统一信用代码：{{ route.query.unifiedSocialCreditCode }}</div>
    <div>信用等级为:{{ route.query.grade }}</div>
    <!--    <div ref="chartsRef" style="width: 400px;height: 400px"></div>-->
    <div>总分为:{{ route.query.total }}</div>
    <el-table :data="tableData1" style="width: 100%">
      <el-table-column :label="'企业竞争力得分详细(满分30分)此项得分为：'+sum1.toFixed(2)">
        <el-table-column width="150" v-for="(item,index) in tempData1" :key="index" :label="item[0]">
          <template #default="scope">
            {{ scope.row[item[0]] }}
          </template>
        </el-table-column>
      </el-table-column>
    </el-table>
    <el-table :data="tableData2" style="width: 100%">
      <el-table-column :label="'财务得分详细(满分10分)此项得分为：'+(sum2<=4?4:sum2).toFixed(2)">
        <el-table-column width="150" v-for="(item,index) in tempData2" :key="index" :label="item[0]">
          <template #default="scope">
            {{ scope.row[item[0]] }}
          </template>
        </el-table-column>
      </el-table-column>
    </el-table>
    <el-table :data="tableData3" style="width: 100%">
      <el-table-column :label="'司法裁判得分详细(满分10分)此项得分为：'+sum3.toFixed(2)">
        <el-table-column width="150" v-for="(item,index) in tempData3" :key="index" :label="item[0]">
          <template #default="scope">
            {{ scope.row[item[0]] ? scope.row[item[0]] : 0 }}
          </template>
        </el-table-column>
      </el-table-column>
    </el-table>
    <el-table :data="tableData4" style="width: 100%">
      <el-table-column :label="'行政处罚得分详细(满分20分)此项得分为：'+sum4.toFixed(2)">
        <el-table-column width="150" v-for="(item,index) in tempData4" :key="index" :label="item[0]">
          <template #default="scope">
            {{ scope.row[item[0]] }}
          </template>
        </el-table-column>
      </el-table-column>
    </el-table>
    <el-table :data="tableData5" style="width: 100%">
      <el-table-column :label="'行政监管、践诺履约得分详细(满分20分)此项得分为：'+sum5.toFixed(2)">
        <el-table-column width="150" v-for="(item,index) in tempData5" :key="index" :label="item[0]">
          <template #default="scope">
            {{ scope.row[item[0]] }}
          </template>
        </el-table-column>
      </el-table-column>
    </el-table>
    <el-table :data="tableData6" style="width: 100%">
      <el-table-column :label="'参考信用评价得分详细(满分10分)此项得分为：'+sum6.toFixed(2)">
        <el-table-column width="150" v-for="(item,index) in tempData6" :key="index" :label="item[0]">
          <template #default="scope">
            {{ scope.row[item[0]] }}
          </template>
        </el-table-column>
      </el-table-column>
    </el-table>
  </div>
</template>

<style scoped lang="scss">

</style>