Compare commits
3 Commits
58637b800b
...
d6ceec13da
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
d6ceec13da | ||
|
|
679ab727f5 | ||
|
|
a7a7cef057 |
@@ -1,5 +1,5 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { AreaChart, Area, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContainer, BarChart, Bar, Legend } from 'recharts';
|
import { AreaChart, Area, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContainer, BarChart, Bar, Legend, Cell } from 'recharts';
|
||||||
import { StatCard } from '../ui/StatCard';
|
import { StatCard } from '../ui/StatCard';
|
||||||
import { Activity, Target, TrendingUp, Zap, Clock, Radio, AlertCircle } from 'lucide-react';
|
import { Activity, Target, TrendingUp, Zap, Clock, Radio, AlertCircle } from 'lucide-react';
|
||||||
|
|
||||||
@@ -60,6 +60,7 @@ export function EfficiencyView() {
|
|||||||
value="~4.2 小时"
|
value="~4.2 小时"
|
||||||
subValue="主要由预约时限测算出的无效排队节省时间"
|
subValue="主要由预约时限测算出的无效排队节省时间"
|
||||||
icon={Clock}
|
icon={Clock}
|
||||||
|
trend={-42}
|
||||||
/>
|
/>
|
||||||
<StatCard
|
<StatCard
|
||||||
title="平均承载饱和度 (预估)"
|
title="平均承载饱和度 (预估)"
|
||||||
|
|||||||
@@ -51,12 +51,14 @@ export function OverallView() {
|
|||||||
value="65 单"
|
value="65 单"
|
||||||
subValue="嘉锦与嘉燃双核驱动,占据主流"
|
subValue="嘉锦与嘉燃双核驱动,占据主流"
|
||||||
icon={Calendar}
|
icon={Calendar}
|
||||||
|
trend={-47}
|
||||||
/>
|
/>
|
||||||
<StatCard
|
<StatCard
|
||||||
title="现阶段活跃运营站点"
|
title="现阶段活跃运营站点"
|
||||||
value="8 个"
|
value="8 个"
|
||||||
subValue="覆盖嘉燃、嘉锦、嘉燃经开、如皋、桐乡、花桥、常熟、嘉善"
|
subValue="覆盖嘉燃、嘉锦、嘉燃经开、如皋、桐乡、花桥、常熟、嘉善"
|
||||||
icon={MapPin}
|
icon={MapPin}
|
||||||
|
trend={14}
|
||||||
/>
|
/>
|
||||||
<StatCard
|
<StatCard
|
||||||
title="近期活跃司机数量"
|
title="近期活跃司机数量"
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContainer, Legend, BarChart, Bar } from 'recharts';
|
import { LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, ResponsiveContainer, Legend, BarChart, Bar, Cell } from 'recharts';
|
||||||
import { StatCard } from '../ui/StatCard';
|
import { StatCard } from '../ui/StatCard';
|
||||||
import { Users, Truck, Smartphone } from 'lucide-react';
|
import { Users, Truck, Smartphone } from 'lucide-react';
|
||||||
|
|
||||||
@@ -16,12 +16,12 @@ const driverGrowth = [
|
|||||||
];
|
];
|
||||||
|
|
||||||
const driverByStation = [
|
const driverByStation = [
|
||||||
{ name: '嘉兴嘉锦', value: 10, fill: '#f59e0b' },
|
{ name: '嘉兴嘉锦', value: 10 },
|
||||||
{ name: '嘉兴嘉燃', value: 8, fill: '#94a3b8' },
|
{ name: '嘉兴嘉燃', value: 8 },
|
||||||
{ name: '嘉燃经开', value: 5, fill: '#94a3b8' },
|
{ name: '嘉燃经开', value: 5 },
|
||||||
{ name: '如皋华神', value: 3, fill: '#94a3b8' },
|
{ name: '如皋华神', value: 3 },
|
||||||
{ name: '桐乡绿能', value: 2, fill: '#94a3b8' },
|
{ name: '桐乡绿能', value: 2 },
|
||||||
{ name: '花桥/嘉善等', value: 2, fill: '#94a3b8' },
|
{ name: '花桥/嘉善等', value: 2 },
|
||||||
];
|
];
|
||||||
|
|
||||||
export function UsersView() {
|
export function UsersView() {
|
||||||
@@ -46,6 +46,7 @@ export function UsersView() {
|
|||||||
value="59 %"
|
value="59 %"
|
||||||
subValue="公司自营与核心车队"
|
subValue="公司自营与核心车队"
|
||||||
icon={Users}
|
icon={Users}
|
||||||
|
trend={-36}
|
||||||
/>
|
/>
|
||||||
<StatCard
|
<StatCard
|
||||||
title="近期最佳外拓来源区"
|
title="近期最佳外拓来源区"
|
||||||
@@ -87,7 +88,11 @@ export function UsersView() {
|
|||||||
<XAxis type="number" hide />
|
<XAxis type="number" hide />
|
||||||
<YAxis dataKey="name" type="category" axisLine={false} tickLine={false} tick={{fill: '#475569', fontSize: 12, fontWeight: 500}} width={80} />
|
<YAxis dataKey="name" type="category" axisLine={false} tickLine={false} tick={{fill: '#475569', fontSize: 12, fontWeight: 500}} width={80} />
|
||||||
<Tooltip cursor={{fill: '#f8fafc'}} contentStyle={{ borderRadius: '12px', border: '1px solid #e2e8f0' }}/>
|
<Tooltip cursor={{fill: '#f8fafc'}} contentStyle={{ borderRadius: '12px', border: '1px solid #e2e8f0' }}/>
|
||||||
<Bar dataKey="value" radius={[0, 6, 6, 0]} barSize={28} />
|
<Bar dataKey="value" radius={[0, 6, 6, 0]} barSize={28}>
|
||||||
|
{driverByStation.map((entry, index) => (
|
||||||
|
<Cell key={`cell-${index}`} fill={index === 0 ? '#f59e0b' : '#94a3b8'} />
|
||||||
|
))}
|
||||||
|
</Bar>
|
||||||
</BarChart>
|
</BarChart>
|
||||||
</ResponsiveContainer>
|
</ResponsiveContainer>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user