This commit is contained in:
Bivekich
2025-07-28 13:19:28 +03:00
18 changed files with 1561 additions and 538 deletions

View File

@ -1,162 +1,190 @@
"use client"
"use client";
import { useState } from 'react'
import { useQuery, useMutation } from '@apollo/client'
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
import { Button } from '@/components/ui/button'
import { Input } from '@/components/ui/input'
import { Label } from '@/components/ui/label'
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogTrigger } from '@/components/ui/dialog'
import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, AlertDialogTrigger } from '@/components/ui/alert-dialog'
import { GET_CATEGORIES } from '@/graphql/queries'
import { CREATE_CATEGORY, UPDATE_CATEGORY, DELETE_CATEGORY } from '@/graphql/mutations'
import { Plus, Edit, Trash2, Package } from 'lucide-react'
import { toast } from 'sonner'
import { useState } from "react";
import { useQuery, useMutation } from "@apollo/client";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
import {
Dialog,
DialogContent,
DialogHeader,
DialogTitle,
DialogTrigger,
} from "@/components/ui/dialog";
import {
AlertDialog,
AlertDialogAction,
AlertDialogCancel,
AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogTitle,
AlertDialogTrigger,
} from "@/components/ui/alert-dialog";
import { GET_CATEGORIES } from "@/graphql/queries";
import {
CREATE_CATEGORY,
UPDATE_CATEGORY,
DELETE_CATEGORY,
} from "@/graphql/mutations";
import { Plus, Edit, Trash2, Package } from "lucide-react";
import { toast } from "sonner";
interface Category {
id: string
name: string
createdAt: string
updatedAt: string
id: string;
name: string;
createdAt: string;
updatedAt: string;
}
export function CategoriesSection() {
const [isCreateDialogOpen, setIsCreateDialogOpen] = useState(false)
const [isEditDialogOpen, setIsEditDialogOpen] = useState(false)
const [editingCategory, setEditingCategory] = useState<Category | null>(null)
const [newCategoryName, setNewCategoryName] = useState('')
const [editCategoryName, setEditCategoryName] = useState('')
const [isCreateDialogOpen, setIsCreateDialogOpen] = useState(false);
const [isEditDialogOpen, setIsEditDialogOpen] = useState(false);
const [editingCategory, setEditingCategory] = useState<Category | null>(null);
const [newCategoryName, setNewCategoryName] = useState("");
const [editCategoryName, setEditCategoryName] = useState("");
const formatDate = (dateString: string) => {
try {
const date = new Date(dateString)
const date = new Date(dateString);
if (isNaN(date.getTime())) {
return 'Неизвестно'
return "Неизвестно";
}
return date.toLocaleDateString('ru-RU', {
day: '2-digit',
month: '2-digit',
year: 'numeric'
})
return date.toLocaleDateString("ru-RU", {
day: "2-digit",
month: "2-digit",
year: "numeric",
});
} catch (error) {
return 'Неизвестно'
return "Неизвестно";
}
}
};
const { data, loading, error, refetch } = useQuery(GET_CATEGORIES)
const [createCategory, { loading: creating }] = useMutation(CREATE_CATEGORY)
const [updateCategory, { loading: updating }] = useMutation(UPDATE_CATEGORY)
const [deleteCategory, { loading: deleting }] = useMutation(DELETE_CATEGORY)
const { data, loading, error, refetch } = useQuery(GET_CATEGORIES);
const [createCategory, { loading: creating }] = useMutation(CREATE_CATEGORY);
const [updateCategory, { loading: updating }] = useMutation(UPDATE_CATEGORY);
const [deleteCategory, { loading: deleting }] = useMutation(DELETE_CATEGORY);
const categories: Category[] = data?.categories || []
const categories: Category[] = data?.categories || [];
const handleCreateCategory = async () => {
if (!newCategoryName.trim()) {
toast.error('Введите название категории')
return
toast.error("Введите название категории");
return;
}
try {
const { data } = await createCategory({
variables: { input: { name: newCategoryName.trim() } }
})
variables: { input: { name: newCategoryName.trim() } },
});
if (data?.createCategory?.success) {
toast.success('Категория успешно создана')
setNewCategoryName('')
setIsCreateDialogOpen(false)
refetch()
toast.success("Категория успешно создана");
setNewCategoryName("");
setIsCreateDialogOpen(false);
refetch();
} else {
toast.error(data?.createCategory?.message || 'Ошибка при создании категории')
toast.error(
data?.createCategory?.message || "Ошибка при создании категории"
);
}
} catch (error) {
console.error('Error creating category:', error)
toast.error('Ошибка при создании категории')
console.error("Error creating category:", error);
toast.error("Ошибка при создании категории");
}
}
};
const handleEditCategory = (category: Category) => {
setEditingCategory(category)
setEditCategoryName(category.name)
setIsEditDialogOpen(true)
}
setEditingCategory(category);
setEditCategoryName(category.name);
setIsEditDialogOpen(true);
};
const handleUpdateCategory = async () => {
if (!editingCategory || !editCategoryName.trim()) {
toast.error('Введите название категории')
return
toast.error("Введите название категории");
return;
}
try {
const { data } = await updateCategory({
variables: {
id: editingCategory.id,
input: { name: editCategoryName.trim() }
}
})
variables: {
id: editingCategory.id,
input: { name: editCategoryName.trim() },
},
});
if (data?.updateCategory?.success) {
toast.success('Категория успешно обновлена')
setEditingCategory(null)
setEditCategoryName('')
setIsEditDialogOpen(false)
refetch()
toast.success("Категория успешно обновлена");
setEditingCategory(null);
setEditCategoryName("");
setIsEditDialogOpen(false);
refetch();
} else {
toast.error(data?.updateCategory?.message || 'Ошибка при обновлении категории')
toast.error(
data?.updateCategory?.message || "Ошибка при обновлении категории"
);
}
} catch (error) {
console.error('Error updating category:', error)
toast.error('Ошибка при обновлении категории')
console.error("Error updating category:", error);
toast.error("Ошибка при обновлении категории");
}
}
};
const handleDeleteCategory = async (categoryId: string) => {
try {
const { data } = await deleteCategory({
variables: { id: categoryId }
})
variables: { id: categoryId },
});
if (data?.deleteCategory) {
toast.success('Категория успешно удалена')
refetch()
toast.success("Категория успешно удалена");
refetch();
} else {
toast.error('Ошибка при удалении категории')
toast.error("Ошибка при удалении категории");
}
} catch (error) {
console.error('Error deleting category:', error)
const errorMessage = error instanceof Error ? error.message : 'Ошибка при удалении категории'
toast.error(errorMessage)
console.error("Error deleting category:", error);
const errorMessage =
error instanceof Error
? error.message
: "Ошибка при удалении категории";
toast.error(errorMessage);
}
}
};
const handleCreateBasicCategories = async () => {
const basicCategories = [
'Электроника',
'Одежда',
'Обувь',
'Дом и сад',
'Красота и здоровье',
'Спорт и отдых',
'Автотовары',
'Детские товары',
'Продукты питания',
'Книги и канцелярия'
]
"Электроника",
"Одежда",
"Обувь",
"Дом и сад",
"Красота и здоровье",
"Спорт и отдых",
"Автотовары",
"Детские товары",
"Продукты питания",
"Книги и канцелярия",
"Расходники",
];
try {
for (const categoryName of basicCategories) {
await createCategory({
variables: { input: { name: categoryName } }
})
variables: { input: { name: categoryName } },
});
}
toast.success('Базовые категории созданы')
refetch()
toast.success("Базовые категории созданы");
refetch();
} catch (error) {
console.error('Error creating basic categories:', error)
toast.error('Ошибка при создании категорий')
console.error("Error creating basic categories:", error);
toast.error("Ошибка при создании категорий");
}
}
};
if (loading) {
return (
@ -170,7 +198,7 @@ export function CategoriesSection() {
</div>
</Card>
</div>
)
);
}
if (error) {
@ -182,13 +210,17 @@ export function CategoriesSection() {
<Card className="glass-card border-white/10 p-6">
<div className="text-center">
<p className="text-white/70 mb-4">Ошибка загрузки категорий</p>
<Button onClick={() => refetch()} variant="outline" className="bg-white/10 text-white border-white/20">
<Button
onClick={() => refetch()}
variant="outline"
className="bg-white/10 text-white border-white/20"
>
Попробовать снова
</Button>
</div>
</Card>
</div>
)
);
}
return (
@ -196,12 +228,14 @@ export function CategoriesSection() {
<div className="flex items-center justify-between">
<div>
<h2 className="text-2xl font-bold text-white">Категории товаров</h2>
<p className="text-white/70 text-sm">Управление категориями для классификации товаров</p>
<p className="text-white/70 text-sm">
Управление категориями для классификации товаров
</p>
</div>
<div className="flex gap-2">
{categories.length === 0 && (
<Button
<Button
onClick={handleCreateBasicCategories}
variant="outline"
className="bg-white/10 hover:bg-white/20 text-white border-white/20"
@ -209,8 +243,11 @@ export function CategoriesSection() {
Создать базовые категории
</Button>
)}
<Dialog open={isCreateDialogOpen} onOpenChange={setIsCreateDialogOpen}>
<Dialog
open={isCreateDialogOpen}
onOpenChange={setIsCreateDialogOpen}
>
<DialogTrigger asChild>
<Button className="bg-gradient-to-r from-purple-600 to-pink-600 hover:from-purple-700 hover:to-pink-700 text-white">
<Plus className="w-4 h-4 mr-2" />
@ -219,34 +256,40 @@ export function CategoriesSection() {
</DialogTrigger>
<DialogContent className="glass-card">
<DialogHeader>
<DialogTitle className="text-white">Создать новую категорию</DialogTitle>
<DialogTitle className="text-white">
Создать новую категорию
</DialogTitle>
</DialogHeader>
<div className="space-y-4">
<div>
<Label htmlFor="category-name" className="text-white">Название категории</Label>
<Label htmlFor="category-name" className="text-white">
Название категории
</Label>
<Input
id="category-name"
value={newCategoryName}
onChange={(e) => setNewCategoryName(e.target.value)}
placeholder="Введите название..."
className="glass-input text-white placeholder:text-white/50"
onKeyDown={(e) => e.key === 'Enter' && handleCreateCategory()}
onKeyDown={(e) =>
e.key === "Enter" && handleCreateCategory()
}
/>
</div>
<div className="flex justify-end gap-2">
<Button
variant="outline"
<Button
variant="outline"
onClick={() => setIsCreateDialogOpen(false)}
className="bg-white/10 text-white border-white/20"
>
Отмена
</Button>
<Button
<Button
onClick={handleCreateCategory}
disabled={creating}
className="bg-gradient-to-r from-purple-600 to-pink-600 text-white"
>
{creating ? 'Создание...' : 'Создать'}
{creating ? "Создание..." : "Создать"}
</Button>
</div>
</div>
@ -257,17 +300,21 @@ export function CategoriesSection() {
<Card className="glass-card border-white/10">
<CardHeader>
<CardTitle className="text-white">Список категорий ({categories.length})</CardTitle>
<CardTitle className="text-white">
Список категорий ({categories.length})
</CardTitle>
</CardHeader>
<CardContent>
{categories.length === 0 ? (
<div className="text-center py-12">
<Package className="h-16 w-16 text-white/40 mx-auto mb-4" />
<h3 className="text-lg font-medium text-white mb-2">Нет категорий</h3>
<h3 className="text-lg font-medium text-white mb-2">
Нет категорий
</h3>
<p className="text-white/60 text-sm mb-4">
Создайте категории для классификации товаров
</p>
<Button
<Button
onClick={handleCreateBasicCategories}
className="bg-gradient-to-r from-purple-600 to-pink-600 text-white"
>
@ -277,10 +324,15 @@ export function CategoriesSection() {
) : (
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
{categories.map((category) => (
<div key={category.id} className="glass-card p-4 border border-white/10 rounded-lg">
<div
key={category.id}
className="glass-card p-4 border border-white/10 rounded-lg"
>
<div className="flex items-center justify-between">
<div>
<h4 className="font-medium text-white">{category.name}</h4>
<h4 className="font-medium text-white">
{category.name}
</h4>
<p className="text-white/60 text-xs">
Создано: {formatDate(category.createdAt)}
</p>
@ -306,22 +358,26 @@ export function CategoriesSection() {
</AlertDialogTrigger>
<AlertDialogContent className="glass-card">
<AlertDialogHeader>
<AlertDialogTitle className="text-white">Удалить категорию</AlertDialogTitle>
<AlertDialogTitle className="text-white">
Удалить категорию
</AlertDialogTitle>
<AlertDialogDescription className="text-white/70">
Вы уверены, что хотите удалить категорию &quot;{category.name}&quot;?
Это действие нельзя отменить. Если в категории есть товары, удаление будет невозможно.
Вы уверены, что хотите удалить категорию &quot;
{category.name}&quot;? Это действие нельзя
отменить. Если в категории есть товары, удаление
будет невозможно.
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel className="bg-white/10 text-white border-white/20">
Отмена
</AlertDialogCancel>
<AlertDialogAction
<AlertDialogAction
onClick={() => handleDeleteCategory(category.id)}
className="bg-red-600 hover:bg-red-700 text-white"
disabled={deleting}
>
{deleting ? 'Удаление...' : 'Удалить'}
{deleting ? "Удаление..." : "Удалить"}
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
@ -339,39 +395,43 @@ export function CategoriesSection() {
<Dialog open={isEditDialogOpen} onOpenChange={setIsEditDialogOpen}>
<DialogContent className="glass-card">
<DialogHeader>
<DialogTitle className="text-white">Редактировать категорию</DialogTitle>
<DialogTitle className="text-white">
Редактировать категорию
</DialogTitle>
</DialogHeader>
<div className="space-y-4">
<div>
<Label htmlFor="edit-category-name" className="text-white">Название категории</Label>
<Label htmlFor="edit-category-name" className="text-white">
Название категории
</Label>
<Input
id="edit-category-name"
value={editCategoryName}
onChange={(e) => setEditCategoryName(e.target.value)}
placeholder="Введите название..."
className="glass-input text-white placeholder:text-white/50"
onKeyDown={(e) => e.key === 'Enter' && handleUpdateCategory()}
onKeyDown={(e) => e.key === "Enter" && handleUpdateCategory()}
/>
</div>
<div className="flex justify-end gap-2">
<Button
variant="outline"
<Button
variant="outline"
onClick={() => setIsEditDialogOpen(false)}
className="bg-white/10 text-white border-white/20"
>
Отмена
</Button>
<Button
<Button
onClick={handleUpdateCategory}
disabled={updating}
className="bg-gradient-to-r from-purple-600 to-pink-600 text-white"
>
{updating ? 'Сохранение...' : 'Сохранить'}
{updating ? "Сохранение..." : "Сохранить"}
</Button>
</div>
</div>
</DialogContent>
</Dialog>
</div>
)
}
);
}

View File

@ -362,7 +362,7 @@ export function FulfillmentWarehouse2Demo() {
icon={Wrench}
current={warehouseStats.fulfillmentSupplies.current}
change={warehouseStats.fulfillmentSupplies.change}
description="Упаковка, этикетки"
description="Расходники, этикетки"
/>
<StatCard
title="Расходники селлеров"

View File

@ -10,7 +10,7 @@ import { useQuery } from "@apollo/client";
import {
GET_CONVERSATIONS,
GET_INCOMING_REQUESTS,
GET_SUPPLY_ORDERS,
GET_PENDING_SUPPLIES_COUNT,
} from "@/graphql/queries";
import {
Settings,
@ -27,32 +27,21 @@ import {
BarChart3,
} from "lucide-react";
// Компонент для отображения уведомлений о новых заявках
function NewOrdersNotification() {
const { user } = useAuth();
// Загружаем заказы поставок для поставщика
const { data: ordersData } = useQuery(GET_SUPPLY_ORDERS, {
pollInterval: 30000, // Обновляем каждые 30 секунд для заявок
// Компонент для отображения уведомлений о непринятых поставках
function PendingSuppliesNotification() {
const { data: pendingData } = useQuery(GET_PENDING_SUPPLIES_COUNT, {
pollInterval: 30000, // Обновляем каждые 30 секунд
fetchPolicy: "cache-first",
errorPolicy: "ignore",
skip: user?.organization?.type !== "WHOLESALE",
});
if (user?.organization?.type !== "WHOLESALE") return null;
const pendingCount = pendingData?.pendingSuppliesCount?.total || 0;
const orders = ordersData?.supplyOrders || [];
// Считаем заявки в статусе PENDING (ожидают одобрения поставщика)
const pendingOrders = orders.filter(
(order) =>
order.status === "PENDING" && order.partnerId === user?.organization?.id
);
if (pendingOrders.length === 0) return null;
if (pendingCount === 0) return null;
return (
<div className="absolute -top-1 -right-1 bg-red-500 text-white text-xs rounded-full min-w-[18px] h-[18px] flex items-center justify-center font-bold animate-pulse">
{pendingOrders.length > 99 ? "99+" : pendingOrders.length}
{pendingCount > 99 ? "99+" : pendingCount}
</div>
);
}
@ -447,12 +436,14 @@ export function Sidebar() {
isSuppliesActive
? "bg-white/20 text-white hover:bg-white/30"
: "text-white/80 hover:bg-white/10 hover:text-white"
} cursor-pointer`}
} cursor-pointer relative`}
onClick={handleSuppliesClick}
title={isCollapsed ? "Мои поставки" : ""}
>
<Truck className="h-4 w-4 flex-shrink-0" />
{!isCollapsed && <span className="ml-3">Мои поставки</span>}
{/* Уведомление о непринятых поставках */}
<PendingSuppliesNotification />
</Button>
)}
@ -504,7 +495,7 @@ export function Sidebar() {
isSuppliesActive
? "bg-white/20 text-white hover:bg-white/30"
: "text-white/80 hover:bg-white/10 hover:text-white"
} cursor-pointer`}
} cursor-pointer relative`}
onClick={handleSuppliesClick}
title={isCollapsed ? "Входящие поставки" : ""}
>
@ -512,6 +503,8 @@ export function Sidebar() {
{!isCollapsed && (
<span className="ml-3">Входящие поставки</span>
)}
{/* Уведомление о непринятых поставках */}
<PendingSuppliesNotification />
</Button>
)}
@ -569,10 +562,8 @@ export function Sidebar() {
>
<Truck className="h-4 w-4 flex-shrink-0" />
{!isCollapsed && <span className="ml-3">Заявки</span>}
{/* Уведомление о новых заявках */}
{user?.organization?.type === "WHOLESALE" && (
<NewOrdersNotification />
)}
{/* Уведомление о непринятых поставках */}
<PendingSuppliesNotification />
</Button>
)}
@ -586,12 +577,14 @@ export function Sidebar() {
isSuppliesActive
? "bg-white/20 text-white hover:bg-white/30"
: "text-white/80 hover:bg-white/10 hover:text-white"
} cursor-pointer`}
} cursor-pointer relative`}
onClick={handleSuppliesClick}
title={isCollapsed ? "Перевозки" : ""}
>
<Truck className="h-4 w-4 flex-shrink-0" />
{!isCollapsed && <span className="ml-3">Перевозки</span>}
{/* Уведомление о непринятых поставках */}
<PendingSuppliesNotification />
</Button>
)}

View File

@ -1,20 +1,42 @@
"use client";
import { useState } from "react";
import { useQuery } from "@apollo/client";
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
import { Card } from "@/components/ui/card";
import { Sidebar } from "@/components/dashboard/sidebar";
import { useSidebar } from "@/hooks/useSidebar";
import { GET_PENDING_SUPPLIES_COUNT } from "@/graphql/queries";
import { Building2, ShoppingCart } from "lucide-react";
// Импорты компонентов подразделов
import { FulfillmentSuppliesTab } from "./fulfillment-supplies/fulfillment-supplies-tab";
import { MarketplaceSuppliesTab } from "./marketplace-supplies/marketplace-supplies-tab";
// Компонент для отображения бейджа с уведомлениями
function NotificationBadge({ count }: { count: number }) {
if (count === 0) return null;
return (
<div className="ml-1 bg-red-500 text-white text-xs font-bold rounded-full min-w-[16px] h-4 flex items-center justify-center px-1">
{count > 99 ? "99+" : count}
</div>
);
}
export function FulfillmentSuppliesDashboard() {
const { getSidebarMargin } = useSidebar();
const [activeTab, setActiveTab] = useState("fulfillment");
// Загружаем данные о непринятых поставках
const { data: pendingData } = useQuery(GET_PENDING_SUPPLIES_COUNT, {
pollInterval: 30000, // Обновляем каждые 30 секунд
fetchPolicy: "cache-first",
errorPolicy: "ignore",
});
const pendingCount = pendingData?.pendingSuppliesCount?.total || 0;
return (
<div className="h-screen flex overflow-hidden">
<Sidebar />
@ -32,13 +54,14 @@ export function FulfillmentSuppliesDashboard() {
<TabsList className="grid w-full grid-cols-2 bg-white/5 backdrop-blur border-white/10 flex-shrink-0 h-8 xl:h-10">
<TabsTrigger
value="fulfillment"
className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70 flex items-center gap-1 text-xs xl:text-sm"
className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70 flex items-center gap-1 text-xs xl:text-sm relative"
>
<Building2 className="h-3 w-3" />
<span className="hidden sm:inline">
Поставки на фулфилмент
</span>
<span className="sm:hidden">Фулфилмент</span>
<NotificationBadge count={pendingCount} />
</TabsTrigger>
<TabsTrigger
value="marketplace"

View File

@ -7,7 +7,12 @@ import { Button } from "@/components/ui/button";
import { Separator } from "@/components/ui/separator";
import { Avatar, AvatarImage, AvatarFallback } from "@/components/ui/avatar";
import { useQuery, useMutation } from "@apollo/client";
import { GET_SUPPLY_ORDERS, GET_MY_SUPPLIES } from "@/graphql/queries";
import {
GET_SUPPLY_ORDERS,
GET_MY_SUPPLIES,
GET_PENDING_SUPPLIES_COUNT,
GET_WAREHOUSE_PRODUCTS,
} from "@/graphql/queries";
import { UPDATE_SUPPLY_ORDER_STATUS } from "@/graphql/mutations";
import { useAuth } from "@/hooks/useAuth";
import { toast } from "sonner";
@ -27,8 +32,61 @@ import {
Building,
Hash,
Store,
Bell,
AlertTriangle,
} from "lucide-react";
// Компонент уведомлений о непринятых поставках
function PendingSuppliesAlert() {
const { data: pendingData } = useQuery(GET_PENDING_SUPPLIES_COUNT, {
pollInterval: 30000, // Обновляем каждые 30 секунд
fetchPolicy: "cache-first",
errorPolicy: "ignore",
});
const pendingCount = pendingData?.pendingSuppliesCount?.total || 0;
const supplyOrdersCount =
pendingData?.pendingSuppliesCount?.supplyOrders || 0;
const incomingRequestsCount =
pendingData?.pendingSuppliesCount?.incomingRequests || 0;
if (pendingCount === 0) return null;
return (
<Card className="bg-gradient-to-r from-orange-500/20 to-red-500/20 backdrop-blur border-orange-400/30 p-3 mb-4">
<div className="flex items-center space-x-3">
<div className="p-2 bg-orange-500/20 rounded-full">
<Bell className="h-5 w-5 text-orange-300 animate-pulse" />
</div>
<div className="flex-1">
<h3 className="text-orange-200 font-semibold text-sm flex items-center gap-2">
<AlertTriangle className="h-4 w-4" />
Требует вашего внимания
</h3>
<div className="text-orange-100 text-xs mt-1 space-y-1">
{supplyOrdersCount > 0 && (
<p>
{supplyOrdersCount} поставок требуют вашего действия
(подтверждение/получение)
</p>
)}
{incomingRequestsCount > 0 && (
<p>
{incomingRequestsCount} заявок на партнерство ожидают ответа
</p>
)}
</div>
</div>
<div className="text-right">
<div className="bg-orange-500 text-white text-xs font-bold rounded-full w-6 h-6 flex items-center justify-center">
{pendingCount > 99 ? "99+" : pendingCount}
</div>
</div>
</div>
</Card>
);
}
interface SupplyOrder {
id: string;
partnerId: string;
@ -90,6 +148,7 @@ export function FulfillmentConsumablesOrdersTab() {
refetchQueries: [
{ query: GET_SUPPLY_ORDERS }, // Обновляем заказы поставок
{ query: GET_MY_SUPPLIES }, // Обновляем склад фулфилмента
{ query: GET_WAREHOUSE_PRODUCTS }, // Обновляем товары склада
],
onError: (error) => {
console.error("Error updating supply order status:", error);
@ -227,6 +286,9 @@ export function FulfillmentConsumablesOrdersTab() {
return (
<div className="space-y-2">
{/* Уведомления о непринятых поставках */}
<PendingSuppliesAlert />
{/* Компактная статистика */}
<div className="grid grid-cols-2 md:grid-cols-4 gap-2">
<Card className="bg-white/10 backdrop-blur border-white/20 p-2">

View File

@ -126,7 +126,7 @@ const mockFulfillmentGoodsSupplies: FulfillmentSupply[] = [
value: "12",
unit: "мес",
},
{ id: "ffparam4", name: "Упаковка ФФ", value: "Усиленная" },
{ id: "ffparam4", name: "Расходники ФФ", value: "Усиленная" },
],
},
],
@ -514,7 +514,7 @@ export function FulfillmentDetailedGoodsTab() {
const isRouteExpanded = expandedRoutes.has(route.id);
return (
<React.Fragment key={route.id}>
<tr
<tr
className="border-b border-white/10 hover:bg-white/5 transition-colors bg-blue-500/10 cursor-pointer"
onClick={() => toggleRouteExpansion(route.id)}
>
@ -614,9 +614,11 @@ export function FulfillmentDetailedGoodsTab() {
);
return (
<React.Fragment key={seller.id}>
<tr
<tr
className="border-b border-white/10 hover:bg-white/5 transition-colors bg-green-500/10 cursor-pointer"
onClick={() => toggleSellerExpansion(seller.id)}
onClick={() =>
toggleSellerExpansion(seller.id)
}
>
<td className="p-4 pl-20">
<div className="flex items-center space-x-2">
@ -693,9 +695,13 @@ export function FulfillmentDetailedGoodsTab() {
expandedProducts.has(product.id);
return (
<React.Fragment key={product.id}>
<tr
<tr
className="border-b border-white/10 hover:bg-white/5 transition-colors bg-yellow-500/10 cursor-pointer"
onClick={() => toggleProductExpansion(product.id)}
onClick={() =>
toggleProductExpansion(
product.id
)
}
>
<td className="p-4 pl-28">
<div className="flex items-center space-x-2">

View File

@ -8,7 +8,10 @@ import { StatsCard } from "../../supplies/ui/stats-card";
import { StatsGrid } from "../../supplies/ui/stats-grid";
import { useRouter } from "next/navigation";
import { useQuery } from "@apollo/client";
import { GET_SUPPLY_ORDERS } from "@/graphql/queries";
import {
GET_SUPPLY_ORDERS,
GET_PENDING_SUPPLIES_COUNT,
} from "@/graphql/queries";
import { useAuth } from "@/hooks/useAuth";
import {
Calendar,
@ -20,8 +23,54 @@ import {
Plus,
ChevronDown,
ChevronRight,
Bell,
AlertTriangle,
} from "lucide-react";
// Компонент уведомлений о непринятых поставках
function PendingSuppliesAlert() {
const { data: pendingData } = useQuery(GET_PENDING_SUPPLIES_COUNT, {
pollInterval: 30000, // Обновляем каждые 30 секунд
fetchPolicy: "cache-first",
errorPolicy: "ignore",
});
const pendingCount = pendingData?.pendingSuppliesCount?.total || 0;
const supplyOrdersCount = pendingData?.pendingSuppliesCount?.supplyOrders || 0;
const incomingRequestsCount = pendingData?.pendingSuppliesCount?.incomingRequests || 0;
if (pendingCount === 0) return null;
return (
<Card className="bg-gradient-to-r from-orange-500/20 to-red-500/20 backdrop-blur border-orange-400/30 p-3 mb-4">
<div className="flex items-center space-x-3">
<div className="p-2 bg-orange-500/20 rounded-full">
<Bell className="h-5 w-5 text-orange-300 animate-pulse" />
</div>
<div className="flex-1">
<h3 className="text-orange-200 font-semibold text-sm flex items-center gap-2">
<AlertTriangle className="h-4 w-4" />
Требует вашего внимания
</h3>
<div className="text-orange-100 text-xs mt-1 space-y-1">
{supplyOrdersCount > 0 && (
<p> {supplyOrdersCount} поставок требуют вашего действия (подтверждение/получение)</p>
)}
{incomingRequestsCount > 0 && (
<p> {incomingRequestsCount} заявок на партнерство ожидают ответа</p>
)}
</div>
</div>
<div className="text-right">
<div className="bg-orange-500 text-white text-xs font-bold rounded-full w-6 h-6 flex items-center justify-center">
{pendingCount > 99 ? "99+" : pendingCount}
</div>
</div>
</div>
</Card>
);
}
// Интерфейс для заказа
interface SupplyOrder {
id: string;
@ -63,21 +112,36 @@ const formatDate = (dateString: string) => {
// Функция для отображения статуса
const getStatusBadge = (status: string) => {
const statusConfig = {
PENDING: { label: "Ожидает", color: "bg-yellow-500/20 text-yellow-300 border-yellow-500/30" },
CONFIRMED: { label: "Подтверждён", color: "bg-blue-500/20 text-blue-300 border-blue-500/30" },
IN_PROGRESS: { label: "В работе", color: "bg-purple-500/20 text-purple-300 border-purple-500/30" },
SHIPPED: { label: "Отправлен", color: "bg-orange-500/20 text-orange-300 border-orange-500/30" },
DELIVERED: { label: "Доставлен", color: "bg-green-500/20 text-green-300 border-green-500/30" },
CANCELLED: { label: "Отменён", color: "bg-red-500/20 text-red-300 border-red-500/30" },
PENDING: {
label: "Ожидает",
color: "bg-yellow-500/20 text-yellow-300 border-yellow-500/30",
},
CONFIRMED: {
label: "Подтверждён",
color: "bg-blue-500/20 text-blue-300 border-blue-500/30",
},
IN_PROGRESS: {
label: "В работе",
color: "bg-purple-500/20 text-purple-300 border-purple-500/30",
},
SHIPPED: {
label: "Отправлен",
color: "bg-orange-500/20 text-orange-300 border-orange-500/30",
},
DELIVERED: {
label: "Доставлен",
color: "bg-green-500/20 text-green-300 border-green-500/30",
},
CANCELLED: {
label: "Отменён",
color: "bg-red-500/20 text-red-300 border-red-500/30",
},
};
const config = statusConfig[status as keyof typeof statusConfig] || statusConfig.PENDING;
const config =
statusConfig[status as keyof typeof statusConfig] || statusConfig.PENDING;
return (
<Badge className={config.color}>
{config.label}
</Badge>
);
return <Badge className={config.color}>{config.label}</Badge>;
};
export function FulfillmentDetailedSuppliesTab() {
@ -87,13 +151,13 @@ export function FulfillmentDetailedSuppliesTab() {
// Загружаем реальные данные заказов расходников
const { data, loading, error } = useQuery(GET_SUPPLY_ORDERS, {
fetchPolicy: 'cache-and-network', // Принудительно проверяем сервер
notifyOnNetworkStatusChange: true
fetchPolicy: "cache-and-network", // Принудительно проверяем сервер
notifyOnNetworkStatusChange: true,
});
// Получаем ID текущей организации (фулфилмент-центра)
const currentOrganizationId = user?.organization?.id;
// Фильтруем заказы созданные текущей организацией (наши расходники)
const ourSupplyOrders: SupplyOrder[] = (data?.supplyOrders || []).filter(
(order: SupplyOrder) => order.organizationId === currentOrganizationId
@ -113,7 +177,9 @@ export function FulfillmentDetailedSuppliesTab() {
return (
<div className="flex items-center justify-center h-64">
<div className="animate-spin rounded-full h-8 w-8 border-2 border-white border-t-transparent"></div>
<span className="ml-3 text-white/60">Загрузка наших расходников...</span>
<span className="ml-3 text-white/60">
Загрузка наших расходников...
</span>
</div>
);
}
@ -123,7 +189,9 @@ export function FulfillmentDetailedSuppliesTab() {
<div className="flex items-center justify-center h-64">
<div className="text-center">
<Wrench className="h-12 w-12 text-red-400 mx-auto mb-4" />
<p className="text-red-400 font-medium">Ошибка загрузки расходников</p>
<p className="text-red-400 font-medium">
Ошибка загрузки расходников
</p>
<p className="text-white/60 text-sm mt-2">{error.message}</p>
</div>
</div>
@ -132,18 +200,21 @@ export function FulfillmentDetailedSuppliesTab() {
return (
<div className="space-y-6">
{/* Уведомления о непринятых поставках */}
<PendingSuppliesAlert />
{/* Заголовок с кнопкой создания поставки */}
<div className="flex items-center justify-between">
<div>
<h2 className="text-xl font-bold text-white mb-1">
Наши расходники
</h2>
<h2 className="text-xl font-bold text-white mb-1">Наши расходники</h2>
<p className="text-white/60 text-sm">
Управление поставками расходников фулфилмента
</p>
</div>
<Button
onClick={() => router.push("/fulfillment-supplies/create-consumables")}
onClick={() =>
router.push("/fulfillment-supplies/create-consumables")
}
className="bg-gradient-to-r from-purple-500 to-pink-500 hover:from-purple-600 hover:to-pink-600 text-white shadow-lg"
>
<Plus className="h-4 w-4 mr-2" />
@ -178,7 +249,10 @@ export function FulfillmentDetailedSuppliesTab() {
<StatsCard
title="Всего единиц"
value={ourSupplyOrders.reduce((sum: number, order: SupplyOrder) => sum + order.totalItems, 0)}
value={ourSupplyOrders.reduce(
(sum: number, order: SupplyOrder) => sum + order.totalItems,
0
)}
icon={Wrench}
iconColor="text-blue-400"
iconBg="bg-blue-500/20"
@ -208,7 +282,8 @@ export function FulfillmentDetailedSuppliesTab() {
Пока нет заказов расходников
</h3>
<p className="text-white/60">
Создайте первый заказ расходников через кнопку &quot;Создать поставку&quot;
Создайте первый заказ расходников через кнопку &quot;Создать
поставку&quot;
</p>
</div>
</Card>
@ -225,8 +300,12 @@ export function FulfillmentDetailedSuppliesTab() {
<th className="text-left p-4 text-white font-semibold">
Дата создания
</th>
<th className="text-left p-4 text-white font-semibold">План</th>
<th className="text-left p-4 text-white font-semibold">Факт</th>
<th className="text-left p-4 text-white font-semibold">
План
</th>
<th className="text-left p-4 text-white font-semibold">
Факт
</th>
<th className="text-left p-4 text-white font-semibold">
Цена расходников
</th>

View File

@ -13,7 +13,11 @@ import {
SelectTrigger,
SelectValue,
} from "@/components/ui/select";
import { GET_MY_EMPLOYEES, GET_MY_COUNTERPARTIES } from "@/graphql/queries";
import {
GET_MY_EMPLOYEES,
GET_MY_COUNTERPARTIES,
GET_PENDING_SUPPLIES_COUNT,
} from "@/graphql/queries";
import {
Package,
Plus,
@ -31,9 +35,62 @@ import {
Clock,
CheckCircle,
FileText,
Bell,
AlertTriangle,
} from "lucide-react";
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
// Компонент уведомлений о непринятых поставках
function PendingSuppliesAlert() {
const { data: pendingData } = useQuery(GET_PENDING_SUPPLIES_COUNT, {
pollInterval: 30000, // Обновляем каждые 30 секунд
fetchPolicy: "cache-first",
errorPolicy: "ignore",
});
const pendingCount = pendingData?.pendingSuppliesCount?.total || 0;
const supplyOrdersCount =
pendingData?.pendingSuppliesCount?.supplyOrders || 0;
const incomingRequestsCount =
pendingData?.pendingSuppliesCount?.incomingRequests || 0;
if (pendingCount === 0) return null;
return (
<Card className="bg-gradient-to-r from-orange-500/20 to-red-500/20 backdrop-blur border-orange-400/30 p-3 mb-4">
<div className="flex items-center space-x-3">
<div className="p-2 bg-orange-500/20 rounded-full">
<Bell className="h-5 w-5 text-orange-300 animate-pulse" />
</div>
<div className="flex-1">
<h3 className="text-orange-200 font-semibold text-sm flex items-center gap-2">
<AlertTriangle className="h-4 w-4" />
Требует вашего внимания
</h3>
<div className="text-orange-100 text-xs mt-1 space-y-1">
{supplyOrdersCount > 0 && (
<p>
{supplyOrdersCount} поставок требуют вашего действия
(подтверждение/получение)
</p>
)}
{incomingRequestsCount > 0 && (
<p>
{incomingRequestsCount} заявок на партнерство ожидают ответа
</p>
)}
</div>
</div>
<div className="text-right">
<div className="bg-orange-500 text-white text-xs font-bold rounded-full w-6 h-6 flex items-center justify-center">
{pendingCount > 99 ? "99+" : pendingCount}
</div>
</div>
</div>
</Card>
);
}
// Интерфейсы для данных
interface Employee {
id: string;
@ -655,6 +712,9 @@ export function FulfillmentGoodsTab() {
return (
<div className="h-full flex flex-col p-2 xl:p-4">
{/* Уведомления о непринятых поставках */}
<PendingSuppliesAlert />
<Tabs
value={activeTab}
onValueChange={setActiveTab}

View File

@ -2,7 +2,9 @@
import { useState, useEffect } from "react";
import { useSearchParams, useRouter } from "next/navigation";
import { useQuery } from "@apollo/client";
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
import { GET_PENDING_SUPPLIES_COUNT } from "@/graphql/queries";
import { Package, Wrench, RotateCcw, Building2 } from "lucide-react";
// Импорты компонентов подкатегорий
@ -13,11 +15,31 @@ import { FulfillmentConsumablesOrdersTab } from "./fulfillment-consumables-order
// Новые компоненты для детального просмотра (копия из supplies модуля)
import { FulfillmentDetailedSuppliesTab } from "./fulfillment-detailed-supplies-tab";
// Компонент для отображения бейджа с уведомлениями
function NotificationBadge({ count }: { count: number }) {
if (count === 0) return null;
return (
<div className="ml-1 bg-red-500 text-white text-xs font-bold rounded-full min-w-[16px] h-4 flex items-center justify-center px-1">
{count > 99 ? "99+" : count}
</div>
);
}
export function FulfillmentSuppliesTab() {
const router = useRouter();
const searchParams = useSearchParams();
const [activeTab, setActiveTab] = useState("goods");
// Загружаем данные о непринятых поставках
const { data: pendingData } = useQuery(GET_PENDING_SUPPLIES_COUNT, {
pollInterval: 30000, // Обновляем каждые 30 секунд
fetchPolicy: "cache-first",
errorPolicy: "ignore",
});
const pendingCount = pendingData?.pendingSuppliesCount?.total || 0;
// Проверяем URL параметр при загрузке
useEffect(() => {
const tabParam = searchParams.get("tab");
@ -66,12 +88,13 @@ export function FulfillmentSuppliesTab() {
</TabsTrigger>
<TabsTrigger
value="consumables"
className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70 flex items-center gap-1 text-[10px] xl:text-xs"
className="data-[state=active]:bg-white/20 data-[state=active]:text-white text-white/70 flex items-center gap-1 text-[10px] xl:text-xs relative"
>
<Wrench className="h-2.5 w-2.5 xl:h-3 xl:w-3" />
<span className="hidden md:inline">Расходники селлеров</span>
<span className="md:hidden hidden sm:inline">Селлеры</span>
<span className="sm:hidden">С</span>
<NotificationBadge count={pendingCount} />
</TabsTrigger>
<TabsTrigger
value="returns"

View File

@ -20,7 +20,7 @@ const mockSellerMaterials = [
id: "1",
materialName: "Пакеты полиэтиленовые 30х40",
seller: "PackStore LLC",
category: "Упаковка",
category: "Расходники",
quantity: 10000,
expectedDate: "2024-01-14",
status: "planned",
@ -32,7 +32,7 @@ const mockSellerMaterials = [
id: "2",
materialName: "Скотч упаковочный прозрачный",
seller: "Packaging Pro",
category: "Упаковка",
category: "Расходники",
quantity: 500,
expectedDate: "2024-01-11",
status: "in-transit",

View File

@ -35,7 +35,7 @@ const mockSupplies: SupplyItem[] = [
id: '2',
name: 'Упаковочные коробки',
type: 'materials',
category: 'Упаковка',
category: 'Расходники',
quantity: 1000,
status: 'in-transit',
date: '2024-01-18',

View File

@ -9,7 +9,12 @@ import { Avatar, AvatarImage, AvatarFallback } from "@/components/ui/avatar";
import { Sidebar } from "@/components/dashboard/sidebar";
import { useSidebar } from "@/hooks/useSidebar";
import { useQuery } from "@apollo/client";
import { GET_MY_COUNTERPARTIES, GET_SUPPLY_ORDERS } from "@/graphql/queries";
import {
GET_MY_COUNTERPARTIES,
GET_SUPPLY_ORDERS,
GET_WAREHOUSE_PRODUCTS,
GET_MY_SUPPLIES, // Добавляем импорт для загрузки расходников
} from "@/graphql/queries";
import { toast } from "sonner";
import {
Package,
@ -180,13 +185,33 @@ export function FulfillmentWarehouseDashboard() {
} = useQuery(GET_SUPPLY_ORDERS, {
fetchPolicy: "cache-and-network",
});
const {
data: productsData,
loading: productsLoading,
error: productsError,
refetch: refetchProducts,
} = useQuery(GET_WAREHOUSE_PRODUCTS, {
fetchPolicy: "cache-and-network",
});
// Получаем данные партнеров-селлеров и заказов
// Загружаем расходники фулфилмента
const {
data: suppliesData,
loading: suppliesLoading,
error: suppliesError,
refetch: refetchSupplies,
} = useQuery(GET_MY_SUPPLIES, {
fetchPolicy: "cache-and-network",
});
// Получаем данные магазинов, заказов и товаров
const allCounterparties = counterpartiesData?.myCounterparties || [];
const sellerPartners = allCounterparties.filter(
(partner: any) => partner.type === "SELLER"
(partner: { type: string }) => partner.type === "SELLER"
);
const supplyOrders: SupplyOrder[] = ordersData?.supplyOrders || [];
const allProducts = productsData?.warehouseProducts || [];
const mySupplies = suppliesData?.mySupplies || []; // Добавляем расходники
// Логирование для отладки
console.log("🏪 Данные склада фулфилмента:", {
@ -201,13 +226,147 @@ export function FulfillmentWarehouseDashboard() {
ordersCount: supplyOrders.length,
deliveredOrders: supplyOrders.filter((o) => o.status === "DELIVERED")
.length,
productsCount: allProducts.length,
suppliesCount: mySupplies.length, // Добавляем логирование расходников
supplies: mySupplies.map((s: any) => ({
id: s.id,
name: s.name,
currentStock: s.currentStock,
category: s.category,
supplier: s.supplier,
})),
products: allProducts.map((p: any) => ({
id: p.id,
name: p.name,
article: p.article,
organizationName: p.organization?.name || p.organization?.fullName,
organizationType: p.organization?.type,
})),
// Добавляем анализ соответствия товаров и расходников
productSupplyMatching: allProducts.map((product: any) => {
const matchingSupply = mySupplies.find((supply: any) => {
return (
supply.name.toLowerCase() === product.name.toLowerCase() ||
supply.name
.toLowerCase()
.includes(product.name.toLowerCase().split(" ")[0])
);
});
return {
productName: product.name,
matchingSupplyName: matchingSupply?.name,
matchingSupplyStock: matchingSupply?.currentStock,
hasMatch: !!matchingSupply,
};
}),
counterpartiesLoading,
ordersLoading,
productsLoading,
suppliesLoading, // Добавляем статус загрузки расходников
counterpartiesError: counterpartiesError?.message,
ordersError: ordersError?.message,
productsError: productsError?.message,
suppliesError: suppliesError?.message, // Добавляем ошибки загрузки расходников
});
// Подсчитываем статистику на основе реальных данных партнеров-селлеров
// Расчет поступлений расходников за сутки (выносим отдельно для использования в storeData)
const suppliesReceivedToday = useMemo(() => {
const deliveredOrders = supplyOrders.filter(
(o) => o.status === "DELIVERED"
);
// Подсчитываем расходники селлера из доставленных заказов за последние сутки
const oneDayAgo = new Date();
oneDayAgo.setDate(oneDayAgo.getDate() - 1);
const recentDeliveredOrders = deliveredOrders.filter((order) => {
const deliveryDate = new Date(order.deliveryDate);
return deliveryDate >= oneDayAgo && order.fulfillmentCenter?.id; // За последние сутки
});
const realSuppliesReceived = recentDeliveredOrders.reduce(
(sum, order) => sum + order.totalItems,
0
);
// Логирование для отладки
console.log("📦 Анализ поставок расходников за сутки:", {
totalDeliveredOrders: deliveredOrders.length,
recentDeliveredOrders: recentDeliveredOrders.length,
recentOrders: recentDeliveredOrders.map((order) => ({
id: order.id,
deliveryDate: order.deliveryDate,
totalItems: order.totalItems,
status: order.status,
})),
realSuppliesReceived,
oneDayAgo: oneDayAgo.toISOString(),
});
// Возвращаем реальное значение без fallback
return realSuppliesReceived;
}, [supplyOrders]);
// Расчет использованных расходников за сутки (пока всегда 0, так как нет данных об использовании)
const suppliesUsedToday = useMemo(() => {
// TODO: Здесь должна быть логика подсчета использованных расходников
// Пока возвращаем 0, так как нет данных об использовании
return 0;
}, []);
// Расчет изменений товаров за сутки (реальные данные)
const productsReceivedToday = useMemo(() => {
// Товары, поступившие за сутки из доставленных заказов
const deliveredOrders = supplyOrders.filter(
(o) => o.status === "DELIVERED"
);
const oneDayAgo = new Date();
oneDayAgo.setDate(oneDayAgo.getDate() - 1);
const recentDeliveredOrders = deliveredOrders.filter((order) => {
const deliveryDate = new Date(order.deliveryDate);
return deliveryDate >= oneDayAgo && order.fulfillmentCenter?.id;
});
const realProductsReceived = recentDeliveredOrders.reduce(
(sum, order) => sum + (order.totalItems || 0),
0
);
// Логирование для отладки
console.log("📦 Анализ поставок товаров за сутки:", {
totalDeliveredOrders: deliveredOrders.length,
recentDeliveredOrders: recentDeliveredOrders.length,
recentOrders: recentDeliveredOrders.map((order) => ({
id: order.id,
deliveryDate: order.deliveryDate,
totalItems: order.totalItems,
status: order.status,
})),
realProductsReceived,
oneDayAgo: oneDayAgo.toISOString(),
});
return realProductsReceived;
}, [supplyOrders]);
const productsUsedToday = useMemo(() => {
// Товары, отправленные/использованные за сутки (пока 0, нет данных)
return 0;
}, []);
// Логирование статистики расходников для отладки
console.log("📊 Статистика расходников селлера:", {
suppliesReceivedToday,
suppliesUsedToday,
totalSellerSupplies: mySupplies.reduce(
(sum: number, supply: any) => sum + (supply.currentStock || 0),
0
),
netChange: suppliesReceivedToday - suppliesUsedToday,
});
// Подсчитываем статистику на основе реальных данных из заказов поставок
const warehouseStats: WarehouseStats = useMemo(() => {
const inTransitOrders = supplyOrders.filter(
(o) => o.status === "IN_TRANSIT"
@ -216,134 +375,381 @@ export function FulfillmentWarehouseDashboard() {
(o) => o.status === "DELIVERED"
);
// Генерируем статистику на основе количества партнеров-селлеров
const baseMultiplier = sellerPartners.length * 100;
// Подсчитываем общее количество товаров из всех доставленных заказов
const totalProductsFromOrders = allProducts.reduce(
(sum, product: any) => sum + (product.orderedQuantity || 0),
0
);
// Подсчитываем реальное количество расходников селлера из таблицы supplies
const totalSellerSupplies = mySupplies.reduce(
(sum: number, supply: any) => sum + (supply.currentStock || 0),
0
);
return {
products: {
current: baseMultiplier + 450,
change: 105,
current: totalProductsFromOrders, // Реальное количество товаров на складе
change: productsReceivedToday - productsUsedToday, // Реальное изменение за сутки
},
goods: {
current: Math.floor(baseMultiplier * 0.6) + 200,
change: 77,
current: 0, // Нет реальных данных о готовых товарах
change: 0, // Нет реальных данных об изменениях готовых товаров
},
defects: {
current: Math.floor(baseMultiplier * 0.05) + 15,
change: -15,
current: 0, // Нет реальных данных о браке
change: 0, // Нет реальных данных об изменениях брака
},
pvzReturns: {
current: Math.floor(baseMultiplier * 0.1) + 50,
change: 36,
current: 0, // Нет реальных данных о возвратах с ПВЗ
change: 0, // Нет реальных данных об изменениях возвратов
},
fulfillmentSupplies: {
current: Math.floor(baseMultiplier * 0.3) + 80,
change: deliveredOrders.length,
current: 0, // Нет реальных данных о расходниках ФФ
change: 0, // Нет реальных данных об изменениях расходников ФФ
},
sellerSupplies: {
current: inTransitOrders.reduce((sum, o) => sum + o.totalItems, 0) + Math.floor(baseMultiplier * 0.2),
change: 57,
current: totalSellerSupplies, // Реальное количество расходников селлера из базы
change: suppliesReceivedToday - suppliesUsedToday, // Реальное изменение за сутки
},
};
}, [sellerPartners, supplyOrders]);
}, [
sellerPartners,
supplyOrders,
allProducts,
mySupplies,
suppliesReceivedToday,
suppliesUsedToday,
productsReceivedToday,
productsUsedToday,
]);
// Создаем структурированные данные склада на основе партнеров-селлеров
// Создаем структурированные данные склада на основе уникальных товаров
const storeData: StoreData[] = useMemo(() => {
if (!sellerPartners.length) return [];
if (!sellerPartners.length && !allProducts.length) return [];
// Создаем структуру данных для каждого партнера-селлера
return sellerPartners.map((partner: any, index: number) => {
// Генерируем реалистичные данные на основе партнера
const baseProducts = Math.floor(Math.random() * 500) + 100;
const baseGoods = Math.floor(baseProducts * 0.6);
const baseDefects = Math.floor(baseProducts * 0.05);
const baseSellerSupplies = Math.floor(Math.random() * 50) + 10;
const basePvzReturns = Math.floor(baseProducts * 0.1);
// Группируем товары по названию, суммируя количества из разных поставок
const groupedProducts = new Map<
string,
{
name: string;
totalQuantity: number;
suppliers: string[];
categories: string[];
prices: number[];
articles: string[];
originalProducts: any[];
}
>();
// Создаем товары для партнера
const itemsCount = Math.floor(Math.random() * 8) + 3; // от 3 до 10 товаров
const items: ProductItem[] = Array.from({ length: itemsCount }, (_, itemIndex) => {
const itemProducts = Math.floor(baseProducts / itemsCount) + Math.floor(Math.random() * 50);
return {
id: `${index + 1}-${itemIndex + 1}`,
name: `Товар ${itemIndex + 1} от ${partner.name}`,
article: `ART${(index + 1).toString().padStart(2, '0')}${(itemIndex + 1).toString().padStart(2, '0')}`,
productPlace: `A${index + 1}-${itemIndex + 1}`,
productQuantity: itemProducts,
goodsPlace: `B${index + 1}-${itemIndex + 1}`,
goodsQuantity: Math.floor(itemProducts * 0.6),
defectsPlace: `C${index + 1}-${itemIndex + 1}`,
defectsQuantity: Math.floor(itemProducts * 0.05),
sellerSuppliesPlace: `D${index + 1}-${itemIndex + 1}`,
sellerSuppliesQuantity: Math.floor(Math.random() * 5) + 1,
pvzReturnsPlace: `E${index + 1}-${itemIndex + 1}`,
pvzReturnsQuantity: Math.floor(itemProducts * 0.1),
// Создаем варианты товара
variants: Math.random() > 0.5 ? [
{
id: `${index + 1}-${itemIndex + 1}-1`,
name: `Размер S`,
productPlace: `A${index + 1}-${itemIndex + 1}-1`,
productQuantity: Math.floor(itemProducts * 0.4),
goodsPlace: `B${index + 1}-${itemIndex + 1}-1`,
goodsQuantity: Math.floor(itemProducts * 0.24),
defectsPlace: `C${index + 1}-${itemIndex + 1}-1`,
defectsQuantity: Math.floor(itemProducts * 0.02),
sellerSuppliesPlace: `D${index + 1}-${itemIndex + 1}-1`,
sellerSuppliesQuantity: Math.floor(Math.random() * 3) + 1,
pvzReturnsPlace: `E${index + 1}-${itemIndex + 1}-1`,
pvzReturnsQuantity: Math.floor(itemProducts * 0.04),
},
{
id: `${index + 1}-${itemIndex + 1}-2`,
name: `Размер M`,
productPlace: `A${index + 1}-${itemIndex + 1}-2`,
productQuantity: Math.floor(itemProducts * 0.4),
goodsPlace: `B${index + 1}-${itemIndex + 1}-2`,
goodsQuantity: Math.floor(itemProducts * 0.24),
defectsPlace: `C${index + 1}-${itemIndex + 1}-2`,
defectsQuantity: Math.floor(itemProducts * 0.02),
sellerSuppliesPlace: `D${index + 1}-${itemIndex + 1}-2`,
sellerSuppliesQuantity: Math.floor(Math.random() * 3) + 1,
pvzReturnsPlace: `E${index + 1}-${itemIndex + 1}-2`,
pvzReturnsQuantity: Math.floor(itemProducts * 0.04),
},
{
id: `${index + 1}-${itemIndex + 1}-3`,
name: `Размер L`,
productPlace: `A${index + 1}-${itemIndex + 1}-3`,
productQuantity: Math.floor(itemProducts * 0.2),
goodsPlace: `B${index + 1}-${itemIndex + 1}-3`,
goodsQuantity: Math.floor(itemProducts * 0.12),
defectsPlace: `C${index + 1}-${itemIndex + 1}-3`,
defectsQuantity: Math.floor(itemProducts * 0.01),
sellerSuppliesPlace: `D${index + 1}-${itemIndex + 1}-3`,
sellerSuppliesQuantity: Math.floor(Math.random() * 2) + 1,
pvzReturnsPlace: `E${index + 1}-${itemIndex + 1}-3`,
pvzReturnsQuantity: Math.floor(itemProducts * 0.02),
},
] : undefined,
};
// Группируем товары из allProducts
allProducts.forEach((product: any) => {
const productName = product.name;
const quantity = product.orderedQuantity || 0;
if (groupedProducts.has(productName)) {
const existing = groupedProducts.get(productName)!;
existing.totalQuantity += quantity;
existing.suppliers.push(
product.organization?.name ||
product.organization?.fullName ||
"Неизвестно"
);
existing.categories.push(product.category?.name || "Без категории");
existing.prices.push(product.price || 0);
existing.articles.push(product.article || "");
existing.originalProducts.push(product);
} else {
groupedProducts.set(productName, {
name: productName,
totalQuantity: quantity,
suppliers: [
product.organization?.name ||
product.organization?.fullName ||
"Неизвестно",
],
categories: [product.category?.name || "Без категории"],
prices: [product.price || 0],
articles: [product.article || ""],
originalProducts: [product],
});
}
});
// Группируем расходники по названию
const groupedSupplies = new Map<string, number>();
mySupplies.forEach((supply: any) => {
const supplyName = supply.name;
const currentStock = supply.currentStock || 0;
if (groupedSupplies.has(supplyName)) {
groupedSupplies.set(
supplyName,
groupedSupplies.get(supplyName)! + currentStock
);
} else {
groupedSupplies.set(supplyName, currentStock);
}
});
// Логирование группировки
console.log("📊 Группировка товаров и расходников:", {
groupedProductsCount: groupedProducts.size,
groupedSuppliesCount: groupedSupplies.size,
groupedProducts: Array.from(groupedProducts.entries()).map(
([name, data]) => ({
name,
totalQuantity: data.totalQuantity,
suppliersCount: data.suppliers.length,
uniqueSuppliers: [...new Set(data.suppliers)],
})
),
groupedSupplies: Array.from(groupedSupplies.entries()).map(
([name, quantity]) => ({
name,
totalQuantity: quantity,
})
),
});
// Создаем виртуальных "партнеров" на основе уникальных товаров
const uniqueProductNames = Array.from(groupedProducts.keys());
const virtualPartners = Math.max(
1,
Math.min(sellerPartners.length, Math.ceil(uniqueProductNames.length / 8))
);
return Array.from({ length: virtualPartners }, (_, index) => {
const startIndex = index * 8;
const endIndex = Math.min(startIndex + 8, uniqueProductNames.length);
const partnerProductNames = uniqueProductNames.slice(
startIndex,
endIndex
);
const items: ProductItem[] = partnerProductNames.map(
(productName, itemIndex) => {
const productData = groupedProducts.get(productName)!;
const itemProducts = productData.totalQuantity;
// Ищем соответствующий расходник по названию
const matchingSupplyQuantity = groupedSupplies.get(productName) || 0;
// Если нет точного совпадения, ищем частичное совпадение
let itemSuppliesQuantity = matchingSupplyQuantity;
if (itemSuppliesQuantity === 0) {
for (const [supplyName, quantity] of groupedSupplies.entries()) {
if (
supplyName.toLowerCase().includes(productName.toLowerCase()) ||
productName.toLowerCase().includes(supplyName.toLowerCase())
) {
itemSuppliesQuantity = quantity;
break;
}
}
}
// Fallback к процентному соотношению
if (itemSuppliesQuantity === 0) {
itemSuppliesQuantity = Math.floor(itemProducts * 0.1);
}
console.log(`📦 Товар "${productName}":`, {
totalQuantity: itemProducts,
suppliersCount: productData.suppliers.length,
uniqueSuppliers: [...new Set(productData.suppliers)],
matchingSupplyQuantity: matchingSupplyQuantity,
finalSuppliesQuantity: itemSuppliesQuantity,
usedFallback:
matchingSupplyQuantity === 0 && itemSuppliesQuantity > 0,
});
return {
id: `grouped-${productName}-${itemIndex}`, // Уникальный ID для группированного товара
name: productName,
article:
productData.articles[0] ||
`ART${(index + 1).toString().padStart(2, "0")}${(itemIndex + 1)
.toString()
.padStart(2, "0")}`,
productPlace: `A${index + 1}-${itemIndex + 1}`,
productQuantity: itemProducts, // Суммированное количество (реальные данные)
goodsPlace: `B${index + 1}-${itemIndex + 1}`,
goodsQuantity: 0, // Нет реальных данных о готовых товарах
defectsPlace: `C${index + 1}-${itemIndex + 1}`,
defectsQuantity: 0, // Нет реальных данных о браке
sellerSuppliesPlace: `D${index + 1}-${itemIndex + 1}`,
sellerSuppliesQuantity: itemSuppliesQuantity, // Суммированное количество расходников (реальные данные)
pvzReturnsPlace: `E${index + 1}-${itemIndex + 1}`,
pvzReturnsQuantity: 0, // Нет реальных данных о возвратах с ПВЗ
// Создаем варианты товара
variants:
Math.random() > 0.5
? [
{
id: `grouped-${productName}-${itemIndex}-1`,
name: `Размер S`,
productPlace: `A${index + 1}-${itemIndex + 1}-1`,
productQuantity: Math.floor(itemProducts * 0.4), // Часть от общего количества
goodsPlace: `B${index + 1}-${itemIndex + 1}-1`,
goodsQuantity: 0, // Нет реальных данных о готовых товарах
defectsPlace: `C${index + 1}-${itemIndex + 1}-1`,
defectsQuantity: 0, // Нет реальных данных о браке
sellerSuppliesPlace: `D${index + 1}-${itemIndex + 1}-1`,
sellerSuppliesQuantity: Math.floor(
itemSuppliesQuantity * 0.4
), // Часть от расходников
pvzReturnsPlace: `E${index + 1}-${itemIndex + 1}-1`,
pvzReturnsQuantity: 0, // Нет реальных данных о возвратах
},
{
id: `grouped-${productName}-${itemIndex}-2`,
name: `Размер M`,
productPlace: `A${index + 1}-${itemIndex + 1}-2`,
productQuantity: Math.floor(itemProducts * 0.4), // Часть от общего количества
goodsPlace: `B${index + 1}-${itemIndex + 1}-2`,
goodsQuantity: 0, // Нет реальных данных о готовых товарах
defectsPlace: `C${index + 1}-${itemIndex + 1}-2`,
defectsQuantity: 0, // Нет реальных данных о браке
sellerSuppliesPlace: `D${index + 1}-${itemIndex + 1}-2`,
sellerSuppliesQuantity: Math.floor(
itemSuppliesQuantity * 0.4
), // Часть от расходников
pvzReturnsPlace: `E${index + 1}-${itemIndex + 1}-2`,
pvzReturnsQuantity: 0, // Нет реальных данных о возвратах
},
{
id: `grouped-${productName}-${itemIndex}-3`,
name: `Размер L`,
productPlace: `A${index + 1}-${itemIndex + 1}-3`,
productQuantity: Math.floor(itemProducts * 0.2), // Оставшаяся часть
goodsPlace: `B${index + 1}-${itemIndex + 1}-3`,
goodsQuantity: 0, // Нет реальных данных о готовых товарах
defectsPlace: `C${index + 1}-${itemIndex + 1}-3`,
defectsQuantity: 0, // Нет реальных данных о браке
sellerSuppliesPlace: `D${index + 1}-${itemIndex + 1}-3`,
sellerSuppliesQuantity: Math.floor(
itemSuppliesQuantity * 0.2
), // Оставшаяся часть расходников
pvzReturnsPlace: `E${index + 1}-${itemIndex + 1}-3`,
pvzReturnsQuantity: 0, // Нет реальных данных о возвратах
},
]
: [],
};
}
);
// Подсчитываем реальные суммы на основе товаров партнера
const totalProducts = items.reduce(
(sum, item) => sum + item.productQuantity,
0
);
const totalGoods = items.reduce(
(sum, item) => sum + item.goodsQuantity,
0
);
const totalDefects = items.reduce(
(sum, item) => sum + item.defectsQuantity,
0
);
// Используем реальные данные из товаров для расходников селлера
const totalSellerSupplies = items.reduce(
(sum, item) => sum + item.sellerSuppliesQuantity,
0
);
const totalPvzReturns = items.reduce(
(sum, item) => sum + item.pvzReturnsQuantity,
0
);
// Логирование общих сумм виртуального партнера
const partnerName = sellerPartners[index]
? sellerPartners[index].name ||
sellerPartners[index].fullName ||
`Селлер ${index + 1}`
: `Склад ${index + 1}`;
console.log(`🏪 Партнер "${partnerName}":`, {
totalProducts,
totalGoods,
totalDefects,
totalSellerSupplies,
totalPvzReturns,
itemsCount: items.length,
itemsWithSupplies: items.filter(
(item) => item.sellerSuppliesQuantity > 0
).length,
productNames: items.map((item) => item.name),
hasRealPartner: !!sellerPartners[index],
});
// Рассчитываем изменения расходников для этого партнера
// Распределяем общие поступления пропорционально количеству расходников партнера
const totalVirtualPartners = Math.max(
1,
Math.min(
sellerPartners.length,
Math.ceil(uniqueProductNames.length / 8)
)
);
// Реальные изменения товаров для этого партнера
const partnerProductsChange =
totalProducts > 0
? Math.floor(
(totalProducts /
(allProducts.reduce(
(sum, p: any) => sum + (p.orderedQuantity || 0),
0
) || 1)) *
(productsReceivedToday - productsUsedToday)
)
: Math.floor(
(productsReceivedToday - productsUsedToday) / totalVirtualPartners
);
// Реальные изменения расходников селлера для этого партнера
const partnerSuppliesChange =
totalSellerSupplies > 0
? Math.floor(
(totalSellerSupplies /
(mySupplies.reduce(
(sum: number, supply: any) =>
sum + (supply.currentStock || 0),
0
) || 1)) *
suppliesReceivedToday
)
: Math.floor(suppliesReceivedToday / totalVirtualPartners);
return {
id: (index + 1).toString(),
name: partner.name || partner.fullName || `Селлер ${index + 1}`,
avatar: partner.users?.[0]?.avatar || `https://images.unsplash.com/photo-15312974840${index + 1}?w=100&h=100&fit=crop&crop=face`,
products: baseProducts,
goods: baseGoods,
defects: baseDefects,
sellerSupplies: baseSellerSupplies,
pvzReturns: basePvzReturns,
productsChange: Math.floor(Math.random() * 50) + 10,
goodsChange: Math.floor(Math.random() * 30) + 15,
defectsChange: Math.floor(Math.random() * 10) - 5,
sellerSuppliesChange: Math.floor(Math.random() * 20) + 5,
pvzReturnsChange: Math.floor(Math.random() * 15) + 3,
id: `virtual-partner-${index + 1}`,
name: sellerPartners[index]
? sellerPartners[index].name ||
sellerPartners[index].fullName ||
`Селлер ${index + 1}`
: `Склад ${index + 1}`, // Только если нет реального партнера
avatar:
sellerPartners[index]?.users?.[0]?.avatar ||
`https://images.unsplash.com/photo-15312974840${
index + 1
}?w=100&h=100&fit=crop&crop=face`,
products: totalProducts, // Реальная сумма товаров
goods: totalGoods, // Реальная сумма готовых к отправке
defects: totalDefects, // Реальная сумма брака
sellerSupplies: totalSellerSupplies, // Реальная сумма расходников селлера
pvzReturns: totalPvzReturns, // Реальная сумма возвратов
productsChange: partnerProductsChange, // Реальные изменения товаров
goodsChange: 0, // Нет реальных данных о готовых товарах
defectsChange: 0, // Нет реальных данных о браке
sellerSuppliesChange: partnerSuppliesChange, // Реальные изменения расходников
pvzReturnsChange: 0, // Нет реальных данных о возвратах
items,
};
});
}, [sellerPartners]);
}, [sellerPartners, allProducts, mySupplies, suppliesReceivedToday]);
// Функции для аватаров магазинов
const getInitials = (name: string): string => {
@ -675,7 +1081,12 @@ export function FulfillmentWarehouseDashboard() {
);
// Индикатор загрузки
if (counterpartiesLoading || ordersLoading) {
if (
counterpartiesLoading ||
ordersLoading ||
productsLoading ||
suppliesLoading
) {
return (
<div className="h-screen flex overflow-hidden">
<Sidebar />
@ -692,7 +1103,7 @@ export function FulfillmentWarehouseDashboard() {
}
// Индикатор ошибки
if (counterpartiesError || ordersError) {
if (counterpartiesError || ordersError || productsError) {
return (
<div className="h-screen flex overflow-hidden">
<Sidebar />
@ -705,7 +1116,9 @@ export function FulfillmentWarehouseDashboard() {
Ошибка загрузки данных склада
</p>
<p className="text-white/60 text-sm mt-2">
{counterpartiesError?.message || ordersError?.message}
{counterpartiesError?.message ||
ordersError?.message ||
productsError?.message}
</p>
</div>
</main>
@ -749,9 +1162,16 @@ export function FulfillmentWarehouseDashboard() {
onClick={() => {
refetchCounterparties();
refetchOrders();
refetchProducts();
refetchSupplies(); // Добавляем обновление расходников
toast.success("Данные склада обновлены");
}}
disabled={counterpartiesLoading || ordersLoading}
disabled={
counterpartiesLoading ||
ordersLoading ||
productsLoading ||
suppliesLoading
}
>
<RotateCcw className="h-3 w-3 mr-1" />
Обновить
@ -792,7 +1212,7 @@ export function FulfillmentWarehouseDashboard() {
icon={Wrench}
current={warehouseStats.fulfillmentSupplies.current}
change={warehouseStats.fulfillmentSupplies.change}
description="Упаковка, этикетки"
description="Расходники, этикетки"
/>
<StatCard
title="Расходники селлеров"
@ -819,7 +1239,7 @@ export function FulfillmentWarehouseDashboard() {
<div className="flex items-center justify-between">
<h2 className="text-base font-semibold text-white flex items-center space-x-2">
<Store className="h-4 w-4 text-blue-400" />
<span>Детализация по партнерам-селлерам</span>
<span>Детализация по Магазинам</span>
<div className="flex items-center space-x-1 text-xs text-white/60">
<div className="flex items-center space-x-1">
<div className="flex space-x-0.5">
@ -827,7 +1247,7 @@ export function FulfillmentWarehouseDashboard() {
<div className="w-2 h-2 bg-pink-400 rounded"></div>
<div className="w-2 h-2 bg-emerald-400 rounded"></div>
</div>
<span>Селлеры</span>
<span>Магазины</span>
</div>
<ChevronRight className="h-3 w-3" />
<div className="flex items-center space-x-1">
@ -842,7 +1262,7 @@ export function FulfillmentWarehouseDashboard() {
<Search className="absolute left-2.5 top-1/2 transform -translate-y-1/2 h-3.5 w-3.5 text-white/40" />
<div className="flex space-x-2">
<Input
placeholder="Поиск по селлерам..."
placeholder="Поиск по магазинам..."
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
className="pl-8 h-8 text-sm glass-input text-white placeholder:text-white/40 flex-1"
@ -860,7 +1280,7 @@ export function FulfillmentWarehouseDashboard() {
variant="secondary"
className="bg-blue-500/20 text-blue-300 text-xs"
>
{filteredAndSortedStores.length} селлеров
{filteredAndSortedStores.length} магазинов
</Badge>
</div>
</div>
@ -869,7 +1289,7 @@ export function FulfillmentWarehouseDashboard() {
<div className="flex-shrink-0 bg-blue-500/20 border-b border-blue-500/40">
<div className="grid grid-cols-6 gap-0">
<TableHeader field="name" sortable>
/ Селлер
/ Магазин
</TableHeader>
<TableHeader field="products" sortable>
Продукты
@ -925,12 +1345,12 @@ export function FulfillmentWarehouseDashboard() {
<div className="flex items-center justify-end space-x-1">
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-green-400">
+{Math.abs(Math.floor(totals.productsChange * 0.6))}
+0 {/* ТЕСТ: Временно захардкожено для проверки */}
</span>
</div>
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-red-400">
-{Math.abs(Math.floor(totals.productsChange * 0.4))}
-0 {/* ТЕСТ: Временно захардкожено для проверки */}
</span>
</div>
<div className="flex items-center space-x-0.5">
@ -970,12 +1390,12 @@ export function FulfillmentWarehouseDashboard() {
<div className="flex items-center justify-end space-x-1">
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-green-400">
+{Math.abs(Math.floor(totals.goodsChange * 0.6))}
+0 {/* Нет реальных данных о готовых товарах */}
</span>
</div>
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-red-400">
-{Math.abs(Math.floor(totals.goodsChange * 0.4))}
-0 {/* Нет реальных данных о готовых товарах */}
</span>
</div>
<div className="flex items-center space-x-0.5">
@ -1016,12 +1436,12 @@ export function FulfillmentWarehouseDashboard() {
<div className="flex items-center justify-end space-x-1">
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-green-400">
+{Math.abs(Math.floor(totals.defectsChange * 0.6))}
+0 {/* Нет реальных данных о браке */}
</span>
</div>
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-red-400">
-{Math.abs(Math.floor(totals.defectsChange * 0.4))}
-0 {/* Нет реальных данных о браке */}
</span>
</div>
<div className="flex items-center space-x-0.5">
@ -1063,18 +1483,12 @@ export function FulfillmentWarehouseDashboard() {
<div className="flex items-center justify-end space-x-1">
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-green-400">
+
{Math.abs(
Math.floor(totals.sellerSuppliesChange * 0.6)
)}
+0 {/* ТЕСТ: Временно захардкожено для проверки */}
</span>
</div>
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-red-400">
-
{Math.abs(
Math.floor(totals.sellerSuppliesChange * 0.4)
)}
-0 {/* ТЕСТ: Временно захардкожено для проверки */}
</span>
</div>
<div className="flex items-center space-x-0.5">
@ -1115,12 +1529,12 @@ export function FulfillmentWarehouseDashboard() {
<div className="flex items-center justify-end space-x-1">
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-green-400">
+{Math.abs(Math.floor(totals.pvzReturnsChange * 0.6))}
+0 {/* Нет реальных данных о возвратах с ПВЗ */}
</span>
</div>
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-red-400">
-{Math.abs(Math.floor(totals.pvzReturnsChange * 0.4))}
-0 {/* Нет реальных данных о возвратах с ПВЗ */}
</span>
</div>
<div className="flex items-center space-x-0.5">
@ -1142,15 +1556,19 @@ export function FulfillmentWarehouseDashboard() {
<Package className="h-12 w-12 text-white/40 mx-auto mb-4" />
<p className="text-white/60 font-medium">
{sellerPartners.length === 0
? "Нет партнеров-селлеров"
: "Партнеры не найдены"}
? "Нет магазинов"
: allProducts.length === 0
? "Нет товаров на складе"
: "Магазины не найдены"}
</p>
<p className="text-white/40 text-sm mt-2">
{sellerPartners.length === 0
? "Добавьте партнеров-селлеров для отображения данных склада"
? "Добавьте магазины для отображения данных склада"
: allProducts.length === 0
? "Добавьте товары на склад для отображения данных"
: searchTerm
? "Попробуйте изменить поисковый запрос"
: "Данные о партнерах-селлерах будут отображены здесь"}
: "Данные о магазинах будут отображены здесь"}
</p>
</div>
</div>
@ -1211,18 +1629,14 @@ export function FulfillmentWarehouseDashboard() {
<div className="flex items-center space-x-1">
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-green-400">
+
{Math.abs(
Math.floor(store.productsChange * 0.6)
)}
+{Math.max(0, store.productsChange)}{" "}
{/* Поступило товаров */}
</span>
</div>
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-red-400">
-
{Math.abs(
Math.floor(store.productsChange * 0.4)
)}
-{Math.max(0, -store.productsChange)}{" "}
{/* Использовано товаров */}
</span>
</div>
<div className="flex items-center space-x-0.5">
@ -1246,18 +1660,14 @@ export function FulfillmentWarehouseDashboard() {
<div className="flex items-center space-x-1">
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-green-400">
+
{Math.abs(
Math.floor(store.goodsChange * 0.6)
)}
+0{" "}
{/* Нет реальных данных о готовых товарах */}
</span>
</div>
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-red-400">
-
{Math.abs(
Math.floor(store.goodsChange * 0.4)
)}
-0{" "}
{/* Нет реальных данных о готовых товарах */}
</span>
</div>
<div className="flex items-center space-x-0.5">
@ -1281,18 +1691,12 @@ export function FulfillmentWarehouseDashboard() {
<div className="flex items-center space-x-1">
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-green-400">
+
{Math.abs(
Math.floor(store.defectsChange * 0.6)
)}
+0 {/* Нет реальных данных о браке */}
</span>
</div>
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-red-400">
-
{Math.abs(
Math.floor(store.defectsChange * 0.4)
)}
-0 {/* Нет реальных данных о браке */}
</span>
</div>
<div className="flex items-center space-x-0.5">
@ -1316,22 +1720,14 @@ export function FulfillmentWarehouseDashboard() {
<div className="flex items-center space-x-1">
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-green-400">
+
{Math.abs(
Math.floor(
store.sellerSuppliesChange * 0.6
)
)}
+{Math.max(0, store.sellerSuppliesChange)}{" "}
{/* Поступило расходников */}
</span>
</div>
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-red-400">
-
{Math.abs(
Math.floor(
store.sellerSuppliesChange * 0.4
)
)}
-{Math.max(0, -store.sellerSuppliesChange)}{" "}
{/* Использовано расходников */}
</span>
</div>
<div className="flex items-center space-x-0.5">
@ -1355,18 +1751,14 @@ export function FulfillmentWarehouseDashboard() {
<div className="flex items-center space-x-1">
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-green-400">
+
{Math.abs(
Math.floor(store.pvzReturnsChange * 0.6)
)}
+0{" "}
{/* Нет реальных данных о возвратах с ПВЗ */}
</span>
</div>
<div className="flex items-center space-x-0.5">
<span className="text-[9px] font-bold text-red-400">
-
{Math.abs(
Math.floor(store.pvzReturnsChange * 0.4)
)}
-0{" "}
{/* Нет реальных данных о возвратах с ПВЗ */}
</span>
</div>
<div className="flex items-center space-x-0.5">

View File

@ -7,7 +7,11 @@ import { Input } from "@/components/ui/input";
import { Badge } from "@/components/ui/badge";
import { Label } from "@/components/ui/label";
import { PhoneInput } from "@/components/ui/phone-input";
import { formatPhoneInput, isValidPhone, formatNameInput } from "@/lib/input-masks";
import {
formatPhoneInput,
isValidPhone,
formatNameInput,
} from "@/lib/input-masks";
import {
Select,
SelectContent,
@ -51,7 +55,10 @@ import {
GET_COUNTERPARTY_SUPPLIES,
GET_SUPPLY_SUPPLIERS,
} from "@/graphql/queries";
import { CREATE_WILDBERRIES_SUPPLY, CREATE_SUPPLY_SUPPLIER } from "@/graphql/mutations";
import {
CREATE_WILDBERRIES_SUPPLY,
CREATE_SUPPLY_SUPPLIER,
} from "@/graphql/mutations";
import { toast } from "sonner";
import { format } from "date-fns";
import { ru } from "date-fns/locale";
@ -187,7 +194,8 @@ export function DirectSupplyCreation({
// Загружаем контрагентов-фулфилментов
const { data: counterpartiesData } = useQuery(GET_MY_COUNTERPARTIES);
const { data: suppliersData, refetch: refetchSuppliers } = useQuery(GET_SUPPLY_SUPPLIERS);
const { data: suppliersData, refetch: refetchSuppliers } =
useQuery(GET_SUPPLY_SUPPLIERS);
// Мутации
const [createSupply, { loading: creatingSupply }] = useMutation(
@ -207,17 +215,17 @@ export function DirectSupplyCreation({
},
}
);
const [createSupplierMutation, { loading: creatingSupplier }] = useMutation(
CREATE_SUPPLY_SUPPLIER,
{
onCompleted: (data) => {
if (data.createSupplySupplier.success) {
toast.success("Поставщик добавлен успешно!");
// Обновляем список поставщиков из БД
refetchSuppliers();
// Очищаем форму
setNewSupplier({
name: "",
@ -236,7 +244,10 @@ export function DirectSupplyCreation({
});
setShowSupplierModal(false);
} else {
toast.error(data.createSupplySupplier.message || "Ошибка при добавлении поставщика");
toast.error(
data.createSupplySupplier.message ||
"Ошибка при добавлении поставщика"
);
}
},
onError: (error) => {
@ -260,11 +271,11 @@ export function DirectSupplyCreation({
supplierVendorCode: "SUPPLIER-001",
mediaFiles: ["/api/placeholder/400/400"],
dimensions: {
length: 30, // 30 см
width: 25, // 25 см
height: 5, // 5 см
weightBrutto: 0.3, // 300г
isValid: true
length: 30, // 30 см
width: 25, // 25 см
height: 5, // 5 см
weightBrutto: 0.3, // 300г
isValid: true,
},
sizes: [
{
@ -289,11 +300,11 @@ export function DirectSupplyCreation({
supplierVendorCode: "SUPPLIER-002",
mediaFiles: ["/api/placeholder/400/403"],
dimensions: {
length: 35, // 35 см
width: 28, // 28 см
height: 6, // 6 см
weightBrutto: 0.4, // 400г
isValid: true
length: 35, // 35 см
width: 28, // 28 см
height: 6, // 6 см
weightBrutto: 0.4, // 400г
isValid: true,
},
sizes: [
{
@ -404,7 +415,10 @@ export function DirectSupplyCreation({
// Загружаем услуги и расходники при выборе фулфилмента
useEffect(() => {
if (selectedFulfillmentId) {
console.log('Загружаем услуги и расходники для фулфилмента:', selectedFulfillmentId);
console.log(
"Загружаем услуги и расходники для фулфилмента:",
selectedFulfillmentId
);
loadOrganizationServices(selectedFulfillmentId);
loadOrganizationSupplies(selectedFulfillmentId);
}
@ -439,7 +453,12 @@ export function DirectSupplyCreation({
const consumablesCost = getConsumablesCost();
onConsumablesCostChange(consumablesCost);
}
}, [selectedConsumables, selectedFulfillmentId, supplyItems.length, onConsumablesCostChange]);
}, [
selectedConsumables,
selectedFulfillmentId,
supplyItems.length,
onConsumablesCostChange,
]);
const loadCards = async () => {
setLoading(true);
@ -462,20 +481,34 @@ export function DirectSupplyCreation({
if (apiToken) {
console.log("Загружаем карточки из WB API...");
const cards = await WildberriesService.getAllCards(apiToken, 500);
// Логируем информацию о размерах товаров
cards.forEach(card => {
cards.forEach((card) => {
if (card.dimensions) {
const volume = (card.dimensions.length / 100) * (card.dimensions.width / 100) * (card.dimensions.height / 100);
console.log(`WB API: Карточка ${card.nmID} - размеры: ${card.dimensions.length}x${card.dimensions.width}x${card.dimensions.height} см, объем: ${volume.toFixed(6)} м³`);
const volume =
(card.dimensions.length / 100) *
(card.dimensions.width / 100) *
(card.dimensions.height / 100);
console.log(
`WB API: Карточка ${card.nmID} - размеры: ${
card.dimensions.length
}x${card.dimensions.width}x${
card.dimensions.height
} см, объем: ${volume.toFixed(6)} м³`
);
} else {
console.log(`WB API: Карточка ${card.nmID} - размеры отсутствуют`);
console.log(
`WB API: Карточка ${card.nmID} - размеры отсутствуют`
);
}
});
setWbCards(cards);
console.log("Загружено карточек из WB API:", cards.length);
console.log("Карточки с размерами:", cards.filter(card => card.dimensions).length);
console.log(
"Карточки с размерами:",
cards.filter((card) => card.dimensions).length
);
return;
}
}
@ -522,20 +555,34 @@ export function DirectSupplyCreation({
searchTerm,
100
);
// Логируем информацию о размерах найденных товаров
cards.forEach(card => {
cards.forEach((card) => {
if (card.dimensions) {
const volume = (card.dimensions.length / 100) * (card.dimensions.width / 100) * (card.dimensions.height / 100);
console.log(`WB API: Найденная карточка ${card.nmID} - размеры: ${card.dimensions.length}x${card.dimensions.width}x${card.dimensions.height} см, объем: ${volume.toFixed(6)} м³`);
const volume =
(card.dimensions.length / 100) *
(card.dimensions.width / 100) *
(card.dimensions.height / 100);
console.log(
`WB API: Найденная карточка ${card.nmID} - размеры: ${
card.dimensions.length
}x${card.dimensions.width}x${
card.dimensions.height
} см, объем: ${volume.toFixed(6)} м³`
);
} else {
console.log(`WB API: Найденная карточка ${card.nmID} - размеры отсутствуют`);
console.log(
`WB API: Найденная карточка ${card.nmID} - размеры отсутствуют`
);
}
});
setWbCards(cards);
console.log("Найдено карточек в WB API:", cards.length);
console.log("Найденные карточки с размерами:", cards.filter(card => card.dimensions).length);
console.log(
"Найденные карточки с размерами:",
cards.filter((card) => card.dimensions).length
);
return;
}
}
@ -650,12 +697,17 @@ export function DirectSupplyCreation({
const newItems = prev.map((item) => {
if (item.card.nmID === nmID) {
const updatedItem = { ...item, [field]: value };
// Пересчитываем totalPrice в зависимости от типа цены
if (field === "quantity" || field === "pricePerUnit" || field === "priceType") {
if (
field === "quantity" ||
field === "pricePerUnit" ||
field === "priceType"
) {
if (updatedItem.priceType === "perUnit") {
// Цена за штуку - умножаем на количество
updatedItem.totalPrice = updatedItem.quantity * updatedItem.pricePerUnit;
updatedItem.totalPrice =
updatedItem.quantity * updatedItem.pricePerUnit;
} else {
// Цена за общее количество - pricePerUnit становится общей ценой
updatedItem.totalPrice = updatedItem.pricePerUnit;
@ -669,13 +721,16 @@ export function DirectSupplyCreation({
// Если изменился поставщик, уведомляем родительский компонент асинхронно
if (field === "supplierId" && onSuppliersChange) {
// Создаем список поставщиков с информацией о выборе
const suppliersInfo = suppliers.map(supplier => ({
const suppliersInfo = suppliers.map((supplier) => ({
...supplier,
selected: newItems.some(item => item.supplierId === supplier.id)
selected: newItems.some((item) => item.supplierId === supplier.id),
}));
console.log("Обновление поставщиков из updateSupplyItem:", suppliersInfo);
console.log(
"Обновление поставщиков из updateSupplyItem:",
suppliersInfo
);
// Вызываем асинхронно чтобы не обновлять состояние во время рендера
setTimeout(() => {
onSuppliersChange(suppliersInfo);
@ -708,16 +763,22 @@ export function DirectSupplyCreation({
}
break;
}
setSupplierErrors(prev => ({...prev, [field]: error}));
setSupplierErrors((prev) => ({ ...prev, [field]: error }));
return error === "";
};
const validateAllSupplierFields = () => {
const nameValid = validateSupplierField("name", newSupplier.name);
const contactNameValid = validateSupplierField("contactName", newSupplier.contactName);
const contactNameValid = validateSupplierField(
"contactName",
newSupplier.contactName
);
const phoneValid = validateSupplierField("phone", newSupplier.phone);
const telegramValid = validateSupplierField("telegram", newSupplier.telegram);
const telegramValid = validateSupplierField(
"telegram",
newSupplier.telegram
);
return nameValid && contactNameValid && phoneValid && telegramValid;
};
@ -760,17 +821,24 @@ export function DirectSupplyCreation({
// Функция для расчета объема одного товара в м³
const calculateItemVolume = (card: WildberriesCard): number => {
if (!card.dimensions) return 0;
const { length, width, height } = card.dimensions;
// Проверяем что все размеры указаны и больше 0
if (!length || !width || !height || length <= 0 || width <= 0 || height <= 0) {
if (
!length ||
!width ||
!height ||
length <= 0 ||
width <= 0 ||
height <= 0
) {
return 0;
}
// Переводим из сантиметров в метры и рассчитываем объем
const volumeInM3 = (length / 100) * (width / 100) * (height / 100);
return volumeInM3;
};
@ -778,7 +846,7 @@ export function DirectSupplyCreation({
const getTotalVolume = () => {
return supplyItems.reduce((totalVolume, item) => {
const itemVolume = calculateItemVolume(item.card);
return totalVolume + (itemVolume * item.quantity);
return totalVolume + itemVolume * item.quantity;
}, 0);
};
@ -883,19 +951,29 @@ export function DirectSupplyCreation({
// Загрузка поставщиков из правильного источника
React.useEffect(() => {
if (suppliersData?.supplySuppliers) {
console.log("Загружаем поставщиков из БД:", suppliersData.supplySuppliers);
console.log(
"Загружаем поставщиков из БД:",
suppliersData.supplySuppliers
);
setSuppliers(suppliersData.supplySuppliers);
// Проверяем есть ли уже выбранные поставщики и уведомляем родителя
if (onSuppliersChange && supplyItems.length > 0) {
const suppliersInfo = suppliersData.supplySuppliers.map((supplier: { id: string; selected?: boolean }) => ({
...supplier,
selected: supplyItems.some(item => item.supplierId === supplier.id)
}));
const suppliersInfo = suppliersData.supplySuppliers.map(
(supplier: { id: string; selected?: boolean }) => ({
...supplier,
selected: supplyItems.some(
(item) => item.supplierId === supplier.id
),
})
);
if (suppliersInfo.some((s: { selected?: boolean }) => s.selected)) {
console.log("Найдены выбранные поставщики при загрузке:", suppliersInfo);
console.log(
"Найдены выбранные поставщики при загрузке:",
suppliersInfo
);
// Вызываем асинхронно чтобы не обновлять состояние во время рендера
setTimeout(() => {
onSuppliersChange(suppliersInfo);
@ -929,8 +1007,6 @@ export function DirectSupplyCreation({
<>
<style>{lineClampStyles}</style>
<div className="flex flex-col h-full space-y-2 w-full min-h-0">
{/* Элегантный блок поиска и товаров */}
<div className="relative">
{/* Главная карточка с градиентом */}
@ -1228,9 +1304,17 @@ export function DirectSupplyCreation({
<div className="text-white/60 text-[10px] flex space-x-2">
<span>WB: {item.card.nmID}</span>
{calculateItemVolume(item.card) > 0 ? (
<span className="text-blue-400">| {(calculateItemVolume(item.card) * item.quantity).toFixed(4)} м³</span>
<span className="text-blue-400">
|{" "}
{(
calculateItemVolume(item.card) * item.quantity
).toFixed(4)}{" "}
м³
</span>
) : (
<span className="text-orange-400">| размеры не указаны</span>
<span className="text-orange-400">
| размеры не указаны
</span>
)}
</div>
</div>
@ -1294,56 +1378,78 @@ export function DirectSupplyCreation({
{/* Создаем массив валидных параметров */}
{(() => {
const params = [];
// Бренд
if (item.card.brand && item.card.brand.trim() && item.card.brand !== '0') {
if (
item.card.brand &&
item.card.brand.trim() &&
item.card.brand !== "0"
) {
params.push({
value: item.card.brand,
color: 'bg-blue-500/80',
key: 'brand'
color: "bg-blue-500/80",
key: "brand",
});
}
// Категория (объект)
if (item.card.object && item.card.object.trim() && item.card.object !== '0') {
if (
item.card.object &&
item.card.object.trim() &&
item.card.object !== "0"
) {
params.push({
value: item.card.object,
color: 'bg-green-500/80',
key: 'object'
color: "bg-green-500/80",
key: "object",
});
}
// Страна (только если не пустая и не 0)
if (item.card.countryProduction && item.card.countryProduction.trim() && item.card.countryProduction !== '0') {
if (
item.card.countryProduction &&
item.card.countryProduction.trim() &&
item.card.countryProduction !== "0"
) {
params.push({
value: item.card.countryProduction,
color: 'bg-purple-500/80',
key: 'country'
color: "bg-purple-500/80",
key: "country",
});
}
// Цена WB
if (item.card.sizes?.[0]?.price && item.card.sizes[0].price > 0) {
if (
item.card.sizes?.[0]?.price &&
item.card.sizes[0].price > 0
) {
params.push({
value: formatCurrency(item.card.sizes[0].price),
color: 'bg-yellow-500/80',
key: 'price'
color: "bg-yellow-500/80",
key: "price",
});
}
// Внутренний артикул
if (item.card.vendorCode && item.card.vendorCode.trim() && item.card.vendorCode !== '0') {
if (
item.card.vendorCode &&
item.card.vendorCode.trim() &&
item.card.vendorCode !== "0"
) {
params.push({
value: item.card.vendorCode,
color: 'bg-gray-500/80',
key: 'vendor'
color: "bg-gray-500/80",
key: "vendor",
});
}
// НАМЕРЕННО НЕ ВКЛЮЧАЕМ techSize и wbSize так как они равны '0'
return params.map(param => (
<span key={param.key} className={`${param.color} text-white text-[9px] px-2 py-1 rounded font-medium`}>
return params.map((param) => (
<span
key={param.key}
className={`${param.color} text-white text-[9px] px-2 py-1 rounded font-medium`}
>
{param.value}
</span>
));
@ -1377,7 +1483,11 @@ export function DirectSupplyCreation({
<div className="flex mb-1">
<button
onClick={() =>
updateSupplyItem(item.card.nmID, "priceType", "perUnit")
updateSupplyItem(
item.card.nmID,
"priceType",
"perUnit"
)
}
className={`text-[9px] px-1 py-0.5 rounded-l ${
item.priceType === "perUnit"
@ -1389,7 +1499,11 @@ export function DirectSupplyCreation({
</button>
<button
onClick={() =>
updateSupplyItem(item.card.nmID, "priceType", "total")
updateSupplyItem(
item.card.nmID,
"priceType",
"total"
)
}
className={`text-[9px] px-1 py-0.5 rounded-r ${
item.priceType === "total"
@ -1400,7 +1514,7 @@ export function DirectSupplyCreation({
За все
</button>
</div>
<Input
type="number"
value={item.pricePerUnit || ""}
@ -1415,7 +1529,8 @@ export function DirectSupplyCreation({
placeholder="₽"
/>
<div className="text-white/80 text-xs font-medium text-center mt-1">
Итого: {formatCurrency(item.totalPrice).replace(" ₽", "₽")}
Итого:{" "}
{formatCurrency(item.totalPrice).replace(" ₽", "₽")}
</div>
</div>
@ -1423,11 +1538,15 @@ export function DirectSupplyCreation({
<div className="bg-white/10 rounded-lg p-2 flex flex-col justify-center h-20">
<div className="space-y-1 max-h-16 overflow-y-auto">
{/* DEBUG */}
{console.log('DEBUG SERVICES:', {
{console.log("DEBUG SERVICES:", {
selectedFulfillmentId,
hasServices: !!organizationServices[selectedFulfillmentId],
servicesCount: organizationServices[selectedFulfillmentId]?.length || 0,
allOrganizationServices: Object.keys(organizationServices)
hasServices:
!!organizationServices[selectedFulfillmentId],
servicesCount:
organizationServices[selectedFulfillmentId]
?.length || 0,
allOrganizationServices:
Object.keys(organizationServices),
})}
{selectedFulfillmentId &&
organizationServices[selectedFulfillmentId] ? (
@ -1463,13 +1582,17 @@ export function DirectSupplyCreation({
</span>
</div>
<span className="text-green-400 text-[10px] font-medium">
{service.price ? `${service.price}` : 'Бесплатно'}
{service.price
? `${service.price}`
: "Бесплатно"}
</span>
</label>
))
) : (
<span className="text-white/60 text-xs text-center">
{selectedFulfillmentId ? 'Нет услуг' : 'Выберите фулфилмент'}
{selectedFulfillmentId
? "Нет услуг"
: "Выберите фулфилмент"}
</span>
)}
</div>
@ -1481,7 +1604,11 @@ export function DirectSupplyCreation({
<Select
value={item.supplierId}
onValueChange={(value) =>
updateSupplyItem(item.card.nmID, "supplierId", value)
updateSupplyItem(
item.card.nmID,
"supplierId",
value
)
}
>
<SelectTrigger className="bg-white/20 border-white/20 text-white h-6 text-xs">
@ -1497,13 +1624,20 @@ export function DirectSupplyCreation({
</Select>
{/* Компактная информация о выбранном поставщике */}
{item.supplierId && suppliers.find((s) => s.id === item.supplierId) ? (
{item.supplierId &&
suppliers.find((s) => s.id === item.supplierId) ? (
<div className="text-center">
<div className="text-white/80 text-[10px] font-medium truncate">
{suppliers.find((s) => s.id === item.supplierId)?.contactName}
{
suppliers.find((s) => s.id === item.supplierId)
?.contactName
}
</div>
<div className="text-white/60 text-[9px] truncate">
{suppliers.find((s) => s.id === item.supplierId)?.phone}
{
suppliers.find((s) => s.id === item.supplierId)
?.phone
}
</div>
</div>
) : (
@ -1524,11 +1658,15 @@ export function DirectSupplyCreation({
<div className="bg-white/10 rounded-lg p-2 flex flex-col justify-center h-20">
<div className="space-y-1 max-h-16 overflow-y-auto">
{/* DEBUG для расходников */}
{console.log('DEBUG CONSUMABLES:', {
{console.log("DEBUG CONSUMABLES:", {
selectedFulfillmentId,
hasConsumables: !!organizationSupplies[selectedFulfillmentId],
consumablesCount: organizationSupplies[selectedFulfillmentId]?.length || 0,
allOrganizationSupplies: Object.keys(organizationSupplies)
hasConsumables:
!!organizationSupplies[selectedFulfillmentId],
consumablesCount:
organizationSupplies[selectedFulfillmentId]
?.length || 0,
allOrganizationSupplies:
Object.keys(organizationSupplies),
})}
{selectedFulfillmentId &&
organizationSupplies[selectedFulfillmentId] ? (
@ -1564,13 +1702,17 @@ export function DirectSupplyCreation({
</span>
</div>
<span className="text-orange-400 text-[10px] font-medium">
{supply.price ? `${supply.price}` : 'Бесплатно'}
{supply.price
? `${supply.price}`
: "Бесплатно"}
</span>
</label>
))
) : (
<span className="text-white/60 text-xs text-center">
{selectedFulfillmentId ? 'Нет расходников' : 'Выберите фулфилмент'}
{selectedFulfillmentId
? "Нет расходников"
: "Выберите фулфилмент"}
</span>
)}
</div>
@ -1581,7 +1723,7 @@ export function DirectSupplyCreation({
<div className="space-y-2">
<label className="flex items-center space-x-2 cursor-pointer">
<input type="checkbox" className="w-3 h-3" />
<span className="text-white text-xs">Упаковка</span>
<span className="text-white text-xs">Расходники</span>
</label>
<label className="flex items-center space-x-2 cursor-pointer">
<input type="checkbox" className="w-3 h-3" />
@ -1626,12 +1768,16 @@ export function DirectSupplyCreation({
validateSupplierField("name", value);
}}
className={`bg-white/10 border-white/20 text-white h-8 text-xs ${
supplierErrors.name ? 'border-red-400 focus:border-red-400' : ''
supplierErrors.name
? "border-red-400 focus:border-red-400"
: ""
}`}
placeholder="Название"
/>
{supplierErrors.name && (
<p className="text-red-400 text-xs mt-1">{supplierErrors.name}</p>
<p className="text-red-400 text-xs mt-1">
{supplierErrors.name}
</p>
)}
</div>
<div>
@ -1647,12 +1793,16 @@ export function DirectSupplyCreation({
validateSupplierField("contactName", value);
}}
className={`bg-white/10 border-white/20 text-white h-8 text-xs ${
supplierErrors.contactName ? 'border-red-400 focus:border-red-400' : ''
supplierErrors.contactName
? "border-red-400 focus:border-red-400"
: ""
}`}
placeholder="Имя"
/>
{supplierErrors.contactName && (
<p className="text-red-400 text-xs mt-1">{supplierErrors.contactName}</p>
<p className="text-red-400 text-xs mt-1">
{supplierErrors.contactName}
</p>
)}
</div>
</div>
@ -1670,12 +1820,16 @@ export function DirectSupplyCreation({
validateSupplierField("phone", value);
}}
className={`bg-white/10 border-white/20 text-white h-8 text-xs ${
supplierErrors.phone ? 'border-red-400 focus:border-red-400' : ''
supplierErrors.phone
? "border-red-400 focus:border-red-400"
: ""
}`}
placeholder="+7 (999) 123-45-67"
/>
{supplierErrors.phone && (
<p className="text-red-400 text-xs mt-1">{supplierErrors.phone}</p>
<p className="text-red-400 text-xs mt-1">
{supplierErrors.phone}
</p>
)}
</div>
<div>
@ -1744,12 +1898,16 @@ export function DirectSupplyCreation({
validateSupplierField("telegram", value);
}}
className={`bg-white/10 border-white/20 text-white h-8 text-xs ${
supplierErrors.telegram ? 'border-red-400 focus:border-red-400' : ''
supplierErrors.telegram
? "border-red-400 focus:border-red-400"
: ""
}`}
placeholder="@username"
/>
{supplierErrors.telegram && (
<p className="text-red-400 text-xs mt-1">{supplierErrors.telegram}</p>
<p className="text-red-400 text-xs mt-1">
{supplierErrors.telegram}
</p>
)}
</div>
@ -1763,7 +1921,15 @@ export function DirectSupplyCreation({
</Button>
<Button
onClick={handleCreateSupplier}
disabled={!newSupplier.name || !newSupplier.contactName || !newSupplier.phone || Object.values(supplierErrors).some(error => error !== "") || creatingSupplier}
disabled={
!newSupplier.name ||
!newSupplier.contactName ||
!newSupplier.phone ||
Object.values(supplierErrors).some(
(error) => error !== ""
) ||
creatingSupplier
}
className="flex-1 bg-gradient-to-r from-purple-500 to-pink-500 hover:from-purple-600 hover:to-pink-600 disabled:opacity-50 disabled:cursor-not-allowed h-8 text-xs"
>
{creatingSupplier ? (
@ -1772,7 +1938,7 @@ export function DirectSupplyCreation({
<span>Добавление...</span>
</div>
) : (
'Добавить'
"Добавить"
)}
</Button>
</div>

View File

@ -116,7 +116,7 @@ const mockFulfillmentConsumables: FulfillmentConsumableSupply[] = [
id: "ffcons1",
name: "Коробки для ФФ 40x30x15",
sku: "BOX-FF-403015",
category: "Упаковка ФФ",
category: "Расходники ФФ",
type: "packaging",
plannedQty: 2000,
actualQty: 1980,
@ -223,7 +223,7 @@ export function FulfillmentSuppliesTab() {
const getTypeBadge = (type: Consumable["type"]) => {
const typeMap = {
packaging: {
label: "Упаковка",
label: "Расходники",
color: "bg-blue-500/20 text-blue-300 border-blue-500/30",
},
labels: {
@ -360,7 +360,7 @@ export function FulfillmentSuppliesTab() {
return (
<React.Fragment key={supply.id}>
{/* Основная строка поставки расходников ФФ */}
<tr
<tr
className="border-b border-white/10 hover:bg-white/5 transition-colors bg-orange-500/10 cursor-pointer"
onClick={() => toggleSupplyExpansion(supply.id)}
>