From 02af807705a50a7b32d03373a8c1cb7402f17e2c Mon Sep 17 00:00:00 2001
From: kkfluous <kkfluous@kdemacbook-air.local>
Date: Sun, 29 Mar 2026 00:01:12 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E5=BA=93=E5=AD=98=E7=BB=9F=E8=AE=A1?=
 =?UTF-8?q?=E7=AD=9B=E9=80=89=E9=9D=A2=E6=9D=BF=E4=BC=98=E5=8C=96=EF=BC=8C?=
 =?UTF-8?q?=E5=8F=82=E8=80=83=E5=AE=A2=E6=88=B7=E7=AD=9B=E9=80=89=E6=A0=B7?=
 =?UTF-8?q?=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 标题改为"数据筛选"，重置改为红色
- 车型和批次改为并排两列布局
- 标签统一uppercase加粗样式
- 确认按钮加阴影，更醒目
- 整体间距和样式与客户筛选一致

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/App.tsx | 63 +++++++++++++++++++++++++----------------------------
 1 file changed, 30 insertions(+), 33 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index 903ca0f..acbf67e 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1045,56 +1045,53 @@ export default function App() {
                         initial={{ opacity: 0, y: 10, scale: 0.95 }}
                         animate={{ opacity: 1, y: 0, scale: 1 }}
                         exit={{ opacity: 0, y: 10, scale: 0.95 }}
-                        className="fixed inset-x-4 top-24 bottom-24 overflow-auto sm:top-auto sm:bottom-auto sm:left-auto sm:right-4 sm:w-80 sm:max-h-[80vh] bg-white rounded-xl shadow-2xl border border-slate-100 z-50 p-4"
+                        className="fixed inset-x-4 top-24 bottom-24 overflow-auto sm:top-auto sm:bottom-auto sm:left-auto sm:right-4 sm:w-72 sm:max-h-[80vh] bg-white rounded-xl shadow-2xl border border-slate-100 z-50 p-4"
                       >
-                        <div className="flex justify-between items-center mb-4">
-                          <h3 className="text-xs font-bold text-slate-800">库存统计 - 数据筛选</h3>
-                          <button
-                            onClick={() => setInventoryFilters({ region: '', city: '', brand: '', type: '', model: '' })}
-                            className="text-[10px] text-blue-500 hover:underline"
-                          >
-                            重置所有
-                          </button>
+                        <div className="flex justify-between items-center mb-3">
+                          <span className="text-sm font-bold text-gray-800">数据筛选</span>
+                          <button onClick={() => setInventoryFilters({ region: '', city: '', brand: '', type: '', model: '' })} className="text-[11px] text-red-500 hover:text-red-600 font-medium">重置所有</button>
                         </div>
 
-                        <div className="space-y-3 text-left">
-                          <div>
-                            <label className="text-[10px] text-slate-400 block mb-1">区域</label>
-                            <select value={inventoryFilters.region} onChange={(e) => setInventoryFilters({...inventoryFilters, region: e.target.value})} className="w-full text-xs bg-white border border-slate-200 rounded-lg px-2 py-1.5 focus:outline-none focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 transition-all shadow-sm cursor-pointer">
+                        <div className="space-y-4">
+                          <div className="space-y-1.5">
+                            <label className="text-[10px] font-bold text-gray-400 uppercase tracking-wider">区域</label>
+                            <select value={inventoryFilters.region} onChange={(e) => setInventoryFilters({...inventoryFilters, region: e.target.value})} className="w-full bg-white border border-gray-200 rounded-lg py-2 px-2 text-xs focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 outline-none transition-all cursor-pointer shadow-sm">
                               <option value="">全部区域</option>
                               {uniqueInventoryRegions.map(r => <option key={r} value={r}>{r}</option>)}
                             </select>
                           </div>
-                          <div>
-                            <label className="text-[10px] text-slate-400 block mb-1">城市</label>
-                            <select value={inventoryFilters.city} onChange={(e) => setInventoryFilters({...inventoryFilters, city: e.target.value})} className="w-full text-xs bg-white border border-slate-200 rounded-lg px-2 py-1.5 focus:outline-none focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 transition-all shadow-sm cursor-pointer">
+                          <div className="space-y-1.5">
+                            <label className="text-[10px] font-bold text-gray-400 uppercase tracking-wider">城市</label>
+                            <select value={inventoryFilters.city} onChange={(e) => setInventoryFilters({...inventoryFilters, city: e.target.value})} className="w-full bg-white border border-gray-200 rounded-lg py-2 px-2 text-xs focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 outline-none transition-all cursor-pointer shadow-sm">
                               <option value="">全部城市</option>
                               {uniqueInventoryCities.map(c => <option key={c} value={c}>{c}</option>)}
                             </select>
                           </div>
-                          <div>
-                            <label className="text-[10px] text-slate-400 block mb-1">品牌</label>
-                            <select value={inventoryFilters.brand} onChange={(e) => setInventoryFilters({...inventoryFilters, brand: e.target.value})} className="w-full text-xs bg-white border border-slate-200 rounded-lg px-2 py-1.5 focus:outline-none focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 transition-all shadow-sm cursor-pointer">
+                          <div className="space-y-1.5">
+                            <label className="text-[10px] font-bold text-gray-400 uppercase tracking-wider">品牌</label>
+                            <select value={inventoryFilters.brand} onChange={(e) => setInventoryFilters({...inventoryFilters, brand: e.target.value})} className="w-full bg-white border border-gray-200 rounded-lg py-2 px-2 text-xs focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 outline-none transition-all cursor-pointer shadow-sm">
                               <option value="">全部品牌</option>
                               {uniqueInventoryBrands.map(b => <option key={b} value={b}>{b}</option>)}
                             </select>
                           </div>
-                          <div>
-                            <label className="text-[10px] text-slate-400 block mb-1">车型</label>
-                            <select value={inventoryFilters.type} onChange={(e) => setInventoryFilters({...inventoryFilters, type: e.target.value, model: ''})} className="w-full text-xs bg-white border border-slate-200 rounded-lg px-2 py-1.5 focus:outline-none focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 transition-all shadow-sm cursor-pointer">
-                              <option value="">全部车型</option>
-                              {uniqueInventoryTypes.map(t => <option key={t} value={t}>{t}</option>)}
-                            </select>
-                          </div>
-                          <div>
-                            <label className="text-[10px] text-slate-400 block mb-1">批次</label>
-                            <select value={inventoryFilters.model} onChange={(e) => setInventoryFilters({...inventoryFilters, model: e.target.value})} className="w-full text-xs bg-white border border-slate-200 rounded-lg px-2 py-1.5 focus:outline-none focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 transition-all shadow-sm cursor-pointer">
-                              <option value="">全部批次</option>
-                              {uniqueInventoryModelsForType.map(m => <option key={m} value={m}>{m}</option>)}
-                            </select>
+                          <div className="grid grid-cols-2 gap-3">
+                            <div className="space-y-1.5">
+                              <label className="text-[10px] font-bold text-gray-400 uppercase tracking-wider">车型</label>
+                              <select value={inventoryFilters.type} onChange={(e) => setInventoryFilters({...inventoryFilters, type: e.target.value, model: ''})} className="w-full bg-white border border-gray-200 rounded-lg py-2 px-2 text-xs focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 outline-none transition-all cursor-pointer shadow-sm">
+                                <option value="">全部车型</option>
+                                {uniqueInventoryTypes.map(t => <option key={t} value={t}>{t}</option>)}
+                              </select>
+                            </div>
+                            <div className="space-y-1.5">
+                              <label className="text-[10px] font-bold text-gray-400 uppercase tracking-wider">批次</label>
+                              <select value={inventoryFilters.model} onChange={(e) => setInventoryFilters({...inventoryFilters, model: e.target.value})} className="w-full bg-white border border-gray-200 rounded-lg py-2 px-2 text-xs focus:ring-2 focus:ring-blue-500/20 focus:border-blue-500 outline-none transition-all cursor-pointer shadow-sm">
+                                <option value="">全部批次</option>
+                                {uniqueInventoryModelsForType.map(m => <option key={m} value={m}>{m}</option>)}
+                              </select>
+                            </div>
                           </div>
                         </div>
-                        <button onClick={() => setIsInventoryFilterOpen(false)} className="w-full mt-4 py-2 bg-blue-600 text-white rounded-lg text-xs font-bold hover:bg-blue-700 transition-colors">确认</button>
+                        <button onClick={() => setIsInventoryFilterOpen(false)} className="w-full mt-5 py-2.5 bg-blue-600 text-white rounded-lg text-xs font-bold hover:bg-blue-700 transition-colors shadow-lg shadow-blue-600/20">确认</button>
                       </motion.div>
                     </>
                   )}