refactor(energy): merge electric overview into a single page
Drop the 每日/总览 sub-tabs on 电能 — only 龙王路充电站 in scope, so the overview is light (3 KPI cards + 1 bar chart) and combining saves a click for daily ops. ElectricView now renders ElectricOverview + ElectricDaily back-to-back below the hint card. 氢能 keeps its sub-tabs (richer overview with Top5 + region chart). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -1,40 +1,14 @@
|
|||||||
import { useState } from 'react';
|
|
||||||
import { LayoutDashboard, CalendarDays } from 'lucide-react';
|
|
||||||
import ElectricOverview from './ElectricOverview';
|
import ElectricOverview from './ElectricOverview';
|
||||||
import ElectricDaily from './ElectricDaily';
|
import ElectricDaily from './ElectricDaily';
|
||||||
|
|
||||||
type SubTab = 'daily' | 'overview';
|
|
||||||
|
|
||||||
const SUB_TABS: Array<{ id: SubTab; label: string; icon: typeof LayoutDashboard }> = [
|
|
||||||
{ id: 'daily', label: '每日', icon: CalendarDays },
|
|
||||||
{ id: 'overview', label: '总览', icon: LayoutDashboard },
|
|
||||||
];
|
|
||||||
|
|
||||||
export default function ElectricView() {
|
export default function ElectricView() {
|
||||||
const [sub, setSub] = useState<SubTab>('daily');
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="bg-white rounded-2xl border border-slate-100 shadow-sm p-1 sticky top-[58px] z-20 flex gap-1">
|
|
||||||
{SUB_TABS.map(({ id, label, icon: Icon }) => {
|
|
||||||
const active = sub === id;
|
|
||||||
return (
|
|
||||||
<button
|
|
||||||
key={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'
|
|
||||||
}`}
|
|
||||||
>
|
|
||||||
<Icon size={14} />
|
|
||||||
<span>{label}</span>
|
|
||||||
</button>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</div>
|
|
||||||
<div className="bg-white rounded-xl border border-slate-100 px-3 py-1.5 text-[11px] text-slate-400">
|
<div className="bg-white rounded-xl border border-slate-100 px-3 py-1.5 text-[11px] text-slate-400">
|
||||||
龙王路停车场充电站,期初 2025-01-01,手工导入每日更新
|
龙王路停车场充电站,期初 2025-01-01,手工导入每日更新
|
||||||
</div>
|
</div>
|
||||||
{sub === 'overview' ? <ElectricOverview /> : <ElectricDaily />}
|
<ElectricOverview />
|
||||||
|
<ElectricDaily />
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user