feat(workload): add workload list

app/person/workload/page.tsx

@@ -0,0 +1,87 @@
+"use client"
+
+import {
+  SettingPage,
+  settingSurfaceClassNames,
+  settingTabsClassNames,
+  settingTabsStyles,
+} from "@/components/setting/PageSurface"
+import { Stack, Tabs, Text } from "@mantine/core"
+import { useState } from "react"
+import LabelWorkloadTable from "./LabelWorkloadTable"
+import Review1WorkloadTable from "./Review1WorkloadTable"
+import Review2WorkloadTable from "./Review2WorkloadTable"
+
+type WorkloadTab = "label" | "review1" | "review2"
+
+function createVisitedTabs() {
+  return {
+    label: true,
+    review1: false,
+    review2: false,
+    task: false,
+  }
+}
+
+export default function TeamWorkloadPage() {
+  const moduleTitle = "个人中心"
+  const [activeTab, setActiveTab] = useState<WorkloadTab>("label")
+  const [visitedTabs, setVisitedTabs] = useState(createVisitedTabs)
+
+  const handleTabChange = (value: string | null) => {
+    if (!value) return
+
+    const nextTab = value as WorkloadTab
+    setActiveTab(nextTab)
+    setVisitedTabs((current) =>
+      current[nextTab] ? current : { ...current, [nextTab]: true }
+    )
+  }
+
+  return (
+    <SettingPage>
+      <Stack className={settingSurfaceClassNames.pageIntro}>
+        <Text className={settingSurfaceClassNames.breadcrumb}>
+          {moduleTitle} /{" "}
+          <span className={settingSurfaceClassNames.breadcrumbCurrent}>
+            工时列表
+          </span>
+        </Text>
+      </Stack>
+      <Tabs
+        value={activeTab}
+        onChange={handleTabChange}
+        variant="pills"
+        color="#1874FF"
+        autoContrast
+        radius="sm"
+        classNames={settingTabsClassNames}
+        styles={{
+          root: {
+            flex: 1,
+            minHeight: 0,
+            minWidth: 0,
+            display: "flex",
+            flexDirection: "column",
+          },
+          ...settingTabsStyles,
+        }}>
+        <Tabs.List>
+          <Tabs.Tab value="label">标注工时</Tabs.Tab>
+          <Tabs.Tab value="review1">审核工时</Tabs.Tab>
+          <Tabs.Tab value="review2">复审工时</Tabs.Tab>
+        </Tabs.List>
+
+        <Tabs.Panel value="label">
+          {visitedTabs.label ? <LabelWorkloadTable /> : null}
+        </Tabs.Panel>
+        <Tabs.Panel value="review1">
+          {visitedTabs.review1 ? <Review1WorkloadTable /> : null}
+        </Tabs.Panel>
+        <Tabs.Panel value="review2">
+          {visitedTabs.review2 ? <Review2WorkloadTable /> : null}
+        </Tabs.Panel>
+      </Tabs>
+    </SettingPage>
+  )
+}