Sfera/sfera-new
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
Bivekich
2025-07-16 22:07:38 +03:00
parent 823ef9a28c
commit 205c9eae98
33 changed files with 3288 additions and 229 deletions
Download Patch File Download Diff File Expand all files Collapse all files

200
src/components/market/market-counterparties.tsx
View File

@ -2,21 +2,18 @@
import { useState } from 'react'
import { useQuery, useMutation } from '@apollo/client'
import { Card } from '@/components/ui/card'
import { Button } from '@/components/ui/button'
import { Badge } from '@/components/ui/badge'
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'
import {
Users,
Clock,
Send,
CheckCircle,
XCircle,
ArrowUpCircle,
ArrowDownCircle
} from 'lucide-react'
import { OrganizationCard } from './organization-card'
import { GET_MY_COUNTERPARTIES, GET_INCOMING_REQUESTS, GET_OUTGOING_REQUESTS } from '@/graphql/queries'
import { OrganizationAvatar } from './organization-avatar'
import { GET_MY_COUNTERPARTIES, GET_INCOMING_REQUESTS, GET_OUTGOING_REQUESTS, SEARCH_ORGANIZATIONS } from '@/graphql/queries'
import { RESPOND_TO_COUNTERPARTY_REQUEST, CANCEL_COUNTERPARTY_REQUEST, REMOVE_COUNTERPARTY } from '@/graphql/mutations'
interface Organization {
@ -47,28 +44,43 @@ export function MarketCounterparties() {
const { data: outgoingData, loading: outgoingLoading, refetch: refetchOutgoing } = useQuery(GET_OUTGOING_REQUESTS)
const [respondToRequest] = useMutation(RESPOND_TO_COUNTERPARTY_REQUEST, {
onCompleted: () => {
refetchIncoming()
refetchCounterparties()
}
refetchQueries: [
{ query: GET_INCOMING_REQUESTS },
{ query: GET_MY_COUNTERPARTIES },
{ query: SEARCH_ORGANIZATIONS, variables: { type: 'SELLER' } },
{ query: SEARCH_ORGANIZATIONS, variables: { type: 'FULFILLMENT' } },
{ query: SEARCH_ORGANIZATIONS, variables: { type: 'LOGIST' } },
{ query: SEARCH_ORGANIZATIONS, variables: { type: 'WHOLESALE' } }
],
awaitRefetchQueries: true
})
const [cancelRequest] = useMutation(CANCEL_COUNTERPARTY_REQUEST, {
onCompleted: () => {
refetchOutgoing()
}
refetchQueries: [
{ query: GET_OUTGOING_REQUESTS },
{ query: SEARCH_ORGANIZATIONS, variables: { type: 'SELLER' } },
{ query: SEARCH_ORGANIZATIONS, variables: { type: 'FULFILLMENT' } },
{ query: SEARCH_ORGANIZATIONS, variables: { type: 'LOGIST' } },
{ query: SEARCH_ORGANIZATIONS, variables: { type: 'WHOLESALE' } }
],
awaitRefetchQueries: true
})
const [removeCounterparty] = useMutation(REMOVE_COUNTERPARTY, {
onCompleted: () => {
refetchCounterparties()
}
refetchQueries: [
{ query: GET_MY_COUNTERPARTIES },
{ query: SEARCH_ORGANIZATIONS, variables: { type: 'SELLER' } },
{ query: SEARCH_ORGANIZATIONS, variables: { type: 'FULFILLMENT' } },
{ query: SEARCH_ORGANIZATIONS, variables: { type: 'LOGIST' } },
{ query: SEARCH_ORGANIZATIONS, variables: { type: 'WHOLESALE' } }
],
awaitRefetchQueries: true
})
const handleAcceptRequest = async (requestId: string) => {
try {
await respondToRequest({
variables: { requestId, response: 'ACCEPTED' }
variables: { requestId, accept: true }
})
} catch (error) {
console.error('Ошибка при принятии заявки:', error)
@ -78,7 +90,7 @@ export function MarketCounterparties() {
const handleRejectRequest = async (requestId: string) => {
try {
await respondToRequest({
variables: { requestId, response: 'REJECTED' }
variables: { requestId, accept: false }
})
} catch (error) {
console.error('Ошибка при отклонении заявки:', error)
@ -207,50 +219,72 @@ export function MarketCounterparties() {
</div>
</div>
) : (
<div className="space-y-4">
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
{incomingRequests.map((request: CounterpartyRequest) => (
<Card key={request.id} className="glass-card p-4">
<div className="flex items-start justify-between">
<div className="flex items-start space-x-3 flex-1">
<div className="flex items-center space-x-3">
<div className="w-10 h-10 rounded-full bg-gradient-to-br from-blue-500 to-purple-600 flex items-center justify-center text-white font-semibold">
{(request.sender.name || request.sender.fullName || 'O').charAt(0).toUpperCase()}
</div>
</div>
<div key={request.id} className="glass-card p-4 w-full">
<div className="flex flex-col space-y-4">
<div className="flex items-start space-x-3">
<OrganizationAvatar organization={request.sender} size="md" />
<div className="flex-1 min-w-0">
<h4 className="text-white font-medium">
{request.sender.name || request.sender.fullName}
</h4>
<p className="text-white/60 text-sm">ИНН: {request.sender.inn}</p>
{request.message && (
<p className="text-white/80 text-sm mt-2 italic">&quot;{request.message}&quot;</p>
)}
<div className="flex items-center space-x-2 mt-2">
<Clock className="h-3 w-3 text-white/40" />
<span className="text-white/40 text-xs">{formatDate(request.createdAt)}</span>
<div className="flex flex-col space-y-2 mb-3">
<h4 className="text-white font-medium text-lg leading-tight">
{request.sender.name || request.sender.fullName}
</h4>
<div className="flex items-center space-x-3">
<Badge className={
request.sender.type === 'FULFILLMENT' ? 'bg-blue-500/20 text-blue-300 border-blue-500/30' :
request.sender.type === 'SELLER' ? 'bg-green-500/20 text-green-300 border-green-500/30' :
request.sender.type === 'LOGIST' ? 'bg-orange-500/20 text-orange-300 border-orange-500/30' :
request.sender.type === 'WHOLESALE' ? 'bg-purple-500/20 text-purple-300 border-purple-500/30' :
'bg-gray-500/20 text-gray-300 border-gray-500/30'
}>
{request.sender.type === 'FULFILLMENT' ? 'Фулфилмент' :
request.sender.type === 'SELLER' ? 'Селлер' :
request.sender.type === 'LOGIST' ? 'Логистика' :
request.sender.type === 'WHOLESALE' ? 'Оптовик' :
request.sender.type}
</Badge>
</div>
</div>
<div className="space-y-2">
<p className="text-white/60 text-sm">ИНН: {request.sender.inn}</p>
{request.sender.address && (
<div className="flex items-center text-white/60 text-sm">
<span className="truncate">{request.sender.address}</span>
</div>
)}
{request.message && (
<div className="p-2 bg-white/5 rounded border border-white/10">
<p className="text-white/80 text-sm italic">&quot;{request.message}&quot;</p>
</div>
)}
<div className="flex items-center text-white/40 text-xs">
<span>Заявка от {formatDate(request.createdAt)}</span>
</div>
</div>
</div>
</div>
<div className="flex space-x-2 ml-4">
<div className="flex space-x-2">
<Button
size="sm"
onClick={() => handleAcceptRequest(request.id)}
className="bg-green-500/20 hover:bg-green-500/30 text-green-300 border-green-500/30 cursor-pointer"
className="bg-green-500/20 hover:bg-green-500/30 text-green-300 border-green-500/30 cursor-pointer flex-1"
>
<CheckCircle className="h-4 w-4" />
Принять
</Button>
<Button
size="sm"
variant="outline"
onClick={() => handleRejectRequest(request.id)}
className="bg-red-500/20 hover:bg-red-500/30 text-red-300 border-red-500/30 cursor-pointer"
className="bg-red-500/20 hover:bg-red-500/30 text-red-300 border-red-500/30 cursor-pointer flex-1"
>
<XCircle className="h-4 w-4" />
Отклонить
</Button>
</div>
</div>
</Card>
</div>
))}
</div>
)}
@ -269,36 +303,56 @@ export function MarketCounterparties() {
</div>
</div>
) : (
<div className="space-y-4">
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
{outgoingRequests.map((request: CounterpartyRequest) => (
<Card key={request.id} className="glass-card p-4">
<div className="flex items-start justify-between">
<div className="flex items-start space-x-3 flex-1">
<div className="flex items-center space-x-3">
<div className="w-10 h-10 rounded-full bg-gradient-to-br from-blue-500 to-purple-600 flex items-center justify-center text-white font-semibold">
{(request.receiver.name || request.receiver.fullName || 'O').charAt(0).toUpperCase()}
</div>
</div>
<div key={request.id} className="glass-card p-4 w-full">
<div className="flex flex-col space-y-4">
<div className="flex items-start space-x-3">
<OrganizationAvatar organization={request.receiver} size="md" />
<div className="flex-1 min-w-0">
<h4 className="text-white font-medium">
{request.receiver.name || request.receiver.fullName}
</h4>
<p className="text-white/60 text-sm">ИНН: {request.receiver.inn}</p>
{request.message && (
<p className="text-white/80 text-sm mt-2 italic">&quot;{request.message}&quot;</p>
)}
<div className="flex items-center space-x-4 mt-2">
<div className="flex items-center space-x-2">
<Clock className="h-3 w-3 text-white/40" />
<span className="text-white/40 text-xs">{formatDate(request.createdAt)}</span>
<div className="flex flex-col space-y-2 mb-3">
<h4 className="text-white font-medium text-lg leading-tight">
{request.receiver.name || request.receiver.fullName}
</h4>
<div className="flex items-center space-x-3">
<Badge className={
request.receiver.type === 'FULFILLMENT' ? 'bg-blue-500/20 text-blue-300 border-blue-500/30' :
request.receiver.type === 'SELLER' ? 'bg-green-500/20 text-green-300 border-green-500/30' :
request.receiver.type === 'LOGIST' ? 'bg-orange-500/20 text-orange-300 border-orange-500/30' :
request.receiver.type === 'WHOLESALE' ? 'bg-purple-500/20 text-purple-300 border-purple-500/30' :
'bg-gray-500/20 text-gray-300 border-gray-500/30'
}>
{request.receiver.type === 'FULFILLMENT' ? 'Фулфилмент' :
request.receiver.type === 'SELLER' ? 'Селлер' :
request.receiver.type === 'LOGIST' ? 'Логистика' :
request.receiver.type === 'WHOLESALE' ? 'Оптовик' :
request.receiver.type}
</Badge>
<Badge className={
request.status === 'PENDING' ? 'bg-yellow-500/20 text-yellow-300 border-yellow-500/30' :
request.status === 'REJECTED' ? 'bg-red-500/20 text-red-300 border-red-500/30' :
'bg-gray-500/20 text-gray-300 border-gray-500/30'
}>
{request.status === 'PENDING' ? 'Ожидает ответа' : request.status === 'REJECTED' ? 'Отклонено' : request.status}
</Badge>
</div>
</div>
<div className="space-y-2">
<p className="text-white/60 text-sm">ИНН: {request.receiver.inn}</p>
{request.receiver.address && (
<div className="flex items-center text-white/60 text-sm">
<span className="truncate">{request.receiver.address}</span>
</div>
)}
{request.message && (
<div className="p-2 bg-white/5 rounded border border-white/10">
<p className="text-white/80 text-sm italic">&quot;{request.message}&quot;</p>
</div>
)}
<div className="flex items-center text-white/40 text-xs">
<span>Отправлено {formatDate(request.createdAt)}</span>
</div>
<Badge className={
request.status === 'PENDING' ? 'bg-yellow-500/20 text-yellow-300 border-yellow-500/30' :
request.status === 'REJECTED' ? 'bg-red-500/20 text-red-300 border-red-500/30' :
'bg-gray-500/20 text-gray-300 border-gray-500/30'
}>
{request.status === 'PENDING' ? 'Ожидает' : request.status === 'REJECTED' ? 'Отклонено' : request.status}
</Badge>
</div>
</div>
</div>
@ -308,13 +362,13 @@ export function MarketCounterparties() {
size="sm"
variant="outline"
onClick={() => handleCancelRequest(request.id)}
className="bg-red-500/20 hover:bg-red-500/30 text-red-300 border-red-500/30 cursor-pointer ml-4"
className="bg-red-500/20 hover:bg-red-500/30 text-red-300 border-red-500/30 cursor-pointer w-full"
>
<XCircle className="h-4 w-4" />
Отменить заявку
</Button>
)}
</div>
</Card>
</div>
))}
</div>
)}