import { Table } from 'antd'
import React from 'react'

interface ColumnItem {
  key: string;
  title: string;
  dataIndex: string;
  width?: number;
  render?: any;
}

const columns: ColumnItem[] = [
  {
    key: 'item',
    title: 'Item',
    dataIndex: 'id',
    width: 80,
  },
  {
    key: 'paciente',
    title: 'Paciente',
    dataIndex: 'nombre',
    render: (text: any, record: any) => (
      <div className="flex items-center gap-2">
        <span>{text}</span>
      </div>
    ),
  },

  {
    key: 'cedula',
    title: 'Cedula',
    dataIndex: 'cedula',
    render: (text: any, record: any) => (
      <div className="flex items-center gap-2">
        <span>{text}</span>
      </div>
    ),
  },
  {
    key: 'direccion',
    title: 'Dirección',
    dataIndex: 'direccion',
    render: (text: any, record: any) => (
      <div className="flex items-center gap-2">
        <span>{text}</span>
      </div>
    ),
  },
  {
    key: 'fecha_creacion',
    title: 'Fecha de Creación',
    dataIndex: 'fecha_creacion',
    render: (text: any, record: any) => (
      <div className="flex items-center gap-2">
        <span>{text}</span>
      </div>
    ),
  },
  {
    key: 'acciones',
    title: 'Acciones',
    dataIndex: 'acciones',
    render: (text: any, record: any) => (
      <div className="flex items-center gap-2">
        <span>{text}</span>
      </div>
    ),
  },
];

const data = [
  {
    "id": 1,
    "nombre": "Juan Pérez",
    "cedula": "12345678",
    "direccion": "Av. Principal 123, Lima",
    "fecha_creacion": "2025-03-25",
    "acciones": "Editar"
  },
  {
    "id": 2,
    "nombre": "María Gómez",
    "cedula": "87654321",
    "direccion": "Calle Secundaria 456, Arequipa",
    "fecha_creacion": "2025-03-24",
    "acciones": "Eliminar"
  },
  {
    "id": 3,
    "nombre": "Carlos Rodríguez",
    "cedula": "11223344",
    "direccion": "Jr. Los Olivos 789, Trujillo",
    "fecha_creacion": "2025-03-23",
    "acciones": "Ver"
  },
  {
    "id": 4,
    "nombre": "Ana Martínez",
    "cedula": "44332211",
    "direccion": "Av. Colonial 321, Cusco",
    "fecha_creacion": "2025-03-22",
    "acciones": "Editar"
  },
  {
    "id": 5,
    "nombre": "Luis Fernández",
    "cedula": "99887766",
    "direccion": "Calle Primavera 654, Piura",
    "fecha_creacion": "2025-03-21",
    "acciones": "Eliminar"
  },
  {
    "id": 6,
    "nombre": "Patricia Ramírez",
    "cedula": "66778899",
    "direccion": "Jr. Las Flores 852, Chiclayo",
    "fecha_creacion": "2025-03-20",
    "acciones": "Ver"
  },
  {
    "id": 7,
    "nombre": "José Gutiérrez",
    "cedula": "22334455",
    "direccion": "Av. San Martín 963, Ica",
    "fecha_creacion": "2025-03-19",
    "acciones": "Editar"
  },
  {
    "id": 8,
    "nombre": "Carmen Castillo",
    "cedula": "55443322",
    "direccion": "Calle Central 741, Tacna",
    "fecha_creacion": "2025-03-18",
    "acciones": "Eliminar"
  },
  {
    "id": 9,
    "nombre": "Fernando López",
    "cedula": "11225544",
    "direccion": "Jr. La Paz 357, Huancayo",
    "fecha_creacion": "2025-03-17",
    "acciones": "Ver"
  },
  {
    "id": 10,
    "nombre": "Laura Herrera",
    "cedula": "66779988",
    "direccion": "Av. Bolívar 258, Ayacucho",
    "fecha_creacion": "2025-03-16",
    "acciones": "Editar"
  },
  {
    "id": 11,
    "nombre": "Ricardo Sánchez",
    "cedula": "77889966",
    "direccion": "Calle del Sol 147, Cajamarca",
    "fecha_creacion": "2025-03-15",
    "acciones": "Eliminar"
  },
  {
    "id": 12,
    "nombre": "Andrea Torres",
    "cedula": "33557799",
    "direccion": "Jr. Independencia 369, Puno",
    "fecha_creacion": "2025-03-14",
    "acciones": "Ver"
  },
  {
    "id": 13,
    "nombre": "Miguel Aguilar",
    "cedula": "22558899",
    "direccion": "Av. Grau 753, Moquegua",
    "fecha_creacion": "2025-03-13",
    "acciones": "Editar"
  },
  {
    "id": 14,
    "nombre": "Rosa Mendoza",
    "cedula": "99886677",
    "direccion": "Calle Central 369, Tumbes",
    "fecha_creacion": "2025-03-12",
    "acciones": "Eliminar"
  },
  {
    "id": 15,
    "nombre": "Javier Ríos",
    "cedula": "33446688",
    "direccion": "Jr. Amazonas 852, Iquitos",
    "fecha_creacion": "2025-03-11",
    "acciones": "Ver"
  },
  {
    "id": 16,
    "nombre": "Elena Silva",
    "cedula": "22114455",
    "direccion": "Av. Universitaria 741, Tarapoto",
    "fecha_creacion": "2025-03-10",
    "acciones": "Editar"
  },
  {
    "id": 17,
    "nombre": "Oscar Campos",
    "cedula": "66778844",
    "direccion": "Calle Real 123, Chimbote",
    "fecha_creacion": "2025-03-09",
    "acciones": "Eliminar"
  },
  {
    "id": 18,
    "nombre": "Daniela Vega",
    "cedula": "55332211",
    "direccion": "Jr. San Juan 963, Huaraz",
    "fecha_creacion": "2025-03-08",
    "acciones": "Ver"
  },
  {
    "id": 19,
    "nombre": "Eduardo Salazar",
    "cedula": "99882233",
    "direccion": "Av. Bolognesi 654, Cerro de Pasco",
    "fecha_creacion": "2025-03-07",
    "acciones": "Editar"
  },
  {
    "id": 20,
    "nombre": "Silvia Paredes",
    "cedula": "22446688",
    "direccion": "Calle Esperanza 369, Huánuco",
    "fecha_creacion": "2025-03-06",
    "acciones": "Eliminar"
  }
]


const TableComponent = () => {
  return (
    <div>
      <Table
        columns={columns}
        dataSource={data}
      />

    </div>
  )
}

export default TableComponent