From fe70ec389bde211ea06e0a5adba3b0817bc8186f Mon Sep 17 00:00:00 2001
From: kkfluous <kkfluous@kdemacbook-air.local>
Date: Thu, 30 Apr 2026 15:22:02 +0800
Subject: [PATCH] =?UTF-8?q?refactor(energy):=20=E7=94=B5=E8=83=BD=E6=95=B4?=
 =?UTF-8?q?=E4=BD=93=E9=A1=B5=E9=9D=A2=E5=AF=B9=E9=BD=90=E6=B0=A2=E8=83=BD?=
 =?UTF-8?q?=EF=BC=9A=E6=AF=8F=E6=97=A5=20/=20=E6=80=BB=E8=A7=88=20?=
 =?UTF-8?q?=E5=AD=90=20tab=20=E5=88=87=E6=8D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- ElectricView 改为受控组件接收 sub prop（与 HydrogenView 对齐）
- EnergyModule sticky 头部统一显示 sub-tabs：氢能、电能都给 每日 / 总览
  ETC 仍不显示子 tab（建设中页）
- 共享 sub state 抽 helper：activeTab 切换时自动用对应的 sub
- 龙王路停车场充电站信息条移入 ElectricOverview 顶部（同氢能"数据自..."）

进入电能默认显示「每日」（与氢能一致），切换「总览」看 KPI + 柱图

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 src/modules/energy/ElectricOverview.tsx |  3 +++
 src/modules/energy/ElectricView.tsx     | 18 ++++++++----------
 src/modules/energy/EnergyModule.tsx     | 23 ++++++++++++++---------
 3 files changed, 25 insertions(+), 19 deletions(-)

diff --git a/src/modules/energy/ElectricOverview.tsx b/src/modules/energy/ElectricOverview.tsx
index eb8b076..2ff711b 100644
--- a/src/modules/energy/ElectricOverview.tsx
+++ b/src/modules/energy/ElectricOverview.tsx
@@ -40,6 +40,9 @@ export default function ElectricOverview() {
 
   return (
     <div className="flex flex-col gap-3">
+      <div className="bg-white rounded-xl border border-slate-100 px-3 py-1.5 text-[11px] text-slate-400">
+        龙王路停车场充电站，期初 2025-01-01，手工导入每日更新
+      </div>
       {/* 横向 mini KPI 头 */}
       <div className="grid grid-cols-2 gap-2 md:gap-3">
         <div className="bg-white rounded-2xl border border-slate-100 shadow-sm p-3 md:p-4">
diff --git a/src/modules/energy/ElectricView.tsx b/src/modules/energy/ElectricView.tsx
index 1592243..0d4fd6a 100644
--- a/src/modules/energy/ElectricView.tsx
+++ b/src/modules/energy/ElectricView.tsx
@@ -1,14 +1,12 @@
 import ElectricOverview from './ElectricOverview';
 import ElectricDaily from './ElectricDaily';
 
-export default function ElectricView() {
-  return (
-    <>
-      <div className="bg-white rounded-xl border border-slate-100 px-3 py-1.5 text-[11px] text-slate-400">
-        龙王路停车场充电站，期初 2025-01-01，手工导入每日更新
-      </div>
-      <ElectricOverview />
-      <ElectricDaily />
-    </>
-  );
+export type ElectricSubTab = 'daily' | 'overview';
+
+interface Props {
+  sub: ElectricSubTab;
+}
+
+export default function ElectricView({ sub }: Props) {
+  return sub === 'overview' ? <ElectricOverview /> : <ElectricDaily />;
 }
diff --git a/src/modules/energy/EnergyModule.tsx b/src/modules/energy/EnergyModule.tsx
index 46ad883..1e1827d 100644
--- a/src/modules/energy/EnergyModule.tsx
+++ b/src/modules/energy/EnergyModule.tsx
@@ -2,10 +2,11 @@ import { useState } from 'react';
 import { Fuel, BatteryCharging, Receipt, LayoutDashboard, CalendarDays } from 'lucide-react';
 import { motion } from 'motion/react';
 import HydrogenView, { type HydrogenSubTab } from './HydrogenView';
-import ElectricView from './ElectricView';
+import ElectricView, { type ElectricSubTab } from './ElectricView';
 import ETCView from './ETCView';
 
 type TopTab = 'hydrogen' | 'electric' | 'etc';
+type SubTabId = HydrogenSubTab | ElectricSubTab; // 'daily' | 'overview'
 
 const TABS: { key: TopTab; label: string; icon: typeof Fuel }[] = [
   { key: 'hydrogen', label: '氢能', icon: Fuel },
@@ -13,7 +14,7 @@ const TABS: { key: TopTab; label: string; icon: typeof Fuel }[] = [
   { key: 'etc',      label: 'ETC', icon: Receipt },
 ];
 
-const HYDROGEN_SUB_TABS: { id: HydrogenSubTab; label: string; icon: typeof LayoutDashboard }[] = [
+const SUB_TABS: { id: SubTabId; label: string; icon: typeof LayoutDashboard }[] = [
   { id: 'daily',    label: '每日', icon: CalendarDays },
   { id: 'overview', label: '总览', icon: LayoutDashboard },
 ];
@@ -21,6 +22,10 @@ const HYDROGEN_SUB_TABS: { id: HydrogenSubTab; label: string; icon: typeof Layou
 export default function EnergyModule() {
   const [activeTab, setActiveTab] = useState<TopTab>('hydrogen');
   const [hydroSub, setHydroSub] = useState<HydrogenSubTab>('daily');
+  const [electricSub, setElectricSub] = useState<ElectricSubTab>('daily');
+  const showSubTabs = activeTab === 'hydrogen' || activeTab === 'electric';
+  const currentSub: SubTabId = activeTab === 'electric' ? electricSub : hydroSub;
+  const setSub = (id: SubTabId) => activeTab === 'electric' ? setElectricSub(id) : setHydroSub(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">
@@ -29,7 +34,7 @@ export default function EnergyModule() {
         <div className="sticky top-0 z-30 -mx-3 md:-mx-6 px-3 md:px-6 -mt-3 md:-mt-6 pt-3 md:pt-6 pb-2 bg-[#F8F9FB]/85 backdrop-blur-md">
           <div className="bg-white rounded-2xl border border-slate-100 shadow-sm overflow-hidden">
             {/* 顶部 tab：氢能 / 电能 / ETC */}
-            <div className={`px-4 py-2 flex items-center gap-6 ${activeTab === 'hydrogen' ? 'border-b border-slate-50' : ''}`}>
+            <div className={`px-4 py-2 flex items-center gap-6 ${showSubTabs ? 'border-b border-slate-50' : ''}`}>
               {TABS.map(tab => {
                 const Icon = tab.icon;
                 const active = activeTab === tab.key;
@@ -48,15 +53,15 @@ export default function EnergyModule() {
                 );
               })}
             </div>
-            {/* 子 tab：仅氢能时显示 */}
-            {activeTab === 'hydrogen' && (
+            {/* 子 tab：氢能 / 电能 都显示 每日 / 总览 */}
+            {showSubTabs && (
               <div className="p-1 flex gap-1">
-                {HYDROGEN_SUB_TABS.map(({ id, label, icon: Icon }) => {
-                  const active = hydroSub === id;
+                {SUB_TABS.map(({ id, label, icon: Icon }) => {
+                  const active = currentSub === id;
                   return (
                     <button
                       key={id}
-                      onClick={() => setHydroSub(id)}
+                      onClick={() => setSub(id)}
                       className={`flex-1 flex items-center justify-center gap-1.5 rounded-xl py-1.5 text-[12px] font-bold transition-all ${
                         active ? 'bg-blue-50 text-blue-600' : 'text-slate-400 hover:bg-slate-50'
                       }`}
@@ -72,7 +77,7 @@ export default function EnergyModule() {
         </div>
 
         {activeTab === 'hydrogen' && <HydrogenView sub={hydroSub} />}
-        {activeTab === 'electric' && <ElectricView />}
+        {activeTab === 'electric' && <ElectricView sub={electricSub} />}
         {activeTab === 'etc' && <ETCView />}
       </div>
     </div>