Добавлены ключевые метрики склада, умные рекомендации и быстрые действия в компонент FulfillmentStatisticsDashboard. Перенесены данные из FulfillmentWarehouse и улучшены стили для более наглядного отображения информации. Обновлены иконки и структура кода для повышения удобства использования.

This commit is contained in:
Veronika Smirnova
2025-07-22 16:42:40 +03:00
parent 1ede90cfa2
commit 0a790c538b
2 changed files with 280 additions and 242 deletions

View File

@ -27,6 +27,9 @@ import {
DollarSign,
Users,
Truck,
Warehouse,
Eye,
EyeOff,
} from "lucide-react";
export function FulfillmentStatisticsDashboard() {
@ -38,6 +41,9 @@ export function FulfillmentStatisticsDashboard() {
marketplaces: true,
analytics: false,
performance: false,
warehouseMetrics: true,
smartRecommendations: true,
quickActions: true,
});
// Мок данные для статистики
@ -67,6 +73,13 @@ export function FulfillmentStatisticsDashboard() {
satisfactionTrend: 5,
};
// Данные склада (перенесено из fulfillment-warehouse)
const warehouseStats = {
efficiency: 94.5,
turnover: 2.3,
utilizationRate: 87,
};
const formatNumber = (num: number) => {
return num.toLocaleString("ru-RU");
};
@ -535,6 +548,135 @@ export function FulfillmentStatisticsDashboard() {
</Card>
)}
</div>
{/* Ключевые метрики склада (перенесено из fulfillment-warehouse) */}
<div>
<SectionHeader
title="Ключевые метрики склада"
section="warehouseMetrics"
color="text-blue-400"
/>
{expandedSections.warehouseMetrics && (
<Card className="bg-gradient-to-r from-slate-900/40 to-slate-800/40 border-slate-700/50">
<div className="p-6">
<div className="flex items-center justify-between">
<div className="flex items-center space-x-4">
<div className="p-3 bg-gradient-to-r from-blue-500/20 to-purple-500/20 rounded-xl border border-blue-400/20">
<Warehouse className="h-6 w-6 text-blue-400" />
</div>
<div className="grid grid-cols-2 gap-6">
<div className="flex items-center space-x-3">
<span className="text-sm text-slate-400 font-medium">Эффективность</span>
<Badge variant="secondary" className="bg-green-500/20 text-green-300 font-bold">
{warehouseStats.efficiency}%
</Badge>
</div>
<div className="flex items-center space-x-3">
<span className="text-sm text-slate-400 font-medium">Оборачиваемость</span>
<Badge variant="secondary" className="bg-blue-500/20 text-blue-300 font-bold">
{warehouseStats.turnover}x
</Badge>
</div>
</div>
</div>
<div className="text-right">
<div className="text-sm text-slate-400 font-medium mb-1">Загрузка склада</div>
<div className="text-3xl font-bold text-white">{warehouseStats.utilizationRate}%</div>
</div>
</div>
</div>
</Card>
)}
</div>
{/* Умные рекомендации склада (перенесено из fulfillment-warehouse) */}
<div>
<SectionHeader
title="Умные рекомендации склада"
section="smartRecommendations"
color="text-green-400"
/>
{expandedSections.smartRecommendations && (
<Card className="glass-card p-6">
<div className="flex items-center justify-between mb-4">
<div className="flex items-center space-x-3">
<div className="p-2 bg-gradient-to-r from-green-500/20 to-blue-500/20 rounded-xl">
<Zap className="h-5 w-5 text-green-400" />
</div>
<h3 className="text-lg font-semibold text-white">Рекомендации по складу</h3>
</div>
<Badge variant="secondary" className="bg-green-500/20 text-green-300">
AI-анализ
</Badge>
</div>
<div className="grid grid-cols-1 md:grid-cols-3 gap-4">
<div className="p-4 bg-white/5 rounded-xl border border-white/10">
<div className="flex items-center space-x-2 mb-2">
<Target className="h-4 w-4 text-yellow-400" />
<span className="text-sm font-medium text-yellow-400">Оптимизация</span>
</div>
<p className="text-xs text-white/70">
Рекомендуется увеличить запас расходников на 15% для покрытия пикового спроса
</p>
</div>
<div className="p-4 bg-white/5 rounded-xl border border-white/10">
<div className="flex items-center space-x-2 mb-2">
<Activity className="h-4 w-4 text-blue-400" />
<span className="text-sm font-medium text-blue-400">Прогноз</span>
</div>
<p className="text-xs text-white/70">
Ожидается рост возвратов на 12% в следующем месяце. Подготовьте дополнительные места
</p>
</div>
<div className="p-4 bg-white/5 rounded-xl border border-white/10">
<div className="flex items-center space-x-2 mb-2">
<BarChart3 className="h-4 w-4 text-purple-400" />
<span className="text-sm font-medium text-purple-400">Тренд</span>
</div>
<p className="text-xs text-white/70">
Эффективность обработки товаров выросла на 8% за последний месяц
</p>
</div>
</div>
</Card>
)}
</div>
{/* Быстрые действия (перенесено из fulfillment-warehouse) */}
<div>
<SectionHeader
title="Быстрые действия"
section="quickActions"
color="text-orange-400"
/>
{expandedSections.quickActions && (
<Card className="glass-card p-6">
<div className="flex items-center justify-between mb-4">
<h3 className="text-lg font-semibold text-white">Управление складом</h3>
<div className="flex space-x-2">
<Button size="sm" variant="outline" className="border-white/20 text-white/70 hover:bg-white/10">
<Eye className="h-4 w-4 mr-2" />
Обзор
</Button>
<Button size="sm" variant="outline" className="border-white/20 text-white/70 hover:bg-white/10">
<Activity className="h-4 w-4 mr-2" />
Отчеты
</Button>
</div>
</div>
<div className="text-center py-8">
<Package className="h-12 w-12 text-white/40 mx-auto mb-4" />
<p className="text-white/60 text-sm">
Основная функциональность склада будет добавлена на следующем этапе
</p>
</div>
</Card>
)}
</div>
</div>
</div>
</main>