Portalweb/src/features/orders/components/OrderTableColumns.tsx

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';

interface CreateOrderColumnsOptions {
  storesMap?: Map<string, string>;
}

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<GridRenderCellParams>) => (
      <Typography
        variant="body2"
        sx={{ fontSize: '0.75rem', fontWeight: 500, textAlign: 'right' }}
      >
        {params.value}
      </Typography>
    ),
  },
  {
    field: 'createDate',
    headerName: 'Data',
    width: 160,
    minWidth: 140,
    renderCell: (params: Readonly<GridRenderCellParams>) => {
      const dateTime = formatDateTime(params.value);
      return (
        <Box>
          <Typography variant="body2" sx={{ fontSize: '0.75rem' }}>
            {formatDate(params.value)}
          </Typography>
          {dateTime && (
            <Typography
              variant="caption"
              color="text.secondary"
              sx={{ fontSize: '0.6875rem' }}
            >
              {dateTime}
            </Typography>
          )}
        </Box>
      );
    },
  },
  {
    field: 'customerName',
    headerName: 'Cliente',
    width: 300,
    minWidth: 250,
    flex: 1,
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography variant="body2" sx={{ fontSize: '0.75rem' }} noWrap>
        {params.value}
      </Typography>
    ),
  },
  {
    field: 'storeId',
    headerName: 'Filial',
    width: 200,
    minWidth: 180,
    renderCell: (params: Readonly<GridRenderCellParams>) => {
      const storeId = String(params.value);
      const storeName = storesMap?.get(storeId) || storeId;
      return (
        <Typography variant="body2" sx={{ fontSize: '0.75rem' }} noWrap>
          {storeName}
        </Typography>
      );
    },
  },
  {
    field: 'store',
    headerName: 'Supervisor',
    width: 200,
    minWidth: 180,
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography variant="body2" sx={{ fontSize: '0.75rem' }} noWrap>
        {params.value}
      </Typography>
    ),
  },
  {
    field: 'status',
    headerName: 'Situação',
    width: 180,
    minWidth: 160,
    renderCell: (params: Readonly<GridRenderCellParams>) => {
      const status = params.value as string;
      const chipProps = getStatusChipProps(status);

      return (
        <Tooltip title={chipProps.label} arrow placement="top">
          <Chip
            label={chipProps.label}
            color={chipProps.color}
            size="small"
            sx={{
              fontSize: '0.6875rem',
              height: 22,
              fontWeight: 300,
            }}
          />
        </Tooltip>
      );
    },
  },
  {
    field: 'orderType',
    headerName: 'Tipo',
    width: 140,
    minWidth: 120,
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography variant="body2" sx={{ fontSize: '0.75rem' }} noWrap>
        {params.value}
      </Typography>
    ),
  },
  {
    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<GridRenderCellParams>) => (
      <Typography
        variant="body2"
        sx={{ fontSize: '0.75rem', fontWeight: 500, textAlign: 'right' }}
      >
        {formatCurrency(params.value)}
      </Typography>
    ),
  },
  {
    field: 'invoiceNumber',
    headerName: 'Nota Fiscal',
    width: 120,
    minWidth: 110,
    headerAlign: 'right',
    align: 'right',
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography
        variant="body2"
        sx={{ fontSize: '0.75rem', textAlign: 'right' }}
      >
        {params.value && params.value !== '-' ? params.value : '-'}
      </Typography>
    ),
  },
  {
    field: 'billingId',
    headerName: 'Cobrança',
    width: 120,
    minWidth: 110,
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography variant="body2" sx={{ fontSize: '0.75rem' }} noWrap>
        {params.value || '-'}
      </Typography>
    ),
  },
  {
    field: 'sellerName',
    headerName: 'Vendedor',
    width: 200,
    minWidth: 180,
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography variant="body2" sx={{ fontSize: '0.75rem' }} noWrap>
        {params.value}
      </Typography>
    ),
  },
  {
    field: 'deliveryType',
    headerName: 'Tipo de Entrega',
    width: 160,
    minWidth: 140,
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography variant="body2" sx={{ fontSize: '0.75rem' }} noWrap>
        {params.value}
      </Typography>
    ),
  },
  {
    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<GridRenderCellParams>) => (
      <Typography
        variant="body2"
        sx={{ fontSize: '0.75rem', textAlign: 'right' }}
      >
        {formatNumber(params.value)}
      </Typography>
    ),
  },
  {
    field: 'fatUserName',
    headerName: 'Usuário Faturou',
    width: 160,
    minWidth: 140,
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography variant="body2" sx={{ fontSize: '0.75rem' }} noWrap>
        {params.value}
      </Typography>
    ),
  },
  {
    field: 'customerId',
    headerName: 'Código Cliente',
    width: 120,
    minWidth: 110,
    headerAlign: 'right',
    align: 'right',
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography
        variant="body2"
        color="text.secondary"
        sx={{ fontSize: '0.75rem', textAlign: 'right' }}
      >
        {params.value || '-'}
      </Typography>
    ),
  },
  {
    field: 'deliveryDate',
    headerName: 'Data Entrega',
    width: 130,
    minWidth: 120,
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography variant="body2" sx={{ fontSize: '0.75rem' }}>
        {params.value ? formatDate(params.value) : '-'}
      </Typography>
    ),
  },
  {
    field: 'deliveryLocal',
    headerName: 'Local Entrega',
    width: 180,
    minWidth: 160,
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography variant="body2" sx={{ fontSize: '0.75rem' }} noWrap>
        {params.value}
      </Typography>
    ),
  },
  {
    field: 'deliveryPriority',
    headerName: 'Prioridade',
    width: 120,
    minWidth: 110,
    renderCell: (params: Readonly<GridRenderCellParams>) => {
      const priority = params.value;
      const chipProps = getPriorityChipProps(priority);

      if (!chipProps) {
        return (
          <Typography
            variant="body2"
            sx={{ fontSize: '0.75rem', color: 'text.secondary' }}
            noWrap
          >
            -
          </Typography>
        );
      }

      return (
        <Tooltip title={chipProps.label} arrow placement="top">
          <Chip
            label={chipProps.label}
            color={chipProps.color}
            size="small"
            sx={{
              fontSize: '0.6875rem',
              height: 22,
              fontWeight: 300,
              maxWidth: '100%',
              '& .MuiChip-label': {
                px: 1,
                py: 0,
                overflow: 'hidden',
                textOverflow: 'ellipsis',
                whiteSpace: 'nowrap',
              },
            }}
          />
        </Tooltip>
      );
    },
  },
  {
    field: 'invoiceDate',
    headerName: 'Data Faturamento',
    width: 150,
    minWidth: 140,
    renderCell: (params: Readonly<GridRenderCellParams>) => {
      const dateStr = formatDate(params.value);
      const timeStr = params.row.invoiceTime;

      return (
        <Typography
          variant="body2"
          sx={{ fontSize: '0.75rem', whiteSpace: 'nowrap' }}
        >
          {dateStr}
          {timeStr && (
            <Box
              component="span"
              sx={{ color: 'text.secondary', fontSize: '0.6875rem', ml: 0.5 }}
            >
              {timeStr}
            </Box>
          )}
        </Typography>
      );
    },
  },
  {
    field: 'invoiceTime',
    headerName: 'Hora Faturamento',
    width: 120,
    minWidth: 110,
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography variant="body2" sx={{ fontSize: '0.75rem' }}>
        {params.value || '-'}
      </Typography>
    ),
  },
  {
    field: 'confirmDeliveryDate',
    headerName: 'Data Confirmação Entrega',
    width: 150,
    minWidth: 140,
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography variant="body2" sx={{ fontSize: '0.75rem' }}>
        {params.value ? formatDate(params.value) : '-'}
      </Typography>
    ),
  },
  {
    field: 'paymentName',
    headerName: 'Pagamento',
    width: 140,
    minWidth: 130,
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography variant="body2" sx={{ fontSize: '0.75rem' }} noWrap>
        {params.value}
      </Typography>
    ),
  },
  {
    field: 'sellerId',
    headerName: 'RCA',
    width: 100,
    minWidth: 90,
    headerAlign: 'right',
    align: 'right',
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography
        variant="body2"
        color="text.secondary"
        sx={{ fontSize: '0.75rem', textAlign: 'right' }}
      >
        {params.value || '-'}
      </Typography>
    ),
  },
  {
    field: 'partnerName',
    headerName: 'Parceiro',
    width: 180,
    minWidth: 160,
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography variant="body2" sx={{ fontSize: '0.75rem' }} noWrap>
        {params.value}
      </Typography>
    ),
  },
  {
    field: 'codusur2Name',
    headerName: 'RCA 2',
    width: 180,
    minWidth: 160,
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography variant="body2" sx={{ fontSize: '0.75rem' }} noWrap>
        {params.value}
      </Typography>
    ),
  },
  {
    field: 'schedulerDelivery',
    headerName: 'Agendamento',
    width: 160,
    minWidth: 140,
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography variant="body2" sx={{ fontSize: '0.75rem' }} noWrap>
        {params.value}
      </Typography>
    ),
  },
  {
    field: 'emitenteNome',
    headerName: 'Emitente',
    width: 180,
    minWidth: 160,
    renderCell: (params: Readonly<GridRenderCellParams>) => (
      <Typography variant="body2" sx={{ fontSize: '0.75rem' }} noWrap>
        {params.value}
      </Typography>
    ),
  },
];
};