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

Compare commits

base: Sfera:a9454912deb2edfccb0d4de8c9eb4706c473f479
Branches Tags
Sfera:main
..
compare: Sfera:441d2daefb917e31b07f3cf7ad6d41046110bd12
Branches Tags
Sfera:main

2 Commits
a9454912de ... 441d2daefb

Author SHA1 Message Date
Veronika Smirnova
441d2daefb Merge branch 'main' of https://gittea.biveki.ru/Sfera/sfera 2025-07-24 13:02:32 +03:00
Veronika Smirnova
3ab20c9514 Упрощен интерфейс компонентов FulfillmentDetailedGoodsTab, FulfillmentDetailedSuppliesTab и FulfillmentGoodsTab: удалены кнопки для разворачивания строк, добавлены обработчики кликов на строки для улучшения взаимодействия с пользователем. Оптимизированы стили и структура кода для повышения удобства использования. 2025-07-24 13:02:31 +03:00
3 changed files with 44 additions and 185 deletions
Expand all files Collapse all files

78
src/components/fulfillment-supplies/fulfillment-supplies/fulfillment-detailed-goods-tab.tsx
View File

@ -5,8 +5,6 @@ import { Card } from "@/components/ui/card";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { Badge } from "@/components/ui/badge"; import { Badge } from "@/components/ui/badge";
import { import {
ChevronDown,
ChevronRight,
Calendar, Calendar,
Package, Package,
MapPin, MapPin,
@ -439,21 +437,12 @@ export function FulfillmentDetailedGoodsTab() {
return ( return (
<React.Fragment key={supply.id}> <React.Fragment key={supply.id}>
{/* Уровень 1: Основная строка поставки ФФ */} {/* Уровень 1: Основная строка поставки ФФ */}
<tr className="border-b border-white/10 hover:bg-white/5 transition-colors bg-purple-500/10"> <tr
className="border-b border-white/10 hover:bg-white/5 transition-colors bg-purple-500/10 cursor-pointer"
onClick={() => toggleSupplyExpansion(supply.id)}
>
<td className="p-4"> <td className="p-4">
<div className="flex items-center space-x-2"> <div className="flex items-center space-x-2">
<Button
variant="ghost"
size="sm"
onClick={() => toggleSupplyExpansion(supply.id)}
className="h-6 w-6 p-0 text-white/60 hover:text-white hover:bg-white/10"
>
{isSupplyExpanded ? (
<ChevronDown className="h-4 w-4" />
) : (
<ChevronRight className="h-4 w-4" />
)}
</Button>
<span className="text-white font-bold text-lg"> <span className="text-white font-bold text-lg">
#{supply.number} #{supply.number}
</span> </span>
@ -525,23 +514,12 @@ export function FulfillmentDetailedGoodsTab() {
const isRouteExpanded = expandedRoutes.has(route.id); const isRouteExpanded = expandedRoutes.has(route.id);
return ( return (
<React.Fragment key={route.id}> <React.Fragment key={route.id}>
<tr className="border-b border-white/10 hover:bg-white/5 transition-colors bg-blue-500/10"> <tr
className="border-b border-white/10 hover:bg-white/5 transition-colors bg-blue-500/10 cursor-pointer"
onClick={() => toggleRouteExpansion(route.id)}
>
<td className="p-4 pl-12"> <td className="p-4 pl-12">
<div className="flex items-center space-x-2"> <div className="flex items-center space-x-2">
<Button
variant="ghost"
size="sm"
onClick={() =>
toggleRouteExpansion(route.id)
}
className="h-6 w-6 p-0 text-white/60 hover:text-white hover:bg-white/10"
>
{isRouteExpanded ? (
<ChevronDown className="h-4 w-4" />
) : (
<ChevronRight className="h-4 w-4" />
)}
</Button>
<MapPin className="h-4 w-4 text-blue-400" /> <MapPin className="h-4 w-4 text-blue-400" />
<span className="text-white font-medium"> <span className="text-white font-medium">
Маршрут ФФ Маршрут ФФ
@ -636,23 +614,12 @@ export function FulfillmentDetailedGoodsTab() {
); );
return ( return (
<React.Fragment key={seller.id}> <React.Fragment key={seller.id}>
<tr className="border-b border-white/10 hover:bg-white/5 transition-colors bg-green-500/10"> <tr
className="border-b border-white/10 hover:bg-white/5 transition-colors bg-green-500/10 cursor-pointer"
onClick={() => toggleSellerExpansion(seller.id)}
>
<td className="p-4 pl-20"> <td className="p-4 pl-20">
<div className="flex items-center space-x-2"> <div className="flex items-center space-x-2">
<Button
variant="ghost"
size="sm"
onClick={() =>
toggleSellerExpansion(seller.id)
}
className="h-6 w-6 p-0 text-white/60 hover:text-white hover:bg-white/10"
>
{isSellerExpanded ? (
<ChevronDown className="h-4 w-4" />
) : (
<ChevronRight className="h-4 w-4" />
)}
</Button>
<Building2 className="h-4 w-4 text-green-400" /> <Building2 className="h-4 w-4 text-green-400" />
<span className="text-white font-medium"> <span className="text-white font-medium">
Селлер ФФ Селлер ФФ
@ -726,25 +693,12 @@ export function FulfillmentDetailedGoodsTab() {
expandedProducts.has(product.id); expandedProducts.has(product.id);
return ( return (
<React.Fragment key={product.id}> <React.Fragment key={product.id}>
<tr className="border-b border-white/10 hover:bg-white/5 transition-colors bg-yellow-500/10"> <tr
className="border-b border-white/10 hover:bg-white/5 transition-colors bg-yellow-500/10 cursor-pointer"
onClick={() => toggleProductExpansion(product.id)}
>
<td className="p-4 pl-28"> <td className="p-4 pl-28">
<div className="flex items-center space-x-2"> <div className="flex items-center space-x-2">
<Button
variant="ghost"
size="sm"
onClick={() =>
toggleProductExpansion(
product.id
)
}
className="h-6 w-6 p-0 text-white/60 hover:text-white hover:bg-white/10"
>
{isProductExpanded ? (
<ChevronDown className="h-4 w-4" />
) : (
<ChevronRight className="h-4 w-4" />
)}
</Button>
<Package className="h-4 w-4 text-yellow-400" /> <Package className="h-4 w-4 text-yellow-400" />
<span className="text-white font-medium"> <span className="text-white font-medium">
Товар ФФ Товар ФФ

80
src/components/fulfillment-supplies/fulfillment-supplies/fulfillment-detailed-supplies-tab.tsx
View File

@ -7,8 +7,6 @@ import { Badge } from "@/components/ui/badge";
import { StatsCard } from "../../supplies/ui/stats-card"; import { StatsCard } from "../../supplies/ui/stats-card";
import { StatsGrid } from "../../supplies/ui/stats-grid"; import { StatsGrid } from "../../supplies/ui/stats-grid";
import { import {
ChevronDown,
ChevronRight,
Calendar, Calendar,
MapPin, MapPin,
Building2, Building2,
@ -429,21 +427,12 @@ export function FulfillmentDetailedSuppliesTab() {
return ( return (
<React.Fragment key={supply.id}> <React.Fragment key={supply.id}>
{/* Основная строка поставки расходников ФФ детально */} {/* Основная строка поставки расходников ФФ детально */}
<tr className="border-b border-white/10 hover:bg-white/5 transition-colors bg-orange-500/10"> <tr
className="border-b border-white/10 hover:bg-white/5 transition-colors bg-orange-500/10 cursor-pointer"
onClick={() => toggleSupplyExpansion(supply.id)}
>
<td className="p-4"> <td className="p-4">
<div className="flex items-center space-x-2"> <div className="flex items-center space-x-2">
<Button
variant="ghost"
size="sm"
onClick={() => toggleSupplyExpansion(supply.id)}
className="h-6 w-6 p-0 text-white/60 hover:text-white hover:bg-white/10"
>
{isSupplyExpanded ? (
<ChevronDown className="h-4 w-4" />
) : (
<ChevronRight className="h-4 w-4" />
)}
</Button>
<span className="text-white font-bold text-lg"> <span className="text-white font-bold text-lg">
#{supply.number} #{supply.number}
</span> </span>
@ -499,23 +488,12 @@ export function FulfillmentDetailedSuppliesTab() {
const isRouteExpanded = expandedRoutes.has(route.id); const isRouteExpanded = expandedRoutes.has(route.id);
return ( return (
<React.Fragment key={route.id}> <React.Fragment key={route.id}>
<tr className="border-b border-white/10 hover:bg-white/5 transition-colors bg-blue-500/10"> <tr
className="border-b border-white/10 hover:bg-white/5 transition-colors bg-blue-500/10 cursor-pointer"
onClick={() => toggleRouteExpansion(route.id)}
>
<td className="p-4 pl-12"> <td className="p-4 pl-12">
<div className="flex items-center space-x-2"> <div className="flex items-center space-x-2">
<Button
variant="ghost"
size="sm"
onClick={() =>
toggleRouteExpansion(route.id)
}
className="h-6 w-6 p-0 text-white/60 hover:text-white hover:bg-white/10"
>
{isRouteExpanded ? (
<ChevronDown className="h-4 w-4" />
) : (
<ChevronRight className="h-4 w-4" />
)}
</Button>
<MapPin className="h-4 w-4 text-blue-400" /> <MapPin className="h-4 w-4 text-blue-400" />
<span className="text-white font-medium"> <span className="text-white font-medium">
Маршрут ФФ Маршрут ФФ
@ -602,25 +580,12 @@ export function FulfillmentDetailedSuppliesTab() {
expandedSuppliers.has(supplier.id); expandedSuppliers.has(supplier.id);
return ( return (
<React.Fragment key={supplier.id}> <React.Fragment key={supplier.id}>
<tr className="border-b border-white/10 hover:bg-white/5 transition-colors bg-green-500/10"> <tr
className="border-b border-white/10 hover:bg-white/5 transition-colors bg-green-500/10 cursor-pointer"
onClick={() => toggleSupplierExpansion(supplier.id)}
>
<td className="p-4 pl-20"> <td className="p-4 pl-20">
<div className="flex items-center space-x-2"> <div className="flex items-center space-x-2">
<Button
variant="ghost"
size="sm"
onClick={() =>
toggleSupplierExpansion(
supplier.id
)
}
className="h-6 w-6 p-0 text-white/60 hover:text-white hover:bg-white/10"
>
{isSupplierExpanded ? (
<ChevronDown className="h-4 w-4" />
) : (
<ChevronRight className="h-4 w-4" />
)}
</Button>
<Building2 className="h-4 w-4 text-green-400" /> <Building2 className="h-4 w-4 text-green-400" />
<span className="text-white font-medium"> <span className="text-white font-medium">
Поставщик ФФ Поставщик ФФ
@ -697,25 +662,12 @@ export function FulfillmentDetailedSuppliesTab() {
); );
return ( return (
<React.Fragment key={consumable.id}> <React.Fragment key={consumable.id}>
<tr className="border-b border-white/10 hover:bg-white/5 transition-colors bg-yellow-500/10"> <tr
className="border-b border-white/10 hover:bg-white/5 transition-colors bg-yellow-500/10 cursor-pointer"
onClick={() => toggleConsumableExpansion(consumable.id)}
>
<td className="p-4 pl-28"> <td className="p-4 pl-28">
<div className="flex items-center space-x-2"> <div className="flex items-center space-x-2">
<Button
variant="ghost"
size="sm"
onClick={() =>
toggleConsumableExpansion(
consumable.id
)
}
className="h-6 w-6 p-0 text-white/60 hover:text-white hover:bg-white/10"
>
{isConsumableExpanded ? (
<ChevronDown className="h-4 w-4" />
) : (
<ChevronRight className="h-4 w-4" />
)}
</Button>
<Wrench className="h-4 w-4 text-yellow-400" /> <Wrench className="h-4 w-4 text-yellow-400" />
<span className="text-white font-medium"> <span className="text-white font-medium">
Расходник ФФ Расходник ФФ

71
src/components/fulfillment-supplies/fulfillment-supplies/fulfillment-goods-tab.tsx
View File

@ -26,8 +26,6 @@ import {
Hash, Hash,
Package2, Package2,
Boxes, Boxes,
ChevronDown,
ChevronRight,
Store, Store,
Building2, Building2,
Clock, Clock,
@ -816,7 +814,10 @@ export function FulfillmentGoodsTab() {
> >
<div className="space-y-3"> <div className="space-y-3">
{/* Компактный блок с названием магазина */} {/* Компактный блок с названием магазина */}
<div className="flex items-center justify-between bg-white/5 rounded-lg p-2"> <div
className="flex items-center justify-between bg-white/5 rounded-lg p-2 cursor-pointer hover:bg-white/10 transition-colors"
onClick={() => toggleSellerExpansion(supply.seller.id)}
>
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
<div className="p-1.5 bg-green-500/20 rounded"> <div className="p-1.5 bg-green-500/20 rounded">
<Store className="h-3 w-3 text-green-400" /> <Store className="h-3 w-3 text-green-400" />
@ -844,6 +845,7 @@ export function FulfillmentGoodsTab() {
rel="noopener noreferrer" rel="noopener noreferrer"
className="p-1 bg-blue-500/20 rounded hover:bg-blue-500/30 transition-colors" className="p-1 bg-blue-500/20 rounded hover:bg-blue-500/30 transition-colors"
title="Написать в Telegram" title="Написать в Telegram"
onClick={(e) => e.stopPropagation()}
> >
<svg <svg
className="h-3 w-3 text-blue-400" className="h-3 w-3 text-blue-400"
@ -862,6 +864,7 @@ export function FulfillmentGoodsTab() {
rel="noopener noreferrer" rel="noopener noreferrer"
className="p-1 bg-green-500/20 rounded hover:bg-green-500/30 transition-colors" className="p-1 bg-green-500/20 rounded hover:bg-green-500/30 transition-colors"
title="Написать в WhatsApp" title="Написать в WhatsApp"
onClick={(e) => e.stopPropagation()}
> >
<svg <svg
className="h-3 w-3 text-green-400" className="h-3 w-3 text-green-400"
@ -883,20 +886,6 @@ export function FulfillmentGoodsTab() {
{supply.supplyNumber} {supply.supplyNumber}
</span> </span>
</div> </div>
<Button
variant="ghost"
size="sm"
onClick={() =>
toggleSellerExpansion(supply.seller.id)
}
className="h-6 w-6 p-0 text-white/60 hover:text-white hover:bg-white/10"
>
{isSellerExpanded ? (
<ChevronDown className="h-3 w-3" />
) : (
<ChevronRight className="h-3 w-3" />
)}
</Button>
</div> </div>
</div> </div>
@ -1099,26 +1088,9 @@ export function FulfillmentGoodsTab() {
<p className="text-white/60 text-xs mb-1"> <p className="text-white/60 text-xs mb-1">
Маршрут Маршрут
</p> </p>
<div className="flex items-center gap-2"> <p className="text-white font-medium text-sm">
<p className="text-white font-medium text-sm"> {route.routeName}
{route.routeName} </p>
</p>
<Button
variant="ghost"
size="sm"
className="h-4 w-4 p-0 text-white/60 hover:text-white hover:bg-white/10"
onClick={(e) => {
e.stopPropagation();
toggleRouteExpansion(route.id);
}}
>
{isRouteExpanded ? (
<ChevronDown className="h-3 w-3" />
) : (
<ChevronRight className="h-3 w-3" />
)}
</Button>
</div>
</div> </div>
{/* Откуда */} {/* Откуда */}
@ -1219,28 +1191,9 @@ export function FulfillmentGoodsTab() {
<p className="text-white/60 text-xs mb-1"> <p className="text-white/60 text-xs mb-1">
Поставщик Поставщик
</p> </p>
<div className="flex items-center gap-2"> <p className="text-white font-medium text-sm">
<p className="text-white font-medium text-sm"> {supplier.name}
{supplier.name} </p>
</p>
<Button
variant="ghost"
size="sm"
className="h-4 w-4 p-0 text-white/60 hover:text-white hover:bg-white/10"
onClick={(e) => {
e.stopPropagation();
toggleSupplierExpansion(
supplier.id
);
}}
>
{isSupplierExpanded ? (
<ChevronDown className="h-3 w-3" />
) : (
<ChevronRight className="h-3 w-3" />
)}
</Button>
</div>
</div> </div>
{/* ИНН */} {/* ИНН */}