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

2025-07-16 18:00:41 +03:00
parent d260749bc9
commit 823ef9a28c
69 changed files with 15539 additions and 210 deletions
--- a/src/components/market/market-logistics.tsx
+++ b/src/components/market/market-logistics.tsx
@ -0,0 +1,125 @@
+"use client"
+
+import { useState } from 'react'
+import { useQuery, useMutation } from '@apollo/client'
+import { Button } from '@/components/ui/button'
+import { Input } from '@/components/ui/input'
+import { Search, Truck } from 'lucide-react'
+import { OrganizationCard } from './organization-card'
+import { SEARCH_ORGANIZATIONS } from '@/graphql/queries'
+import { SEND_COUNTERPARTY_REQUEST } from '@/graphql/mutations'
+
+interface Organization {
+  id: string
+  inn: string
+  name?: string
+  fullName?: string
+  type: 'FULFILLMENT' | 'SELLER' | 'LOGIST' | 'WHOLESALE'
+  address?: string
+  phones?: Array<{ value: string }>
+  emails?: Array<{ value: string }>
+  createdAt: string
+  users?: Array<{ id: string, avatar?: string }>
+  isCounterparty?: boolean
+}
+
+export function MarketLogistics() {
+  const [searchTerm, setSearchTerm] = useState('')
+
+  const { data, loading, refetch } = useQuery(SEARCH_ORGANIZATIONS, {
+    variables: { type: 'LOGIST', search: searchTerm || null }
+  })
+
+  const [sendRequest, { loading: sendingRequest }] = useMutation(SEND_COUNTERPARTY_REQUEST, {
+    onCompleted: () => {
+      refetch()
+    }
+  })
+
+  const handleSearch = () => {
+    refetch({ type: 'LOGIST', search: searchTerm || null })
+  }
+
+  const handleSendRequest = async (organizationId: string, message: string) => {
+    try {
+      await sendRequest({
+        variables: {
+          receiverId: organizationId,
+          message: message || 'Заявка на добавление в контрагенты'
+        }
+      })
+    } catch (error) {
+      console.error('Ошибка отправки заявки:', error)
+    }
+  }
+
+  const organizations = data?.searchOrganizations || []
+
+  return (
+    <div className="h-full flex flex-col space-y-4 overflow-hidden">
+      {/* Поиск */}
+      <div className="flex space-x-4 flex-shrink-0">
+        <div className="relative flex-1">
+          <Search className="absolute left-3 top-3 h-4 w-4 text-white/40" />
+          <Input
+            placeholder="Поиск логистических компаний по названию или ИНН..."
+            value={searchTerm}
+            onChange={(e) => setSearchTerm(e.target.value)}
+            onKeyDown={(e) => e.key === 'Enter' && handleSearch()}
+            className="pl-10 glass-input text-white placeholder:text-white/40 h-10"
+          />
+        </div>
+        <Button 
+          onClick={handleSearch}
+          className="bg-orange-500/20 hover:bg-orange-500/30 text-orange-300 border-orange-500/30 cursor-pointer"
+        >
+          <Search className="h-4 w-4 mr-2" />
+          Найти
+        </Button>
+      </div>
+
+      {/* Заголовок с иконкой */}
+      <div className="flex items-center space-x-3 flex-shrink-0 mb-4">
+        <Truck className="h-6 w-6 text-orange-400" />
+        <div>
+          <h3 className="text-lg font-semibold text-white">Логистика</h3>
+          <p className="text-white/60 text-sm">Найдите и добавьте логистические компании в контрагенты</p>
+        </div>
+      </div>
+
+      {/* Результаты поиска */}
+      <div className="flex-1 overflow-auto">
+        {loading ? (
+          <div className="flex items-center justify-center p-8">
+            <div className="text-white/60">Поиск...</div>
+          </div>
+        ) : organizations.length === 0 ? (
+          <div className="glass-card p-8">
+            <div className="text-center">
+              <Truck className="h-12 w-12 text-white/20 mx-auto mb-4" />
+              <p className="text-white/60">
+                {searchTerm ? 'Логистические компании не найдены' : 'Введите запрос для поиска'}
+              </p>
+              <p className="text-white/40 text-sm mt-2">
+                Попробуйте изменить условия поиска
+              </p>
+            </div>
+          </div>
+        ) : (
+          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+            {organizations.map((organization: Organization) => (
+              <OrganizationCard
+                key={organization.id}
+                organization={organization}
+                onSendRequest={handleSendRequest}
+                actionButtonText="Добавить"
+                actionButtonColor="yellow"
+                requestSending={sendingRequest}
+              />
+            ))}
+          </div>
+        )}
+      </div>
+    </div>
+  )
+}