<template>
  <nav-bar title="精彩活动"  />
  <div class="px-5 py-8">
    <p class="text-base text-gray-800 font-semibold">{{ title }}</p>
    <p class="text-xs text-gray-400 mt-5">发布时间 {{ timestampFormat(created_at) }}</p>
    <img :src="src" class="text-center" />
    <p class="text-sm text-gray-800 text-justify mt-5" v-html="content"></p>
  </div>
</template>

<script lang="ts" setup>
import NavBar from "@/components/NavBar/index.vue";
import { useRoute } from "vue-router";
import { queryActivityInfo } from "@/service/ActivityService/index";
import { onMounted } from "@vue/runtime-core";
import { ref } from "vue";
import { getImageSrcFromFileHash } from "@/service/FileService";
import { timestampFormat } from "@/utils/time"

const uuid = useRoute().params.uuid as string;
const title = ref("");
const created_at = ref(0);
const content = ref("");
const file_name = ref("");
const src = ref("");

onMounted(() => {
  queryActivityInfo({ uuid: uuid }).then((ret) => {
    if (ret.code === 200) {
      title.value = ret.data.title;
      created_at.value = ret.data.created_at;
      content.value = ret.data.content;
      file_name.value = ret.data.file_name;
      src.value = getImageSrcFromFileHash(file_name.value);
    }
  });
});

</script>

<style scoped>
</style>