- Adiciona integração com API de produtos em http://10.1.1.212:8805/api/v1/data-consult/products/{id} - Corrige mapeamento de resposta da API para formato Product interface - Atualiza ProductSearchInput para usar description como nome do produto - Corrige API_BASE_URL adicionando protocolo http:// para evitar URLs relativas - Resolve erro 404 causado por URLs malformadas em requisições de API
119 lines
3.4 KiB
TypeScript
119 lines
3.4 KiB
TypeScript
import React, { memo, useMemo } from "react";
|
|
import {
|
|
TableBody,
|
|
TableCell,
|
|
TableRow,
|
|
} from "@/src/components/ui/table";
|
|
import { OrderRowExpandable } from "./tabela-pedidos/components/OrderRowExpandable";
|
|
import { Order } from "@/src/components/types";
|
|
|
|
/**
|
|
* Propriedades para o componente OrdersTableBody
|
|
* @typedef {Object} OrdersTableBodyProps
|
|
* @property {Order[]} orders - Lista completa de pedidos
|
|
* @property {Order[]} currentOrders - Lista de pedidos filtrados/paginados
|
|
* @property {string|null} selectedOrderId - ID do pedido selecionado
|
|
* @property {string[]} visibleColumns - Colunas visíveis na tabela
|
|
* @property {(storeId?: string) => string} getStoreName - Função para obter o nome da loja
|
|
* @property {(orderId: string) => void} handleRowClick - Função chamada ao clicar em uma linha
|
|
*/
|
|
interface OrdersTableBodyProps {
|
|
orders: Order[];
|
|
currentOrders: Order[];
|
|
selectedOrderId: string | null;
|
|
visibleColumns: string[];
|
|
getStoreName: (storeId?: string) => string;
|
|
handleRowClick: (orderId: string) => void;
|
|
}
|
|
|
|
/**
|
|
* Linha vazia exibida quando não há pedidos
|
|
* @param {{ colSpan: number }} props
|
|
* @returns {JSX.Element}
|
|
*/
|
|
const EmptyRow = memo(({ colSpan }: { colSpan: number }) => (
|
|
<TableRow>
|
|
<TableCell colSpan={colSpan} className="h-24 text-center text-xs">
|
|
Nenhum pedido encontrado com os filtros informados.
|
|
</TableCell>
|
|
</TableRow>
|
|
));
|
|
|
|
/**
|
|
* Linha de pedido individual, expansível
|
|
* @param {{ order: Order, isSelected: boolean, visibleColumns: string[], onSelect: (orderId: string) => void, getStoreName: (storeId?: string) => string }} props
|
|
* @returns {JSX.Element}
|
|
*/
|
|
const OrderRow = memo(({
|
|
order,
|
|
isSelected,
|
|
visibleColumns,
|
|
onSelect,
|
|
getStoreName
|
|
}: {
|
|
order: Order;
|
|
isSelected: boolean;
|
|
visibleColumns: string[];
|
|
onSelect: (orderId: string) => void;
|
|
getStoreName: (storeId?: string) => string;
|
|
}) => {
|
|
// Cria um novo objeto de pedido com o nome da loja
|
|
const orderWithStore = {
|
|
...order,
|
|
store: getStoreName(order.storeId),
|
|
storeId: order.storeId, // Mantém o storeId original
|
|
};
|
|
|
|
return (
|
|
<OrderRowExpandable
|
|
key={order.orderId}
|
|
order={orderWithStore}
|
|
isSelected={isSelected}
|
|
onSelect={onSelect}
|
|
orderItems={[]}
|
|
loadingItems={false}
|
|
itemsError={null}
|
|
visibleColumns={visibleColumns}
|
|
/>
|
|
);
|
|
});
|
|
|
|
/**
|
|
* Corpo da tabela de pedidos, renderiza linhas de pedidos ou linha vazia
|
|
* @param {OrdersTableBodyProps} props
|
|
* @returns {JSX.Element}
|
|
*/
|
|
function OrdersTableBodyComponent({
|
|
orders,
|
|
currentOrders,
|
|
selectedOrderId,
|
|
visibleColumns,
|
|
getStoreName,
|
|
handleRowClick,
|
|
}: OrdersTableBodyProps) {
|
|
// Renderização condicional baseada na presença de pedidos
|
|
const content = useMemo(() => {
|
|
if (orders.length === 0) {
|
|
return <EmptyRow colSpan={visibleColumns.length} />;
|
|
}
|
|
|
|
return currentOrders.map((order) => (
|
|
<OrderRow
|
|
key={order.orderId}
|
|
order={order}
|
|
isSelected={selectedOrderId === order.orderId}
|
|
visibleColumns={visibleColumns}
|
|
onSelect={handleRowClick}
|
|
getStoreName={getStoreName}
|
|
/>
|
|
));
|
|
}, [orders.length, currentOrders, selectedOrderId, visibleColumns, getStoreName, handleRowClick]);
|
|
|
|
return <TableBody>{content}</TableBody>;
|
|
}
|
|
|
|
/**
|
|
* Exporta o componente memoizado do corpo da tabela de pedidos
|
|
* @type {React.NamedExoticComponent<OrdersTableBodyProps>}
|
|
*/
|
|
export const OrdersTableBody = memo(OrdersTableBodyComponent); |