<template>
  <ie-page bg-color="#F6F8FA" :fix-height="true">
    <ie-navbar :title="pageTitle" />
    <view class="h-20"></view>
    <view class="bg-white flex-1 min-h-1 relative">
      <view class="pt-30 px-32 text-30 text-fore-title font-bold">{{ prevData.name }}的视频观看统计</view>
      <video-table :data="data" />
    </view>
  </ie-page>
</template>
<script lang="ts" setup>
import videoTable from '@/pagesStudy/components/video-table.vue';
import { useTransferPage } from '@/hooks/useTransferPage';
import { useScroll } from '@/hooks/useScroll';
import { Study } from '@/types';
import { getStudentVideoStudyRecord } from '@/api/modules/study';

const { prevData } = useTransferPage();
const { scrollTop } = useScroll();
const data = ref<Study.VideoStudy>({} as Study.VideoStudy);

const pageTitle = computed(() => {
  if (scrollTop.value > 45) {
    return `学生刷题详情-${prevData.value.name}`;
  }
  return '学生刷题详情';
});

const loadData = async () => {
  uni.$ie.showLoading();
  try {
    const res = await getStudentVideoStudyRecord({
      recordId: prevData.value.recordId,
    });
    data.value = res.data;
  } finally {
    uni.$ie.hideLoading();
  }
}
onLoad(() => {
  loadData();
});
</script>
<style lang="scss" scoped></style>