<script setup lang="ts">
import { useRoute } from 'vue-router'
import { getDick, getNewsById, type NewsData, type NewsResponseData } from '@/api/home'
import {ref} from 'vue';
import { formatTime } from '@/utils/formatTime'
import { downloadFile } from '@/utils/request'
const route = useRoute();
const getData = async ()=>{
  const res = await getNewsById(Number(route.query.id));
  if(res.code == 200){
    newsData.value = res.data;
  }
}
const BASE_URL = import.meta.env.VITE_APP_BASE_URL;
const newsData = ref<NewsData>();
getData()
</script>

<template>
  <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="min-h-500px">
    <div class="w-912px ml-a mr-a text-24px color-black bold text-center mb-30px">
      {{newsData?.title}}
    </div>
    <div class="w-912px ml-a mr-a h-1px bg-gray"></div>
    <div class="w-912px ml-a mr-a text-14px mt-10px flex justify-between">
      <div>发布时间：{{formatTime(newsData?.date)}}</div>
      <div class="mr-20px">数据来源：{{newsData?.dataSource}}</div>
    </div>
    <div class="custom-font w-912px ml-a mr-a text-18px mt-10px  line-height-34px " v-html="newsData?.content"></div>
    <div class="w-912px ml-a mr-a text-14px mt-10px" v-if="newsData?.files.length">
      <div>附件下载</div>
      <div v-for="(item,index) in newsData?.files" :key="index" class="line-height-40px">
        <!--      <a :href="`${BASE_URL}${item.fileUrl}`" :download="item.fileOriginalName">{{ item.fileOriginalName }}</a>-->
        <div >
          <span class="text-blue underline hover:text-red cursor-pointer" @click="downloadFile(`${BASE_URL}${item.fileUrl}`,item.fileOriginalName)">{{item.fileOriginalName}}</span>
        </div>
      </div>
    </div>
  </div>
</template>

<style scoped>
.custom-font{
  font-family: 等线;
}
</style>