<route lang="json">
{
  "style": {
    "navigationBarTitleText": "详情",
    "navigationBarBackgroundColor": "#fff"
  }
}
</route>
<script setup lang="ts">
import { logo } from '../../../core/libs/svgs'
import { getBanner, getContent } from '../../../core/libs/requests'
import Article from '../components/article.vue'
import { Content } from '../../../core/libs/models'

const id = ref()
const type = ref()
const request = ref<() => Promise<IResData<Partial<Content>>>>()
const { data, run } = useRequest(() => request.value(), { initialData: {} })
onLoad(async (query: { id: string; type?: 'banner' }) => {
  id.value = query.id
  type.value = query.type
  if (type.value === 'banner') {
    request.value = () =>
      getBanner(id.value).then((res) => ({
        ...res,
        data: {
          title: res.data?.name,
          contentDetail: res.data?.bannerDetailsContent,
          createTime: res.data?.createTime.toString(),
          viewsCount: res.data?.viewCount,
        },
      }))
  } else {
    request.value = () => getContent({ id: id.value })
  }
  await run()
})
onShareAppMessage(() => ({
  title: data.value?.title,
}))
onShareTimeline(() => ({
  title: data.value?.title,
}))
</script>
<template>
  <div class="flex-grow bg-white">
    <Article
      :title="data?.title"
      :author="{ name: '筑巢荟' }"
      :content="data?.contentDetail"
      :createAt="data?.createTime"
      :viewNum="data?.viewsCount || 0"
    >
      <template #avatar><wd-img width="28" height="28" :src="logo"></wd-img></template>
    </Article>
  </div>
</template>
