From 6a7cde2ca66de8a6e2575fceb5728b027d28a3f6 Mon Sep 17 00:00:00 2001
From: chengma <chengma2027@gmail.com>
Date: Fri, 7 Aug 2026 17:13:42 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E9=A1=BA=E8=BF=90=E5=AE=9D=E9=A1=B5?=
 =?UTF-8?q?=E4=B8=8E=E9=87=87=E9=9B=86=E9=87=87=E8=B4=AD=E9=A1=B5=E6=90=9C?=
 =?UTF-8?q?=E7=B4=A2=E6=A1=86=E6=94=B6=E7=AA=84=20(#34)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

跟上 #23 给 PDD 页做的：搜索框收到 30%，「搜索」按钮紧挨输入框。
蝦皮数据页和客户端列表页按用户要求暂不动。

复用 #23 已有的 .search-narrow 类，没有为这两页新写 CSS 规则——
多写一条就多一处将来要同步的地方。全局规则
.toolbar input[type="text"] 一字未动，它被五个页面共用。

搜索按钮靠左没有加对齐样式，是收窄的自然结果：输入框不再伸展之后，
多余空间留在按钮之后。额外加 margin-right:auto 之类会和 grow 叠加出
难预料的结果。两个表单的 grow 都保留，它负责把删除按钮顶到最右侧。

/tasks 的 placeholder 从「任务编号 / 订单号 / PDD 商品 ID」缩成
「任务编号 / 订单号 / 商品 ID」——收到 30% 之后原文案装不下，
会被截断成看不出意思的半截。缩文案而不是调回宽度。

文档把这条规则从 §5.1 提到 §3.1 表格通用规则里，三个页面都指向它。
原来写在 PDD 页那一节，另外两页要用时看不到。

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
---
 admin/static/css/app.css       | 3 ++-
 admin/templates/syb/list.html  | 5 ++++-
 admin/templates/task/list.html | 4 +++-
 3 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/admin/static/css/app.css b/admin/static/css/app.css
index 2b724de..3eef8e7 100644
--- a/admin/static/css/app.css
+++ b/admin/static/css/app.css
@@ -63,7 +63,8 @@ body {
 /* 搜索表单占据剩余空间，把删除按钮挤到右边 */
 .toolbar .grow { flex: 1; }
 .toolbar label { color: #555; white-space: nowrap; }
-/* 搜索框收窄到 30%（目前只有 PDD 页用）。
+/* 搜索框收窄到 30%。目前 PDD 商品页、顺运宝数据页、采集采购页在用；
+   蝦皮数据页和客户端列表页仍是撑满的。
    这样搜索表单里就没有会伸展的元素了，多余空间留在按钮之后，
    「搜索」按钮自然贴着输入框，不会被顶到很右边。
    用 flex 而不是 width：工具条是 flex 布局，width 会被 flex-grow 盖掉。
diff --git a/admin/templates/syb/list.html b/admin/templates/syb/list.html
index 0b9b350..ef2ebaf 100644
--- a/admin/templates/syb/list.html
+++ b/admin/templates/syb/list.html
@@ -14,7 +14,10 @@
 
   <form class="inline grow" method="get" action="/syb">
     <label for="q">订单号</label>
-    <input id="q" type="text" name="order_no" value="{{.Keyword}}" placeholder="订单号">
+    {{/* search-narrow 把搜索框收到 30%，让「搜索」按钮紧挨着它。
+         用类名而不是改 .toolbar input[type="text"]——那条被五个页面共用。 */}}
+    <input id="q" type="text" name="order_no" value="{{.Keyword}}"
+           class="search-narrow" placeholder="订单号">
     <button type="submit">搜索</button>
   </form>
 
diff --git a/admin/templates/task/list.html b/admin/templates/task/list.html
index d2a6d45..e84ff30 100644
--- a/admin/templates/task/list.html
+++ b/admin/templates/task/list.html
@@ -24,8 +24,10 @@
     <input type="hidden" name="type" value="{{.TypeFilter}}">
     <input type="hidden" name="status" value="{{.StatusFilter}}">
     <label for="q">关键词</label>
+    {{/* search-narrow 把搜索框收到 30%，让「搜索」按钮紧挨着它。
+         用类名而不是改 .toolbar input[type="text"]——那条被五个页面共用。 */}}
     <input id="q" type="text" name="q" value="{{.Keyword}}"
-           placeholder="任务编号 / 订单号 / PDD 商品 ID">
+           class="search-narrow" placeholder="任务编号 / 订单号 / 商品 ID">
     <button type="submit">搜索</button>
   </form>