84 lines
3.0 KiB
TypeScript
84 lines
3.0 KiB
TypeScript
"use client"
|
||
|
||
import { useQuery } from '@apollo/client'
|
||
import { CartItems } from '../cart/cart-items'
|
||
import { CartSummary } from '../cart/cart-summary'
|
||
import { GET_MY_CART } from '@/graphql/queries'
|
||
import { ShoppingCart, Package } from 'lucide-react'
|
||
|
||
export function MarketRequests() {
|
||
const { data, loading, error } = useQuery(GET_MY_CART)
|
||
|
||
const cart = data?.myCart
|
||
const hasItems = cart?.items && cart.items.length > 0
|
||
|
||
if (loading) {
|
||
return (
|
||
<div className="h-full flex items-center justify-center">
|
||
<div className="text-center">
|
||
<div className="animate-spin rounded-full h-16 w-16 border-4 border-white border-t-transparent mx-auto mb-4"></div>
|
||
<p className="text-white/70">Загружаем заявки...</p>
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|
||
|
||
if (error) {
|
||
return (
|
||
<div className="h-full flex items-center justify-center">
|
||
<div className="text-center">
|
||
<ShoppingCart className="h-16 w-16 text-red-400/40 mx-auto mb-4" />
|
||
<p className="text-red-400">Ошибка загрузки заявок</p>
|
||
<p className="text-white/40 text-sm mt-2">{error.message}</p>
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|
||
|
||
return (
|
||
<div className="h-full w-full flex flex-col">
|
||
{/* Заголовок */}
|
||
<div className="flex items-center space-x-3 p-6 border-b border-white/10">
|
||
<ShoppingCart className="h-6 w-6 text-purple-400" />
|
||
<div>
|
||
<h1 className="text-xl font-bold text-white">Мои заявки</h1>
|
||
<p className="text-white/60">
|
||
{hasItems
|
||
? `${cart.totalItems} заявок на сумму ${new Intl.NumberFormat('ru-RU', { style: 'currency', currency: 'RUB' }).format(cart.totalPrice)}`
|
||
: 'У вас пока нет заявок'
|
||
}
|
||
</p>
|
||
</div>
|
||
</div>
|
||
|
||
{/* Основной контент */}
|
||
<div className="flex-1 overflow-hidden">
|
||
{hasItems ? (
|
||
<div className="h-full grid grid-cols-1 lg:grid-cols-3 gap-6 p-6">
|
||
{/* Заявки */}
|
||
<div className="lg:col-span-2">
|
||
<div className="glass-card h-full overflow-hidden">
|
||
<CartItems cart={cart} />
|
||
</div>
|
||
</div>
|
||
|
||
{/* Сводка заявок */}
|
||
<div className="lg:col-span-1">
|
||
<div className="glass-card h-fit">
|
||
<CartSummary cart={cart} />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
) : (
|
||
<div className="h-full flex flex-col items-center justify-center text-center p-8">
|
||
<Package className="h-24 w-24 text-white/20 mb-6" />
|
||
<h2 className="text-xl font-semibold text-white mb-2">Нет заявок</h2>
|
||
<p className="text-white/60 mb-6 max-w-md">
|
||
Добавьте товары в заявки из раздела "Товары", чтобы создать заявку для оптовика
|
||
</p>
|
||
</div>
|
||
)}
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|