<script lang="ts" setup>
import { getCourseDetail } from "~/api/course";

definePageMeta({
  requiresAuth: true,
});

const {
  params: { id: courseId },
} = useRoute();

// const loginState = useLoginState();
const course = await getCourseDetail(courseId as string);
</script>

<template>
  <div class="flex flex-col gap-4 px-4 py-2">
    <div class="flex justify-between items-start">
      <h1 class="text-xl font-medium">
        课程班级管理
        <span class="block text-sm text-muted-foreground">
          课程负责人：{{ course.data.teacherName || "未知" }}
        </span>
      </h1>
      <div class="flex items-center gap-4">
        <Button variant="secondary" size="sm" class="flex items-center gap-1">
          <Icon name="tabler:plus" size="16px" />
          <span>创建班级</span>
        </Button>
      </div>
    </div>

    <div v-if="false"></div>
    <EmptyScreen
      v-else
      title="暂无班级"
      description="课程下没有班级，请创建新的班级"
      icon="fluent-color:people-list-24"
    />
  </div>
</template>

<style scoped></style>
