details.vue 2.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. <template>
  2. <view class="d-flex flex-col bg-base">
  3. <SimplePageContentLoader :loader="loader">
  4. <template v-if="loader.content.value">
  5. <view class="d-flex flex-col p-3">
  6. <view class="d-flex flex-row justify-between">
  7. <view class="d-flex flex-col">
  8. <text class="size-lll font-bold color-text-content">{{ loader.content.value.title }}</text>
  9. <text class="size-base color-text-content-second mt-2">{{ loader.content.value.birthplace || loader.content.value.desc }}</text>
  10. <RoundTags
  11. :tags="loader.content.value.tags"
  12. :tags2="[
  13. loader.content.value.age as string,
  14. loader.content.value.nation as string
  15. ]"
  16. />
  17. </view>
  18. <image
  19. class="width-150 height-150 radius-base flex-shrink-0"
  20. :src="loader.content.value.image" mode="aspectFill"
  21. />
  22. </view>
  23. <view class="d-flex flex-col radius-l bg-light p-25 mt-3">
  24. <u-parse :content="loader.content.value.intro" :tagStyle="commonParserStyle"></u-parse>
  25. <u-parse :content="loader.content.value.content" :tagStyle="commonParserStyle"></u-parse>
  26. <u-parse :content="loader.content.value.value" :tagStyle="commonParserStyle"></u-parse>
  27. </view>
  28. </view>
  29. </template>
  30. </SimplePageContentLoader>
  31. </view>
  32. </template>
  33. <script setup lang="ts">
  34. import type { GetContentDetailItem } from "@/api/CommonContent";
  35. import { useSimplePageContentLoader } from "@/common/composeabe/SimplePageContentLoader";
  36. import { onLoad } from "@dcloudio/uni-app";
  37. import { navTo } from "@/common/utils/PageAction";
  38. import UnmoveableContent from "@/api/inheritor/UnmoveableContent";
  39. import SimplePageContentLoader from "@/common/components/SimplePageContentLoader.vue";
  40. import ImageWrapper from "@/common/components/ImageWrapper.vue";
  41. import RoundTags from "@/pages/parts/RoundTags.vue";
  42. import commonParserStyle from "@/common/style/commonParserStyle";
  43. import { useLoadQuerys } from "@/common/composeabe/LoadQuerys";
  44. const loader = useSimplePageContentLoader<
  45. GetContentDetailItem,
  46. { id: number }
  47. >(async (params) => {
  48. if (!params)
  49. throw new Error("!params");
  50. return await UnmoveableContent.getContentDetail(params.id);
  51. });
  52. useLoadQuerys({ id : 0 }, (p) => loader.loadData(p));
  53. </script>
  54. <style lang="scss">
  55. </style>