import OHeader from '@/components/o-header'
import OSticky from '@/components/o-sticky'
import { Tabs, Tab } from 'vant'
import { defineComponent, reactive, ref } from 'vue'
import { useRouter } from 'vue-router'
import AttendStudent from './components/attend-student'
import AttendTeacher from './components/attend-teacher'
const activeName = ref('student')
export default defineComponent({
  name: 'school-attendance',
  setup() {
    const router = useRouter()
    const state = reactive({})

    return () => (
      <>
        <OSticky position="top" background="#F8F8F8">
          <OHeader isBack={true}></OHeader>
          <Tabs v-model:active={activeName.value}>
            <Tab name="student" title="学生考勤"></Tab>
            <Tab name="teacher" title="伴学指导考勤"></Tab>
          </Tabs>
        </OSticky>

        {activeName.value == 'student' ? (
          <AttendStudent></AttendStudent>
        ) : (
          <AttendTeacher></AttendTeacher>
        )}
      </>
    )
  }
})