import { GridColDef, GridRenderCellParams } from '@mui/x-data-grid-premium'; import Box from '@mui/material/Box'; import Typography from '@mui/material/Typography'; import Chip from '@mui/material/Chip'; import Tooltip from '@mui/material/Tooltip'; import { formatDate, formatDateTime, formatCurrency, formatNumber, } from '../utils/orderFormatters'; import { getStatusChipProps, getPriorityChipProps, } from '../utils/tableHelpers'; const CELL_FONT_SIZE = '0.75rem'; const CAPTION_FONT_SIZE = '0.6875rem'; const CHIP_STYLES = { fontSize: CAPTION_FONT_SIZE, height: 22, fontWeight: 300, } as const; const CHIP_PRIORITY_STYLES = { ...CHIP_STYLES, maxWidth: '100%', '& .MuiChip-label': { px: 1, py: 0, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap', }, } as const; interface CellTextProps { value: unknown; secondary?: boolean; fontWeight?: number; } const CellText = ({ value, secondary = false, fontWeight }: CellTextProps) => ( {String(value ?? '-')} ); interface CellNumericProps { value: unknown; formatter?: (val: number) => string; secondary?: boolean; fontWeight?: number; } const CellNumeric = ({ value, formatter, secondary = false, fontWeight, }: CellNumericProps) => ( {formatter ? formatter(value as number) : String(value ?? '-')} ); interface CellDateProps { value: unknown; showTime?: boolean; time?: string; } const CellDate = ({ value, showTime = false, time }: CellDateProps) => { const dateStr = formatDate(value as string | undefined); if (!showTime && !time) { return ( {dateStr} ); } const timeStr = time || formatDateTime(value as string | undefined); return ( {dateStr} {timeStr && ( {timeStr} )} ); }; interface CreateOrderColumnsOptions { storesMap?: Map; } export const createOrderColumns = ( options?: CreateOrderColumnsOptions ): GridColDef[] => { const storesMap = options?.storesMap; return [ { field: 'orderId', headerName: 'Pedido', width: 120, minWidth: 100, headerAlign: 'right', align: 'right', renderCell: (params: Readonly) => ( ), }, { field: 'createDate', headerName: 'Data', width: 160, minWidth: 140, renderCell: (params: Readonly) => ( ), }, { field: 'customerName', headerName: 'Cliente', width: 300, minWidth: 250, flex: 1, renderCell: (params: Readonly) => ( ), }, { field: 'customerId', headerName: 'Código Cliente', width: 120, minWidth: 110, headerAlign: 'right', align: 'right', renderCell: (params: Readonly) => ( ), }, { field: 'storeId', headerName: 'Filial', width: 200, minWidth: 180, renderCell: (params: Readonly) => { const storeId = String(params.value); const storeName = storesMap?.get(storeId) || storeId; return ; }, }, { field: 'store', headerName: 'Supervisor', width: 200, minWidth: 180, renderCell: (params: Readonly) => ( ), }, { field: 'status', headerName: 'Situação', width: 180, minWidth: 160, renderCell: (params: Readonly) => { const status = params.value as string; const chipProps = getStatusChipProps(status); return ( ); }, }, { field: 'orderType', headerName: 'Tipo', width: 140, minWidth: 120, renderCell: (params: Readonly) => ( ), }, { field: 'amount', headerName: 'Valor Total', width: 130, minWidth: 120, type: 'number', aggregable: true, headerAlign: 'right', align: 'right', valueFormatter: (value) => formatCurrency(value as number), renderCell: (params: Readonly) => ( ), }, { field: 'totalWeight', headerName: 'Peso (kg)', width: 100, minWidth: 90, type: 'number', aggregable: true, headerAlign: 'right', align: 'right', valueFormatter: (value) => formatNumber(value as number), renderCell: (params: Readonly) => ( ), }, { field: 'invoiceNumber', headerName: 'Nota Fiscal', width: 120, minWidth: 110, headerAlign: 'right', align: 'right', renderCell: (params: Readonly) => { const value = params.value && params.value !== '-' ? params.value : '-'; return ; }, }, { field: 'invoiceDate', headerName: 'Data Faturamento', width: 150, minWidth: 140, renderCell: (params: Readonly) => ( ), }, { field: 'fatUserName', headerName: 'Usuário Faturou', width: 160, minWidth: 140, renderCell: (params: Readonly) => ( ), }, { field: 'billingId', headerName: 'Cobrança', width: 120, minWidth: 110, renderCell: (params: Readonly) => ( ), }, { field: 'paymentName', headerName: 'Pagamento', width: 140, minWidth: 130, renderCell: (params: Readonly) => ( ), }, { field: 'sellerName', headerName: 'Vendedor', width: 200, minWidth: 180, renderCell: (params: Readonly) => ( ), }, { field: 'sellerId', headerName: 'RCA', width: 100, minWidth: 90, headerAlign: 'right', align: 'right', renderCell: (params: Readonly) => ( ), }, { field: 'codusur2Name', headerName: 'RCA 2', width: 180, minWidth: 160, renderCell: (params: Readonly) => ( ), }, { field: 'deliveryType', headerName: 'Tipo de Entrega', width: 160, minWidth: 140, renderCell: (params: Readonly) => ( ), }, { field: 'deliveryDate', headerName: 'Data Entrega', width: 130, minWidth: 120, renderCell: (params: Readonly) => ( ), }, { field: 'deliveryLocal', headerName: 'Local Entrega', width: 180, minWidth: 160, renderCell: (params: Readonly) => ( ), }, { field: 'deliveryPriority', headerName: 'Prioridade', width: 120, minWidth: 110, renderCell: (params: Readonly) => { const priority = params.value; const chipProps = getPriorityChipProps(priority); if (!chipProps) { return ; } return ( ); }, }, { field: 'confirmDeliveryDate', headerName: 'Data Confirmação Entrega', width: 150, minWidth: 140, renderCell: (params: Readonly) => ( ), }, { field: 'schedulerDelivery', headerName: 'Agendamento', width: 160, minWidth: 140, renderCell: (params: Readonly) => ( ), }, { field: 'partnerName', headerName: 'Parceiro', width: 180, minWidth: 160, renderCell: (params: Readonly) => ( ), }, { field: 'emitenteNome', headerName: 'Emitente', width: 180, minWidth: 160, renderCell: (params: Readonly) => ( ), }, ]; };