<template>
  <el-tabs v-model="activeTab" type="card" class="page-tab">
    <el-tab-pane name="course">
      <template #label>
        <el-button :type="activeTab === 'course' ? 'primary' : 'default'"
          >按科目统计</el-button
        >
      </template>
      <ScanCourseStats />
    </el-tab-pane>
    <el-tab-pane name="point">
      <template #label>
        <el-button :type="activeTab === 'point' ? 'primary' : 'default'"
          >按考点统计</el-button
        >
      </template>
      <ScanPointStats />
    </el-tab-pane>
    <el-tab-pane name="signPaper">
      <template #label>
        <el-button :type="activeTab === 'signPaper' ? 'primary' : 'default'"
          >签到表统计</el-button
        >
      </template>
      <SignPaperStats />
    </el-tab-pane>
  </el-tabs>
</template>

<script setup lang="ts">
  import { ref } from 'vue';
  import { useRoute } from 'vue-router';

  import ScanCourseStats from './ScanCourseStats.vue';
  import ScanPointStats from './ScanPointStats.vue';
  import SignPaperStats from './SignPaperStats.vue';

  defineOptions({
    name: 'ScanManage',
  });

  const route = useRoute();
  // 从路由参数获取tab值，默认为course
  const activeTab = ref((route.query.tab as string) || 'course');
</script>
