Добавлены новые кнопки и улучшения в компоненте ButtonsDemo для управления поставками и фильтрации. Обновлены мок-данные в FulfillmentGoodsTab с новыми статусами и логикой фильтрации. Изменено название вкладки в FulfillmentSuppliesTab на "Наши расходники". Улучшена структура кода и взаимодействие с пользователем.
This commit is contained in:
Veronika Smirnova
@ -11,7 +11,12 @@ import {
|
||||
Plus,
|
||||
Search,
|
||||
Filter,
|
||||
Loader2
|
||||
Loader2,
|
||||
Package,
|
||||
Wrench,
|
||||
RotateCcw,
|
||||
Building2,
|
||||
ShoppingCart
|
||||
} from 'lucide-react'
|
||||
|
||||
export function ButtonsDemo() {
|
||||
@ -240,6 +245,166 @@ export function ButtonsDemo() {
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
{/* Кнопки из Fulfillment Supplies */}
|
||||
<Card className="glass-card border-white/10">
|
||||
<CardHeader>
|
||||
<CardTitle className="text-white">Кнопки из страницы Поставки Фулфилмента</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-6">
|
||||
{/* Основные кнопки создания */}
|
||||
<div>
|
||||
<h4 className="text-white/90 text-sm font-medium mb-3">Кнопки создания</h4>
|
||||
<div className="flex flex-wrap gap-3">
|
||||
<Button
|
||||
size="sm"
|
||||
className="bg-gradient-to-r from-blue-500 to-cyan-500 hover:from-blue-600 hover:to-cyan-600 text-white text-xs"
|
||||
>
|
||||
<Plus className="h-3 w-3 mr-1" />
|
||||
Создать
|
||||
</Button>
|
||||
<Button
|
||||
size="sm"
|
||||
className="bg-gradient-to-r from-purple-500 to-pink-500 hover:from-purple-600 hover:to-pink-600 text-white text-xs"
|
||||
>
|
||||
<Plus className="h-3 w-3 mr-1" />
|
||||
Создать
|
||||
</Button>
|
||||
<Button
|
||||
size="sm"
|
||||
className="bg-gradient-to-r from-purple-500 to-pink-500 hover:from-purple-600 hover:to-pink-600 text-white text-sm px-6 h-[60px] whitespace-nowrap"
|
||||
>
|
||||
<Plus className="h-4 w-4 mr-2" />
|
||||
Создать поставку
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Кнопки заказа */}
|
||||
<div>
|
||||
<h4 className="text-white/90 text-sm font-medium mb-3">Кнопки заказа</h4>
|
||||
<div className="flex flex-wrap gap-3">
|
||||
<Button
|
||||
size="sm"
|
||||
className="bg-gradient-to-r from-purple-500 to-pink-500 hover:from-purple-600 hover:to-pink-600 text-white text-sm px-6 h-[60px] whitespace-nowrap"
|
||||
>
|
||||
<Plus className="h-4 w-4 mr-2" />
|
||||
Заказать
|
||||
</Button>
|
||||
<Button
|
||||
size="sm"
|
||||
className="bg-gradient-to-r from-orange-500 to-red-500 hover:from-orange-600 hover:to-red-600 text-white text-sm px-6 h-[60px] whitespace-nowrap"
|
||||
>
|
||||
<Plus className="h-4 w-4 mr-2" />
|
||||
Заказать материалы
|
||||
</Button>
|
||||
<Button
|
||||
size="sm"
|
||||
className="bg-gradient-to-r from-blue-500 to-cyan-500 hover:from-blue-600 hover:to-cyan-600 text-white text-sm px-6 h-[60px] whitespace-nowrap"
|
||||
>
|
||||
<Plus className="h-4 w-4 mr-2" />
|
||||
Запланировать сбор
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Кнопки фильтров */}
|
||||
<div>
|
||||
<h4 className="text-white/90 text-sm font-medium mb-3">Кнопки фильтров (активные и неактивные)</h4>
|
||||
<div className="flex flex-wrap gap-1">
|
||||
<Button
|
||||
variant="secondary"
|
||||
size="sm"
|
||||
className="h-7 px-2 text-xs bg-white/20 text-white"
|
||||
>
|
||||
Все
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
className="h-7 px-2 text-xs text-white/70 hover:bg-white/10 flex items-center gap-1"
|
||||
>
|
||||
<Package className="h-3 w-3" />
|
||||
Товары
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
className="h-7 px-2 text-xs text-white/70 hover:bg-white/10 flex items-center gap-1"
|
||||
>
|
||||
<Wrench className="h-3 w-3" />
|
||||
Расходники
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
className="h-7 px-2 text-xs text-white/70 hover:bg-white/10 flex items-center gap-1"
|
||||
>
|
||||
<RotateCcw className="h-3 w-3" />
|
||||
Возвраты
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Кнопки маркетплейсов */}
|
||||
<div>
|
||||
<h4 className="text-white/90 text-sm font-medium mb-3">Кнопки маркетплейсов</h4>
|
||||
<div className="flex flex-wrap gap-2">
|
||||
<Button
|
||||
variant="secondary"
|
||||
size="sm"
|
||||
className="bg-white/20 text-white flex items-center gap-1"
|
||||
>
|
||||
Все
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
className="text-white/70 hover:bg-white/10 flex items-center gap-1"
|
||||
>
|
||||
<div className="w-3 h-3 bg-purple-400 rounded-full"></div>
|
||||
Wildberries
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
className="text-white/70 hover:bg-white/10 flex items-center gap-1"
|
||||
>
|
||||
<div className="w-3 h-3 bg-blue-400 rounded-full"></div>
|
||||
Ozon
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Навигационная кнопка */}
|
||||
<div>
|
||||
<h4 className="text-white/90 text-sm font-medium mb-3">Навигация</h4>
|
||||
<div className="flex gap-2">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
className="text-white/60 hover:text-white hover:bg-white/10"
|
||||
>
|
||||
К поставкам
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Специализированные кнопки по маркетплейсам */}
|
||||
<div>
|
||||
<h4 className="text-white/90 text-sm font-medium mb-3">Специализированные кнопки</h4>
|
||||
<div className="flex flex-wrap gap-3">
|
||||
<Button
|
||||
size="sm"
|
||||
className="bg-gradient-to-r from-blue-500 to-indigo-500 hover:from-blue-600 hover:to-indigo-600 text-white text-sm px-6 h-[60px] whitespace-nowrap"
|
||||
>
|
||||
<Plus className="h-4 w-4 mr-2" />
|
||||
Создать поставку (Ozon)
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
{/* Примеры использования */}
|
||||
<Card className="glass-card border-white/10">
|
||||
<CardHeader>
|
||||
|
||||
Reference in New Issue
Block a user