Обновлены компоненты управления поставками: улучшены стили и логика отображения для вкладок и карточек товаров. Добавлены проверки на наличие идентификаторов для улучшения обработки данных. Оптимизирован интерфейс с использованием новых компонентов и улучшена читаемость кода.
This commit is contained in:
@ -23,9 +23,9 @@ export function SuppliesDashboard() {
|
||||
|
||||
// Автоматически открываем нужную вкладку при загрузке
|
||||
useEffect(() => {
|
||||
const tab = searchParams.get('tab');
|
||||
if (tab === 'consumables') {
|
||||
setActiveTab('fulfillment'); // Устанавливаем основную вкладку "Поставки на ФФ"
|
||||
const tab = searchParams.get("tab");
|
||||
if (tab === "consumables") {
|
||||
setActiveTab("fulfillment"); // Устанавливаем основную вкладку "Поставки на ФФ"
|
||||
}
|
||||
}, [searchParams]);
|
||||
|
||||
@ -33,7 +33,7 @@ export function SuppliesDashboard() {
|
||||
<div className="h-screen flex overflow-hidden">
|
||||
<Sidebar />
|
||||
<main
|
||||
className={`flex-1 ${getSidebarMargin()} px-4 py-4 overflow-hidden transition-all duration-300`}
|
||||
className={`flex-1 ${getSidebarMargin()} px-2 py-2 overflow-hidden transition-all duration-300`}
|
||||
>
|
||||
<div className="h-full">
|
||||
{/* Главные вкладки с кнопкой создания */}
|
||||
@ -42,28 +42,34 @@ export function SuppliesDashboard() {
|
||||
onValueChange={setActiveTab}
|
||||
className="w-full h-full flex flex-col"
|
||||
>
|
||||
<div className="flex items-center justify-between mb-2">
|
||||
<TabsList className="grid grid-cols-2 bg-white/10 backdrop-blur border-white/20 w-fit">
|
||||
<div className="flex items-center justify-between mb-1 flex-wrap gap-2">
|
||||
<TabsList className="grid grid-cols-2 bg-white/10 backdrop-blur border-white/20 w-fit text-sm">
|
||||
<TabsTrigger
|
||||
value="fulfillment"
|
||||
className="data-[state=active]:bg-gradient-to-r data-[state=active]:from-purple-500 data-[state=active]:to-pink-500 data-[state=active]:text-white text-white/60 px-8"
|
||||
className="data-[state=active]:bg-gradient-to-r data-[state=active]:from-purple-500 data-[state=active]:to-pink-500 data-[state=active]:text-white text-white/60 px-3 sm:px-6"
|
||||
>
|
||||
Поставки на ФФ
|
||||
<span className="hidden sm:inline">Поставки на ФФ</span>
|
||||
<span className="sm:hidden">ФФ</span>
|
||||
</TabsTrigger>
|
||||
<TabsTrigger
|
||||
value="marketplace"
|
||||
className="data-[state=active]:bg-gradient-to-r data-[state=active]:from-purple-500 data-[state=active]:to-pink-500 data-[state=active]:text-white text-white/60 px-8"
|
||||
className="data-[state=active]:bg-gradient-to-r data-[state=active]:from-purple-500 data-[state=active]:to-pink-500 data-[state=active]:text-white text-white/60 px-3 sm:px-6"
|
||||
>
|
||||
Поставки на Маркетплейсы
|
||||
<span className="hidden sm:inline">Поставки на Маркетплейсы</span>
|
||||
<span className="sm:hidden">МП</span>
|
||||
</TabsTrigger>
|
||||
</TabsList>
|
||||
|
||||
<DropdownMenu>
|
||||
<DropdownMenuTrigger asChild>
|
||||
<Button className="bg-gradient-to-r from-purple-500 to-pink-500 hover:from-purple-600 hover:to-pink-600 text-white shadow-lg">
|
||||
<Plus className="h-4 w-4 mr-2" />
|
||||
Создать поставку
|
||||
<ChevronDown className="h-4 w-4 ml-2" />
|
||||
<Button
|
||||
size="sm"
|
||||
className="bg-gradient-to-r from-purple-500 to-pink-500 hover:from-purple-600 hover:to-pink-600 text-white shadow-lg"
|
||||
>
|
||||
<Plus className="h-3 w-3 mr-1" />
|
||||
<span className="hidden sm:inline">Создать поставку</span>
|
||||
<span className="sm:hidden">Создать</span>
|
||||
<ChevronDown className="h-3 w-3 ml-1" />
|
||||
</Button>
|
||||
</DropdownMenuTrigger>
|
||||
<DropdownMenuContent
|
||||
@ -92,11 +98,23 @@ export function SuppliesDashboard() {
|
||||
</DropdownMenu>
|
||||
</div>
|
||||
|
||||
<TabsContent value="fulfillment" className="mt-0 flex-1 overflow-hidden">
|
||||
<FulfillmentSuppliesTab defaultSubTab={searchParams.get('tab') === 'consumables' ? 'supplies' : undefined} />
|
||||
<TabsContent
|
||||
value="fulfillment"
|
||||
className="mt-0 flex-1 overflow-hidden"
|
||||
>
|
||||
<FulfillmentSuppliesTab
|
||||
defaultSubTab={
|
||||
searchParams.get("tab") === "consumables"
|
||||
? "supplies"
|
||||
: undefined
|
||||
}
|
||||
/>
|
||||
</TabsContent>
|
||||
|
||||
<TabsContent value="marketplace" className="mt-0 flex-1 overflow-hidden">
|
||||
<TabsContent
|
||||
value="marketplace"
|
||||
className="mt-0 flex-1 overflow-hidden"
|
||||
>
|
||||
<MarketplaceSuppliesTab />
|
||||
</TabsContent>
|
||||
</Tabs>
|
||||
|
Reference in New Issue
Block a user