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' &&
}