Добавлены модели и функциональность для управления логистикой, включая создание, обновление и удаление логистических маршрутов через GraphQL. Обновлены компоненты для отображения и управления логистикой, улучшен интерфейс взаимодействия с пользователем. Реализованы новые типы данных и интерфейсы для логистики, а также улучшена обработка ошибок.
This commit is contained in:
Bivekich
260
src/components/supplies/wholesaler-selection.tsx
Normal file
260
src/components/supplies/wholesaler-selection.tsx
Normal file
@ -0,0 +1,260 @@
|
||||
"use client"
|
||||
|
||||
import React, { useState } from 'react'
|
||||
import { Card } from '@/components/ui/card'
|
||||
import { Button } from '@/components/ui/button'
|
||||
import { Badge } from '@/components/ui/badge'
|
||||
import {
|
||||
ArrowLeft,
|
||||
Building2,
|
||||
MapPin,
|
||||
Phone,
|
||||
Mail,
|
||||
Package,
|
||||
Star
|
||||
} from 'lucide-react'
|
||||
// import { WholesalerProducts } from './wholesaler-products'
|
||||
|
||||
interface Wholesaler {
|
||||
id: string
|
||||
inn: string
|
||||
name: string
|
||||
fullName: string
|
||||
address: string
|
||||
phone?: string
|
||||
email?: string
|
||||
rating: number
|
||||
productCount: number
|
||||
avatar?: string
|
||||
specialization: string[]
|
||||
}
|
||||
|
||||
interface WholesalerSelectionProps {
|
||||
onBack: () => void
|
||||
onClose: () => void
|
||||
onSupplyCreated: () => void
|
||||
}
|
||||
|
||||
// Моковые данные оптовиков
|
||||
const mockWholesalers: Wholesaler[] = [
|
||||
{
|
||||
id: '1',
|
||||
inn: '7707083893',
|
||||
name: 'ОПТ-Электроника',
|
||||
fullName: 'ООО "ОПТ-Электроника"',
|
||||
address: 'г. Москва, ул. Садовая, д. 15',
|
||||
phone: '+7 (495) 123-45-67',
|
||||
email: 'opt@electronics.ru',
|
||||
rating: 4.8,
|
||||
productCount: 1250,
|
||||
specialization: ['Электроника', 'Бытовая техника']
|
||||
},
|
||||
{
|
||||
id: '2',
|
||||
inn: '7707083894',
|
||||
name: 'ТекстильМастер',
|
||||
fullName: 'ООО "ТекстильМастер"',
|
||||
address: 'г. Иваново, пр. Ленина, д. 42',
|
||||
phone: '+7 (4932) 55-66-77',
|
||||
email: 'sales@textilmaster.ru',
|
||||
rating: 4.6,
|
||||
productCount: 850,
|
||||
specialization: ['Текстиль', 'Одежда', 'Домашний текстиль']
|
||||
},
|
||||
{
|
||||
id: '3',
|
||||
inn: '7707083895',
|
||||
name: 'МетизКомплект',
|
||||
fullName: 'ООО "МетизКомплект"',
|
||||
address: 'г. Тула, ул. Металлургов, д. 8',
|
||||
phone: '+7 (4872) 33-44-55',
|
||||
email: 'info@metiz.ru',
|
||||
rating: 4.9,
|
||||
productCount: 2100,
|
||||
specialization: ['Крепеж', 'Метизы', 'Инструменты']
|
||||
},
|
||||
{
|
||||
id: '4',
|
||||
inn: '7707083896',
|
||||
name: 'ПродОпт',
|
||||
fullName: 'ООО "ПродОпт"',
|
||||
address: 'г. Краснодар, ул. Красная, д. 123',
|
||||
phone: '+7 (861) 777-88-99',
|
||||
email: 'order@prodopt.ru',
|
||||
rating: 4.7,
|
||||
productCount: 560,
|
||||
specialization: ['Продукты питания', 'Напитки']
|
||||
},
|
||||
{
|
||||
id: '5',
|
||||
inn: '7707083897',
|
||||
name: 'СтройМатериалы+',
|
||||
fullName: 'ООО "СтройМатериалы+"',
|
||||
address: 'г. Воронеж, пр. Революции, д. 67',
|
||||
phone: '+7 (473) 222-33-44',
|
||||
email: 'stroim@materials.ru',
|
||||
rating: 4.5,
|
||||
productCount: 1800,
|
||||
specialization: ['Стройматериалы', 'Сантехника']
|
||||
},
|
||||
{
|
||||
id: '6',
|
||||
inn: '7707083898',
|
||||
name: 'КосметикОпт',
|
||||
fullName: 'ООО "КосметикОпт"',
|
||||
address: 'г. Санкт-Петербург, Невский пр., д. 45',
|
||||
phone: '+7 (812) 111-22-33',
|
||||
email: 'beauty@cosmeticopt.ru',
|
||||
rating: 4.4,
|
||||
productCount: 920,
|
||||
specialization: ['Косметика', 'Парфюмерия', 'Уход']
|
||||
}
|
||||
]
|
||||
|
||||
export function WholesalerSelection({ onBack, onClose, onSupplyCreated }: WholesalerSelectionProps) {
|
||||
const [selectedWholesaler, setSelectedWholesaler] = useState<Wholesaler | null>(null)
|
||||
|
||||
if (selectedWholesaler) {
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<div className="flex items-center space-x-3">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={() => setSelectedWholesaler(null)}
|
||||
className="text-white/60 hover:text-white hover:bg-white/10"
|
||||
>
|
||||
<ArrowLeft className="h-4 w-4 mr-2" />
|
||||
Назад
|
||||
</Button>
|
||||
<div>
|
||||
<h2 className="text-2xl font-bold text-white mb-1">Товары оптовика</h2>
|
||||
<p className="text-white/60">{selectedWholesaler.name}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="text-center py-12">
|
||||
<p className="text-white/60">Компонент товаров в разработке...</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
const renderStars = (rating: number) => {
|
||||
return Array.from({ length: 5 }, (_, i) => (
|
||||
<Star
|
||||
key={i}
|
||||
className={`h-4 w-4 ${i < Math.floor(rating) ? 'text-yellow-400 fill-current' : 'text-gray-400'}`}
|
||||
/>
|
||||
))
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="space-y-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<div className="flex items-center space-x-3">
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={onBack}
|
||||
className="text-white/60 hover:text-white hover:bg-white/10"
|
||||
>
|
||||
<ArrowLeft className="h-4 w-4 mr-2" />
|
||||
Назад
|
||||
</Button>
|
||||
<div>
|
||||
<h2 className="text-2xl font-bold text-white mb-1">Выбор оптовика</h2>
|
||||
<p className="text-white/60">Выберите оптовика для создания поставки</p>
|
||||
</div>
|
||||
</div>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="sm"
|
||||
onClick={onClose}
|
||||
className="text-white/60 hover:text-white hover:bg-white/10"
|
||||
>
|
||||
Отмена
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
||||
{mockWholesalers.map((wholesaler) => (
|
||||
<Card
|
||||
key={wholesaler.id}
|
||||
className="bg-white/10 backdrop-blur border-white/20 p-6 cursor-pointer transition-all hover:bg-white/15 hover:border-white/30 hover:scale-105"
|
||||
onClick={() => setSelectedWholesaler(wholesaler)}
|
||||
>
|
||||
<div className="space-y-4">
|
||||
{/* Заголовок карточки */}
|
||||
<div className="flex items-start space-x-3">
|
||||
<div className="p-3 bg-blue-500/20 rounded-lg">
|
||||
<Building2 className="h-6 w-6 text-blue-400" />
|
||||
</div>
|
||||
<div className="flex-1 min-w-0">
|
||||
<h3 className="text-white font-semibold text-lg mb-1 truncate">
|
||||
{wholesaler.name}
|
||||
</h3>
|
||||
<p className="text-white/60 text-xs mb-2 truncate">
|
||||
{wholesaler.fullName}
|
||||
</p>
|
||||
<div className="flex items-center space-x-1 mb-2">
|
||||
{renderStars(wholesaler.rating)}
|
||||
<span className="text-white/60 text-sm ml-2">{wholesaler.rating}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Информация */}
|
||||
<div className="space-y-2">
|
||||
<div className="flex items-center space-x-2">
|
||||
<MapPin className="h-4 w-4 text-gray-400" />
|
||||
<span className="text-white/80 text-sm truncate">{wholesaler.address}</span>
|
||||
</div>
|
||||
|
||||
{wholesaler.phone && (
|
||||
<div className="flex items-center space-x-2">
|
||||
<Phone className="h-4 w-4 text-gray-400" />
|
||||
<span className="text-white/80 text-sm">{wholesaler.phone}</span>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{wholesaler.email && (
|
||||
<div className="flex items-center space-x-2">
|
||||
<Mail className="h-4 w-4 text-gray-400" />
|
||||
<span className="text-white/80 text-sm truncate">{wholesaler.email}</span>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="flex items-center space-x-2">
|
||||
<Package className="h-4 w-4 text-gray-400" />
|
||||
<span className="text-white/80 text-sm">{wholesaler.productCount} товаров</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Специализация */}
|
||||
<div className="space-y-2">
|
||||
<p className="text-white/60 text-xs">Специализация:</p>
|
||||
<div className="flex flex-wrap gap-1">
|
||||
{wholesaler.specialization.map((spec, index) => (
|
||||
<Badge
|
||||
key={index}
|
||||
className="bg-purple-500/20 text-purple-300 border-purple-500/30 text-xs"
|
||||
>
|
||||
{spec}
|
||||
</Badge>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* ИНН */}
|
||||
<div className="pt-2 border-t border-white/10">
|
||||
<p className="text-white/60 text-xs">ИНН: {wholesaler.inn}</p>
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user