<script setup>
import { ref, onMounted } from 'vue';
import request from "@/utils/request.js";
import { ElMessage, ElTable, ElTableColumn, ElPagination } from "element-plus";
import {useRouter} from "vue-router";

const tableData = ref([]);
const total = ref(0);
const currentPage = ref(1);
const pageSize = ref(10);
const router = useRouter();

const getList = async (page = 1, size = 10) => {
  try {
    const res = await request('basicData/xcrEBaseinfo/getCreditScoreListDetails', {
      params: {
        pageNum: page,
        pageSize: size,
      }
    });

    if (res.code !== 200) {
      ElMessage.error(res.msg);
      return;
    }

    tableData.value = res.data.result;
    total.value = res.data.totalSize;
  } catch (error) {
    ElMessage.error('获取数据失败');
    console.error(error);
  }
};

const handleSizeChange = (val) => {
  pageSize.value = val;
  getList(currentPage.value, val);
};

const handleCurrentChange = (val) => {
  currentPage.value = val;
  getList(val, pageSize.value);
};

const checkDetail = (row)=>{
  router.push({
    path:'/qyxypj/zxxddf',
    query:{
      row:JSON.stringify(row)
    }
  })
}

onMounted(() => {
  getList();
});
</script>

<template>
  <div class="p-4">
    <el-table :data="tableData" border stripe hover class="w-full">
      <el-table-column prop="enterpriseName" label="企业名称">
        <template #default="scope">
          <el-link class="text-blue" @click="checkDetail(scope.row)">{{ scope.row.enterpriseName }}</el-link>
        </template>
      </el-table-column>
      <el-table-column prop="uniCode" label="统一社会信用代码" />
      <el-table-column prop="grade" label="等级" width="150" />
      <el-table-column prop="total" label="总分" width="150">
        <template #default="scope">
          {{ scope.row.total.toFixed(2) }}
        </template>
      </el-table-column>
      <el-table-column prop="administrativePenaltyScore" label="行政处罚分数" width="150" />
      <el-table-column prop="enterpriseCompetitivenessScore" label="企业竞争力分数" />
      <el-table-column prop="referenceCreditRatingScore" label="参考信用评级分数" />
    </el-table>

    <div class="flex justify-center mt-4">
      <el-pagination
          v-model:current-page="currentPage"
          v-model:page-size="pageSize"
          :page-sizes="[10, 20, 50, 100]"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
      />
    </div>
  </div>
</template>
