<template>
  <div id="index">
    <el-row>
      <el-col :span="24" class="main animate__animated animate__backInRight" v-loading="loading">
        <div class="w_1200">
          <el-col :span="24" class="one">
            <div class="span">{{ info.title || '暂无标题' }}</div>
          </el-col>
          <el-col :span="24" class="two">
            <el-col :span="8" class="two_1"><span>浏览量：</span>{{ info.number || '0' }}</el-col>
            <el-col :span="8" class="two_1">
              <span>发布人：</span>
              {{ info.person || '暂无' }}
            </el-col>
            <el-col :span="8" class="two_1">
              <span>发布时间：</span>
              {{ info.time || '暂无' }}
            </el-col>
          </el-col>
          <el-col :span="24" class="thr">
            <div v-html="info.content"></div>
          </el-col>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script setup>
// 接口
import { NewsStore } from '@/store/api/platform/news'
const store = NewsStore()
// 路由
const route = useRoute()
// 加载中
const loading = ref(false)
const info = ref({})
// 请求
onMounted(async () => {
  loading.value = true
  await searchOther()
  await search()
  loading.value = false
})
const search = async () => {
  let id = route.query.id
  if (id) {
    let res = await store.fetch(id)
    if (res.errcode == '0') {
      info.value = res.data
    }
  }
}
// 查询其他信息
const searchOther = async () => {
  //   let res: IQueryResult;
  //   // 性别
  //   res = await dictAxios.query({ type: 'common_gender' });
  //   if (res.errcode == '0') genderList.value = res.data;
}
</script>
<style scoped lang="scss">
.main {
  .one {
    font-size: 24px;
    font-weight: 700;
    border-bottom: 2px solid #2374ff;
    text-align: center;
    color: #2374ff;

    .span {
      padding: 10px 0;
    }
  }

  .two {
    display: flex;
    font-size: 14px;
    color: #7e8288;
    margin: 20px 0;
  }

  .thr {
    font-family: PingFangSC-Regular;
    font-size: 20px;
    color: #383b40;
    line-height: 24px;
  }
}
</style>
