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 (
+
+ 龙王路停车场充电站,期初 2025-01-01,手工导入每日更新 +
{/* 横向 mini KPI 头 */}
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 ( - <> -
- 龙王路停车场充电站,期初 2025-01-01,手工导入每日更新 -
- - - - ); +export type ElectricSubTab = 'daily' | 'overview'; + +interface Props { + sub: ElectricSubTab; +} + +export default function ElectricView({ sub }: Props) { + return sub === 'overview' ? : ; } 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('hydrogen'); const [hydroSub, setHydroSub] = useState('daily'); + const [electricSub, setElectricSub] = useState('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 (
@@ -29,7 +34,7 @@ export default function EnergyModule() {
{/* 顶部 tab:氢能 / 电能 / ETC */} -
+
{TABS.map(tab => { const Icon = tab.icon; const active = activeTab === tab.key; @@ -48,15 +53,15 @@ export default function EnergyModule() { ); })}
- {/* 子 tab:仅氢能时显示 */} - {activeTab === 'hydrogen' && ( + {/* 子 tab:氢能 / 电能 都显示 每日 / 总览 */} + {showSubTabs && (
- {HYDROGEN_SUB_TABS.map(({ id, label, icon: Icon }) => { - const active = hydroSub === id; + {SUB_TABS.map(({ id, label, icon: Icon }) => { + const active = currentSub === id; return (
{activeTab === 'hydrogen' && } - {activeTab === 'electric' && } + {activeTab === 'electric' && } {activeTab === 'etc' && }