<route lang="json">
{
  "style": {
    "navigationBarTitleText": "活动图片",
    "navigationBarBackgroundColor": "#ffffff"
  }
}
</route>
<script setup lang="ts">
import { getPhotoList } from '../../../../core/libs/requests'
import SectionHeading from '@/components/section-heading.vue'
import dayjs from 'dayjs'

const id = ref()
const type = ref()
const { data, run: setData } = useRequest(
  () =>
    getPhotoList({
      bizId: id.value,
      bizType: { studyTour: '2', activity: '1' }[type.value],
      pageSize: -1,
    }),
  { initialData: { list: [], total: 0 } },
)
onLoad(async (query: { id: string; type: 'activity' | 'studyTour'; title: string }) => {
  await uni.setNavigationBarTitle({ title: query.title })
  id.value = query.id
  type.value = query.type
  await setData()
})
</script>
<template>
  <div class="flex flex-col flex-grow p-4 bg-white gap-4">
    <template v-for="(it, i) in data.list" :key="i">
      <SectionHeading
        :title="'第' + Number(i + 1) + '天 ' + dayjs(it.travelDate).format('YYYY-MM-DD')"
      ></SectionHeading>
      <template v-for="(video, index) in it.video" :key="index">
        <video class="w-full" :src="video"></video>
      </template>
      <template v-for="(img, index) in it.picture" :key="index">
        <wd-img width="100%" mode="widthFix" :src="img" enable-preview show-menu-by-longpress />
      </template>
    </template>
  </div>
</template>
