<template>
  <div>
    <div class="box">
      <el-breadcrumb class="mt20" :separator-icon="ArrowRight">
        <el-breadcrumb-item :to="{ path: '/' }">
          <el-icon>
            <HomeFilled />
          </el-icon>
          首页
        </el-breadcrumb-item>
        <el-breadcrumb-item>资讯列表</el-breadcrumb-item>
        <el-breadcrumb-item>{{ kindName }}</el-breadcrumb-item>
      </el-breadcrumb>
      <el-card class="mt20 mb20">
        <el-row :gutter="20" class="newsimgcover mb20">
          <el-col
            v-for="(n,index) in newsList" :key="index" :lg="8" :md="8" :sm="12"
            @click="goDetail(n)"
          >
            <div class="item">
              <div class="imgbox"><img :src="fillImgUrl_webSite(n.picUrl)"></div>
              <h3 class="esp">
                <span v-if="n.publishType">
                  <span v-for="(t,index) in n.publishType.split(',')" :key="index" class="jstype">{{ t }}</span>
                </span>

                {{ n.name }}</h3>
            </div>
          </el-col>
        </el-row>

        <div v-if="total>8" class="pc-page-box">
          <PaginationPc v-model:page="query.pageNum" v-model:limit="query.pageSize" :total="total" @pagination="getList" />
        </div>

        <el-empty v-if="newsList.length == 0" description="暂无数据" />

      </el-card>

    </div>
  </div>
</template>

<script setup>
import { ArrowRight } from '@element-plus/icons-vue'

const route = useRoute()
const router = useRouter()
import { onMounted, ref } from 'vue'
import { getNewsListById } from '@/apiPc/webSite'
import { useRoute, useRouter } from 'vue-router'

const query = ref({
  pageSize: 10,
  pageNum: 1
})
const kindName = ref('')
const total = ref(0)
const newsList = ref([])
onMounted(() => {
  kindName.value = route.query.sortName
  query.value.sortId = route.query.sortId
  query.value.code = route.query.code
  getList()
})
const getList = () => {
  getNewsListById(query.value).then(res => {
    newsList.value = res.rows
    total.value = res.total
  })
}
const goDetail = (n) => {
  if (n.isOut == '1') {
    window.open(n.jumpUrl)
  } else {
    router.push({
      path: `/news/detail/${n.noteId}`
    })
  }
}
</script>

<style scoped lang="scss">

</style>