<template>
  <div :class="[prefixCls, 'flex full relative']">
    <div :class="`${prefixCls}-content  pt-24`">

      <el-breadcrumb style="position: absolute; top: 80px;left: 120px" :separator-icon="ArrowRight">
        <el-breadcrumb-item class="text-2xl" :to="{ path: '/rules' }">法律法规</el-breadcrumb-item>
        <el-breadcrumb-item class="text-2xl">法律法规详情</el-breadcrumb-item>
      </el-breadcrumb>
      <div class="text-center mb-8">
        <h3 class="mb-5 text-4xl font-bold">{{ content.title }}</h3>
        <div class="w-3/6 flex justify-between mx-auto text-xl font-bold" style="color: #666666">
          <span>发布时间：{{ dayjs(content.createtime * 1000).format('YYYY-MM-DD') }}</span>
          <span v-if="content.source">文章来源：{{ content.source }}</span>
        </div>
      </div>
      <HtmlPreview :content="content.content" />
    </div>
  </div>
</template>

<script setup lang="ts">
import dayjs from "dayjs";

definePageMeta({
  name:'法律法规详情',
  hidden: true,
  headerHost: false,
  parentPath: '/rules',
  // @ts-ignore
  path: '/rules/:id'
})
useHead({
  title:'法律法规详情'
})
import { ArrowRight } from '@element-plus/icons-vue'
useAppStore().setBannerTitle("法律法规详情")

const {prefixCls} = useDesign('mai-wrap');
const route = useRoute()
const content = ref('')
const nextdata = ref()
const prevdata = ref()
async function getData() {
  const data = await useApi().technicalApi.getTechnicalDetail(route.params.id as string)
  console.log('data.data.info')
  content.value = data.data.info;
}
getData()
</script>

<style scoped></style>
