<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">
      <view class="pt-30 px-30 text-30 text-fore-title font-bold">{{ prevData.name }}的知识点记录</view>
      <knowledge-table :data="tableList" />
    </view>
  </ie-page>
</template>
<script lang="ts" setup>
import knowledgeTable from '@/pagesStudy/components/knowledge-table.vue';
import { useTransferPage } from '@/hooks/useTransferPage';
import { useScroll } from '@/hooks/useScroll';
import { getStudentKnowledgeRecord } from '@/api/modules/study';
import { Study } from '@/types';

const { prevData } = useTransferPage();
const recordId = ref();
const { scrollTop } = useScroll();
const tableList = ref<Study.KnowledgeRecord[]>([]);

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

const loadData = async () => {
  uni.$ie.showLoading();
  try {
    const { rows } = await getStudentKnowledgeRecord({
      recordId: recordId.value,
    });
    tableList.value = rows;
  } finally {
    uni.$ie.hideLoading();
  }

}
onLoad(() => {
  recordId.value = prevData.value.recordId;
  loadData();
});
</script>
<style lang="scss" scoped></style>