<script setup lang="ts">
import { ref } from 'vue'
import { type CompanyData, type CompanyListData, getCompanyList } from '@/views/creditWarning/type'
import { queryFieldMethod } from '@/utils/queryFieldMethod'
import { getNews, type NewsData } from '@/api/home'
import { useRouter } from 'vue-router'
import SmallSearch from '@/components/SmallSearch.vue'
import NewDynamics from '@/components/NewDynamics.vue'

const companyList = ref<CompanyData[]>();
const pageSize = ref<number>(10);
const currentPage = ref<number>(1);
const total = ref<number>(0);
let router = useRouter()
const getCompany = async (currentPage:number, pageSize:number)=>{
  const res = await getCompanyList(currentPage,pageSize);
  if(res.code == 200){
    companyList.value = res.data.result;
    console.log(companyList.value)
    total.value = res.data.totalSize;
  }
}
const handleChange = ()=>{
  getCompany(currentPage.value, pageSize.value)
}
const creditDynamics = ref<NewsData[]>([])

const init = async ()=>{
  await getCompany(currentPage.value, pageSize.value)
  //获取信用动态 数据
  const res3 = await getNews(queryFieldMethod('special_column','credit_dynamics'))
  if(res3.code == 200){
    creditDynamics.value = res3.data;
  }
}
const toDetail = (id:number|undefined)=>{
  if(!id){
    return
  }
  router.push({
    path:'/newsDetail',
    query:{
      id
    }
  })
}
init()
</script>

<template>
  <div class="resContainer">
    <div class="w-912px ml-auto mr-auto pt-20px mb-20px text-14px">
      你所在的位置：<span class="cursor-pointer" @click="$router.push('/')">首页</span> > <span class="color-#006eff">信用警示</span>
    </div>
    <div class="w-912px ml-auto mr-auto flex">
      <div class="w-603px bg-white bg-opacity-90 mr-15px h-750px">
        <!--        <div class="p-20px pl-24px pr-24px">-->
        <!--          <div class="text-16px text-#000000 bold ">文本企业</div>-->
        <!--          <div class="mt-8px line-height-23px text-13px text-#464646 line-clamp-4">文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本文本</div>-->
        <!--          <div class="mt-20px h-1px bg-#e9e9e9"></div>-->
        <!--        </div>-->
        <div class="flex justify-around border-solid border-#e9e9e9 border-b-1px text-18px line-height-28px bg-[#fbfbfbff]">
          <div class="w-65% text-center border-solid border-#e9e9e9 border-1px">企业名称</div>
          <div class="w-35% text-center border-solid border-#e9e9e9 border-1px">企业信用评价等级</div>
        </div>
        <div class="flex justify-around border-solid border-#e9e9e9 border-b-1px text-18px line-height-60px" v-for="(item,index) in companyList" :key="index">
          <div class="w-65% pl-20px border-solid border-#e9e9e9 border-b-1px">
            <div class="border-solid border-#e9e9e9 border-b-1px line-clamp-1">{{ item.enterpriseName }}</div>
          </div>
          <div class="w-35% text-center border-solid border-#e9e9e9 border-b-1px">
            <div class="text-center border-solid border-#e9e9e9 border-b-1px">{{item.grade}}</div>
          </div>
        </div>
        <div class="ml-120px mt-20px">
          <div class="example-pagination-block">
            <el-pagination
              layout="prev, pager, next, total"
              v-model:pageSize = pageSize
              v-model:currentPage = currentPage
              :total="total"
              @change = handleChange
            />
          </div>
        </div>
      </div>
      <div class="w-294px bg-opacity-90">
        <small-search />
        <new-dynamics />
      </div>
    </div>
  </div>
</template>

<style scoped>
.resContainer {
  background-color: #ecf0f9;
}
</style>
