<template>
  <view class="bg-white flex-1">
    <video-history-student v-if="isStudent" />
    <teacher-class-view v-else>
      <template #default="{ teachClass }">
        <view class="mt-30 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>
</template>
<script lang="ts" setup>
defineOptions({
  options: {
    virtualHost: true
  }
});
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>