From 015ff9bc7ed804e015d0018269356fefda06eee0 Mon Sep 17 00:00:00 2001
From: kkfluous <kkfluous@kdemacbook-air.local>
Date: Thu, 30 Apr 2026 15:11:19 +0800
Subject: [PATCH] =?UTF-8?q?fix(energy):=20=E7=AB=99=E5=90=8D=E9=95=BF?=
 =?UTF-8?q?=E5=90=8D=E7=A7=B0=E4=B8=8D=E5=86=8D=E6=8D=A2=E8=A1=8C=20+=20?=
 =?UTF-8?q?=E3=80=8C=E7=BE=9A=E7=89=9B/=E5=A4=96=E9=83=A8=E3=80=8D?=
 =?UTF-8?q?=E6=94=B9=E4=B8=BA=E3=80=8C=E7=BE=9A=E7=89=9B=E8=BD=A6=E8=BE=86?=
 =?UTF-8?q?/=E5=A4=96=E9=83=A8=E8=BD=A6=E8=BE=86=E3=80=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

问题 1：广州新锋交通联新加氢站 等长名称在右侧空间足够时仍折行
- mobile 列宽过宽：120px (kg) + 88px (chainPct) 占去 232px
- 子行 pl-9 缩进 (36px) 也吃掉空间
修复：
  - mobile 列宽收紧 84/80，gap 缩到 2，子行缩进 pl-6
  - 名字 + 单价徽章改为 inline-flex（whitespace-nowrap）
    名字一行写完，单价徽章紧跟其后；空间不够时单价徽章自动换到下一行
  - desktop 列宽 140/120/104（之前 140/140/120）

问题 2：氢/电 daily 客户类型 segmented control
  「羚牛」→「羚牛车辆」，「外部」→「外部车辆」更明确

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 src/modules/energy/ElectricDaily.tsx |  2 +-
 src/modules/energy/HydrogenDaily.tsx | 22 +++++++++++-----------
 2 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/modules/energy/ElectricDaily.tsx b/src/modules/energy/ElectricDaily.tsx
index 8d12c7a..d259004 100644
--- a/src/modules/energy/ElectricDaily.tsx
+++ b/src/modules/energy/ElectricDaily.tsx
@@ -68,7 +68,7 @@ export default function ElectricDaily() {
               customer === c ? 'bg-white shadow-sm text-slate-800' : 'text-slate-500'
             }`}
           >
-            {c === 'external' ? '外部' : '羚牛'}
+            {c === 'external' ? '外部车辆' : '羚牛车辆'}
           </button>
         ))}
       </div>
diff --git a/src/modules/energy/HydrogenDaily.tsx b/src/modules/energy/HydrogenDaily.tsx
index 74aa8e5..62a3755 100644
--- a/src/modules/energy/HydrogenDaily.tsx
+++ b/src/modules/energy/HydrogenDaily.tsx
@@ -68,7 +68,7 @@ export default function HydrogenDaily() {
               customer === c ? 'bg-white shadow-sm text-slate-800' : 'text-slate-500'
             }`}
           >
-            {c === 'external' ? '外部' : '羚牛'}
+            {c === 'external' ? '外部车辆' : '羚牛车辆'}
           </button>
         ))}
       </div>
@@ -137,14 +137,14 @@ export default function HydrogenDaily() {
       {!(customer === 'external' && rows !== null && rows.length === 0) && (
       <div className="bg-white rounded-2xl border border-slate-100 shadow-sm overflow-hidden">
         {/* 表头 */}
-        <div className="grid grid-cols-[minmax(0,1fr)_120px_88px] md:grid-cols-[minmax(0,1fr)_140px_140px_120px] gap-3 px-3 py-2 bg-slate-50 text-[11px] font-bold text-slate-500">
+        <div className="grid grid-cols-[minmax(0,1fr)_84px_80px] md:grid-cols-[minmax(0,1fr)_140px_120px_104px] gap-2 md:gap-3 px-3 py-2 bg-slate-50 text-[11px] font-bold text-slate-500">
           <span>日期 / 加氢站</span>
           <span className="hidden md:block text-right">单价 (元/Kg)</span>
           <span className="text-right">加氢量 (Kg)</span>
           <span className="text-right">环比</span>
         </div>
         {/* 合计行 */}
-        <div className="grid grid-cols-[minmax(0,1fr)_120px_88px] md:grid-cols-[minmax(0,1fr)_140px_140px_120px] gap-3 px-3 py-2 bg-blue-50/50 text-[12px] text-blue-600 font-bold">
+        <div className="grid grid-cols-[minmax(0,1fr)_84px_80px] md:grid-cols-[minmax(0,1fr)_140px_120px_104px] gap-2 md:gap-3 px-3 py-2 bg-blue-50/50 text-[12px] text-blue-600 font-bold">
           <span>合计</span>
           <span className="hidden md:block" />
           <span className="text-right">{totalKg.toLocaleString('zh-CN', { maximumFractionDigits: 2 })}</span>
@@ -167,7 +167,7 @@ export default function HydrogenDaily() {
             <div key={r.date} className={`border-t border-slate-100 ${abnormalBg}`}>
               <button
                 onClick={() => toggle(r.date)}
-                className="w-full grid grid-cols-[minmax(0,1fr)_120px_88px] md:grid-cols-[minmax(0,1fr)_140px_140px_120px] gap-3 px-3 py-2.5 text-left hover:bg-slate-50/60 transition-colors"
+                className="w-full grid grid-cols-[minmax(0,1fr)_84px_80px] md:grid-cols-[minmax(0,1fr)_140px_120px_104px] gap-2 md:gap-3 px-3 py-2.5 text-left hover:bg-slate-50/60 transition-colors"
               >
                 <span className="flex items-center gap-1 text-[12px] text-slate-700 font-bold">
                   <ChevronRight size={14} className={`transition-transform ${open ? 'rotate-90' : ''} text-slate-400`} />
@@ -191,16 +191,16 @@ export default function HydrogenDaily() {
                     {r.stations.map(s => (
                       <div
                         key={s.name}
-                        className="grid grid-cols-[minmax(0,1fr)_120px_88px] md:grid-cols-[minmax(0,1fr)_140px_140px_120px] gap-3 px-3 py-2.5 pl-9 border-t border-slate-100 first:border-t-0 items-start"
+                        className="grid grid-cols-[minmax(0,1fr)_84px_80px] md:grid-cols-[minmax(0,1fr)_140px_120px_104px] gap-2 md:gap-3 px-3 py-2 pl-6 md:pl-9 border-t border-slate-100 first:border-t-0 items-center"
                       >
-                        <div className="min-w-0">
-                          <div className="text-[12px] text-slate-700 font-medium leading-snug break-words">
+                        <div className="min-w-0 flex items-center gap-1.5 flex-wrap">
+                          <span className="text-[12px] text-slate-700 font-medium whitespace-nowrap">
                             {s.name}
-                          </div>
+                          </span>
                           {s.pricePerKg > 0 && (
-                            <div className="md:hidden mt-1 inline-flex items-center gap-1 text-[10px] text-amber-600 bg-amber-50 px-1.5 py-0.5 rounded font-bold">
-                              单价 {s.pricePerKg} 元/Kg
-                            </div>
+                            <span className="md:hidden inline-flex items-center text-[10px] text-amber-600 bg-amber-50 px-1.5 py-0.5 rounded font-bold whitespace-nowrap">
+                              {s.pricePerKg} 元/Kg
+                            </span>
                           )}
                         </div>
                         <span className="hidden md:block text-right text-[12px] text-slate-500 font-bold tabular-nums">{s.pricePerKg > 0 ? s.pricePerKg : '—'}</span>