
<template>
  <div class="flex flex-col w-320px min-w-320px min-h-0">
    <n-tabs v-model:value="topicType" type="line" animated>
      <n-tab-pane name="normal" tab="普通题目">
        <right-topic-list-normal :currBookPage="currBookPage"></right-topic-list-normal>
      </n-tab-pane>
      <n-tab-pane name="special" tab="特殊区域">
        <right-topic-list-special :currBookPage="currBookPage"></right-topic-list-special>
      </n-tab-pane>
    </n-tabs>
  </div>
</template>

<script setup lang="ts">
  import { ref, type PropType } from 'vue';
  import { NTabs, NTabPane } from 'naive-ui';
  import type { CurrBookPageAllInfo } from '../../types';
  import RightTopicListSpecial from './components/right-topic-list-special/right-topic-list-special.vue';
  import RightTopicListNormal from './components/right-topic-list-normal/right-topic-list-normal.vue';

  const props = defineProps({
    /** 当前页码信息 */
    currBookPage: { type: Object as PropType<CurrBookPageAllInfo>, default: undefined },
  });

  /** 题的类型 正常或特殊 */
  const topicType = ref<'normal' | 'special'>('normal');
</script>

<style scoped></style>
