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

This commit is contained in:
Bivekich
2025-07-18 16:18:50 +03:00
parent ba9333f959
commit e4886b3166

View File

@ -1,6 +1,6 @@
"use client"
import React, { useState } from 'react'
import React, { useState, useEffect } from 'react'
import { Card } from '@/components/ui/card'
import { Button } from '@/components/ui/button'
import { Badge } from '@/components/ui/badge'
@ -226,6 +226,13 @@ export function CreateSupplyPage() {
const [selectedProducts, setSelectedProducts] = useState<SelectedProduct[]>([])
const [showSummary, setShowSummary] = useState(false)
// Автоматически показываем корзину если в ней есть товары и мы на этапе выбора оптовиков
useEffect(() => {
if (selectedVariant === 'wholesaler' && !selectedWholesaler && selectedProducts.length > 0) {
setShowSummary(true)
}
}, [selectedVariant, selectedWholesaler, selectedProducts.length])
const formatCurrency = (amount: number) => {
return new Intl.NumberFormat('ru-RU', {
style: 'currency',
@ -299,10 +306,12 @@ export function CreateSupplyPage() {
const handleGoBack = () => {
if (selectedWholesaler) {
setSelectedWholesaler(null)
setSelectedProducts([])
// НЕ очищаем корзину! setSelectedProducts([])
setShowSummary(false)
} else if (selectedVariant) {
setSelectedVariant(null)
setSelectedProducts([]) // Очищаем корзину только при полном выходе
setShowSummary(false)
} else {
router.push('/supplies')
}
@ -677,7 +686,12 @@ export function CreateSupplyPage() {
</Button>
<div>
<h1 className="text-3xl font-bold text-white mb-2">Выбор оптовика</h1>
<p className="text-white/60">Выберите оптовика для создания поставки</p>
<p className="text-white/60">
{selectedProducts.length > 0
? `Выберите еще оптовика или перейдите к оформлению (${selectedProducts.length} товаров в корзине)`
: "Выберите оптовика для создания поставки"
}
</p>
</div>
</div>
{selectedProducts.length > 0 && (
@ -693,22 +707,27 @@ export function CreateSupplyPage() {
)}
</div>
{/* Корзина как в маркете */}
{/* Корзина */}
{showSummary && selectedProducts.length > 0 && (
<Card className="bg-white/5 backdrop-blur border-white/10 mb-8">
<Card className="bg-gradient-to-br from-purple-500/10 to-pink-500/10 backdrop-blur-xl border border-purple-500/20 mb-8 shadow-2xl">
<div className="p-6">
<div className="flex items-center justify-between mb-6">
<h3 className="text-white font-semibold text-xl flex items-center">
<ShoppingCart className="h-5 w-5 mr-2" />
Корзина ({selectedProducts.length})
</h3>
<div className="flex items-center space-x-3">
<div className="p-3 bg-gradient-to-r from-purple-500 to-pink-500 rounded-xl">
<ShoppingCart className="h-6 w-6 text-white" />
</div>
<div>
<h3 className="text-white font-bold text-xl">Корзина</h3>
<p className="text-purple-200 text-sm">{selectedProducts.length} товаров от {Object.keys(selectedProducts.reduce((acc, p) => ({ ...acc, [p.wholesalerId]: true }), {})).length} поставщиков</p>
</div>
</div>
<Button
variant="ghost"
size="sm"
onClick={() => setShowSummary(false)}
className="text-white/60 hover:text-white"
className="text-white/60 hover:text-white hover:bg-white/10 rounded-xl"
>
<Eye className="h-4 w-4" />
</Button>
</div>
@ -834,13 +853,23 @@ export function CreateSupplyPage() {
{formatCurrency(getTotalAmount())}
</span>
</div>
<Button
className="w-full mt-4 bg-gradient-to-r from-green-500 to-emerald-500 hover:from-green-600 hover:to-emerald-600 text-white"
onClick={handleCreateSupply}
>
<ShoppingCart className="h-4 w-4 mr-2" />
Создать поставку
</Button>
<div className="flex space-x-3 mt-4">
<Button
variant="outline"
className="flex-1 border-purple-300/30 text-white hover:bg-white/10"
onClick={() => setShowSummary(false)}
>
<Plus className="h-4 w-4 mr-2" />
Добавить еще
</Button>
<Button
className="flex-1 bg-gradient-to-r from-green-500 to-emerald-500 hover:from-green-600 hover:to-emerald-600 text-white"
onClick={handleCreateSupply}
>
<ShoppingCart className="h-4 w-4 mr-2" />
Оформить поставку
</Button>
</div>
</div>
</div>
</Card>