From 74f0018962bde6a6e5a9ffc9a6ffdb3e1e376bf7 Mon Sep 17 00:00:00 2001
From: zhaoying <yzhao96@best-inc.com>
Date: Tue, 27 Jan 2026 19:17:32 +0800
Subject: [PATCH] feat(web): add PageTabs component

---
 web/src/components/PageTabs/index.module.css | 13 +++++++++++++
 web/src/components/PageTabs/index.tsx        | 18 ++++++++++++++++++
 2 files changed, 31 insertions(+)
 create mode 100644 web/src/components/PageTabs/index.module.css
 create mode 100644 web/src/components/PageTabs/index.tsx

diff --git a/web/src/components/PageTabs/index.module.css b/web/src/components/PageTabs/index.module.css
new file mode 100644
index 00000000..6eab8a48
--- /dev/null
+++ b/web/src/components/PageTabs/index.module.css
@@ -0,0 +1,13 @@
+.page-tabs:global(.ant-segmented) {
+  background-color: rgba(91, 97, 103, 0.08);
+  padding: 4px;
+}
+.page-tabs:global(.ant-segmented .ant-segmented-item-label) {
+  line-height: 24px;
+  min-height: 24px;
+  padding: 0 12px;
+}
+
+.page-tabs:global(.ant-segmented .ant-segmented-item-selected) {
+  box-shadow: 0px 2px 4px 0px rgba(33, 35, 50, 0.16);
+}
\ No newline at end of file
diff --git a/web/src/components/PageTabs/index.tsx b/web/src/components/PageTabs/index.tsx
new file mode 100644
index 00000000..33f02097
--- /dev/null
+++ b/web/src/components/PageTabs/index.tsx
@@ -0,0 +1,18 @@
+import { type FC } from 'react';
+import { Segmented, type SegmentedProps } from 'antd';
+import styles from './index.module.css';
+
+const PageTabs: FC<SegmentedProps> = ({
+  value,
+  options,
+  onChange
+}) => {
+  return <Segmented
+    value={value}
+    options={options}
+    onChange={onChange}
+    className={styles.pageTabs}
+  />;
+};
+
+export default PageTabs;