"use client"

import { Paper, Stack, Tabs } from "@mantine/core"
import LabelWorkloadTable from "./LabelWorkloadTable"
import Review1WorkloadTable from "./Review1WorkloadTable"
import Review2WorkloadTable from "./Review2WorkloadTable"
import TaskListTable from "./TaskListTable"

export default function TeamWorkloadPage() {
  return (
    <Stack w="100%" h="calc(100vh - 56px)" p="md" gap="md">
      <Paper
        withBorder
        p="md"
        radius="md"
        style={{
          borderColor:
            "light-dark(var(--mantine-color-gray-4), var(--mantine-color-dark-4))",
          flex: 1,
          minHeight: 0,
          display: "flex",
          flexDirection: "column",
        }}>
        <Tabs
          defaultValue="label"
          variant="pills"
          radius="sm"
          styles={{
            root: { height: "100%", display: "flex", flexDirection: "column" },
            panel: { flex: 1, minHeight: 0, paddingTop: 12 },
          }}>
          <Tabs.List>
            <Tabs.Tab value="label">标注工时</Tabs.Tab>
            <Tabs.Tab value="review1">审核工时</Tabs.Tab>
            <Tabs.Tab value="review2">复审工时</Tabs.Tab>
            <Tabs.Tab value="task">全部任务</Tabs.Tab>
          </Tabs.List>

          <Tabs.Panel value="label">
            <LabelWorkloadTable />
          </Tabs.Panel>
          <Tabs.Panel value="review1">
            <Review1WorkloadTable />
          </Tabs.Panel>
          <Tabs.Panel value="review2">
            <Review2WorkloadTable />
          </Tabs.Panel>
          <Tabs.Panel value="task">
            <TaskListTable />
          </Tabs.Panel>
        </Tabs>
      </Paper>
    </Stack>
  )
}