<template>
  <ie-page bg-color="#FFFFFF" :fix-height="true">
    <z-paging ref="pagingRef" v-model="historyList" :loading-more-enabled="false" @query="handleQuery">
      <template #top>
        <ie-navbar title="刷题记录" />
      </template>
      <view class="h-20 bg-[#F6F8FA]"></view>
      <view class="safe-area-inset-bottom">
        <view v-for="(item, index) in historyList" :key="index"
          class="bg-white px-40 py-30 flex items-center sibling-border-top">
          <view class="flex-1">
            <view class="text-28">
              <text class=" text-fore-light">知识点：</text>
              <text class="text-fore-title">{{ item.paperName }}</text>
            </view>
            <view class="mt-10 text-28">
              <text class=" text-fore-light">完成时间：</text>
              <text class="text-fore-title">{{ getTime(item.endTime) }}</text>
            </view>
          </view>
          <view class="text-24 text-white bg-primary w-fit px-40 py-12 rounded-full text-center"
            @click="handleViewHistory(item)">
            查看
          </view>
        </view>
      </view>
    </z-paging>
  </ie-page>
</template>
<script lang="ts" setup>
import { useNavbar } from '@/hooks/useNavbar';
import { useTransferPage } from '@/hooks/useTransferPage';
import { getPracticeHistory } from '@/api/modules/study';
import { Study } from '@/types';
import { Transfer } from '@/types';
import { EnumPaperType } from '@/common/enum';
import { formatTime } from '@/utils/format';

const { prevData, transferTo } = useTransferPage<{}, Transfer.PracticeResultPageOptions>();
const { baseStickyTop } = useNavbar();
const historyList = ref<Study.PracticeHistory[]>([]);
const handleViewHistory = (value: Study.PracticeHistory) => {
  transferTo('/pagesStudy/pages/knowledge-practice-detail/knowledge-practice-detail', {
    data: {
      paperType: EnumPaperType.PRACTICE,
      examineeId: value.examineeId,
      name: value.paperName,
      directed: value.directed === 1
    }
  });
}

const pagingRef = ref();
const getTime = (time: string) => {
  return formatTime(time, 'yyyy-mm-dd hh:MM:ss');
}
const handleQuery = (pageNum: number, pageSize: number) => {
  getPracticeHistory({
    pageNum,
    pageSize
  }).then(res => {
    historyList.value = res.rows.map(item => {
      return {
        ...item,
        endTime: uni.$uv.timeFormat(item.endTime, 'yyyy-mm-dd hh:MM:ss')
      } as Study.PracticeHistory;
    });
    pagingRef.value.complete(res.rows)
  }).catch(() => {
    pagingRef.value.complete(false);
  });
}
</script>
<style lang="scss" scoped></style>