fix(energy): 日期速选并入 sticky 头部，避免滚动时被遮挡

之前「本周/本月/近 15 天」放在 HydrogenDaily/ElectricDaily 的
内容区第一行，sticky 头部独占顶部。滚动后这一行会从 sticky
头部下方钻过去，露出半截，看起来像被切。

修复：把日期速选行也放进 sticky 头部白卡里：
  - EnergyModule 持有 hydroPick / electricPick state
  - 头部第三行（border-t 分割）渲染速选按钮，仅 daily 模式显示
  - HydrogenView/ElectricView/ElectricDaily/HydrogenDaily 改为
    通过 pick prop 接收，组件内不再 useState

现在头部「Top Tab + Sub Tab + 日期速选」是同一张白卡，
滚动时整体一起 sticky，不再有半截遮挡。

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/modules/energy/EnergyModule.tsx

@@ -4,6 +4,13 @@ import { motion } from 'motion/react';
 import HydrogenView, { type HydrogenSubTab } from './HydrogenView';
 import ElectricView, { type ElectricSubTab } from './ElectricView';
 import ETCView from './ETCView';
+import type { DateQuickPick } from './types';
+
+const QUICK_PICK_OPTIONS: Array<{ id: DateQuickPick; label: string }> = [
+  { id: 'thisWeek',  label: '本周'    },
+  { id: 'thisMonth', label: '本月'    },
+  { id: 'last15',    label: '近 15 天' },
+];
 
 type TopTab = 'hydrogen' | 'electric' | 'etc';
 type SubTabId = HydrogenSubTab | ElectricSubTab; // 'daily' | 'overview'
@@ -23,9 +30,16 @@ export default function EnergyModule() {
   const [activeTab, setActiveTab] = useState<TopTab>('hydrogen');
   const [hydroSub, setHydroSub] = useState<HydrogenSubTab>('daily');
   const [electricSub, setElectricSub] = useState<ElectricSubTab>('daily');
+  const [hydroPick, setHydroPick] = useState<DateQuickPick>('last15');
+  const [electricPick, setElectricPick] = useState<DateQuickPick>('last15');
   const showSubTabs = activeTab === 'hydrogen' || activeTab === 'electric';
   const currentSub: SubTabId = activeTab === 'electric' ? electricSub : hydroSub;
   const setSub = (id: SubTabId) => activeTab === 'electric' ? setElectricSub(id) : setHydroSub(id);
+  // 是否在 daily 模式（需要在 sticky 头部展示日期速选）
+  const showQuickPick = (activeTab === 'hydrogen' && hydroSub === 'daily')
+                     || (activeTab === 'electric' && electricSub === 'daily');
+  const currentPick: DateQuickPick = activeTab === 'electric' ? electricPick : hydroPick;
+  const setPick = (id: DateQuickPick) => activeTab === 'electric' ? setElectricPick(id) : setHydroPick(id);
   return (
     <div className="min-h-screen bg-[#F8F9FB] text-gray-800 font-sans p-3 md:p-6 relative" style={{ overflowX: 'clip' }}>
       <div className="max-w-6xl mx-auto flex flex-col gap-3 pb-16 landscape:pb-0 landscape:h-full landscape:flex-1 landscape:overflow-hidden">
@@ -74,11 +88,32 @@ export default function EnergyModule() {
                 })}
               </div>
             )}
+            {/* 日期速选：daily 模式时跟着 sticky，避免滚动后被遮挡 */}
+            {showQuickPick && (
+              <div className="px-2 pb-2 pt-1 border-t border-slate-50 flex items-center gap-2 overflow-x-auto">
+                {QUICK_PICK_OPTIONS.map(opt => {
+                  const active = currentPick === opt.id;
+                  return (
+                    <button
+                      key={opt.id}
+                      onClick={() => setPick(opt.id)}
+                      className={`shrink-0 rounded-lg px-3 py-1 text-[11px] font-bold border transition-colors ${
+                        active
+                          ? 'bg-blue-50 text-blue-600 border-blue-200'
+                          : 'bg-white text-slate-500 border-slate-200 hover:bg-slate-50'
+                      }`}
+                    >
+                      {opt.label}
+                    </button>
+                  );
+                })}
+              </div>
+            )}
           </div>
         </div>
 
-        {activeTab === 'hydrogen' && <HydrogenView sub={hydroSub} />}
-        {activeTab === 'electric' && <ElectricView sub={electricSub} />}
+        {activeTab === 'hydrogen' && <HydrogenView sub={hydroSub} pick={hydroPick} />}
+        {activeTab === 'electric' && <ElectricView sub={electricSub} pick={electricPick} />}
         {activeTab === 'etc' && <ETCView />}
       </div>
     </div>