<template>
  <view class="flex-1 min-h-1 bg-white relative">
    <view class="absolute inset-0">
      <video-history-student v-if="isStudent" />
      <teacher-class-view v-else>
        <template #default="{ teachClass }">
          <view class="w-fit mx-auto">
            <ie-tab :options="tabList" v-model="currentSort" />
          </view>
          <video-history-teacher :teach-class="teachClass" :current-sort="currentSort" />
        </template>
      </teacher-class-view>
    </view>
  </view>
</template>
<script lang="ts" setup>
import videoHistoryStudent from './video-history-student.vue';
import videoHistoryTeacher from './video-history-teacher.vue';
import teacherClassView from '@/pagesStudy/components/teacher-class-view.vue';
import { OPEN_VIDEO_DETAIL } from '@/types/injectionSymbols';
import { useTransferPage } from '@/hooks/useTransferPage';
import { useUserStore } from '@/store/userStore';
const { transferTo } = useTransferPage();
const { isStudent } = storeToRefs(useUserStore());
const currentSort = ref('asc');
const tabList = ref([
  {
    label: '升序',
    value: 'asc'
  },
  {
    label: '降序',
    value: 'desc'
  }
])
const openVideoDetail = (recordId: number, name: string) => {
  transferTo('/pagesStudy/pages/study-video-detail/study-video-detail', {
    data: {
      recordId,
      name
    }
  });
}
provide(OPEN_VIDEO_DETAIL, openVideoDetail);
</script>
<style lang="scss" scoped></style>