Portal web moderno para la consulta y pago de impuestos prediales de la Gobernación, ofreciendo una experiencia fluida y segura para los ciudadanos.
-
📋 Consulta de Facturas
- Búsqueda por número de factura o ID predial
- Visualización detallada de la información
- Validación del estado actual
-
💳 Sistema de Pagos
- Integración completa con PSE
- Aplicación automática de descuentos
- Sistema de abonos parciales
- Comprobantes digitales
-
📄 Generación de Comprobantes
- PDFs estandarizados
- Diferenciación entre pagos y abonos
- Descarga automática
- TypeScript 5.0+ - Lenguaje base con tipado estático
- Next.js 15.1 - Framework de React con SSR y routing
- pnpm - Gestor de paquetes rápido y eficiente
- Tailwind CSS - Framework CSS utility-first
- shadcn/ui - Componentes reutilizables y accesibles
- Lucide Icons - Set de iconos modernos y personalizables
- jsPDF - Generación de documentos PDF
- React Hook Form - Manejo de formularios
- Zod - Validación de esquemas
# Clonar el repositorio
git clone [url-del-repositorio]
# Navegar al directorio
cd predial_tax_prototype
# Instalar dependencias
pnpm install
# Iniciar servidor de desarrollo
pnpm dev
| Caso de Prueba | Descripción | Resultado Esperado |
|---|---|---|
| Factura Vencida | 000069704647 |
Sin descuento aplicable |
| Con Descuento | 000011123448 |
Descuento por pronto pago |
| Ya Pagada | 000011123450 |
Muestra estado pagado |
| Abono Parcial | Cualquier factura pendiente | Mínimo $30,000 |
| Factura Inválida | Números aleatorios | Mensaje de error |
.
├── components.json
├── eslint.config.mjs
├── next.config.ts
├── next-env.d.ts
├── package.json
├── pnpm-lock.yaml
├── postcss.config.mjs
├── README.md
├── src
│ ├── app
│ │ ├── config
│ │ │ └── routes.ts
│ │ ├── globals.css
│ │ ├── invoice # Módulo de factura/invoice
│ │ │ ├── [id] # Ruta dinámica factura específica
│ │ │ │ └── page.tsx
│ │ │ └── page.tsx # Página consulta factura
│ │ ├── layout.tsx
│ │ ├── page.tsx # Página principal/Home
│ │ └── payment # Módulo de pago
│ │ ├── [id]
│ │ │ ├── confirmation
│ │ │ │ └── page.tsx
│ │ │ └── page.tsx
│ │ └── page.tsx
│ ├── components
│ │ ├── home
│ │ │ ├── HeroSection.tsx
│ │ │ └── InfoSection.tsx
│ │ ├── invoice # Componentes específicos factura
│ │ │ ├── InvoiceDetails.tsx
│ │ │ ├── InvoiceForm.tsx # Formulario consulta factura
│ │ │ ├── InvoiceOptions.tsx # Opciones (descargar/pagar/abonar)
│ │ │ └── InvoicePreview.tsx # Vista previa factura PDF
│ │ ├── payment # Componentes de pago
│ │ │ ├── AbonoForm.tsx # Formulario de abono
│ │ │ ├── InvoiceSummary.tsx
│ │ │ └── PSEForm.tsx # Formulario pago PSE
│ │ ├── shared
│ │ │ ├── Footer.tsx
│ │ │ └── Header.tsx
│ │ └── ui # Componentes que sean necesarios
│ │ ├── alert.tsx
│ │ ├── button.tsx
│ │ ├── card.tsx
│ │ ├── dropdown-menu.tsx
│ │ ├── input.tsx
│ │ ├── progress.tsx
│ │ ├── select.tsx
│ │ ├── stepper.tsx
│ │ ├── toaster.tsx
│ │ ├── toast.tsx
│ │ └── tooltip.tsx
│ ├── data
│ │ ├── BanksMockData.ts # Lista bancos PSE
│ │ ├── InvoiceMockData.ts # Datos factura predial
│ │ ├── NavMockData.ts
│ │ └── PropertyMockData.ts # Datos predio
│ ├── hooks
│ │ ├── useAbono.ts # Hook proceso abono
│ │ ├── useInvoice.ts # Hook consulta factura
│ │ ├── usePayment.ts # Hook proceso pago
│ │ └── use-toast.ts
│ ├── lib
│ │ ├── constants.ts # Constantes
│ │ ├── formatUtils.ts
│ │ ├── pdf-generator.ts # Utilidades generación PDF
│ │ └── utils.ts # Utilidades generales
│ ├── services # Servicios para lógica de negocio
│ │ ├── api # Servicios API base
│ │ │ ├── client.ts # Cliente API base
│ │ │ └── config.ts # Configuración API (endpoints, headers)
│ │ ├── invoice # Servicios relacionados a facturas
│ │ │ ├── invoice.service.ts # Métodos CRUD factura
│ │ │ └── types.ts # Tipos específicos del servicio
│ │ ├── payment # Servicios relacionados a pagos
│ │ │ ├── payment.service.ts # Lógica de pagos y PSE
│ │ │ └── types.ts # Tipos específicos del servicio
│ │ └── property # Servicios relacionados a predios
│ │ ├── property.service.ts # Consultas de predios
│ │ └── types.ts # Tipos específicos del servicio
│ ├── store # Estado global si necesario
│ │ └── invoiceStore.ts # Estado factura actual
│ └── types
│ ├── commonTypes.ts # Interfaces comunes
│ ├── invoiceDetailsTypes.ts
│ ├── invoiceTypes.ts # Interfaces factura
│ ├── navigation.ts
│ ├── paymentPSETypes.ts # Interfaces PSE
│ ├── paymentTypes.ts # Interfaces pago
│ ├── propertyTypes.ts # Interfaces predio
│ └── stepperTypes.ts # Interfaces stepper
├── tailwind.config.ts
└── tsconfig.json
- Fork el proyecto
- Crea tu rama de feature (
git checkout -b feature/NuevaCaracteristica) - Commit tus cambios (
git commit -m 'Agrega nueva característica') - Push a la rama (
git push origin feature/NuevaCaracteristica) - Abre un Pull Request
Este proyecto está bajo la Licencia MIT - ver el archivo LICENSE.md para más detalles.
