From bdb6bb8200809c76c39a7e3e36c4afe005a2bdff Mon Sep 17 00:00:00 2001
From: yml2213 <a2213290201@gmail.com>
Date: Sat, 15 Aug 2026 15:33:25 +0800
Subject: [PATCH] =?UTF-8?q?=E6=94=AF=E6=8C=81=E7=89=A9=E5=93=81=E8=A7=84?=
 =?UTF-8?q?=E5=88=99=E5=88=86=E7=B1=BB=E7=AD=9B=E9=80=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../pages/admin/panels/ProductRulesPanel.tsx  | 23 +++++++++++++++++--
 apps/frontend/src/styles/main.css             | 20 ++++++++++++++++
 2 files changed, 41 insertions(+), 2 deletions(-)

diff --git a/apps/frontend/src/pages/admin/panels/ProductRulesPanel.tsx b/apps/frontend/src/pages/admin/panels/ProductRulesPanel.tsx
index 3cd69c6b..928cb45e 100644
--- a/apps/frontend/src/pages/admin/panels/ProductRulesPanel.tsx
+++ b/apps/frontend/src/pages/admin/panels/ProductRulesPanel.tsx
@@ -202,8 +202,10 @@ export default function ProductRulesPanel() {
   }
 
   const [keyword, setKeyword] = useState('')
+  const [categoryId, setCategoryId] = useState<number | undefined>()
 
   const filteredRules = (rulesQuery.data?.data.items || []).filter((rule) => {
+    if (categoryId && Number(rule.categoryId || 0) !== categoryId) return false
     const keywordText = keyword.trim().toLowerCase()
     if (!keywordText) return true
     return [
@@ -625,9 +627,26 @@ export default function ProductRulesPanel() {
         </Card>
         <Card
           className="product-rules-list-card"
-          title="物品规则"
+          title={
+            <div className="product-rules-list-heading">
+              <span>物品规则</span>
+              <Tabs
+                className="product-rules-category-tabs"
+                size="small"
+                activeKey={categoryId ? String(categoryId) : 'all'}
+                onChange={(key) => setCategoryId(key === 'all' ? undefined : Number(key))}
+                items={[
+                  { key: 'all', label: '全部' },
+                  ...(categoriesQuery.data?.data.items || []).map((item) => ({
+                    key: String(item.categoryId),
+                    label: item.name,
+                  })),
+                ]}
+              />
+            </div>
+          }
           extra={
-            <Space>
+            <Space wrap>
               <Input.Search
                 allowClear
                 placeholder="搜索规则标识/商品/SKU/店铺"
diff --git a/apps/frontend/src/styles/main.css b/apps/frontend/src/styles/main.css
index 69b57ceb..1323e531 100644
--- a/apps/frontend/src/styles/main.css
+++ b/apps/frontend/src/styles/main.css
@@ -2530,6 +2530,26 @@ select {
   min-width: 0;
 }
 
+.product-rules-list-heading {
+  display: flex;
+  align-items: center;
+  gap: 20px;
+  min-width: 0;
+}
+
+.product-rules-category-tabs {
+  min-width: 0;
+  transform: translateY(-6px);
+}
+
+.product-rules-category-tabs .ant-tabs-nav {
+  margin: 0;
+}
+
+.product-rules-category-tabs .ant-tabs-content-holder {
+  display: none;
+}
+
 .product-rules-list-card .ant-card-body {
   max-height: calc(100vh - 150px);
   overflow-y: auto;