From 7585cedd3e9eb366e863e7da0a493a67fff22642 Mon Sep 17 00:00:00 2001
From: Galindo97 <agalindo2aduanasoft.com.mx>
Date: Wed, 24 Dec 2025 09:10:10 -0600
Subject: [PATCH] feat: add partidas tab form component with CRUD functionality

- Implemented the partidas tab form in Svelte for managing partidas.
- Added functionality to create, edit, delete, and list partidas.
- Integrated a dialog for adding and editing partidas with validation.
- Included a checkbox component for selecting partidas.
- Added total calculations for partidas in the UI.
- Enhanced UI with buttons for various actions and a responsive table layout.
---
 .../general_catalogs/exchange_rate/routes.py  |    2 +-
 .../lib/api/dashboard/a76/exchange-rate.ts    |   18 +-
 .../src/lib/api/dashboard/a76/pedimentos.ts   |   52 +-
 .../edit/bultos-transportes-tab-form.svelte   | 1117 +++++++++++
 .../edit/contribuciones-tab-form.svelte       |  547 ++++++
 .../edit/cuentas-compensacion-tab-form.svelte |  632 ++++++
 .../pedimentos/edit/dates-tab-form.svelte     |  138 +-
 .../pedimentos/edit/descargas-tab-form.svelte |  495 +++++
 .../edit/digitalizacion-tab-form.svelte       |  414 ++++
 .../pedimentos/edit/facturas-tab-form.svelte  |  530 +++++
 .../pedimentos/edit/general-tab-form.svelte   |  586 +++++-
 .../edit/otros-datos-tab-form.svelte          | 1709 +++++++++++++++++
 .../pedimentos/edit/partidas-tab-form.svelte  |  543 ++++++
 .../components/ui/checkbox/checkbox.svelte    |   36 +
 .../src/lib/components/ui/checkbox/index.ts   |    6 +
 .../pedimentos/edit/[id]/+page.svelte         |  436 +++--
 16 files changed, 6971 insertions(+), 290 deletions(-)
 create mode 100644 frontend/src/lib/components/dashboard/pedimentos/edit/bultos-transportes-tab-form.svelte
 create mode 100644 frontend/src/lib/components/dashboard/pedimentos/edit/contribuciones-tab-form.svelte
 create mode 100644 frontend/src/lib/components/dashboard/pedimentos/edit/cuentas-compensacion-tab-form.svelte
 create mode 100644 frontend/src/lib/components/dashboard/pedimentos/edit/descargas-tab-form.svelte
 create mode 100644 frontend/src/lib/components/dashboard/pedimentos/edit/digitalizacion-tab-form.svelte
 create mode 100644 frontend/src/lib/components/dashboard/pedimentos/edit/facturas-tab-form.svelte
 create mode 100644 frontend/src/lib/components/dashboard/pedimentos/edit/otros-datos-tab-form.svelte
 create mode 100644 frontend/src/lib/components/dashboard/pedimentos/edit/partidas-tab-form.svelte
 create mode 100644 frontend/src/lib/components/ui/checkbox/checkbox.svelte
 create mode 100644 frontend/src/lib/components/ui/checkbox/index.ts

diff --git a/backend/api/v1/modules/a76/general_catalogs/exchange_rate/routes.py b/backend/api/v1/modules/a76/general_catalogs/exchange_rate/routes.py
index 99f0b786..546ead36 100644
--- a/backend/api/v1/modules/a76/general_catalogs/exchange_rate/routes.py
+++ b/backend/api/v1/modules/a76/general_catalogs/exchange_rate/routes.py
@@ -14,7 +14,7 @@ router = TenantCRUDRoutes(
     resource_name="Exchange Rate",
     id_name="id",  # Using numeric ID
     enable_list=True,  # Enable GET /exchange-rate with pagination
-    enable_filters=True,  # Enable filtering by date, local_currency, foreign_currency
+    enable_filters=False,
     default_page_size=50,
     max_page_size=100,
 ).router
diff --git a/frontend/src/lib/api/dashboard/a76/exchange-rate.ts b/frontend/src/lib/api/dashboard/a76/exchange-rate.ts
index d7843807..81b14e90 100644
--- a/frontend/src/lib/api/dashboard/a76/exchange-rate.ts
+++ b/frontend/src/lib/api/dashboard/a76/exchange-rate.ts
@@ -24,16 +24,20 @@ export interface ExchangeRateListResponse {
 /**
  * Get exchange rate by date
  */
-export async function getExchangeRateByDate(date: string): Promise<ExchangeRate | null> {
+export async function getExchangeRateByDate(date: string, companyId: number): Promise<ExchangeRate | null> {
 	try {
-		// Convert date to ISO format with time for backend datetime field
-		const dateWithTime = `${date}T00:00:00`;
-		const response = await api.get<ExchangeRateListResponse>(`/v1/a76/exchange-rate?date=${dateWithTime}`);
+		// Get all exchange rates and filter by date on client side
+		const response = await api.get<ExchangeRateListResponse>(`/v1/a76/exchange-rate/?company_id=${companyId}`);
 		
 		if (response.data && response.data.items && response.data.items.length > 0) {
-			// Find USD exchange rate
-			const usdRate = response.data.items.find(rate => rate.foreign_currency === 'USD');
-			return usdRate || null;
+			// Filter by date and find USD exchange rate
+			const dateOnly = date.split('T')[0]; // Get YYYY-MM-DD part
+			const matchingRates = response.data.items.filter(rate => {
+				const rateDate = rate.date.split('T')[0];
+				return rateDate === dateOnly && rate.foreign_currency === 'USD';
+			});
+			
+			return matchingRates.length > 0 ? matchingRates[0] : null;
 		}
 		
 		return null;
diff --git a/frontend/src/lib/api/dashboard/a76/pedimentos.ts b/frontend/src/lib/api/dashboard/a76/pedimentos.ts
index 175c9a79..fea0001e 100644
--- a/frontend/src/lib/api/dashboard/a76/pedimentos.ts
+++ b/frontend/src/lib/api/dashboard/a76/pedimentos.ts
@@ -50,6 +50,41 @@ export interface PedimentoValidation {
 	responsible_id?: number | null;
 }
 
+export interface PedimentoIncrementables {
+	insured_value?: number | null;
+	packaging?: number | null;
+	freight?: number | null;
+	deductibles?: number | null;
+	currency?: string | null;
+	not_affect_usd_value?: number | null;
+	not_affect_customs_value?: number | null;
+}
+
+export interface PedimentoDecrementables {
+	freight?: number | null;
+	insurance?: number | null;
+	loading?: number | null;
+	unloading?: number | null;
+	others?: number | null;
+	currency?: string | null;
+	not_affect_usd_value?: number | null;
+}
+
+export interface PedimentoIndexes {
+	update_factor_type?: number | null;
+	update_factor?: number | null;
+	manual_update_factor?: number | null;
+}
+
+export interface PedimentoConfigAdditional {
+	manual_pedimento_year?: string | null;
+	add_po_identifier?: number | null;
+	do_not_exempt_norms_complement_x?: number | null;
+	enable_import_invoice_recipient?: number | null;
+	send_502_validation_file_for_consolidated?: number | null;
+	add_remove_norms?: number | null;
+}
+
 export interface Pedimento {
 	id: number;
 	tenant_id: number;
@@ -67,12 +102,17 @@ export interface Pedimento {
 	paid_price?: number | null;
 	gross_weight?: number | null;
 	exchange_rate?: number | null;
+	observaciones?: string | null;
 	created_at: string;
 	// Sub-resources
 	pedimento_dates?: PedimentoDates | null;
 	pedimento_payments?: PedimentoPayments | null;
 	pedimento_transport_means?: PedimentoTransportMeans | null;
-	pedimento_validation?: PedimentoValidation | null;	
+	pedimento_validation?: PedimentoValidation | null;
+	pedimento_incrementables?: PedimentoIncrementables | null;
+	pedimento_decrementables?: PedimentoDecrementables | null;
+	pedimento_indexes?: PedimentoIndexes | null;
+	pedimento_config_additional?: PedimentoConfigAdditional | null;
 }
 
 export interface PedimentoListResponse {
@@ -97,11 +137,16 @@ export interface CreatePedimentoData {
 	paid_price?: number | null;
 	gross_weight?: number | null;
 	exchange_rate?: number | null;
+	observaciones?: string | null;
 	// Sub-resources
 	pedimento_dates?: PedimentoDates | null;
 	pedimento_payments?: PedimentoPayments | null;
 	pedimento_transport_means?: PedimentoTransportMeans | null;
 	pedimento_validation?: PedimentoValidation | null;
+	pedimento_incrementables?: PedimentoIncrementables | null;
+	pedimento_decrementables?: PedimentoDecrementables | null;
+	pedimento_indexes?: PedimentoIndexes | null;
+	pedimento_config_additional?: PedimentoConfigAdditional | null;
 }
 
 export interface UpdatePedimentoData {
@@ -119,11 +164,16 @@ export interface UpdatePedimentoData {
 	paid_price?: number | null;
 	gross_weight?: number | null;
 	exchange_rate?: number | null;
+	observaciones?: string | null;
 	// Sub-resources
 	pedimento_dates?: PedimentoDates | null;
 	pedimento_payments?: PedimentoPayments | null;
 	pedimento_transport_means?: PedimentoTransportMeans | null;
 	pedimento_validation?: PedimentoValidation | null;
+	pedimento_incrementables?: PedimentoIncrementables | null;
+	pedimento_decrementables?: PedimentoDecrementables | null;
+	pedimento_indexes?: PedimentoIndexes | null;
+	pedimento_config_additional?: PedimentoConfigAdditional | null;
 }
 
 export interface PedimentoFilters {
diff --git a/frontend/src/lib/components/dashboard/pedimentos/edit/bultos-transportes-tab-form.svelte b/frontend/src/lib/components/dashboard/pedimentos/edit/bultos-transportes-tab-form.svelte
new file mode 100644
index 00000000..eb469557
--- /dev/null
+++ b/frontend/src/lib/components/dashboard/pedimentos/edit/bultos-transportes-tab-form.svelte
@@ -0,0 +1,1117 @@
+<script lang="ts">
+	import { Card, CardContent, CardHeader, CardTitle } from '$lib/components/ui/card';
+	import { Button } from '$lib/components/ui/button';
+	import { Input } from '$lib/components/ui/input';
+	import { Label } from '$lib/components/ui/label';
+	import {
+		Table,
+		TableBody,
+		TableCell,
+		TableHead,
+		TableHeader,
+		TableRow
+	} from '$lib/components/ui/table';
+	import {
+		Dialog,
+		DialogContent,
+		DialogHeader,
+		DialogTitle,
+		DialogFooter
+	} from '$lib/components/ui/dialog';
+	import * as Select from '$lib/components/ui/select';
+	import {
+		Plus,
+		Pencil,
+		Trash2,
+		FileText,
+		Copy,
+		Upload
+	} from 'lucide-svelte';
+
+	interface Transporte {
+		id?: number;
+		transportista: string;
+		rfc: string;
+		curp: string;
+		nombre: string;
+		domicilio: string;
+		ciudad: string;
+		estado: string;
+		pais: string;
+		identificacion_fiscal: string;
+		total_bultos: number;
+		identificacion: string;
+	}
+
+	interface Guia {
+		id?: number;
+		guia: string;
+		identificador: string;
+	}
+
+	interface Precinto {
+		id?: number;
+		numero: string;
+		identificacion: string;
+	}
+
+	interface Contenedor {
+		id?: number;
+		numero: string;
+		identificacion: string;
+		tipo: string;
+	}
+
+	let {
+		formData = $bindable({
+			bultos: {
+				cantidad: 0,
+				marcas: 'S/M',
+				numero: 'S/N',
+				vehiculos: 1
+			},
+			transportes: [] as Transporte[],
+			guias: [] as Guia[],
+			precintos: [] as Precinto[],
+			contenedores: [] as Contenedor[]
+		})
+	}: {
+		formData: {
+			bultos: {
+				cantidad: number;
+				marcas: string;
+				numero: string;
+				vehiculos: number;
+			};
+			transportes: Transporte[];
+			guias: Guia[];
+			precintos: Precinto[];
+			contenedores: Contenedor[];
+		};
+	} = $props();
+
+	// Estados para diálogos
+	let isTransporteDialogOpen = $state(false);
+	let isPrecintoDialogOpen = $state(false);
+	let isContenedorDialogOpen = $state(false);
+	let isTransportesPrecintosDialogOpen = $state(false);
+	let isGuiasDialogOpen = $state(false);
+
+	// Estados para diálogo de Transportes y Precintos separados por comas
+	let transportesPrecintosData = $state({
+		pais: '',
+		lista_transportes: '',
+		lista_precintos: ''
+	});
+
+	// Estados para diálogo de Guías
+	let editingGuiaIndex = $state<number | null>(null);
+	let currentGuia = $state<Guia>({
+		guia: '',
+		identificador: ''
+	});
+
+	// Estados para edición
+	let editingTransporteIndex = $state<number | null>(null);
+	let editingPrecintoIndex = $state<number | null>(null);
+	let editingContenedorIndex = $state<number | null>(null);
+
+	// Estados actuales
+	let currentTransporte = $state<Transporte>({
+		transportista: '',
+		rfc: '',
+		curp: '',
+		nombre: '',
+		domicilio: '',
+		ciudad: '',
+		estado: '',
+		pais: '',
+		identificacion_fiscal: '',
+		total_bultos: 0,
+		identificacion: ''
+	});
+
+	let currentPrecinto = $state<Precinto>({
+		numero: '',
+		identificacion: ''
+	});
+
+	let currentContenedor = $state<Contenedor>({
+		numero: '',
+		identificacion: '',
+		tipo: ''
+	});
+
+	const paises = [
+		'Estados Unidos',
+		'México',
+		'Canadá',
+		'China',
+		'Alemania',
+		'Japón',
+		'Reino Unido',
+		'Francia',
+		'Italia',
+		'España'
+	];
+
+	const estadosMexico = [
+		'Aguascalientes',
+		'Baja California',
+		'Baja California Sur',
+		'Campeche',
+		'Chiapas',
+		'Chihuahua',
+		'Ciudad de México',
+		'Coahuila',
+		'Colima',
+		'Durango',
+		'Guanajuato',
+		'Guerrero',
+		'Hidalgo',
+		'Jalisco',
+		'México',
+		'Michoacán',
+		'Morelos',
+		'Nayarit',
+		'Nuevo León',
+		'Oaxaca',
+		'Puebla',
+		'Querétaro',
+		'Quintana Roo',
+		'San Luis Potosí',
+		'Sinaloa',
+		'Sonora',
+		'Tabasco',
+		'Tamaulipas',
+		'Tlaxcala',
+		'Veracruz',
+		'Yucatán',
+		'Zacatecas'
+	];
+
+	const tiposContenedor = [
+		"1 - CONTENEDOR ESTANDAR 20' (STANDARD CONTAINER 20')",
+		'2 - CONTENEDOR ESTANDAR 40 (STANDARD CONTAINER)',
+		"3 - CONTENEDOR ESTANDAR DE CUBO ALTO 40' (HIGH CUBE ST",
+		"4 - CONTENEDOR TAPA DURA 20' (HARDTOP CONTAINER 20')",
+		"5 - CONTENEDOR TAPA DURA 40' (HARDTOP CONTAINER 40')",
+		"6 - CONTENEDOR TAPA ABIERTA 20' (OPEN TOP CONTAINER 20",
+		"7 - CONTENEDOR TAPA ABIERTA 40' (OPEN TOP CONTAINER 40",
+		"8 - FLAT 20' (FLAT 20')",
+		"9 - FLAT 40' (FLAT 40')",
+		"10 - PLATAFORMA 20' (PLATFORM 20')",
+		"11 - PLATAFORMA 40' (PLATFORM 48')",
+		"12 - CONTENEDOR VENTILADO 20' (VENTILATED CONTAINER 20'",
+		"13 - CONTENEDOR TERMICO 20' (INSULATED CONTAINER 20')",
+		"14 - CONTENEDOR TERMICO 40' (INSULATED CONTAINER 40')",
+		"15 - CONTENEDOR REFRIGERANTE 20' (REFRIGERATED CONTAINE",
+		"16 - CONTENEDOR REFRIGERANTE 40' (REFRIGERATED CONTAINE",
+		"17 - CONTENEDOR REFRIGERANTE CUBO ALTO 40' (HIGH CUBE R",
+		"18 - CONTENEDOR CARGA A GRANEL 20' (BULK CONTAINER 20')",
+		"19 - CONTENEDOR TIPO TANQUE 20' (TANK CONTAINER 20')",
+		"20 - CONTENEDOR ESTANDAR 53' (STANDARD CONTAINER 53')",
+		"21 - CONTENEDOR ESTANDAR 45' (STANDARD CONTAINER 45')",
+		"22 - CONTENEDOR ESTANDAR 48' (STANDARD CONTAINER 48')",
+		"23 - CONTENEDOR ESTANDAR 8' (STANDARD CONTAINER 8')",
+		"24 - CONTENEDOR ESTANDAR 10' (STANDARD CONTAINER 10')",
+		"25 - CONTENEDOR ESTANDAR DE CUBO ALTO 45' (HIGH CUBE ST",
+		'26 - SEMIRREMOLQUE CON PACKS PARA ENVASIOS DE BEBIDAS.',
+		'27 - SEMIRREMOLQUE CUELLO DE GANZO.',
+		'28 - SEMIRREMOLQUE CUELLO MUERTO.',
+		'29 - SEMIRREMOLQUE TOLVA (ABIETTU)',
+		'30 - AUTO TOLVA CUBIERTA (DE CARGA NEUMATICA',
+		'31 - SEMIRREMOLQUE CHASIS',
+		'32 - SEMIRREMOLQUE AUTOBAJABLE (CON SISTEMA DE ELEVACI',
+		'33 - CON TEMPERATURA CONTROLADA.',
+		'34 - SEMIRREMOLQUE DE CORTO TRAMO',
+		'35 - SEMIRREMOLQUE DE CAMA BAJA.',
+		"36 - PLATAFORMA DE 28'.",
+		"37 - PLATAFORMA DE 45'.",
+		"38 - PLATAFORMA DE 48'.",
+		'39 - SEMIRREMOLQUE PARA TRANSPORTE DE CABALLOS.',
+		'40 - SEMIRREMOLQUE PARA TRANSPORTE DE GANADO.',
+		'41 - SEMIRREMOLQUE TANQUE (LIQUIDOS) / SIN CALEFACCION',
+		'42 - SEMIRREMOLQUE TANQUE (LIQUIDOS) / CON CALEFACCION /',
+		'43 - SEMIRREMOLQUE TANQUE (LIQUIDOS) / SIN CALEFACCION',
+		'44 - SEMIRREMOLQUE TANQUE (LIQUIDOS) / CON CALEFACCION',
+		'45 - SEMIRREMOLQUE TANQUE (GAS) / SIN CALEFACCION / SIN',
+		'46 - SEMIRREMOLQUE TANQUE (GAS) / CON CALEFACCION / SIN',
+		'47 - SEMIRREMOLQUE TANQUE (GAS) / SIN CALEFACCION / A/S',
+		'48 - SEMIRREMOLQUE TANQUE (GAS) / CON CALEFACCION / A/S',
+		'49 - SEMIRREMOLQUE TANQUE (QUIMICOS) / SIN CALEFACCION',
+		'50 - SEMIRREMOLQUE TANQUE (QUIMICOS) / CON CALEFACCION',
+		'51 - SEMIRREMOLQUE TANQUE (QUIMICOS) / SIN CALEFACCION',
+		'52 - SEMIRREMOLQUE TANQUE (QUIMICOS) / CON CALEFACCION',
+		'53 - SEMIRREMOLQUE GONDOLA-CERRADA.',
+		'54 - SEMIRREMOLQUE GONDOLA-ABIERTA.',
+		'55 - SEMIRREMOLQUE TIPO CAJA CERRADA 48\'.',
+		'56 - SEMIRREMOLQUE TIPO CAJA CERRADA 53\'.',
+		'57 - SEMIRREMOLQUE TIPO CAJA REFRIGERADA 48\'.',
+		'58 - SEMIRREMOLQUE TIPO CAJA REFRIGERADA 53\'.',
+		'59 - DOBLE SEMIRREMOLQUE.',
+		'60 - OTROS.',
+		"61 - TANQUE 20'",
+		"62 - TANQUE 40'",
+		'63 - CARRO DE FERROCARRIL',
+		"64 - HIGH CUBE DE 20'",
+		'65 - AUTOMOVIL',
+		'66 - CAMION UNITARIO DE DOS EJES',
+		'67 - CAMION UNITARIO DE TRES EJES',
+		'68 - VEHICULOS CON CAPACIDAD DE CARGA DE HASTA 3.5. TON',
+		'69 - TRACTOCAMION'
+	];
+
+	// Funciones para Transportes
+	function openNewTransporte() {
+		editingTransporteIndex = null;
+		currentTransporte = {
+			transportista: '',
+			rfc: '',
+			curp: '',
+			nombre: '',
+			domicilio: '',
+			ciudad: '',
+			estado: '',
+			pais: '',
+			identificacion_fiscal: '',
+			total_bultos: 0,
+			identificacion: ''
+		};
+		isTransporteDialogOpen = true;
+	}
+
+	function openTransportesPrecintosDialog() {
+		isTransportesPrecintosDialogOpen = true;
+	}
+
+	// Funciones para Guías
+	function openNewGuia() {
+		editingGuiaIndex = null;
+		currentGuia = {
+			guia: '',
+			identificador: ''
+		};
+		isGuiasDialogOpen = true;
+	}
+
+	function openEditGuia(index: number) {
+		if (!formData?.guias) return;
+		editingGuiaIndex = index;
+		currentGuia = { ...formData.guias[index] };
+		isGuiasDialogOpen = true;
+	}
+
+	function saveGuia() {
+		if (!formData?.guias) return;
+		if (editingGuiaIndex !== null) {
+			formData.guias[editingGuiaIndex] = { ...currentGuia };
+		} else {
+			formData.guias = [...formData.guias, { ...currentGuia }];
+		}
+		isGuiasDialogOpen = false;
+	}
+
+	function deleteGuia(index: number) {
+		if (!formData?.guias) return;
+		if (confirm('¿Está seguro de eliminar esta guía?')) {
+			formData.guias = formData.guias.filter((_, i) => i !== index);
+		}
+	}
+
+	function openEditTransporte(index: number) {
+		if (!formData?.transportes) return;
+		editingTransporteIndex = index;
+		currentTransporte = { ...formData.transportes[index] };
+		isTransporteDialogOpen = true;
+	}
+
+	function saveTransporte() {
+		if (!formData?.transportes) return;
+		if (editingTransporteIndex !== null) {
+			formData.transportes[editingTransporteIndex] = { ...currentTransporte };
+		} else {
+			formData.transportes = [...formData.transportes, { ...currentTransporte }];
+		}
+		isTransporteDialogOpen = false;
+	}
+
+	function deleteTransporte(index: number) {
+		if (!formData?.transportes) return;
+		if (confirm('¿Está seguro de eliminar este transporte?')) {
+			formData.transportes = formData.transportes.filter((_, i) => i !== index);
+		}
+	}
+
+	// Funciones para Precintos
+	function openNewPrecinto() {
+		editingPrecintoIndex = null;
+		currentPrecinto = {
+			numero: '',
+			identificacion: ''
+		};
+		isPrecintoDialogOpen = true;
+	}
+
+	function openEditPrecinto(index: number) {
+		if (!formData?.precintos) return;
+		editingPrecintoIndex = index;
+		currentPrecinto = { ...formData.precintos[index] };
+		isPrecintoDialogOpen = true;
+	}
+
+	function savePrecinto() {
+		if (!formData?.precintos) return;
+		if (editingPrecintoIndex !== null) {
+			formData.precintos[editingPrecintoIndex] = { ...currentPrecinto };
+		} else {
+			formData.precintos = [...formData.precintos, { ...currentPrecinto }];
+		}
+		isPrecintoDialogOpen = false;
+	}
+
+	function deletePrecinto(index: number) {
+		if (!formData?.precintos) return;
+		if (confirm('¿Está seguro de eliminar este precinto?')) {
+			formData.precintos = formData.precintos.filter((_, i) => i !== index);
+		}
+	}
+
+	// Funciones para Contenedores
+	function openNewContenedor() {
+		editingContenedorIndex = null;
+		currentContenedor = {
+			numero: '',
+			identificacion: '',
+			tipo: ''
+		};
+		isContenedorDialogOpen = true;
+	}
+
+	function openEditContenedor(index: number) {
+		if (!formData?.contenedores) return;
+		editingContenedorIndex = index;
+		currentContenedor = { ...formData.contenedores[index] };
+		isContenedorDialogOpen = true;
+	}
+
+	function saveContenedor() {
+		if (!formData?.contenedores) return;
+		if (editingContenedorIndex !== null) {
+			formData.contenedores[editingContenedorIndex] = { ...currentContenedor };
+		} else {
+			formData.contenedores = [...formData.contenedores, { ...currentContenedor }];
+		}
+		isContenedorDialogOpen = false;
+	}
+
+	function deleteContenedor(index: number) {
+		if (!formData?.contenedores) return;
+		if (confirm('¿Está seguro de eliminar este contenedor?')) {
+			formData.contenedores = formData.contenedores.filter((_, i) => i !== index);
+		}
+	}
+
+	function copiarATransporte() {
+		if (!formData?.contenedores || formData.contenedores.length === 0) {
+			alert('No hay contenedores para copiar');
+			return;
+		}
+		alert('Copiar a Transporte no implementado aún');
+	}
+
+	function importarContenedores() {
+		// Disparar el input file oculto
+		const fileInput = document.getElementById('importar-contenedores-file') as HTMLInputElement;
+		if (fileInput) {
+			fileInput.click();
+		}
+	}
+
+	function handleFileImport(event: Event) {
+		const input = event.target as HTMLInputElement;
+		const file = input.files?.[0];
+		if (!file) return;
+
+		// Aquí iría la lógica para procesar el archivo
+		// Por ahora solo mostramos el nombre del archivo seleccionado
+		alert(`Archivo seleccionado: ${file.name}\n\nProcesamiento de archivo pendiente de implementación`);
+		
+		// Limpiar el input para permitir seleccionar el mismo archivo de nuevo
+		input.value = '';
+	}
+</script>
+
+<!-- Input file oculto para importar contenedores -->
+<input
+	id="importar-contenedores-file"
+	type="file"
+	accept=".csv,.xlsx,.xls,.txt"
+	class="hidden"
+	onchange={handleFileImport}
+/>
+
+<div class="space-y-4">
+	<!-- Sección de Bultos y Transportes principales -->
+	<div class="grid grid-cols-2 gap-4">
+		<!-- Bultos -->
+		<Card>
+			<CardHeader class="pb-3">
+				<CardTitle class="text-base">Bultos</CardTitle>
+			</CardHeader>
+			<CardContent class="space-y-3">
+				<div class="space-y-2">
+					<Label for="cantidad">Cantidad</Label>
+					<Input
+						id="cantidad"
+						type="number"
+						bind:value={formData.bultos.cantidad}
+						placeholder="0"
+					/>
+				</div>
+				<div class="space-y-2">
+					<Label for="marcas">Marcas</Label>
+					<Input id="marcas" bind:value={formData.bultos.marcas} placeholder="S/M" />
+				</div>
+				<div class="space-y-2">
+					<Label for="numero">Número</Label>
+					<Input id="numero" bind:value={formData.bultos.numero} placeholder="S/N" />
+				</div>
+				<div class="space-y-2">
+					<Label for="vehiculos">Vehículos</Label>
+					<Input
+						id="vehiculos"
+						type="number"
+						bind:value={formData.bultos.vehiculos}
+						placeholder="1"
+					/>
+				</div>
+			</CardContent>
+		</Card>
+
+		<!-- Transportes -->
+		<Card>
+			<CardHeader class="pb-3">
+				<CardTitle class="text-base">Transportes</CardTitle>
+			</CardHeader>
+			<CardContent>
+				<div class="border rounded-lg overflow-hidden">
+					<Table>
+						<TableHeader>
+							<TableRow>
+								<TableHead>Identificación</TableHead>
+								<TableHead>País</TableHead>
+								<TableHead class="w-[100px]">Acciones</TableHead>
+							</TableRow>
+						</TableHeader>
+						<TableBody>
+							{#if !formData?.transportes || formData.transportes.length === 0}
+								<TableRow>
+									<TableCell colspan={3} class="text-center text-muted-foreground py-4">
+										No hay transportes registrados
+									</TableCell>
+								</TableRow>
+							{:else}
+								{#each formData.transportes as transporte, index}
+									<TableRow>
+										<TableCell>{transporte.identificacion}</TableCell>
+										<TableCell>{transporte.pais}</TableCell>
+										<TableCell>
+											<div class="flex gap-1">
+												<Button size="sm" variant="ghost" onclick={() => openEditTransporte(index)}>
+													<Pencil size={14} />
+												</Button>
+												<Button size="sm" variant="ghost" onclick={() => deleteTransporte(index)}>
+													<Trash2 size={14} />
+												</Button>
+											</div>
+										</TableCell>
+									</TableRow>
+								{/each}
+							{/if}
+						</TableBody>
+					</Table>
+				</div>
+				<div class="flex gap-2 mt-3">
+					<Button size="sm" onclick={openNewTransporte}>
+						<Plus class="mr-1.5" size={14} />
+						Nuevo
+					</Button>
+					<Button
+						size="sm"
+						variant="outline"
+						disabled={formData?.transportes?.length === 0}
+						onclick={() => {
+							const index = 0;
+							if (formData?.transportes?.[index]) openEditTransporte(index);
+						}}
+					>
+						<Pencil class="mr-1.5" size={14} />
+						Editar
+					</Button>
+					<Button
+						size="sm"
+						variant="destructive"
+						disabled={formData?.transportes?.length === 0}
+						onclick={() => {
+							const index = 0;
+							if (formData?.transportes?.[index]) deleteTransporte(index);
+						}}
+					>
+						<Trash2 class="mr-1.5" size={14} />
+						Borrar
+					</Button>
+				<Button size="sm" variant="outline" onclick={openTransportesPrecintosDialog}>
+						<FileText class="mr-1.5" size={14} />
+						Transportes, Precintos
+					</Button>
+				</div>
+			</CardContent>
+		</Card>
+	</div>
+
+	<!-- Sección de Guías -->
+	<Card>
+		<CardHeader class="pb-3">
+			<CardTitle class="text-base">Guías</CardTitle>
+		</CardHeader>
+		<CardContent>
+			<div class="border rounded-lg overflow-hidden">
+				<Table>
+					<TableHeader>
+						<TableRow>
+							<TableHead>Guía</TableHead>
+							<TableHead>Identificador</TableHead>
+							<TableHead class="w-[100px]">Acciones</TableHead>
+						</TableRow>
+					</TableHeader>
+					<TableBody>
+						{#if !formData?.guias || formData.guias.length === 0}
+							<TableRow>
+								<TableCell colspan={3} class="text-center text-muted-foreground py-4">
+									No hay guías registradas
+								</TableCell>
+							</TableRow>
+						{:else}
+							{#each formData.guias as guia, index}
+								<TableRow>
+									<TableCell>{guia.guia}</TableCell>
+									<TableCell>{guia.identificador}</TableCell>
+									<TableCell>
+										<div class="flex gap-1">
+											<Button size="sm" variant="ghost" onclick={() => openEditGuia(index)}>
+												<Pencil size={14} />
+											</Button>
+											<Button size="sm" variant="ghost" onclick={() => deleteGuia(index)}>
+												<Trash2 size={14} />
+											</Button>
+										</div>
+									</TableCell>
+								</TableRow>
+							{/each}
+						{/if}
+					</TableBody>
+				</Table>
+			</div>
+			<div class="flex gap-2 mt-3">
+				<Button size="sm" onclick={openNewGuia}>
+					<Plus class="mr-1.5" size={14} />
+					Nuevo
+				</Button>
+				<Button
+					size="sm"
+					variant="outline"
+					disabled={formData?.guias?.length === 0}
+					onclick={() => {
+						const index = 0;
+						if (formData?.guias?.[index]) openEditGuia(index);
+					}}
+				>
+					<Pencil class="mr-1.5" size={14} />
+					Editar
+				</Button>
+				<Button
+					size="sm"
+					variant="destructive"
+					disabled={formData?.guias?.length === 0}
+					onclick={() => {
+						const index = 0;
+						if (formData?.guias?.[index]) deleteGuia(index);
+					}}
+				>
+					<Trash2 class="mr-1.5" size={14} />
+					Borrar
+				</Button>
+			</div>
+		</CardContent>
+	</Card>
+
+	<!-- Sección de Precintos y Contenedores -->
+	<div class="grid grid-cols-2 gap-4">
+		<!-- Transportes, Precintos -->
+		<Card>
+			<CardHeader class="pb-3">
+				<CardTitle class="text-base">Transportes, Precintos</CardTitle>
+			</CardHeader>
+			<CardContent>
+				<div class="border rounded-lg overflow-hidden">
+					<Table>
+						<TableHeader>
+							<TableRow>
+								<TableHead>Número</TableHead>
+								<TableHead>Identificación</TableHead>
+								<TableHead class="w-[100px]">Acciones</TableHead>
+							</TableRow>
+						</TableHeader>
+						<TableBody>
+							{#if !formData?.precintos || formData.precintos.length === 0}
+								<TableRow>
+									<TableCell colspan={3} class="text-center text-muted-foreground py-4">
+										No hay precintos registrados
+									</TableCell>
+								</TableRow>
+							{:else}
+								{#each formData.precintos as precinto, index}
+									<TableRow>
+										<TableCell>{precinto.numero}</TableCell>
+										<TableCell>{precinto.identificacion}</TableCell>
+										<TableCell>
+											<div class="flex gap-1">
+												<Button size="sm" variant="ghost" onclick={() => openEditPrecinto(index)}>
+													<Pencil size={14} />
+												</Button>
+												<Button size="sm" variant="ghost" onclick={() => deletePrecinto(index)}>
+													<Trash2 size={14} />
+												</Button>
+											</div>
+										</TableCell>
+									</TableRow>
+								{/each}
+							{/if}
+						</TableBody>
+					</Table>
+				</div>
+				<div class="flex gap-2 mt-3">
+					<Button size="sm" onclick={openNewPrecinto}>
+						<Plus class="mr-1.5" size={14} />
+						Nuevo
+					</Button>
+					<Button
+						size="sm"
+						variant="outline"
+						disabled={formData?.precintos?.length === 0}
+						onclick={() => {
+							const index = 0;
+							if (formData?.precintos?.[index]) openEditPrecinto(index);
+						}}
+					>
+						<Pencil class="mr-1.5" size={14} />
+						Editar
+					</Button>
+					<Button
+						size="sm"
+						variant="destructive"
+						disabled={formData?.precintos?.length === 0}
+						onclick={() => {
+							const index = 0;
+							if (formData?.precintos?.[index]) deletePrecinto(index);
+						}}
+					>
+						<Trash2 class="mr-1.5" size={14} />
+						Borrar
+					</Button>
+				</div>
+			</CardContent>
+		</Card>
+
+		<!-- Contenedores -->
+		<Card>
+			<CardHeader class="pb-3">
+				<CardTitle class="text-base">Contenedores</CardTitle>
+			</CardHeader>
+			<CardContent>
+				<div class="border rounded-lg overflow-hidden">
+					<Table>
+						<TableHeader>
+							<TableRow>
+								<TableHead>Número</TableHead>
+								<TableHead>Identificación</TableHead>
+								<TableHead>Tipo</TableHead>
+								<TableHead class="w-[100px]">Acciones</TableHead>
+							</TableRow>
+						</TableHeader>
+						<TableBody>
+							{#if !formData?.contenedores || formData.contenedores.length === 0}
+								<TableRow>
+									<TableCell colspan={4} class="text-center text-muted-foreground py-4">
+										No hay contenedores registrados
+									</TableCell>
+								</TableRow>
+							{:else}
+								{#each formData.contenedores as contenedor, index}
+									<TableRow>
+										<TableCell>{contenedor.numero}</TableCell>
+										<TableCell>{contenedor.identificacion}</TableCell>
+										<TableCell>{contenedor.tipo}</TableCell>
+										<TableCell>
+											<div class="flex gap-1">
+												<Button size="sm" variant="ghost" onclick={() => openEditContenedor(index)}>
+													<Pencil size={14} />
+												</Button>
+												<Button size="sm" variant="ghost" onclick={() => deleteContenedor(index)}>
+													<Trash2 size={14} />
+												</Button>
+											</div>
+										</TableCell>
+									</TableRow>
+								{/each}
+							{/if}
+						</TableBody>
+					</Table>
+				</div>
+				<div class="flex gap-2 mt-3">
+					<Button size="sm" onclick={openNewContenedor}>
+						<Plus class="mr-1.5" size={14} />
+						Nuevo
+					</Button>
+					<Button
+						size="sm"
+						variant="outline"
+						disabled={formData?.contenedores?.length === 0}
+						onclick={() => {
+							const index = 0;
+							if (formData?.contenedores?.[index]) openEditContenedor(index);
+						}}
+					>
+						<Pencil class="mr-1.5" size={14} />
+						Editar
+					</Button>
+					<Button
+						size="sm"
+						variant="destructive"
+						disabled={formData?.contenedores?.length === 0}
+						onclick={() => {
+							const index = 0;
+							if (formData?.contenedores?.[index]) deleteContenedor(index);
+						}}
+					>
+						<Trash2 class="mr-1.5" size={14} />
+						Borrar
+					</Button>
+					<Button size="sm" variant="outline" onclick={copiarATransporte}>
+						<Copy class="mr-1.5" size={14} />
+						Copiar a Transp.
+					</Button>
+					<Button size="sm" variant="outline" onclick={importarContenedores}>
+						<Upload class="mr-1.5" size={14} />
+						Importar
+					</Button>
+				</div>
+			</CardContent>
+		</Card>
+	</div>
+</div>
+
+<!-- Dialog para Transportes -->
+<Dialog bind:open={isTransporteDialogOpen}>
+	<DialogContent class="max-w-3xl">
+		<DialogHeader>
+			<DialogTitle>Transportes del Pedimento</DialogTitle>
+		</DialogHeader>
+
+		<div class="grid gap-4 py-4">
+			<div class="space-y-2">
+				<Label for="t_transportista">Transportista:</Label>
+				<Input
+					id="t_transportista"
+					bind:value={currentTransporte.transportista}
+					placeholder="Transportista"
+				/>
+			</div>
+
+			<div class="grid grid-cols-2 gap-4">
+				<div class="space-y-2">
+					<Label for="t_rfc">RFC:</Label>
+					<Input id="t_rfc" bind:value={currentTransporte.rfc} placeholder="RFC" />
+				</div>
+				<div class="space-y-2">
+					<Label for="t_curp">CURP:</Label>
+					<Input id="t_curp" bind:value={currentTransporte.curp} placeholder="CURP" />
+				</div>
+			</div>
+
+			<div class="space-y-2">
+				<Label for="t_nombre">Nombre:</Label>
+				<Input id="t_nombre" bind:value={currentTransporte.nombre} placeholder="Nombre" />
+			</div>
+
+			<div class="space-y-2">
+				<Label for="t_domicilio">Domicilio:</Label>
+				<Input
+					id="t_domicilio"
+					bind:value={currentTransporte.domicilio}
+					placeholder="Domicilio"
+				/>
+			</div>
+
+			<div class="grid grid-cols-2 gap-4">
+				<div class="space-y-2">
+					<Label for="t_ciudad">Ciudad:</Label>
+					<Input id="t_ciudad" bind:value={currentTransporte.ciudad} placeholder="Ciudad" />
+				</div>
+				<div class="space-y-2">
+					<Label for="t_estado">Estado:</Label>
+					<Select.Root
+						type="single"
+						value={currentTransporte.estado}
+						onValueChange={(v: string | undefined) => v && (currentTransporte.estado = v)}
+					>
+						<Select.Trigger id="t_estado" class="w-full">
+							<span class="truncate">{currentTransporte.estado || 'Seleccionar estado'}</span>
+						</Select.Trigger>
+						<Select.Content>
+							{#each estadosMexico as estado}
+								<Select.Item value={estado}>{estado}</Select.Item>
+							{/each}
+						</Select.Content>
+					</Select.Root>
+				</div>
+			</div>
+
+			<div class="space-y-2">
+				<Label for="t_pais">País:</Label>
+				<div class="flex gap-2">
+					<Input id="t_pais" bind:value={currentTransporte.pais} placeholder="País" class="flex-1" />
+					<Button size="icon" variant="outline" onclick={() => alert('País en común')}>
+						<FileText size={16} />
+					</Button>
+				</div>
+			</div>
+
+			<div class="grid grid-cols-2 gap-4">
+				<div class="space-y-2">
+					<Label for="t_identificacion_fiscal">Identificación Fiscal:</Label>
+					<Input
+						id="t_identificacion_fiscal"
+						bind:value={currentTransporte.identificacion_fiscal}
+						placeholder="Identificación Fiscal"
+					/>
+				</div>
+				<div class="space-y-2">
+					<Label for="t_total_bultos">Total de bultos:</Label>
+					<Input
+						id="t_total_bultos"
+						type="number"
+						bind:value={currentTransporte.total_bultos}
+						placeholder="0"
+					/>
+				</div>
+			</div>
+		</div>
+
+		<DialogFooter>
+			<Button variant="outline" onclick={() => (isTransporteDialogOpen = false)}>Cancelar</Button>
+			<Button onclick={saveTransporte}>Aceptar</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
+
+<!-- Dialog para Precintos -->
+<Dialog bind:open={isPrecintoDialogOpen}>
+	<DialogContent class="max-w-lg">
+		<DialogHeader>
+			<DialogTitle>
+				{editingPrecintoIndex !== null ? 'Editar Precinto' : 'Nuevo Precinto'}
+			</DialogTitle>
+		</DialogHeader>
+
+		<div class="grid gap-4 py-4">
+			<div class="space-y-2">
+				<Label for="p_numero">Número *</Label>
+				<Input id="p_numero" bind:value={currentPrecinto.numero} placeholder="Número de precinto" />
+			</div>
+
+			<div class="space-y-2">
+				<Label for="p_identificacion">Identificación *</Label>
+				<Input
+					id="p_identificacion"
+					bind:value={currentPrecinto.identificacion}
+					placeholder="Identificación"
+				/>
+			</div>
+		</div>
+
+		<DialogFooter>
+			<Button variant="outline" onclick={() => (isPrecintoDialogOpen = false)}>Cancelar</Button>
+			<Button
+				onclick={savePrecinto}
+				disabled={!currentPrecinto.numero || !currentPrecinto.identificacion}
+			>
+				{editingPrecintoIndex !== null ? 'Actualizar' : 'Guardar'}
+			</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
+
+<!-- Dialog para Contenedores -->
+<Dialog bind:open={isContenedorDialogOpen}>
+	<DialogContent class="max-w-lg">
+		<DialogHeader>
+			<DialogTitle>
+				{editingContenedorIndex !== null ? 'Editar Contenedor' : 'Nuevo Contenedor'}
+			</DialogTitle>
+		</DialogHeader>
+
+		<div class="grid gap-4 py-4">
+			<div class="space-y-2">
+				<Label for="c_numero">Número *</Label>
+				<Input
+					id="c_numero"
+					bind:value={currentContenedor.numero}
+					placeholder="Número de contenedor"
+				/>
+			</div>
+
+			<div class="space-y-2">
+				<Label for="c_tipo">Tipo *</Label>
+				<Select.Root
+					type="single"
+					value={currentContenedor.tipo}
+					onValueChange={(v: string | undefined) => v && (currentContenedor.tipo = v)}
+				>
+					<Select.Trigger id="c_tipo">
+						{currentContenedor.tipo || 'Seleccionar tipo'}
+					</Select.Trigger>
+					<Select.Content>
+						{#each tiposContenedor as tipo}
+							<Select.Item value={tipo}>{tipo}</Select.Item>
+						{/each}
+					</Select.Content>
+				</Select.Root>
+			</div>
+		</div>
+
+		<DialogFooter>
+			<Button variant="outline" onclick={() => (isContenedorDialogOpen = false)}>Cancelar</Button>
+			<Button
+				onclick={saveContenedor}
+				disabled={!currentContenedor.numero ||
+					!currentContenedor.tipo}
+			>
+				{editingContenedorIndex !== null ? 'Actualizar' : 'Guardar'}
+			</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
+
+<!-- Diálogo de Transportes y Precintos separados por comas -->
+<Dialog open={isTransportesPrecintosDialogOpen} onOpenChange={(open) => (isTransportesPrecintosDialogOpen = open)}>
+	<DialogContent class="max-w-2xl">
+		<DialogHeader>
+			<DialogTitle>Transportes y Precintos</DialogTitle>
+		</DialogHeader>
+		<div class="space-y-6">
+			<!-- Listado de transportes -->
+			<div class="border rounded-lg p-4 bg-muted/30">
+				<h3 class="text-sm font-semibold mb-3">Listado de transportes separados por comas</h3>
+				<div class="space-y-3">
+					<div class="flex items-center gap-2">
+						<Label for="pais-transportes" class="w-12">País:</Label>
+						<Input
+							id="pais-transportes"
+							bind:value={transportesPrecintosData.pais}
+							class="flex-1"
+						/>
+						<button
+							class="text-xs text-blue-600 hover:underline whitespace-nowrap"
+							onclick={() => alert('País en común para todos los transportes')}
+						>
+							[ País en común para todos los transportes ]
+						</button>
+					</div>
+					<div class="space-y-1">
+						<Label for="lista-transportes">Lista:</Label>
+						<textarea
+							id="lista-transportes"
+							bind:value={transportesPrecintosData.lista_transportes}
+							class="w-full min-h-[120px] rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 resize-y"
+							placeholder="Ingrese los transportes separados por comas"
+						></textarea>
+					</div>
+				</div>
+			</div>
+
+			<!-- Listado de precintos -->
+			<div class="border rounded-lg p-4 bg-muted/30">
+				<h3 class="text-sm font-semibold mb-3">Listado de precintos separados por comas</h3>
+				<div class="space-y-1">
+					<Label for="lista-precintos">Lista:</Label>
+					<textarea
+						id="lista-precintos"
+						bind:value={transportesPrecintosData.lista_precintos}
+						class="w-full min-h-[120px] rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 resize-y"
+						placeholder="Ingrese los precintos separados por comas"
+					></textarea>
+				</div>
+			</div>
+		</div>
+		<DialogFooter class="flex justify-end gap-2 mt-6">
+			<Button
+				variant="outline"
+				onclick={() => {
+					isTransportesPrecintosDialogOpen = false;
+				}}
+			>
+				Cancelar
+			</Button>
+			<Button
+				onclick={() => {
+					// Aquí iría la lógica para procesar las listas y crear transportes/precintos
+					isTransportesPrecintosDialogOpen = false;
+				}}
+			>
+				Aceptar
+			</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
+
+<!-- Diálogo de Guías de Pedimento -->
+<Dialog open={isGuiasDialogOpen} onOpenChange={(open) => (isGuiasDialogOpen = open)}>
+	<DialogContent class="max-w-md">
+		<DialogHeader>
+			<DialogTitle>Guías de Pedimento</DialogTitle>
+		</DialogHeader>
+		<div class="space-y-4">
+			<div class="space-y-2">
+				<Label for="guia">Guía:</Label>
+				<Input
+					id="guia"
+					bind:value={currentGuia.guia}
+					placeholder="Ingrese guía"
+				/>
+			</div>
+
+			<div class="space-y-2">
+				<Label for="identificador">Identificador:</Label>
+				<Select.Root
+					type="single"
+					value={currentGuia.identificador}
+					onValueChange={(v: string | undefined) => v && (currentGuia.identificador = v)}
+				>
+					<Select.Trigger id="identificador">
+						<span class="truncate">{currentGuia.identificador || 'Seleccionar identificador'}</span>
+					</Select.Trigger>
+					<Select.Content>
+						<Select.Item value="Maestra">Maestra</Select.Item>
+					</Select.Content>
+				</Select.Root>
+			</div>
+		</div>
+
+		<DialogFooter class="flex justify-end gap-2 mt-6">
+			<Button variant="outline" onclick={() => (isGuiasDialogOpen = false)}>Cancelar</Button>
+			<Button onclick={saveGuia}>Aceptar</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
diff --git a/frontend/src/lib/components/dashboard/pedimentos/edit/contribuciones-tab-form.svelte b/frontend/src/lib/components/dashboard/pedimentos/edit/contribuciones-tab-form.svelte
new file mode 100644
index 00000000..4b4b3827
--- /dev/null
+++ b/frontend/src/lib/components/dashboard/pedimentos/edit/contribuciones-tab-form.svelte
@@ -0,0 +1,547 @@
+<script lang="ts">
+	import { Card, CardContent } from '$lib/components/ui/card';
+	import { Button } from '$lib/components/ui/button';
+	import { Input } from '$lib/components/ui/input';
+	import { Label } from '$lib/components/ui/label';
+	import {
+		Table,
+		TableBody,
+		TableCell,
+		TableHead,
+		TableHeader,
+		TableRow
+	} from '$lib/components/ui/table';
+	import {
+		Dialog,
+		DialogContent,
+		DialogHeader,
+		DialogTitle,
+		DialogFooter
+	} from '$lib/components/ui/dialog';
+	import Checkbox from '$lib/components/ui/checkbox/checkbox.svelte';
+	import {
+		Plus,
+		Pencil,
+		Trash2
+	} from 'lucide-svelte';
+
+	interface Contribucion {
+		id?: number;
+		contribucion: string;
+		tipo_tasa: string;
+		tasa: number;
+		forma_pago: string;
+		importe: number;
+		gravamen: string;
+		abreviacion: string;
+		forma_pago_2: string;
+		importe_2: number;
+	}
+
+	let {
+		formData = $bindable({
+			// Campos por pestaña
+			dta: {
+				forma_pago_recargo: 0,
+				tasa_recargo: 0.0,
+				importe_recargo: 0
+			},
+			prev: {
+				forma_pago_prevalidacion: 0
+			},
+			eci: {
+				forma_pago_eci: 0,
+				importe_eci: 0
+			},
+			mult: {
+				forma_pago_multa: 0,
+				importe_multa: 0
+			},
+			rec: {
+				forma_pago_uia: 0,
+				importe_compensar: 0
+			},
+			// Configuración
+			calculo_manual: false,
+			operaciones_regla_31_40: false,
+			// Contribuciones (tabla compartida)
+			contribuciones: [] as Contribucion[]
+		})
+	}: {
+		formData: {
+			dta: {
+				forma_pago_recargo: number;
+				tasa_recargo: number;
+				importe_recargo: number;
+			};
+			prev: {
+				forma_pago_prevalidacion: number;
+			};
+			eci: {
+				forma_pago_eci: number;
+				importe_eci: number;
+			};
+			mult: {
+				forma_pago_multa: number;
+				importe_multa: number;
+			};
+			rec: {
+				forma_pago_uia: number;
+				importe_compensar: number;
+			};
+			calculo_manual: boolean;
+			operaciones_regla_31_40: boolean;
+			contribuciones: Contribucion[];
+		};
+	} = $props();
+
+	// Pestaña activa
+	let activeTab = $state('DTA');
+
+	// Estados para diálogo
+	let isDialogOpen = $state(false);
+	let editingIndex = $state<number | null>(null);
+
+	let currentContribucion = $state<Contribucion>({
+		contribucion: '',
+		tipo_tasa: '',
+		tasa: 0,
+		forma_pago: '',
+		importe: 0,
+		gravamen: '',
+		abreviacion: '',
+		forma_pago_2: '',
+		importe_2: 0
+	});
+
+	function openNewContribucion() {
+		editingIndex = null;
+		currentContribucion = {
+			contribucion: '',
+			tipo_tasa: '',
+			tasa: 0,
+			forma_pago: '',
+			importe: 0,
+			gravamen: '',
+			abreviacion: '',
+			forma_pago_2: '',
+			importe_2: 0
+		};
+		isDialogOpen = true;
+	}
+
+	function openEditContribucion(index: number) {
+		if (!formData?.contribuciones) return;
+		editingIndex = index;
+		currentContribucion = { ...formData.contribuciones[index] };
+		isDialogOpen = true;
+	}
+
+	function saveContribucion() {
+		if (!formData?.contribuciones) return;
+		if (editingIndex !== null) {
+			formData.contribuciones[editingIndex] = { ...currentContribucion };
+		} else {
+			formData.contribuciones = [...formData.contribuciones, { ...currentContribucion }];
+		}
+		isDialogOpen = false;
+	}
+
+	function deleteContribucion(index: number) {
+		if (!formData?.contribuciones) return;
+		if (confirm('¿Está seguro de eliminar esta contribución?')) {
+			formData.contribuciones = formData.contribuciones.filter((_, i) => i !== index);
+		}
+	}
+</script>
+
+<Card>
+	<CardContent class="p-6 space-y-4">
+		<!-- Pestañas de navegación -->
+		<div class="flex gap-1 border-b">
+			<button
+				class="px-4 py-2 text-sm font-medium border-b-2 transition-colors {activeTab === 'DTA'
+					? 'border-primary text-primary'
+					: 'border-transparent text-muted-foreground hover:text-foreground'}"
+				onclick={() => (activeTab = 'DTA')}
+			>
+				DTA
+			</button>
+			<button
+				class="px-4 py-2 text-sm font-medium border-b-2 transition-colors {activeTab === 'PREV'
+					? 'border-primary text-primary'
+					: 'border-transparent text-muted-foreground hover:text-foreground'}"
+				onclick={() => (activeTab = 'PREV')}
+			>
+				PREV
+			</button>
+			<button
+				class="px-4 py-2 text-sm font-medium border-b-2 transition-colors {activeTab === 'ECI'
+					? 'border-primary text-primary'
+					: 'border-transparent text-muted-foreground hover:text-foreground'}"
+				onclick={() => (activeTab = 'ECI')}
+			>
+				ECI
+			</button>
+			<button
+				class="px-4 py-2 text-sm font-medium border-b-2 transition-colors {activeTab === 'MULT'
+					? 'border-primary text-primary'
+					: 'border-transparent text-muted-foreground hover:text-foreground'}"
+				onclick={() => (activeTab = 'MULT')}
+			>
+				MULT
+			</button>
+			<button
+				class="px-4 py-2 text-sm font-medium border-b-2 transition-colors {activeTab === 'REC'
+					? 'border-primary text-primary'
+					: 'border-transparent text-muted-foreground hover:text-foreground'}"
+				onclick={() => (activeTab = 'REC')}
+			>
+				REC
+			</button>
+		</div>
+
+		<!-- Contenido dinámico según pestaña -->
+		<div class="border rounded-lg p-4 bg-muted/30">
+			{#if activeTab === 'DTA'}
+				<div class="grid grid-cols-3 gap-4">
+					<div class="space-y-2">
+						<Label for="forma_pago_recargo">Forma de pago Recargo:</Label>
+						<Input
+							id="forma_pago_recargo"
+							type="number"
+							bind:value={formData.dta.forma_pago_recargo}
+							placeholder="0"
+						/>
+					</div>
+					<div class="space-y-2">
+						<Label for="tasa_recargo">Tasa Recargo:</Label>
+						<Input
+							id="tasa_recargo"
+							type="number"
+							step="0.00001"
+							bind:value={formData.dta.tasa_recargo}
+							placeholder="0.00000"
+						/>
+						<p class="text-xs text-muted-foreground">(dejar en cero para calcular automático)</p>
+					</div>
+					<div class="space-y-2">
+						<Label for="importe_recargo">Importe Recargo:</Label>
+						<Input
+							id="importe_recargo"
+							type="number"
+							bind:value={formData.dta.importe_recargo}
+							placeholder="0"
+						/>
+						<p class="text-xs text-muted-foreground">(dejar en cero para calcular automático)</p>
+					</div>
+				</div>
+			{:else if activeTab === 'PREV'}
+				<div class="grid grid-cols-1 gap-4 max-w-md">
+					<div class="space-y-2">
+						<Label for="forma_pago_prevalidacion">Forma de pago Prevalidación:</Label>
+						<Input
+							id="forma_pago_prevalidacion"
+							type="number"
+							bind:value={formData.prev.forma_pago_prevalidacion}
+							placeholder="0"
+						/>
+					</div>
+				</div>
+			{:else if activeTab === 'ECI'}
+				<div class="grid grid-cols-2 gap-4">
+					<div class="space-y-2">
+						<Label for="forma_pago_eci">Forma de pago ECI:</Label>
+						<Input
+							id="forma_pago_eci"
+							type="number"
+							bind:value={formData.eci.forma_pago_eci}
+							placeholder="0"
+						/>
+					</div>
+					<div class="space-y-2">
+						<Label for="importe_eci">Importe ECI:</Label>
+						<Input
+							id="importe_eci"
+							type="number"
+							bind:value={formData.eci.importe_eci}
+							placeholder="0"
+						/>
+						<p class="text-xs text-muted-foreground">
+							(dejar en cero para que el sistema calcule el importe)
+						</p>
+					</div>
+				</div>
+			{:else if activeTab === 'MULT'}
+				<div class="grid grid-cols-2 gap-4">
+					<div class="space-y-2">
+						<Label for="forma_pago_multa">Forma de pago Multa:</Label>
+						<Input
+							id="forma_pago_multa"
+							type="number"
+							bind:value={formData.mult.forma_pago_multa}
+							placeholder="0"
+						/>
+					</div>
+					<div class="space-y-2">
+						<Label for="importe_multa">Importe Multa:</Label>
+						<Input
+							id="importe_multa"
+							type="number"
+							bind:value={formData.mult.importe_multa}
+							placeholder="0"
+						/>
+					</div>
+				</div>
+			{:else if activeTab === 'REC'}
+				<div class="grid grid-cols-2 gap-4">
+					<div class="space-y-2">
+						<Label for="forma_pago_uia">Forma de pago U I A:</Label>
+						<Input
+							id="forma_pago_uia"
+							type="number"
+							bind:value={formData.rec.forma_pago_uia}
+							placeholder="0"
+						/>
+					</div>
+					<div class="space-y-2">
+						<Label for="importe_compensar">Importe a Compensar:</Label>
+						<Input
+							id="importe_compensar"
+							type="number"
+							bind:value={formData.rec.importe_compensar}
+							placeholder="0"
+						/>
+					</div>
+				</div>
+			{/if}
+		</div>
+
+		<!-- Tabla de contribuciones -->
+		<div class="border rounded-lg overflow-hidden">
+			<Table>
+				<TableHeader>
+					<TableRow>
+						<TableHead>Contribución</TableHead>
+						<TableHead>T.T.</TableHead>
+						<TableHead>Tasa</TableHead>
+						<TableHead>F.P.</TableHead>
+						<TableHead class="text-right">Importe</TableHead>
+						<TableHead>Gravamen</TableHead>
+						<TableHead>Abreviación</TableHead>
+						<TableHead>F.P.</TableHead>
+						<TableHead class="text-right">Importe</TableHead>
+						<TableHead class="w-[100px]">Acciones</TableHead>
+					</TableRow>
+				</TableHeader>
+				<TableBody>
+					{#if !formData?.contribuciones || formData.contribuciones.length === 0}
+						<TableRow>
+							<TableCell colspan={10} class="text-center text-muted-foreground py-8">
+								No hay contribuciones registradas
+							</TableCell>
+						</TableRow>
+					{:else}
+						{#each formData.contribuciones as contribucion, index}
+							<TableRow>
+								<TableCell>{contribucion.contribucion}</TableCell>
+								<TableCell>{contribucion.tipo_tasa}</TableCell>
+								<TableCell class="text-right"
+									>{contribucion.tasa.toLocaleString('es-MX', {
+										minimumFractionDigits: 2,
+										maximumFractionDigits: 5
+									})}</TableCell
+								>
+								<TableCell>{contribucion.forma_pago}</TableCell>
+								<TableCell class="text-right"
+									>{contribucion.importe.toLocaleString('es-MX', {
+										minimumFractionDigits: 2,
+										maximumFractionDigits: 2
+									})}</TableCell
+								>
+								<TableCell>{contribucion.gravamen}</TableCell>
+								<TableCell>{contribucion.abreviacion}</TableCell>
+								<TableCell>{contribucion.forma_pago_2}</TableCell>
+								<TableCell class="text-right"
+									>{contribucion.importe_2.toLocaleString('es-MX', {
+										minimumFractionDigits: 2,
+										maximumFractionDigits: 2
+									})}</TableCell
+								>
+								<TableCell>
+									<div class="flex gap-1">
+										<Button size="sm" variant="ghost" onclick={() => openEditContribucion(index)}>
+											<Pencil size={14} />
+										</Button>
+										<Button size="sm" variant="ghost" onclick={() => deleteContribucion(index)}>
+											<Trash2 size={14} />
+										</Button>
+									</div>
+								</TableCell>
+							</TableRow>
+						{/each}
+					{/if}
+				</TableBody>
+			</Table>
+		</div>
+
+		<!-- Controles inferiores -->
+		<div class="flex items-center justify-between border-t pt-4">
+			<div class="flex items-center gap-6">
+				<div class="flex items-center space-x-2">
+					<Checkbox
+						id="calculo_manual"
+						checked={formData?.calculo_manual ?? false}
+						onCheckedChange={(checked: boolean | 'indeterminate') =>
+							formData && (formData.calculo_manual = checked === true)}
+					/>
+					<Label for="calculo_manual" class="font-normal cursor-pointer text-sm"
+						>Cálculo Manual</Label
+					>
+				</div>
+
+				<div class="flex items-center space-x-2">
+					<Checkbox
+						id="operaciones_regla"
+						checked={formData?.operaciones_regla_31_40 ?? false}
+						onCheckedChange={(checked: boolean | 'indeterminate') =>
+							formData && (formData.operaciones_regla_31_40 = checked === true)}
+					/>
+					<Label for="operaciones_regla" class="font-normal cursor-pointer text-sm"
+						>Operaciones al amparo de la regla 31.40</Label
+					>
+				</div>
+			</div>
+
+			<div class="flex gap-2">
+				<Button size="sm" onclick={openNewContribucion}>
+					<Plus class="mr-1.5" size={14} />
+					Nuevo
+				</Button>
+				<Button
+					size="sm"
+					variant="outline"
+					disabled={formData?.contribuciones?.length === 0}
+					onclick={() => {
+						const index = 0;
+						if (formData?.contribuciones?.[index]) openEditContribucion(index);
+					}}
+				>
+					<Pencil class="mr-1.5" size={14} />
+					Editar
+				</Button>
+				<Button
+					size="sm"
+					variant="destructive"
+					disabled={formData?.contribuciones?.length === 0}
+					onclick={() => {
+						const index = 0;
+						if (formData?.contribuciones?.[index]) deleteContribucion(index);
+					}}
+				>
+					<Trash2 class="mr-1.5" size={14} />
+					Borrar
+				</Button>
+			</div>
+		</div>
+	</CardContent>
+</Card>
+
+<!-- Dialog para Contribuciones -->
+<Dialog bind:open={isDialogOpen}>
+	<DialogContent class="max-w-3xl">
+		<DialogHeader>
+			<DialogTitle>
+				{editingIndex !== null ? 'Editar Contribución' : 'Nueva Contribución'}
+			</DialogTitle>
+		</DialogHeader>
+
+		<div class="grid gap-4 py-4">
+			<div class="grid grid-cols-2 gap-4">
+				<div class="space-y-2">
+					<Label for="contribucion">Contribución *</Label>
+					<Input
+						id="contribucion"
+						bind:value={currentContribucion.contribucion}
+						placeholder="Nombre de la contribución"
+					/>
+				</div>
+				<div class="space-y-2">
+					<Label for="tipo_tasa">T.T. (Tipo de Tasa) *</Label>
+					<Input id="tipo_tasa" bind:value={currentContribucion.tipo_tasa} placeholder="Tipo" />
+				</div>
+			</div>
+
+			<div class="grid grid-cols-3 gap-4">
+				<div class="space-y-2">
+					<Label for="tasa">Tasa *</Label>
+					<Input
+						id="tasa"
+						type="number"
+						step="0.00001"
+						bind:value={currentContribucion.tasa}
+						placeholder="0.00000"
+					/>
+				</div>
+				<div class="space-y-2">
+					<Label for="forma_pago">F.P. (Forma de Pago) *</Label>
+					<Input id="forma_pago" bind:value={currentContribucion.forma_pago} placeholder="FP" />
+				</div>
+				<div class="space-y-2">
+					<Label for="importe">Importe *</Label>
+					<Input
+						id="importe"
+						type="number"
+						step="0.01"
+						bind:value={currentContribucion.importe}
+						placeholder="0.00"
+					/>
+				</div>
+			</div>
+
+			<div class="grid grid-cols-2 gap-4">
+				<div class="space-y-2">
+					<Label for="gravamen">Gravamen</Label>
+					<Input id="gravamen" bind:value={currentContribucion.gravamen} placeholder="Gravamen" />
+				</div>
+				<div class="space-y-2">
+					<Label for="abreviacion">Abreviación</Label>
+					<Input
+						id="abreviacion"
+						bind:value={currentContribucion.abreviacion}
+						placeholder="Abreviación"
+					/>
+				</div>
+			</div>
+
+			<div class="grid grid-cols-2 gap-4">
+				<div class="space-y-2">
+					<Label for="forma_pago_2">F.P. 2</Label>
+					<Input id="forma_pago_2" bind:value={currentContribucion.forma_pago_2} placeholder="FP" />
+				</div>
+				<div class="space-y-2">
+					<Label for="importe_2">Importe 2</Label>
+					<Input
+						id="importe_2"
+						type="number"
+						step="0.01"
+						bind:value={currentContribucion.importe_2}
+						placeholder="0.00"
+					/>
+				</div>
+			</div>
+		</div>
+
+		<DialogFooter>
+			<Button variant="outline" onclick={() => (isDialogOpen = false)}>Cancelar</Button>
+			<Button
+				onclick={saveContribucion}
+				disabled={!currentContribucion.contribucion ||
+					!currentContribucion.tipo_tasa ||
+					!currentContribucion.forma_pago}
+			>
+				{editingIndex !== null ? 'Actualizar' : 'Guardar'}
+			</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
diff --git a/frontend/src/lib/components/dashboard/pedimentos/edit/cuentas-compensacion-tab-form.svelte b/frontend/src/lib/components/dashboard/pedimentos/edit/cuentas-compensacion-tab-form.svelte
new file mode 100644
index 00000000..bf791baa
--- /dev/null
+++ b/frontend/src/lib/components/dashboard/pedimentos/edit/cuentas-compensacion-tab-form.svelte
@@ -0,0 +1,632 @@
+<script lang="ts">
+	import { Card, CardContent, CardHeader, CardTitle } from '$lib/components/ui/card';
+	import { Button } from '$lib/components/ui/button';
+	import { Input } from '$lib/components/ui/input';
+	import { Label } from '$lib/components/ui/label';
+	import {
+		Table,
+		TableBody,
+		TableCell,
+		TableHead,
+		TableHeader,
+		TableRow
+	} from '$lib/components/ui/table';
+	import {
+		Dialog,
+		DialogContent,
+		DialogHeader,
+		DialogTitle,
+		DialogFooter
+	} from '$lib/components/ui/dialog';
+	import {
+		Plus,
+		Pencil,
+		Trash2
+	} from 'lucide-svelte';
+
+	interface CuentaGarantia {
+		id?: number;
+		institucion_emisora: string;
+		numero_contrato: string;
+		total_garantia: number;
+		folio_constancia: string;
+		fecha_constancia: string;
+		um: string;
+		valor_unitario: number;
+	}
+
+	interface Compensacion {
+		id?: number;
+		patente_original: string;
+		pedimento_original: string;
+	}
+
+	interface DocumentoPago {
+		id?: number;
+		forma_pago: string;
+		dependencia: string;
+	}
+
+	let {
+		formData = $bindable({
+			cuentas_garantia: [] as CuentaGarantia[],
+			compensaciones: [] as Compensacion[],
+			documentos_pago: [] as DocumentoPago[]
+		})
+	}: {
+		formData: {
+			cuentas_garantia: CuentaGarantia[];
+			compensaciones: Compensacion[];
+			documentos_pago: DocumentoPago[];
+		};
+	} = $props();
+
+	// Estados para diálogos
+	let isCuentaDialogOpen = $state(false);
+	let isCompensacionDialogOpen = $state(false);
+	let isDocumentoDialogOpen = $state(false);
+
+	// Estados para edición
+	let editingCuentaIndex = $state<number | null>(null);
+	let editingCompensacionIndex = $state<number | null>(null);
+	let editingDocumentoIndex = $state<number | null>(null);
+
+	// Estados actuales
+	let currentCuenta = $state<CuentaGarantia>({
+		institucion_emisora: '',
+		numero_contrato: '',
+		total_garantia: 0,
+		folio_constancia: '',
+		fecha_constancia: '',
+		um: '',
+		valor_unitario: 0
+	});
+
+	let currentCompensacion = $state<Compensacion>({
+		patente_original: '',
+		pedimento_original: ''
+	});
+
+	let currentDocumento = $state<DocumentoPago>({
+		forma_pago: '',
+		dependencia: ''
+	});
+
+	const unidadesMedida = ['KG', 'LT', 'PZ', 'MT', 'M2', 'M3', 'TON', 'CAJ', 'PAR'];
+
+	// Funciones para Cuentas Garantía
+	function openNewCuenta() {
+		editingCuentaIndex = null;
+		currentCuenta = {
+			institucion_emisora: '',
+			numero_contrato: '',
+			total_garantia: 0,
+			folio_constancia: '',
+			fecha_constancia: '',
+			um: '',
+			valor_unitario: 0
+		};
+		isCuentaDialogOpen = true;
+	}
+
+	function openEditCuenta(index: number) {
+		if (!formData?.cuentas_garantia) return;
+		editingCuentaIndex = index;
+		currentCuenta = { ...formData.cuentas_garantia[index] };
+		isCuentaDialogOpen = true;
+	}
+
+	function saveCuenta() {
+		if (!formData?.cuentas_garantia) return;
+		if (editingCuentaIndex !== null) {
+			formData.cuentas_garantia[editingCuentaIndex] = { ...currentCuenta };
+		} else {
+			formData.cuentas_garantia = [...formData.cuentas_garantia, { ...currentCuenta }];
+		}
+		isCuentaDialogOpen = false;
+	}
+
+	function deleteCuenta(index: number) {
+		if (!formData?.cuentas_garantia) return;
+		if (confirm('¿Está seguro de eliminar esta cuenta?')) {
+			formData.cuentas_garantia = formData.cuentas_garantia.filter((_, i) => i !== index);
+		}
+	}
+
+	// Funciones para Compensaciones
+	function openNewCompensacion() {
+		editingCompensacionIndex = null;
+		currentCompensacion = {
+			patente_original: '',
+			pedimento_original: ''
+		};
+		isCompensacionDialogOpen = true;
+	}
+
+	function openEditCompensacion(index: number) {
+		if (!formData?.compensaciones) return;
+		editingCompensacionIndex = index;
+		currentCompensacion = { ...formData.compensaciones[index] };
+		isCompensacionDialogOpen = true;
+	}
+
+	function saveCompensacion() {
+		if (!formData?.compensaciones) return;
+		if (editingCompensacionIndex !== null) {
+			formData.compensaciones[editingCompensacionIndex] = { ...currentCompensacion };
+		} else {
+			formData.compensaciones = [...formData.compensaciones, { ...currentCompensacion }];
+		}
+		isCompensacionDialogOpen = false;
+	}
+
+	function deleteCompensacion(index: number) {
+		if (!formData?.compensaciones) return;
+		if (confirm('¿Está seguro de eliminar esta compensación?')) {
+			formData.compensaciones = formData.compensaciones.filter((_, i) => i !== index);
+		}
+	}
+
+	// Funciones para Documentos de Pago
+	function openNewDocumento() {
+		editingDocumentoIndex = null;
+		currentDocumento = {
+			forma_pago: '',
+			dependencia: ''
+		};
+		isDocumentoDialogOpen = true;
+	}
+
+	function openEditDocumento(index: number) {
+		if (!formData?.documentos_pago) return;
+		editingDocumentoIndex = index;
+		currentDocumento = { ...formData.documentos_pago[index] };
+		isDocumentoDialogOpen = true;
+	}
+
+	function saveDocumento() {
+		if (!formData?.documentos_pago) return;
+		if (editingDocumentoIndex !== null) {
+			formData.documentos_pago[editingDocumentoIndex] = { ...currentDocumento };
+		} else {
+			formData.documentos_pago = [...formData.documentos_pago, { ...currentDocumento }];
+		}
+		isDocumentoDialogOpen = false;
+	}
+
+	function deleteDocumento(index: number) {
+		if (!formData?.documentos_pago) return;
+		if (confirm('¿Está seguro de eliminar este documento?')) {
+			formData.documentos_pago = formData.documentos_pago.filter((_, i) => i !== index);
+		}
+	}
+</script>
+
+<div class="space-y-4">
+	<!-- Sección de Cuentas Garantía -->
+	<Card>
+		<CardContent class="p-6 space-y-4">
+			<div class="border rounded-lg overflow-hidden">
+				<Table>
+					<TableHeader>
+						<TableRow>
+							<TableHead>Institución Emisora</TableHead>
+							<TableHead>Número Contrato</TableHead>
+							<TableHead class="text-right">Total Garantía</TableHead>
+							<TableHead>Folio Constancia</TableHead>
+							<TableHead>Fecha Constancia</TableHead>
+							<TableHead>UM</TableHead>
+							<TableHead class="text-right">Valor Unitario</TableHead>
+							<TableHead class="w-[100px]">Acciones</TableHead>
+						</TableRow>
+					</TableHeader>
+					<TableBody>
+						{#if !formData?.cuentas_garantia || formData.cuentas_garantia.length === 0}
+							<TableRow>
+								<TableCell colspan={8} class="text-center text-muted-foreground py-8">
+									No hay cuentas de garantía registradas
+								</TableCell>
+							</TableRow>
+						{:else}
+							{#each formData.cuentas_garantia as cuenta, index}
+								<TableRow>
+									<TableCell>{cuenta.institucion_emisora}</TableCell>
+									<TableCell>{cuenta.numero_contrato}</TableCell>
+									<TableCell class="text-right"
+										>{cuenta.total_garantia.toLocaleString('es-MX', {
+											minimumFractionDigits: 2,
+											maximumFractionDigits: 2
+										})}</TableCell
+									>
+									<TableCell>{cuenta.folio_constancia}</TableCell>
+									<TableCell>{cuenta.fecha_constancia}</TableCell>
+									<TableCell>{cuenta.um}</TableCell>
+									<TableCell class="text-right"
+										>{cuenta.valor_unitario.toLocaleString('es-MX', {
+											minimumFractionDigits: 2,
+											maximumFractionDigits: 2
+										})}</TableCell
+									>
+									<TableCell>
+										<div class="flex gap-1">
+											<Button size="sm" variant="ghost" onclick={() => openEditCuenta(index)}>
+												<Pencil size={14} />
+											</Button>
+											<Button size="sm" variant="ghost" onclick={() => deleteCuenta(index)}>
+												<Trash2 size={14} />
+											</Button>
+										</div>
+									</TableCell>
+								</TableRow>
+							{/each}
+						{/if}
+					</TableBody>
+				</Table>
+			</div>
+
+			<div class="flex gap-2">
+				<Button size="sm" onclick={openNewCuenta}>
+					<Plus class="mr-1.5" size={14} />
+					Nuevo
+				</Button>
+				<Button
+					size="sm"
+					variant="outline"
+					disabled={formData?.cuentas_garantia?.length === 0}
+					onclick={() => {
+						const index = 0;
+						if (formData?.cuentas_garantia?.[index]) openEditCuenta(index);
+					}}
+				>
+					<Pencil class="mr-1.5" size={14} />
+					Editar
+				</Button>
+				<Button
+					size="sm"
+					variant="destructive"
+					disabled={formData?.cuentas_garantia?.length === 0}
+					onclick={() => {
+						const index = 0;
+						if (formData?.cuentas_garantia?.[index]) deleteCuenta(index);
+					}}
+				>
+					<Trash2 class="mr-1.5" size={14} />
+					Borrar
+				</Button>
+			</div>
+		</CardContent>
+	</Card>
+
+	<!-- Secciones en grid -->
+	<div class="grid grid-cols-2 gap-4">
+		<!-- Compensaciones -->
+		<Card>
+			<CardHeader class="pb-3">
+				<CardTitle class="text-base">Compensaciones</CardTitle>
+			</CardHeader>
+			<CardContent class="space-y-4">
+				<div class="border rounded-lg overflow-hidden">
+					<Table>
+						<TableHeader>
+							<TableRow>
+								<TableHead>Patente Original</TableHead>
+								<TableHead>Pedimento Original</TableHead>
+								<TableHead class="w-[100px]">Acciones</TableHead>
+							</TableRow>
+						</TableHeader>
+						<TableBody>
+							{#if !formData?.compensaciones || formData.compensaciones.length === 0}
+								<TableRow>
+									<TableCell colspan={3} class="text-center text-muted-foreground py-8">
+										No hay compensaciones registradas
+									</TableCell>
+								</TableRow>
+							{:else}
+								{#each formData.compensaciones as compensacion, index}
+									<TableRow>
+										<TableCell>{compensacion.patente_original}</TableCell>
+										<TableCell>{compensacion.pedimento_original}</TableCell>
+										<TableCell>
+											<div class="flex gap-1">
+												<Button
+													size="sm"
+													variant="ghost"
+													onclick={() => openEditCompensacion(index)}
+												>
+													<Pencil size={14} />
+												</Button>
+												<Button
+													size="sm"
+													variant="ghost"
+													onclick={() => deleteCompensacion(index)}
+												>
+													<Trash2 size={14} />
+												</Button>
+											</div>
+										</TableCell>
+									</TableRow>
+								{/each}
+							{/if}
+						</TableBody>
+					</Table>
+				</div>
+
+				<div class="flex gap-2">
+					<Button size="sm" onclick={openNewCompensacion}>
+						<Plus class="mr-1.5" size={14} />
+						Nuevo
+					</Button>
+					<Button
+						size="sm"
+						variant="outline"
+						disabled={formData?.compensaciones?.length === 0}
+						onclick={() => {
+							const index = 0;
+							if (formData?.compensaciones?.[index]) openEditCompensacion(index);
+						}}
+					>
+						<Pencil class="mr-1.5" size={14} />
+						Editar
+					</Button>
+					<Button
+						size="sm"
+						variant="destructive"
+						disabled={formData?.compensaciones?.length === 0}
+						onclick={() => {
+							const index = 0;
+							if (formData?.compensaciones?.[index]) deleteCompensacion(index);
+						}}
+					>
+						<Trash2 class="mr-1.5" size={14} />
+						Borrar
+					</Button>
+				</div>
+			</CardContent>
+		</Card>
+
+		<!-- Documentos que amparan las Formas de Pago -->
+		<Card>
+			<CardHeader class="pb-3">
+				<CardTitle class="text-base">Documentos que amparan las Formas de Pago</CardTitle>
+			</CardHeader>
+			<CardContent class="space-y-4">
+				<div class="border rounded-lg overflow-hidden">
+					<Table>
+						<TableHeader>
+							<TableRow>
+								<TableHead>Forma de Pago</TableHead>
+								<TableHead>Dependencia</TableHead>
+								<TableHead class="w-[100px]">Acciones</TableHead>
+							</TableRow>
+						</TableHeader>
+						<TableBody>
+							{#if !formData?.documentos_pago || formData.documentos_pago.length === 0}
+								<TableRow>
+									<TableCell colspan={3} class="text-center text-muted-foreground py-8">
+										No hay documentos registrados
+									</TableCell>
+								</TableRow>
+							{:else}
+								{#each formData.documentos_pago as documento, index}
+									<TableRow>
+										<TableCell>{documento.forma_pago}</TableCell>
+										<TableCell>{documento.dependencia}</TableCell>
+										<TableCell>
+											<div class="flex gap-1">
+												<Button size="sm" variant="ghost" onclick={() => openEditDocumento(index)}>
+													<Pencil size={14} />
+												</Button>
+												<Button size="sm" variant="ghost" onclick={() => deleteDocumento(index)}>
+													<Trash2 size={14} />
+												</Button>
+											</div>
+										</TableCell>
+									</TableRow>
+								{/each}
+							{/if}
+						</TableBody>
+					</Table>
+				</div>
+
+				<div class="flex gap-2">
+					<Button size="sm" onclick={openNewDocumento}>
+						<Plus class="mr-1.5" size={14} />
+						Nuevo
+					</Button>
+					<Button
+						size="sm"
+						variant="outline"
+						disabled={formData?.documentos_pago?.length === 0}
+						onclick={() => {
+							const index = 0;
+							if (formData?.documentos_pago?.[index]) openEditDocumento(index);
+						}}
+					>
+						<Pencil class="mr-1.5" size={14} />
+						Editar
+					</Button>
+					<Button
+						size="sm"
+						variant="destructive"
+						disabled={formData?.documentos_pago?.length === 0}
+						onclick={() => {
+							const index = 0;
+							if (formData?.documentos_pago?.[index]) deleteDocumento(index);
+						}}
+					>
+						<Trash2 class="mr-1.5" size={14} />
+						Borrar
+					</Button>
+				</div>
+			</CardContent>
+		</Card>
+	</div>
+</div>
+
+<!-- Dialog para Cuentas Garantía -->
+<Dialog bind:open={isCuentaDialogOpen}>
+	<DialogContent class="max-w-3xl">
+		<DialogHeader>
+			<DialogTitle>
+				{editingCuentaIndex !== null ? 'Editar Cuenta Garantía' : 'Nueva Cuenta Garantía'}
+			</DialogTitle>
+		</DialogHeader>
+
+		<div class="grid gap-4 py-4">
+			<div class="grid grid-cols-2 gap-4">
+				<div class="space-y-2">
+					<Label for="institucion_emisora">Institución Emisora *</Label>
+					<Input
+						id="institucion_emisora"
+						bind:value={currentCuenta.institucion_emisora}
+						placeholder="Nombre de la institución"
+					/>
+				</div>
+				<div class="space-y-2">
+					<Label for="numero_contrato">Número Contrato *</Label>
+					<Input
+						id="numero_contrato"
+						bind:value={currentCuenta.numero_contrato}
+						placeholder="Número de contrato"
+					/>
+				</div>
+			</div>
+
+			<div class="grid grid-cols-2 gap-4">
+				<div class="space-y-2">
+					<Label for="total_garantia">Total Garantía *</Label>
+					<Input
+						id="total_garantia"
+						type="number"
+						step="0.01"
+						bind:value={currentCuenta.total_garantia}
+						placeholder="0.00"
+					/>
+				</div>
+				<div class="space-y-2">
+					<Label for="folio_constancia">Folio Constancia *</Label>
+					<Input
+						id="folio_constancia"
+						bind:value={currentCuenta.folio_constancia}
+						placeholder="Folio"
+					/>
+				</div>
+			</div>
+
+			<div class="grid grid-cols-3 gap-4">
+				<div class="space-y-2">
+					<Label for="fecha_constancia">Fecha Constancia *</Label>
+					<Input id="fecha_constancia" type="date" bind:value={currentCuenta.fecha_constancia} />
+				</div>
+				<div class="space-y-2">
+					<Label for="um">UM *</Label>
+					<Input id="um" bind:value={currentCuenta.um} placeholder="Unidad de medida" />
+				</div>
+				<div class="space-y-2">
+					<Label for="valor_unitario">Valor Unitario *</Label>
+					<Input
+						id="valor_unitario"
+						type="number"
+						step="0.01"
+						bind:value={currentCuenta.valor_unitario}
+						placeholder="0.00"
+					/>
+				</div>
+			</div>
+		</div>
+
+		<DialogFooter>
+			<Button variant="outline" onclick={() => (isCuentaDialogOpen = false)}>Cancelar</Button>
+			<Button
+				onclick={saveCuenta}
+				disabled={!currentCuenta.institucion_emisora ||
+					!currentCuenta.numero_contrato ||
+					!currentCuenta.folio_constancia ||
+					!currentCuenta.fecha_constancia ||
+					!currentCuenta.um}
+			>
+				{editingCuentaIndex !== null ? 'Actualizar' : 'Guardar'}
+			</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
+
+<!-- Dialog para Compensaciones -->
+<Dialog bind:open={isCompensacionDialogOpen}>
+	<DialogContent class="max-w-lg">
+		<DialogHeader>
+			<DialogTitle>
+				{editingCompensacionIndex !== null ? 'Editar Compensación' : 'Nueva Compensación'}
+			</DialogTitle>
+		</DialogHeader>
+
+		<div class="grid gap-4 py-4">
+			<div class="space-y-2">
+				<Label for="patente_original">Patente Original *</Label>
+				<Input
+					id="patente_original"
+					bind:value={currentCompensacion.patente_original}
+					placeholder="0000"
+				/>
+			</div>
+
+			<div class="space-y-2">
+				<Label for="pedimento_original">Pedimento Original *</Label>
+				<Input
+					id="pedimento_original"
+					bind:value={currentCompensacion.pedimento_original}
+					placeholder="00  00  0000  0000000"
+				/>
+			</div>
+		</div>
+
+		<DialogFooter>
+			<Button variant="outline" onclick={() => (isCompensacionDialogOpen = false)}
+				>Cancelar</Button
+			>
+			<Button
+				onclick={saveCompensacion}
+				disabled={!currentCompensacion.patente_original || !currentCompensacion.pedimento_original}
+			>
+				{editingCompensacionIndex !== null ? 'Actualizar' : 'Guardar'}
+			</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
+
+<!-- Dialog para Documentos de Pago -->
+<Dialog bind:open={isDocumentoDialogOpen}>
+	<DialogContent class="max-w-lg">
+		<DialogHeader>
+			<DialogTitle>
+				{editingDocumentoIndex !== null ? 'Editar Documento' : 'Nuevo Documento'}
+			</DialogTitle>
+		</DialogHeader>
+
+		<div class="grid gap-4 py-4">
+			<div class="space-y-2">
+				<Label for="forma_pago">Forma de Pago *</Label>
+				<Input id="forma_pago" bind:value={currentDocumento.forma_pago} placeholder="Forma de pago" />
+			</div>
+
+			<div class="space-y-2">
+				<Label for="dependencia">Dependencia *</Label>
+				<Input
+					id="dependencia"
+					bind:value={currentDocumento.dependencia}
+					placeholder="Dependencia"
+				/>
+			</div>
+		</div>
+
+		<DialogFooter>
+			<Button variant="outline" onclick={() => (isDocumentoDialogOpen = false)}>Cancelar</Button>
+			<Button
+				onclick={saveDocumento}
+				disabled={!currentDocumento.forma_pago || !currentDocumento.dependencia}
+			>
+				{editingDocumentoIndex !== null ? 'Actualizar' : 'Guardar'}
+			</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
diff --git a/frontend/src/lib/components/dashboard/pedimentos/edit/dates-tab-form.svelte b/frontend/src/lib/components/dashboard/pedimentos/edit/dates-tab-form.svelte
index 106ca429..070c664b 100644
--- a/frontend/src/lib/components/dashboard/pedimentos/edit/dates-tab-form.svelte
+++ b/frontend/src/lib/components/dashboard/pedimentos/edit/dates-tab-form.svelte
@@ -1,107 +1,83 @@
 <script lang="ts">
 	import * as Card from '$lib/components/ui/card';
-	import { Input } from '$lib/components/ui/input';
 	import { Label } from '$lib/components/ui/label';
 	import type { Pedimento } from '$lib/api/dashboard/a76/pedimentos';
 
 	let { 
 		pedimento,
 		formData = $bindable(),
-		exists = $bindable()
+		exists = $bindable(),
+		pedimentoType = '',
+		pedimentoNumber = ''
 	}: { 
 		pedimento: Pedimento | null;
 		formData?: any;
 		exists?: boolean;
+		pedimentoType?: string;
+		pedimentoNumber?: string;
 	} = $props();
 
-	// Inicializar formData inmediatamente
-	const datesData = pedimento?.pedimento_dates;
-	if (datesData) {
-		exists = true;
-		if (!formData) {
-			formData = {
-				entry_date: datesData.entry_date ? datesData.entry_date.substring(0, 10) : '',
-				pedimento_date: datesData.pedimento_date ? datesData.pedimento_date.substring(0, 10) : '',
-				payment_date: datesData.payment_date ? datesData.payment_date.substring(0, 10) : '',
-				rectification_payment_date: datesData.rectification_payment_date ? datesData.rectification_payment_date.substring(0, 10) : '',
-				extraction_date: datesData.extraction_date ? datesData.extraction_date.substring(0, 10) : '',
-				submission_date: datesData.submission_date ? datesData.submission_date.substring(0, 10) : '',
-				eucan_date: datesData.eucan_date ? datesData.eucan_date.substring(0, 10) : '',
-				original_date: datesData.original_date ? datesData.original_date.substring(0, 10) : '',
-				start_date: datesData.start_date ? datesData.start_date.substring(0, 10) : '',
-				end_date: datesData.end_date ? datesData.end_date.substring(0, 10) : '',
-			};
-		}
-	} else {
-		exists = false;
-		if (!formData) {
-			formData = {
-				entry_date: '',
-				pedimento_date: '',
-				payment_date: '',
-				rectification_payment_date: '',
-				extraction_date: '',
-				submission_date: '',
-				eucan_date: '',
-				original_date: '',
-				start_date: '',
-				end_date: '',
-				capture_time: ''
-			};
-		}
+	// Inicializar formData
+	if (!formData) {
+		formData = {
+			observaciones: pedimento?.observaciones || ''
+		};
 	}
+	
+	exists = !!pedimento?.observaciones;
+	
+	// Mapear el tipo de pedimento a un nombre legible
+	const tipoPedimentoNombre = $derived.by(() => {
+		switch(pedimentoType?.toLowerCase()) {
+			case 'automovil':
+				return 'Automóvil';
+			case 'complementario':
+				return 'Complementario';
+			case 'consolidado':
+				return 'Consolidado';
+			case 'normal':
+				return 'Normal';
+			default:
+				return pedimentoType || 'No especificado';
+		}
+	});
 </script>
 
 <Card.Root>
 	<Card.Header>
-		<Card.Title>Fechas del Pedimento</Card.Title>
+		<Card.Title>Observaciones</Card.Title>
 		<Card.Description>
-			Gestiona las fechas importantes del pedimento
+			Agrega notas y observaciones sobre el pedimento
 		</Card.Description>
 	</Card.Header>
 	<Card.Content>
-		<div class="space-y-6">
-			<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
-					<!-- Fecha de Envío -->
-					<div class="space-y-2">
-						<Label for="submission_date">Fecha de Envío</Label>
-						<Input
-							id="submission_date"
-							type="date"
-							bind:value={formData.submission_date}
-						/>
+		<div class="space-y-4">
+			<!-- Mostrar el tipo de pedimento y número -->
+			<div class="rounded-lg border bg-card p-4">
+				<div class="space-y-2">
+					<div class="flex items-center gap-2">
+						<span class="text-sm font-medium text-muted-foreground">Tipo de Pedimento:</span>
+						<span class="text-sm font-semibold">{tipoPedimentoNombre}</span>
 					</div>
-
-					<!-- Fecha EUCAN -->
-					<div class="space-y-2">
-						<Label for="eucan_date">Fecha EUCAN</Label>
-						<Input
-							id="eucan_date"
-							type="date"
-							bind:value={formData.eucan_date}
-						/>
-					</div>
-
-					<!-- Fecha de Inicio -->
-					<div class="space-y-2">
-						<Label for="start_date">Fecha de Inicio</Label>
-						<Input
-							id="start_date"
-							type="date"
-							bind:value={formData.start_date}
-						/>
-					</div>
-
-					<!-- Fecha de Fin -->
-					<div class="space-y-2">
-						<Label for="end_date">Fecha de Fin</Label>
-						<Input
-							id="end_date"
-							type="date"
-							bind:value={formData.end_date}
-						/>
-					</div>					
+					{#if pedimentoNumber}
+						<div class="flex items-center gap-2">
+							<span class="text-sm font-medium text-muted-foreground">Número de Pedimento:</span>
+							<span class="text-sm font-semibold">{pedimentoNumber}</span>
+						</div>
+					{/if}
 				</div>
 			</div>
-		</Card.Content>
-	</Card.Root>
\ No newline at end of file
+			
+			<div class="space-y-2">
+				<Label for="observaciones">Observaciones</Label>
+				<textarea
+					id="observaciones"
+					bind:value={formData.observaciones}
+					placeholder="Escribe tus observaciones aquí..."
+					rows={10}
+					class="flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 resize-y"
+				></textarea>
+			</div>
+		</div>
+	</Card.Content>
+</Card.Root>
\ No newline at end of file
diff --git a/frontend/src/lib/components/dashboard/pedimentos/edit/descargas-tab-form.svelte b/frontend/src/lib/components/dashboard/pedimentos/edit/descargas-tab-form.svelte
new file mode 100644
index 00000000..7695298b
--- /dev/null
+++ b/frontend/src/lib/components/dashboard/pedimentos/edit/descargas-tab-form.svelte
@@ -0,0 +1,495 @@
+<script lang="ts">
+	import { Card, CardContent, CardHeader, CardTitle } from '$lib/components/ui/card';
+	import { Button } from '$lib/components/ui/button';
+	import { Input } from '$lib/components/ui/input';
+	import { Label } from '$lib/components/ui/label';
+	import {
+		Table,
+		TableBody,
+		TableCell,
+		TableHead,
+		TableHeader,
+		TableRow
+	} from '$lib/components/ui/table';
+	import {
+		Dialog,
+		DialogContent,
+		DialogHeader,
+		DialogTitle,
+		DialogFooter
+	} from '$lib/components/ui/dialog';
+	import {
+		Plus,
+		Pencil,
+		Trash2,
+		Upload,
+		Trash
+	} from 'lucide-svelte';
+
+	interface Descargo {
+		id?: number;
+		patente: string;
+		pedimento: string;
+		aduana: string;
+		clave: string;
+		fecha_pago: string;
+		fraccion: string;
+		umt: string;
+		cantidad_tarifa: number;
+	}
+
+	interface Destinatario {
+		id?: number;
+		clave: string;
+		identificacion_fiscal: string;
+		nombre: string;
+	}
+
+	let {
+		formData = $bindable({
+			descargos: [] as Descargo[],
+			destinatarios: [] as Destinatario[]
+		})
+	}: {
+		formData: {
+			descargos: Descargo[];
+			destinatarios: Destinatario[];
+		};
+	} = $props();
+
+	// Estados para diálogos
+	let isDescargoDialogOpen = $state(false);
+	let isDestinatarioDialogOpen = $state(false);
+
+	// Estados para edición
+	let editingDescargoIndex = $state<number | null>(null);
+	let editingDestinatarioIndex = $state<number | null>(null);
+
+	// Estados actuales
+	let currentDescargo = $state<Descargo>({
+		patente: '',
+		pedimento: '',
+		aduana: '',
+		clave: '',
+		fecha_pago: '',
+		fraccion: '',
+		umt: '',
+		cantidad_tarifa: 0
+	});
+
+	let currentDestinatario = $state<Destinatario>({
+		clave: '',
+		identificacion_fiscal: '',
+		nombre: ''
+	});
+
+	const unidadesMedida = ['KG', 'LT', 'PZ', 'MT', 'M2', 'M3', 'TON', 'CAJ', 'PAR'];
+
+	// Funciones para Descargos
+	function openNewDescargo() {
+		editingDescargoIndex = null;
+		currentDescargo = {
+			patente: '',
+			pedimento: '',
+			aduana: '',
+			clave: '',
+			fecha_pago: '',
+			fraccion: '',
+			umt: '',
+			cantidad_tarifa: 0
+		};
+		isDescargoDialogOpen = true;
+	}
+
+	function openEditDescargo(index: number) {
+		if (!formData?.descargos) return;
+		editingDescargoIndex = index;
+		currentDescargo = { ...formData.descargos[index] };
+		isDescargoDialogOpen = true;
+	}
+
+	function saveDescargo() {
+		if (!formData?.descargos) return;
+		if (editingDescargoIndex !== null) {
+			formData.descargos[editingDescargoIndex] = { ...currentDescargo };
+		} else {
+			formData.descargos = [...formData.descargos, { ...currentDescargo }];
+		}
+		isDescargoDialogOpen = false;
+	}
+
+	function deleteDescargo(index: number) {
+		if (!formData?.descargos) return;
+		if (confirm('¿Está seguro de eliminar este descargo?')) {
+			formData.descargos = formData.descargos.filter((_, i) => i !== index);
+		}
+	}
+
+	function deleteAllDescargos() {
+		if (!formData?.descargos) return;
+		if (formData.descargos.length === 0) {
+			alert('No hay descargos para eliminar');
+			return;
+		}
+		if (confirm(`¿Está seguro de eliminar todos los descargos (${formData.descargos.length})?`)) {
+			formData.descargos = [];
+		}
+	}
+
+	function importarDescargos() {
+		alert('Importar Descargos (Formato CSV) no implementado aún');
+	}
+
+	// Funciones para Destinatarios
+	function openNewDestinatario() {
+		editingDestinatarioIndex = null;
+		currentDestinatario = {
+			clave: '',
+			identificacion_fiscal: '',
+			nombre: ''
+		};
+		isDestinatarioDialogOpen = true;
+	}
+
+	function openEditDestinatario(index: number) {
+		if (!formData?.destinatarios) return;
+		editingDestinatarioIndex = index;
+		currentDestinatario = { ...formData.destinatarios[index] };
+		isDestinatarioDialogOpen = true;
+	}
+
+	function saveDestinatario() {
+		if (!formData?.destinatarios) return;
+		if (editingDestinatarioIndex !== null) {
+			formData.destinatarios[editingDestinatarioIndex] = { ...currentDestinatario };
+		} else {
+			formData.destinatarios = [...formData.destinatarios, { ...currentDestinatario }];
+		}
+		isDestinatarioDialogOpen = false;
+	}
+
+	function deleteDestinatario(index: number) {
+		if (!formData?.destinatarios) return;
+		if (confirm('¿Está seguro de eliminar este destinatario?')) {
+			formData.destinatarios = formData.destinatarios.filter((_, i) => i !== index);
+		}
+	}
+</script>
+
+<div class="space-y-4">
+	<!-- Sección de Descargos -->
+	<Card>
+		<CardHeader class="pb-3">
+			<CardTitle class="text-base">Descargos</CardTitle>
+		</CardHeader>
+		<CardContent class="space-y-4">
+			<div class="border rounded-lg overflow-hidden">
+				<Table>
+					<TableHeader>
+						<TableRow>
+							<TableHead>Patente</TableHead>
+							<TableHead>Pedimento</TableHead>
+							<TableHead>Aduana</TableHead>
+							<TableHead>Clave</TableHead>
+							<TableHead>Fecha Pago</TableHead>
+							<TableHead>Fracción</TableHead>
+							<TableHead>UMT</TableHead>
+							<TableHead class="text-right">Cantidad Tarifa</TableHead>
+							<TableHead class="w-[100px]">Acciones</TableHead>
+						</TableRow>
+					</TableHeader>
+					<TableBody>
+						{#if !formData?.descargos || formData.descargos.length === 0}
+							<TableRow>
+								<TableCell colspan={9} class="text-center text-muted-foreground py-8">
+									No hay descargos registrados
+								</TableCell>
+							</TableRow>
+						{:else}
+							{#each formData.descargos as descargo, index}
+								<TableRow>
+									<TableCell>{descargo.patente}</TableCell>
+									<TableCell>{descargo.pedimento}</TableCell>
+									<TableCell>{descargo.aduana}</TableCell>
+									<TableCell>{descargo.clave}</TableCell>
+									<TableCell>{descargo.fecha_pago}</TableCell>
+									<TableCell>{descargo.fraccion}</TableCell>
+									<TableCell>{descargo.umt}</TableCell>
+									<TableCell class="text-right"
+										>{descargo.cantidad_tarifa.toLocaleString('es-MX', {
+											minimumFractionDigits: 2,
+											maximumFractionDigits: 2
+										})}</TableCell
+									>
+									<TableCell>
+										<div class="flex gap-1">
+											<Button size="sm" variant="ghost" onclick={() => openEditDescargo(index)}>
+												<Pencil size={14} />
+											</Button>
+											<Button size="sm" variant="ghost" onclick={() => deleteDescargo(index)}>
+												<Trash2 size={14} />
+											</Button>
+										</div>
+									</TableCell>
+								</TableRow>
+							{/each}
+						{/if}
+					</TableBody>
+				</Table>
+			</div>
+
+			<div class="flex gap-2">
+				<Button size="sm" variant="outline" onclick={importarDescargos}>
+					<Upload class="mr-1.5" size={14} />
+					Importar Descargos (Formato CSV)
+				</Button>
+				<Button size="sm" onclick={openNewDescargo}>
+					<Plus class="mr-1.5" size={14} />
+					Nuevo
+				</Button>
+				<Button
+					size="sm"
+					variant="outline"
+					disabled={formData?.descargos?.length === 0}
+					onclick={() => {
+						const index = 0;
+						if (formData?.descargos?.[index]) openEditDescargo(index);
+					}}
+				>
+					<Pencil class="mr-1.5" size={14} />
+					Editar
+				</Button>
+				<Button
+					size="sm"
+					variant="destructive"
+					disabled={formData?.descargos?.length === 0}
+					onclick={() => {
+						const index = 0;
+						if (formData?.descargos?.[index]) deleteDescargo(index);
+					}}
+				>
+					<Trash2 class="mr-1.5" size={14} />
+					Borrar
+				</Button>
+				<Button
+					size="sm"
+					variant="destructive"
+					disabled={formData?.descargos?.length === 0}
+					onclick={deleteAllDescargos}
+				>
+					<Trash class="mr-1.5" size={14} />
+					Borrar Todo
+				</Button>
+			</div>
+		</CardContent>
+	</Card>
+
+	<!-- Sección de Destinatarios -->
+	<Card>
+		<CardHeader class="pb-3">
+			<CardTitle class="text-base">Destinatarios</CardTitle>
+		</CardHeader>
+		<CardContent class="space-y-4">
+			<div class="border rounded-lg overflow-hidden">
+				<Table>
+					<TableHeader>
+						<TableRow>
+							<TableHead>Clave</TableHead>
+							<TableHead>Identificación Fiscal</TableHead>
+							<TableHead>Nombre</TableHead>
+							<TableHead class="w-[100px]">Acciones</TableHead>
+						</TableRow>
+					</TableHeader>
+					<TableBody>
+						{#if !formData?.destinatarios || formData.destinatarios.length === 0}
+							<TableRow>
+								<TableCell colspan={4} class="text-center text-muted-foreground py-8">
+									No hay destinatarios registrados
+								</TableCell>
+							</TableRow>
+						{:else}
+							{#each formData.destinatarios as destinatario, index}
+								<TableRow>
+									<TableCell>{destinatario.clave}</TableCell>
+									<TableCell>{destinatario.identificacion_fiscal}</TableCell>
+									<TableCell>{destinatario.nombre}</TableCell>
+									<TableCell>
+										<div class="flex gap-1">
+											<Button size="sm" variant="ghost" onclick={() => openEditDestinatario(index)}>
+												<Pencil size={14} />
+											</Button>
+											<Button size="sm" variant="ghost" onclick={() => deleteDestinatario(index)}>
+												<Trash2 size={14} />
+											</Button>
+										</div>
+									</TableCell>
+								</TableRow>
+							{/each}
+						{/if}
+					</TableBody>
+				</Table>
+			</div>
+
+			<div class="flex gap-2">
+				<Button size="sm" onclick={openNewDestinatario}>
+					<Plus class="mr-1.5" size={14} />
+					Nuevo
+				</Button>
+				<Button
+					size="sm"
+					variant="outline"
+					disabled={formData?.destinatarios?.length === 0}
+					onclick={() => {
+						const index = 0;
+						if (formData?.destinatarios?.[index]) openEditDestinatario(index);
+					}}
+				>
+					<Pencil class="mr-1.5" size={14} />
+					Editar
+				</Button>
+				<Button
+					size="sm"
+					variant="destructive"
+					disabled={formData?.destinatarios?.length === 0}
+					onclick={() => {
+						const index = 0;
+						if (formData?.destinatarios?.[index]) deleteDestinatario(index);
+					}}
+				>
+					<Trash2 class="mr-1.5" size={14} />
+					Borrar
+				</Button>
+			</div>
+		</CardContent>
+	</Card>
+</div>
+
+<!-- Dialog para Descargos -->
+<Dialog bind:open={isDescargoDialogOpen}>
+	<DialogContent class="max-w-3xl">
+		<DialogHeader>
+			<DialogTitle>
+				{editingDescargoIndex !== null ? 'Editar Descargo' : 'Nuevo Descargo'}
+			</DialogTitle>
+		</DialogHeader>
+
+		<div class="grid gap-4 py-4">
+			<div class="grid grid-cols-3 gap-4">
+				<div class="space-y-2">
+					<Label for="d_patente">Patente *</Label>
+					<Input id="d_patente" bind:value={currentDescargo.patente} placeholder="0000" />
+				</div>
+				<div class="space-y-2">
+					<Label for="d_pedimento">Pedimento *</Label>
+					<Input
+						id="d_pedimento"
+						bind:value={currentDescargo.pedimento}
+						placeholder="00  00  0000  0000000"
+					/>
+				</div>
+				<div class="space-y-2">
+					<Label for="d_aduana">Aduana *</Label>
+					<Input id="d_aduana" bind:value={currentDescargo.aduana} placeholder="00" />
+				</div>
+			</div>
+
+			<div class="grid grid-cols-2 gap-4">
+				<div class="space-y-2">
+					<Label for="d_clave">Clave *</Label>
+					<Input id="d_clave" bind:value={currentDescargo.clave} placeholder="Clave" />
+				</div>
+				<div class="space-y-2">
+					<Label for="d_fecha_pago">Fecha Pago *</Label>
+					<Input id="d_fecha_pago" type="date" bind:value={currentDescargo.fecha_pago} />
+				</div>
+			</div>
+
+			<div class="grid grid-cols-3 gap-4">
+				<div class="space-y-2">
+					<Label for="d_fraccion">Fracción *</Label>
+					<Input id="d_fraccion" bind:value={currentDescargo.fraccion} placeholder="0000.00.00" />
+				</div>
+				<div class="space-y-2">
+					<Label for="d_umt">UMT *</Label>
+					<Input id="d_umt" bind:value={currentDescargo.umt} placeholder="Ej: KG" />
+				</div>
+				<div class="space-y-2">
+					<Label for="d_cantidad_tarifa">Cantidad Tarifa *</Label>
+					<Input
+						id="d_cantidad_tarifa"
+						type="number"
+						step="0.01"
+						bind:value={currentDescargo.cantidad_tarifa}
+						placeholder="0.00"
+					/>
+				</div>
+			</div>
+		</div>
+
+		<DialogFooter>
+			<Button variant="outline" onclick={() => (isDescargoDialogOpen = false)}>Cancelar</Button>
+			<Button
+				onclick={saveDescargo}
+				disabled={!currentDescargo.patente ||
+					!currentDescargo.pedimento ||
+					!currentDescargo.aduana ||
+					!currentDescargo.clave ||
+					!currentDescargo.fecha_pago ||
+					!currentDescargo.fraccion ||
+					!currentDescargo.umt}
+			>
+				{editingDescargoIndex !== null ? 'Actualizar' : 'Guardar'}
+			</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
+
+<!-- Dialog para Destinatarios -->
+<Dialog bind:open={isDestinatarioDialogOpen}>
+	<DialogContent class="max-w-2xl">
+		<DialogHeader>
+			<DialogTitle>
+				{editingDestinatarioIndex !== null ? 'Editar Destinatario' : 'Nuevo Destinatario'}
+			</DialogTitle>
+		</DialogHeader>
+
+		<div class="grid gap-4 py-4">
+			<div class="space-y-2">
+				<Label for="dest_clave">Clave *</Label>
+				<Input id="dest_clave" bind:value={currentDestinatario.clave} placeholder="Clave" />
+			</div>
+
+			<div class="space-y-2">
+				<Label for="dest_identificacion">Identificación Fiscal *</Label>
+				<Input
+					id="dest_identificacion"
+					bind:value={currentDestinatario.identificacion_fiscal}
+					placeholder="RFC o identificación fiscal"
+				/>
+			</div>
+
+			<div class="space-y-2">
+				<Label for="dest_nombre">Nombre *</Label>
+				<Input
+					id="dest_nombre"
+					bind:value={currentDestinatario.nombre}
+					placeholder="Nombre del destinatario"
+				/>
+			</div>
+		</div>
+
+		<DialogFooter>
+			<Button variant="outline" onclick={() => (isDestinatarioDialogOpen = false)}
+				>Cancelar</Button
+			>
+			<Button
+				onclick={saveDestinatario}
+				disabled={!currentDestinatario.clave ||
+					!currentDestinatario.identificacion_fiscal ||
+					!currentDestinatario.nombre}
+			>
+				{editingDestinatarioIndex !== null ? 'Actualizar' : 'Guardar'}
+			</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
diff --git a/frontend/src/lib/components/dashboard/pedimentos/edit/digitalizacion-tab-form.svelte b/frontend/src/lib/components/dashboard/pedimentos/edit/digitalizacion-tab-form.svelte
new file mode 100644
index 00000000..689ee413
--- /dev/null
+++ b/frontend/src/lib/components/dashboard/pedimentos/edit/digitalizacion-tab-form.svelte
@@ -0,0 +1,414 @@
+<script lang="ts">
+	import { Card, CardContent } from '$lib/components/ui/card';
+	import { Button } from '$lib/components/ui/button';
+	import { Input } from '$lib/components/ui/input';
+	import { Label } from '$lib/components/ui/label';
+	import {
+		Table,
+		TableBody,
+		TableCell,
+		TableHead,
+		TableHeader,
+		TableRow
+	} from '$lib/components/ui/table';
+	import {
+		Dialog,
+		DialogContent,
+		DialogHeader,
+		DialogTitle,
+		DialogFooter
+	} from '$lib/components/ui/dialog';
+	import { Textarea } from '$lib/components/ui/textarea';
+	import {
+		Plus,
+		Pencil,
+		Trash2,
+		Upload,
+		FileText,
+		Search,
+		FolderOpen,
+		CheckCircle,
+		ChevronsLeft,
+		ChevronLeft,
+		ChevronRight,
+		ChevronsRight
+	} from 'lucide-svelte';
+
+	interface Digitalizacion {
+		id?: number;
+		linea: number;
+		clave: string;
+		documento: string;
+		e_document: string;
+		operacion: string;
+		observaciones: string;
+	}
+
+	let {
+		formData = $bindable({
+			digitalizaciones: [] as Digitalizacion[]
+		})
+	}: {
+		formData: {
+			digitalizaciones: Digitalizacion[];
+		};
+	} = $props();
+
+	// Estados para diálogo
+	let isDialogOpen = $state(false);
+	let editingIndex = $state<number | null>(null);
+
+	// Paginación
+	let currentPage = $state(0);
+	let pageSize = 10;
+
+	let currentDigitalizacion = $state<Digitalizacion>({
+		linea: 0,
+		clave: '',
+		documento: '',
+		e_document: '',
+		operacion: '',
+		observaciones: ''
+	});
+
+	const totalPages = $derived(
+		Math.ceil((formData?.digitalizaciones?.length ?? 0) / pageSize)
+	);
+
+	const paginatedDigitalizaciones = $derived(
+		formData?.digitalizaciones?.slice(
+			currentPage * pageSize,
+			(currentPage + 1) * pageSize
+		) ?? []
+	);
+
+	function openNewDigitalizacion() {
+		editingIndex = null;
+		const nextLinea = formData?.digitalizaciones?.length
+			? Math.max(...formData.digitalizaciones.map((d) => d.linea)) + 1
+			: 1;
+		currentDigitalizacion = {
+			linea: nextLinea,
+			clave: '',
+			documento: '',
+			e_document: '',
+			operacion: '',
+			observaciones: ''
+		};
+		isDialogOpen = true;
+	}
+
+	function openEditDigitalizacion(index: number) {
+		if (!formData?.digitalizaciones) return;
+		const realIndex = currentPage * pageSize + index;
+		editingIndex = realIndex;
+		currentDigitalizacion = { ...formData.digitalizaciones[realIndex] };
+		isDialogOpen = true;
+	}
+
+	function saveDigitalizacion() {
+		if (!formData?.digitalizaciones) return;
+		if (editingIndex !== null) {
+			formData.digitalizaciones[editingIndex] = { ...currentDigitalizacion };
+		} else {
+			formData.digitalizaciones = [...formData.digitalizaciones, { ...currentDigitalizacion }];
+		}
+		isDialogOpen = false;
+	}
+
+	function deleteDigitalizacion(index: number) {
+		if (!formData?.digitalizaciones) return;
+		const realIndex = currentPage * pageSize + index;
+		if (confirm('¿Está seguro de eliminar esta digitalización?')) {
+			formData.digitalizaciones = formData.digitalizaciones.filter((_, i) => i !== realIndex);
+			// Reordenar líneas
+			formData.digitalizaciones = formData.digitalizaciones.map((d, idx) => ({
+				...d,
+				linea: idx + 1
+			}));
+			// Ajustar página si es necesario
+			if (paginatedDigitalizaciones.length === 0 && currentPage > 0) {
+				currentPage--;
+			}
+		}
+	}
+
+	function digitalizarVU() {
+		alert('Digitalizar en VU no implementado aún');
+	}
+
+	function acuseDigitalizacion() {
+		alert('Acuse de Digitalización no implementado aún');
+	}
+
+	function procesarDigitalizacion() {
+		alert('Procesar Digitalización no implementado aún');
+	}
+
+	function consultarOperacion() {
+		alert('Consultar Operación no implementado aún');
+	}
+
+	function abrirDocumento() {
+		alert('Abrir Documento no implementado aún');
+	}
+
+	function cargarEDocument() {
+		alert('Cargar E-Document no implementado aún');
+	}
+
+	function goToFirstPage() {
+		currentPage = 0;
+	}
+
+	function goToPreviousPage() {
+		if (currentPage > 0) currentPage--;
+	}
+
+	function goToNextPage() {
+		if (currentPage < totalPages - 1) currentPage++;
+	}
+
+	function goToLastPage() {
+		currentPage = totalPages - 1;
+	}
+</script>
+
+<Card>
+	<CardContent class="p-6 space-y-4">
+		<!-- Tabla de digitalizaciones -->
+		<div class="border rounded-lg overflow-hidden">
+			<Table>
+				<TableHeader>
+					<TableRow>
+						<TableHead class="w-[80px]">Línea</TableHead>
+						<TableHead>Clave</TableHead>
+						<TableHead>Documento</TableHead>
+						<TableHead>E-Document</TableHead>
+						<TableHead>Operación</TableHead>
+						<TableHead>Observaciones</TableHead>
+						<TableHead class="w-[100px]">Acciones</TableHead>
+					</TableRow>
+				</TableHeader>
+				<TableBody>
+					{#if !formData?.digitalizaciones || formData.digitalizaciones.length === 0}
+						<TableRow>
+							<TableCell colspan={7} class="text-center text-muted-foreground py-8">
+								No hay digitalizaciones registradas
+							</TableCell>
+						</TableRow>
+					{:else if paginatedDigitalizaciones.length === 0}
+						<TableRow>
+							<TableCell colspan={7} class="text-center text-muted-foreground py-8">
+								No hay datos en esta página
+							</TableCell>
+						</TableRow>
+					{:else}
+						{#each paginatedDigitalizaciones as digitalizacion, index}
+							<TableRow>
+								<TableCell class="font-medium">{digitalizacion.linea}</TableCell>
+								<TableCell>{digitalizacion.clave}</TableCell>
+								<TableCell>{digitalizacion.documento}</TableCell>
+								<TableCell>{digitalizacion.e_document}</TableCell>
+								<TableCell>{digitalizacion.operacion}</TableCell>
+								<TableCell class="max-w-[200px] truncate" title={digitalizacion.observaciones}>
+									{digitalizacion.observaciones}
+								</TableCell>
+								<TableCell>
+									<div class="flex gap-1">
+										<Button
+											size="sm"
+											variant="ghost"
+											onclick={() => openEditDigitalizacion(index)}
+										>
+											<Pencil size={14} />
+										</Button>
+										<Button size="sm" variant="ghost" onclick={() => deleteDigitalizacion(index)}>
+											<Trash2 size={14} />
+										</Button>
+									</div>
+								</TableCell>
+							</TableRow>
+						{/each}
+					{/if}
+				</TableBody>
+			</Table>
+		</div>
+
+		<!-- Controles de paginación -->
+		{#if formData?.digitalizaciones && formData.digitalizaciones.length > 0}
+			<div class="flex items-center justify-center gap-2 border-t pt-3">
+				<Button
+					size="sm"
+					variant="outline"
+					onclick={goToFirstPage}
+					disabled={currentPage === 0}
+					class="w-8 h-8 p-0"
+				>
+					<ChevronsLeft size={16} />
+				</Button>
+				<Button
+					size="sm"
+					variant="outline"
+					onclick={goToPreviousPage}
+					disabled={currentPage === 0}
+					class="w-8 h-8 p-0"
+				>
+					<ChevronLeft size={16} />
+				</Button>
+				<span class="text-sm text-muted-foreground px-2">
+					Página {currentPage + 1} de {totalPages || 1}
+				</span>
+				<Button
+					size="sm"
+					variant="outline"
+					onclick={goToNextPage}
+					disabled={currentPage >= totalPages - 1}
+					class="w-8 h-8 p-0"
+				>
+					<ChevronRight size={16} />
+				</Button>
+				<Button
+					size="sm"
+					variant="outline"
+					onclick={goToLastPage}
+					disabled={currentPage >= totalPages - 1}
+					class="w-8 h-8 p-0"
+				>
+					<ChevronsRight size={16} />
+				</Button>
+			</div>
+		{/if}
+
+		<!-- Botones de acción -->
+		<div class="flex flex-wrap gap-2 border-t pt-4">
+			<Button size="sm" variant="outline" onclick={digitalizarVU}>
+				<Upload class="mr-1.5" size={14} />
+				Digitalizar en VU
+			</Button>
+			<Button size="sm" variant="outline" onclick={acuseDigitalizacion}>
+				<CheckCircle class="mr-1.5" size={14} />
+				Acuse de Digitalización
+			</Button>
+			<Button size="sm" variant="outline" onclick={procesarDigitalizacion}>
+				<FileText class="mr-1.5" size={14} />
+				Procesar Digitalización
+			</Button>
+			<Button size="sm" onclick={openNewDigitalizacion}>
+				<Plus class="mr-1.5" size={14} />
+				Nuevo
+			</Button>
+			<Button
+				size="sm"
+				variant="outline"
+				disabled={formData?.digitalizaciones?.length === 0}
+				onclick={() => {
+					if (paginatedDigitalizaciones[0]) openEditDigitalizacion(0);
+				}}
+			>
+				<Pencil class="mr-1.5" size={14} />
+				Editar
+			</Button>
+			<Button
+				size="sm"
+				variant="destructive"
+				disabled={formData?.digitalizaciones?.length === 0}
+				onclick={() => {
+					if (paginatedDigitalizaciones[0]) deleteDigitalizacion(0);
+				}}
+			>
+				<Trash2 class="mr-1.5" size={14} />
+				Borrar
+			</Button>
+			<Button size="sm" variant="outline" onclick={consultarOperacion}>
+				<Search class="mr-1.5" size={14} />
+				Consultar Operación
+			</Button>
+			<Button size="sm" variant="outline" onclick={abrirDocumento}>
+				<FolderOpen class="mr-1.5" size={14} />
+				Abrir Documento
+			</Button>
+			<Button size="sm" variant="outline" onclick={cargarEDocument}>
+				<Upload class="mr-1.5" size={14} />
+				Cargar E-Document
+			</Button>
+		</div>
+	</CardContent>
+</Card>
+
+<!-- Dialog para Digitalización -->
+<Dialog bind:open={isDialogOpen}>
+	<DialogContent class="max-w-2xl">
+		<DialogHeader>
+			<DialogTitle>
+				{editingIndex !== null ? 'Editar Digitalización' : 'Nueva Digitalización'}
+			</DialogTitle>
+		</DialogHeader>
+
+		<div class="grid gap-4 py-4">
+			<div class="grid grid-cols-2 gap-4">
+				<div class="space-y-2">
+					<Label for="linea">Línea *</Label>
+					<Input
+						id="linea"
+						type="number"
+						bind:value={currentDigitalizacion.linea}
+						placeholder="1"
+						readonly
+					/>
+				</div>
+				<div class="space-y-2">
+					<Label for="clave">Clave *</Label>
+					<Input id="clave" bind:value={currentDigitalizacion.clave} placeholder="Clave" />
+				</div>
+			</div>
+
+			<div class="space-y-2">
+				<Label for="documento">Documento *</Label>
+				<Input
+					id="documento"
+					bind:value={currentDigitalizacion.documento}
+					placeholder="Nombre o tipo del documento"
+				/>
+			</div>
+
+			<div class="space-y-2">
+				<Label for="e_document">E-Document</Label>
+				<Input
+					id="e_document"
+					bind:value={currentDigitalizacion.e_document}
+					placeholder="Referencia del documento electrónico"
+				/>
+			</div>
+
+			<div class="space-y-2">
+				<Label for="operacion">Operación</Label>
+				<Input
+					id="operacion"
+					bind:value={currentDigitalizacion.operacion}
+					placeholder="Tipo de operación"
+				/>
+			</div>
+
+			<div class="space-y-2">
+				<Label for="observaciones">Observaciones</Label>
+				<Textarea
+					id="observaciones"
+					bind:value={currentDigitalizacion.observaciones}
+					placeholder="Observaciones adicionales"
+					rows={3}
+				/>
+			</div>
+		</div>
+
+		<DialogFooter>
+			<Button variant="outline" onclick={() => (isDialogOpen = false)}>Cancelar</Button>
+			<Button
+				onclick={saveDigitalizacion}
+				disabled={!currentDigitalizacion.clave || !currentDigitalizacion.documento}
+			>
+				{editingIndex !== null ? 'Actualizar' : 'Guardar'}
+			</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
diff --git a/frontend/src/lib/components/dashboard/pedimentos/edit/facturas-tab-form.svelte b/frontend/src/lib/components/dashboard/pedimentos/edit/facturas-tab-form.svelte
new file mode 100644
index 00000000..11b3d105
--- /dev/null
+++ b/frontend/src/lib/components/dashboard/pedimentos/edit/facturas-tab-form.svelte
@@ -0,0 +1,530 @@
+<script lang="ts">
+	import { Card, CardContent } from '$lib/components/ui/card';
+	import { Button } from '$lib/components/ui/button';
+	import { Input } from '$lib/components/ui/input';
+	import { Label } from '$lib/components/ui/label';
+	import {
+		Table,
+		TableBody,
+		TableCell,
+		TableHead,
+		TableHeader,
+		TableRow
+	} from '$lib/components/ui/table';
+	import {
+		Dialog,
+		DialogContent,
+		DialogHeader,
+		DialogTitle,
+		DialogFooter
+	} from '$lib/components/ui/dialog';
+	import * as Select from '$lib/components/ui/select';
+	import Checkbox from '$lib/components/ui/checkbox/checkbox.svelte';
+	import { Textarea } from '$lib/components/ui/textarea';
+	import {
+		Plus,
+		Pencil,
+		Trash2,
+		FileSpreadsheet,
+		FileText,
+		Check,
+		RotateCw,
+		ArrowUpDown
+	} from 'lucide-svelte';
+
+	interface Factura {
+		id?: number;
+		numero_factura: string;
+		fecha: string;
+		proveedor: string;
+		pais: string;
+		moneda: string;
+		valor_factura: number;
+		valor_usd: number;
+		es_consolidado: boolean;
+		arribo_consolidado: boolean;
+		inicio?: string;
+		fin?: string;
+		detalle_e_document?: string;
+	}
+
+	let {
+		formData = $bindable({
+			facturas: [] as Factura[]
+		})
+	}: {
+		formData: {
+			facturas: Factura[];
+		};
+	} = $props();
+
+	let isDialogOpen = $state(false);
+	let editingIndex = $state<number | null>(null);
+	let selectedFacturas = $state<Set<number>>(new Set());
+
+	let currentFactura = $state<Factura>({
+		numero_factura: '',
+		fecha: '',
+		proveedor: '',
+		pais: '',
+		moneda: 'USD',
+		valor_factura: 0,
+		valor_usd: 0,
+		es_consolidado: false,
+		arribo_consolidado: false,
+		inicio: '',
+		fin: '',
+		detalle_e_document: ''
+	});
+
+	const monedas = ['USD', 'MXN', 'EUR', 'CAD', 'JPY', 'GBP', 'CHF'];
+	const paises = [
+		'Estados Unidos',
+		'México',
+		'Canadá',
+		'China',
+		'Alemania',
+		'Japón',
+		'Reino Unido',
+		'Francia',
+		'Italia',
+		'España',
+		'Corea del Sur',
+		'India'
+	];
+
+	const totalFacturas = $derived(formData?.facturas?.length ?? 0);
+	const sumaPesos = $derived(
+		formData?.facturas?.reduce((sum, f) => sum + (f.valor_factura || 0), 0) ?? 0
+	);
+	const sumaDolares = $derived(formData?.facturas?.reduce((sum, f) => sum + (f.valor_usd || 0), 0) ?? 0);
+
+	function openNewFactura() {
+		editingIndex = null;
+		currentFactura = {
+			numero_factura: '',
+			fecha: '',
+			proveedor: '',
+			pais: '',
+			moneda: 'USD',
+			valor_factura: 0,
+			valor_usd: 0,
+			es_consolidado: false,
+			arribo_consolidado: false,
+			inicio: '',
+			fin: '',
+			detalle_e_document: ''
+		};
+		isDialogOpen = true;
+	}
+
+	function openEditFactura(index: number) {
+		if (!formData?.facturas) return;
+		editingIndex = index;
+		currentFactura = { ...formData.facturas[index] };
+		isDialogOpen = true;
+	}
+
+	function saveFactura() {
+		if (!formData?.facturas) return;
+		if (editingIndex !== null) {
+			formData.facturas[editingIndex] = { ...currentFactura };
+		} else {
+			formData.facturas = [...formData.facturas, { ...currentFactura }];
+		}
+		isDialogOpen = false;
+	}
+
+	function deleteFactura(index: number) {
+		if (!formData?.facturas) return;
+		if (confirm('¿Está seguro de eliminar esta factura?')) {
+			formData.facturas = formData.facturas.filter((_, i) => i !== index);
+		}
+	}
+
+	function clearForm() {
+		currentFactura = {
+			numero_factura: '',
+			fecha: '',
+			proveedor: '',
+			pais: '',
+			moneda: 'USD',
+			valor_factura: 0,
+			valor_usd: 0,
+			es_consolidado: false,
+			arribo_consolidado: false,
+			inicio: '',
+			fin: '',
+			detalle_e_document: ''
+		};
+	}
+
+	function toggleSelectFactura(index: number) {
+		if (selectedFacturas.has(index)) {
+			selectedFacturas.delete(index);
+		} else {
+			selectedFacturas.add(index);
+		}
+		selectedFacturas = new Set(selectedFacturas);
+	}
+
+	function selectAllWithoutCove() {
+		// Esta función seleccionaría facturas sin COVE
+		// Por ahora seleccionamos todas
+		if (!formData?.facturas) return;
+		selectedFacturas = new Set(formData.facturas.map((_, i) => i));
+	}
+
+	function deleteSelectedFacturas() {
+		if (!formData?.facturas) return;
+		if (selectedFacturas.size === 0) {
+			alert('No hay facturas seleccionadas');
+			return;
+		}
+		if (confirm(`¿Está seguro de eliminar ${selectedFacturas.size} factura(s)?`)) {
+			formData.facturas = formData.facturas.filter((_, i) => !selectedFacturas.has(i));
+			selectedFacturas = new Set();
+		}
+	}
+
+	function validateVentanillaUnica() {
+		alert('Validación en Ventanilla Única no implementada aún');
+	}
+
+	function importFacturas() {
+		alert('Importación de facturas no implementada aún');
+	}
+
+	function overwriteFacturas() {
+		alert('Sobre escribir facturas no implementado aún');
+	}
+
+	function reorderFacturas() {
+		alert('Reordenar facturas no implementado aún');
+	}
+
+	function datosSonana() {
+		alert('Datos Sonana no implementado aún');
+	}
+</script>
+
+<Card>
+	<CardContent class="p-6 space-y-4">
+		<!-- Barra de herramientas superior -->
+		<div class="flex flex-wrap gap-2 border-b pb-4">
+			<Button size="sm" variant="outline" onclick={clearForm}>
+				<RotateCw class="mr-1.5" size={14} />
+				Limpiar
+			</Button>
+			<Button size="sm" variant="outline" onclick={selectAllWithoutCove}>
+				<Check class="mr-1.5" size={14} />
+				Selec. sin cove
+			</Button>
+			<Button size="sm" onclick={openNewFactura}>
+				<Plus class="mr-1.5" size={14} />
+				Nuevo
+			</Button>
+			<Button
+				size="sm"
+				variant="outline"
+				disabled={selectedFacturas.size !== 1}
+				onclick={() => {
+					const index = Array.from(selectedFacturas)[0];
+					if (index !== undefined) openEditFactura(index);
+				}}
+			>
+				<Pencil class="mr-1.5" size={14} />
+				Editar
+			</Button>
+			<Button
+				size="sm"
+				variant="destructive"
+				disabled={selectedFacturas.size !== 1}
+				onclick={() => {
+					const index = Array.from(selectedFacturas)[0];
+					if (index !== undefined) deleteFactura(index);
+				}}
+			>
+				<Trash2 class="mr-1.5" size={14} />
+				Borrar
+			</Button>
+			<Button
+				size="sm"
+				variant="destructive"
+				disabled={selectedFacturas.size === 0}
+				onclick={deleteSelectedFacturas}
+			>
+				<Trash2 class="mr-1.5" size={14} />
+				Borrar Facturas Selec.
+			</Button>
+			<Button size="sm" variant="outline" onclick={validateVentanillaUnica}>
+				<Check class="mr-1.5" size={14} />
+				Validar en Ventanilla Única
+			</Button>
+			<Button size="sm" variant="outline" onclick={importFacturas}>
+				<FileSpreadsheet class="mr-1.5" size={14} />
+				Imp Facturas
+			</Button>
+			<Button size="sm" variant="outline" onclick={overwriteFacturas}>
+				<FileText class="mr-1.5" size={14} />
+				Sobre escribir
+			</Button>
+			<Button size="sm" variant="outline" onclick={reorderFacturas}>
+				<ArrowUpDown class="mr-1.5" size={14} />
+				Reordenar
+			</Button>
+			<Button size="sm" variant="outline" onclick={datosSonana}>
+				<FileText class="mr-1.5" size={14} />
+				Datos Sonana
+			</Button>
+		</div>
+
+		<!-- Tabla de facturas -->
+		<div class="border rounded-lg overflow-hidden">
+			<Table>
+				<TableHeader>
+					<TableRow>
+						<TableHead class="w-[50px]">Sel.</TableHead>
+						<TableHead>Núm. Factura</TableHead>
+						<TableHead>Fecha</TableHead>
+						<TableHead>Proveedor</TableHead>
+						<TableHead>País</TableHead>
+						<TableHead>Moneda</TableHead>
+						<TableHead class="text-right">Valor Factura</TableHead>
+						<TableHead class="text-right">Valor USD</TableHead>
+						<TableHead class="text-center">Consolidado</TableHead>
+						<TableHead class="text-center">Arribo Consol.</TableHead>
+						<TableHead class="w-[100px]">Acciones</TableHead>
+					</TableRow>
+				</TableHeader>
+				<TableBody>
+				{#if !formData?.facturas || formData.facturas.length === 0}
+						<TableRow>
+							<TableCell colspan={11} class="text-center text-muted-foreground py-8">
+								No hay facturas registradas. Haga clic en "Nuevo" para agregar una.
+							</TableCell>
+						</TableRow>
+					{:else}
+						{#each formData.facturas as factura, index}
+							<TableRow>
+								<TableCell>
+									<Checkbox
+										checked={selectedFacturas.has(index)}
+										onCheckedChange={() => toggleSelectFactura(index)}
+									/>
+								</TableCell>
+								<TableCell class="font-medium">{factura.numero_factura}</TableCell>
+								<TableCell>{factura.fecha}</TableCell>
+								<TableCell>{factura.proveedor}</TableCell>
+								<TableCell>{factura.pais}</TableCell>
+								<TableCell>{factura.moneda}</TableCell>
+								<TableCell class="text-right"
+									>{factura.valor_factura.toLocaleString('es-MX', {
+										minimumFractionDigits: 2,
+										maximumFractionDigits: 2
+									})}</TableCell
+								>
+								<TableCell class="text-right"
+									>{factura.valor_usd.toLocaleString('es-MX', {
+										minimumFractionDigits: 2,
+										maximumFractionDigits: 2
+									})}</TableCell
+								>
+								<TableCell class="text-center">
+									{#if factura.es_consolidado}
+										<Check class="inline" size={16} />
+									{/if}
+								</TableCell>
+								<TableCell class="text-center">
+									{#if factura.arribo_consolidado}
+										<Check class="inline" size={16} />
+									{/if}
+								</TableCell>
+								<TableCell>
+									<div class="flex gap-1">
+										<Button size="sm" variant="ghost" onclick={() => openEditFactura(index)}>
+											<Pencil size={14} />
+										</Button>
+										<Button size="sm" variant="ghost" onclick={() => deleteFactura(index)}>
+											<Trash2 size={14} />
+										</Button>
+									</div>
+								</TableCell>
+							</TableRow>
+						{/each}
+					{/if}
+				</TableBody>
+			</Table>
+		</div>
+
+		<!-- Totales -->
+		<div class="flex gap-6 text-sm font-medium border-t pt-4">
+			<div>Facturas: <span class="text-primary">{totalFacturas}</span></div>
+			<div>
+				Suma Pesos: <span class="text-primary"
+					>{sumaPesos.toLocaleString('es-MX', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
+					MXN</span
+				>
+			</div>
+			<div>
+				Suma USD: <span class="text-primary"
+					>{sumaDolares.toLocaleString('es-MX', {
+						minimumFractionDigits: 2,
+						maximumFractionDigits: 2
+					})} USD</span
+				>
+			</div>
+		</div>
+	</CardContent>
+</Card>
+
+<!-- Dialog para agregar/editar factura -->
+<Dialog bind:open={isDialogOpen}>
+	<DialogContent class="max-w-2xl max-h-[90vh] overflow-y-auto">
+		<DialogHeader>
+			<DialogTitle>{editingIndex !== null ? 'Editar Factura' : 'Nueva Factura'}</DialogTitle>
+		</DialogHeader>
+
+		<div class="grid gap-4 py-4">
+			<div class="grid grid-cols-2 gap-4">
+				<div class="space-y-2">
+					<Label for="numero_factura">Núm. de Factura *</Label>
+					<Input
+						id="numero_factura"
+						bind:value={currentFactura.numero_factura}
+						placeholder="Ej: INV-2024-001"
+					/>
+				</div>
+				<div class="space-y-2">
+					<Label for="fecha">Fecha *</Label>
+					<Input id="fecha" type="date" bind:value={currentFactura.fecha} />
+				</div>
+			</div>
+
+			<div class="space-y-2">
+				<Label for="proveedor">Proveedor *</Label>
+				<Input
+					id="proveedor"
+					bind:value={currentFactura.proveedor}
+					placeholder="Nombre del proveedor"
+				/>
+			</div>
+
+			<div class="grid grid-cols-2 gap-4">
+				<div class="space-y-2">
+					<Label for="pais">País *</Label>
+					<Select.Root
+						type="single"
+						value={currentFactura.pais}
+						onValueChange={(v: string | undefined) => v && (currentFactura.pais = v)}
+					>
+						<Select.Trigger id="pais">
+							{currentFactura.pais || 'Seleccionar país'}
+						</Select.Trigger>
+						<Select.Content>
+							{#each paises as pais}
+								<Select.Item value={pais}>{pais}</Select.Item>
+							{/each}
+						</Select.Content>
+					</Select.Root>
+				</div>
+				<div class="space-y-2">
+					<Label for="moneda">Moneda *</Label>
+					<Select.Root
+						type="single"
+						value={currentFactura.moneda}
+						onValueChange={(v: string | undefined) => v && (currentFactura.moneda = v)}
+					>
+						<Select.Trigger id="moneda">
+							{currentFactura.moneda || 'Seleccionar moneda'}
+						</Select.Trigger>
+						<Select.Content>
+							{#each monedas as moneda}
+								<Select.Item value={moneda}>{moneda}</Select.Item>
+							{/each}
+						</Select.Content>
+					</Select.Root>
+				</div>
+			</div>
+
+			<div class="grid grid-cols-2 gap-4">
+				<div class="space-y-2">
+					<Label for="valor_factura">Valor Factura *</Label>
+					<Input
+						id="valor_factura"
+						type="number"
+						step="0.01"
+						bind:value={currentFactura.valor_factura}
+						placeholder="0.00"
+					/>
+				</div>
+				<div class="space-y-2">
+					<Label for="valor_usd">Valor USD *</Label>
+					<Input
+						id="valor_usd"
+						type="number"
+						step="0.01"
+						bind:value={currentFactura.valor_usd}
+						placeholder="0.00"
+					/>
+				</div>
+			</div>
+
+			<div class="grid grid-cols-2 gap-4">
+				<div class="flex items-center space-x-2">
+					<Checkbox
+						id="es_consolidado"
+						checked={currentFactura.es_consolidado}
+						onCheckedChange={(checked: boolean | 'indeterminate') => (currentFactura.es_consolidado = checked === true)}
+					/>
+					<Label for="es_consolidado" class="font-normal cursor-pointer">Es Consolidado</Label>
+				</div>
+				<div class="flex items-center space-x-2">
+					<Checkbox
+						id="arribo_consolidado"
+						checked={currentFactura.arribo_consolidado}
+						onCheckedChange={(checked: boolean | 'indeterminate') => (currentFactura.arribo_consolidado = checked === true)}
+					/>
+					<Label for="arribo_consolidado" class="font-normal cursor-pointer"
+						>Arribo Consolidado</Label
+					>
+				</div>
+			</div>
+
+			<div class="grid grid-cols-2 gap-4">
+				<div class="space-y-2">
+					<Label for="inicio">Inicio</Label>
+					<Input id="inicio" type="date" bind:value={currentFactura.inicio} />
+				</div>
+				<div class="space-y-2">
+					<Label for="fin">Fin</Label>
+					<Input id="fin" type="date" bind:value={currentFactura.fin} />
+				</div>
+			</div>
+
+			<div class="space-y-2">
+				<Label for="detalle_e_document">Detalle de E_Document</Label>
+				<Textarea
+					id="detalle_e_document"
+					bind:value={currentFactura.detalle_e_document}
+					placeholder="Detalles adicionales del documento electrónico"
+					rows={3}
+				/>
+			</div>
+		</div>
+
+		<DialogFooter>
+			<Button variant="outline" onclick={() => (isDialogOpen = false)}>Cancelar</Button>
+			<Button
+				onclick={saveFactura}
+				disabled={!currentFactura.numero_factura ||
+					!currentFactura.fecha ||
+					!currentFactura.proveedor ||
+					!currentFactura.pais ||
+					!currentFactura.moneda}
+			>
+				{editingIndex !== null ? 'Actualizar' : 'Guardar'}
+			</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
diff --git a/frontend/src/lib/components/dashboard/pedimentos/edit/general-tab-form.svelte b/frontend/src/lib/components/dashboard/pedimentos/edit/general-tab-form.svelte
index 2d72efb2..74c29207 100644
--- a/frontend/src/lib/components/dashboard/pedimentos/edit/general-tab-form.svelte
+++ b/frontend/src/lib/components/dashboard/pedimentos/edit/general-tab-form.svelte
@@ -4,6 +4,7 @@
 	import { Label } from '$lib/components/ui/label';
 	import * as Select from '$lib/components/ui/select';
 	import { getExchangeRateByDate } from '$lib/api/dashboard/a76/exchange-rate';
+	import { companyStore } from '$lib/stores/company.svelte';
 	import type { Pedimento } from '$lib/api/dashboard/a76/pedimentos';
 	import type { PedimentoCode } from '$lib/api/dashboard/refrence_data/pedimento_codes';
 	import type { CustomsSection } from '$lib/api/dashboard/refrence_data/customs_sections';
@@ -29,6 +30,9 @@
 		codePedimentoRegimens?: CodePedimentoRegimen[];
 	} = $props();
 
+	// Estado para controlar la sección activa de la navegación
+	let activeSection = $state('fechas');
+
 	// Extraer regímenes únicos de codePedimentoRegimens
 	const uniqueRegimens = $derived(
 		Array.from(new Set(codePedimentoRegimens.map(r => r.regimen_code).filter((code): code is string => code !== null)))
@@ -198,6 +202,11 @@
 
 	// Obtener el año actual (últimos 2 dígitos)
 	const currentYear = String(new Date().getFullYear()).slice(-2);
+	
+	// Obtener fecha y hora actual para captura
+	const now = new Date();
+	const currentDate = now.toISOString().substring(0, 10); // YYYY-MM-DD
+	const currentTime = now.toTimeString().substring(0, 5); // HH:MM
 
 	// Inicializar formData con los valores del pedimento (o vacío si es null)
 	if (!formData) {
@@ -223,7 +232,10 @@
 		extraction_date: datesData?.extraction_date ? datesData.extraction_date.substring(0, 10) : '',
 		rectification_payment_date: datesData?.rectification_payment_date ? datesData.rectification_payment_date.substring(0, 10) : '',
 		original_date: datesData?.original_date ? datesData.original_date.substring(0, 10) : '',
-		payment_date: datesData?.payment_date ? datesData.payment_date.substring(0, 10) : ''
+		payment_date: datesData?.payment_date ? datesData.payment_date.substring(0, 10) : '',
+		// Campos de captura automática
+		fecha_captura: currentDate,
+		hora_captura: currentTime
 		};
 	}
 
@@ -236,10 +248,10 @@
 
 	// Obtener automáticamente el tipo de cambio cuando cambie la fecha de entrada
 	$effect(() => {
-		if (formData && formData.entry_date) {
+		if (formData && formData.entry_date && companyStore.activeCompany) {
 			console.log('Buscando tipo de cambio para fecha:', formData.entry_date);
 			
-			getExchangeRateByDate(formData.entry_date)
+			getExchangeRateByDate(formData.entry_date, companyStore.activeCompany.id)
 				.then(usdRate => {
 					console.log('Tipo de cambio USD encontrado:', usdRate);
 					if (usdRate && formData) {
@@ -277,6 +289,14 @@
 		{ value: 'consolidado', label: 'Consolidado' },
 		{ value: 'normal', label: 'Normal' }
 	];
+
+	const tipoOperacionOptions = [
+		{ value: 'incrementables', label: 'Incrementables' },
+		{ value: 'identificadores', label: 'Identificadores' },
+		{ value: 'indices', label: 'Indices' },
+		{ value: 'adicional', label: 'Adicional' },
+		{ value: 'decrementable', label: 'Decrementable' }
+	];
 </script>
 
 <Card.Root>
@@ -346,7 +366,7 @@
 					<Select.Root 
 						type="single" 
 						value={formData.license || ''}
-						onValueChange={(v: string) => formData.license = v ?? ''}
+						onValueChange={(v: string | undefined) => formData.license = v || null}
 					>
 						<Select.Trigger class="w-full md:w-24">
 							<span class="truncate">
@@ -354,12 +374,17 @@
 							</span>
 						</Select.Trigger>
 						<Select.Content class="max-w-[300px] max-h-[300px]">
+							{@const validBrokers = customsBrokers.filter(b => b.license)}
 							{#if customsBrokers.length === 0}
 								<div class="px-2 py-1.5 text-sm text-muted-foreground">
-									No hay patentes disponibles
+									No hay agentes aduanales registrados
+								</div>
+							{:else if validBrokers.length === 0}
+								<div class="px-2 py-1.5 text-sm text-muted-foreground">
+									No hay patentes válidas. Edita el agente aduanal para agregar su patente.
 								</div>
 							{:else}
-								{#each customsBrokers as broker}
+								{#each validBrokers as broker}
 									{@const displayName = broker.name || broker.broker_key || ''}
 									<Select.Item value={broker.license}>
 										<span class="truncate overflow-hidden text-ellipsis whitespace-nowrap" title={displayName ? `${displayName} - ${broker.license}` : broker.license}>
@@ -560,7 +585,9 @@
 						</Select.Content>
 					</Select.Root>
 				</div>
-
+			</div>
+		
+			<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
 				<!-- Valor USD -->
 				<div class="space-y-2">
 					<Label for="usd_value">Valor USD</Label>
@@ -595,71 +622,540 @@
 						bind:value={formData.gross_weight}
 						placeholder="Ej: 100.00"
 					/>
-				</div>				
-			</div>
+				</div>
 
-			<!-- Fechas -->
-			<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
-				<!-- Fecha de Entrada -->
+				<!-- Despacho -->
 				<div class="space-y-2">
-					<Label for="entry_date">Fecha de Entrada</Label>
+					<Label for="despacho">Despacho</Label>
 					<Input
-						id="entry_date"
-						type="date"
-						bind:value={formData.entry_date}
+						id="despacho"
+						type="number"
+						bind:value={formData.despacho}
+						placeholder="0"
 					/>
 				</div>
 
-				<!-- Fecha de Presentación -->
+				<!-- Aduana E/S -->
 				<div class="space-y-2">
-					<Label for="pedimento_date">Fecha de Presentación</Label>
+					<Label for="aduana_es">Aduana E/S</Label>
 					<Input
-						id="pedimento_date"
-						type="date"
-						bind:value={formData.pedimento_date}
+						id="aduana_es"
+						type="number"
+						bind:value={formData.aduana_es}
+						placeholder="0"
 					/>
 				</div>
 
-				<!-- Fecha de Extracción -->
+				<!-- E/S -->
 				<div class="space-y-2">
-					<Label for="extraction_date">Fecha de Extracción</Label>
+					<Label for="es">E/S</Label>
 					<Input
-						id="extraction_date"
-						type="date"
-						bind:value={formData.extraction_date}
+						id="es"
+						type="number"
+						bind:value={formData.es}
+						placeholder="0"
 					/>
 				</div>
 
-				<!-- Fecha de Pago Rectificación -->
+				<!-- Fecha de Captura -->
 				<div class="space-y-2">
-					<Label for="rectification_payment_date">Fecha de Pago R1</Label>
+					<Label for="fecha_captura">Fecha de Captura</Label>
 					<Input
-						id="rectification_payment_date"
+						id="fecha_captura"
 						type="date"
-						bind:value={formData.rectification_payment_date}
+						bind:value={formData.fecha_captura}
+						readonly
+						disabled
+						class="bg-muted cursor-not-allowed"
 					/>
 				</div>
 
-				<!-- Fecha Original -->
+				<!-- Hora de Captura -->
 				<div class="space-y-2">
-					<Label for="original_date">Fecha de Pago Original</Label>
+					<Label for="hora_captura">Hora de Captura</Label>
 					<Input
-						id="original_date"
-						type="date"
-						bind:value={formData.original_date}
-					/>
-				</div>
-
-				<!-- Fecha de Pago -->
-				<div class="space-y-2">
-					<Label for="payment_date">Fecha de Pago</Label>
-					<Input
-						id="payment_date"
-						type="date"
-						bind:value={formData.payment_date}
+						id="hora_captura"
+						type="time"
+						bind:value={formData.hora_captura}
+						readonly
+						disabled
+						class="bg-muted cursor-not-allowed"
 					/>
 				</div>
 			</div>
+
+			<!-- Lista de navegación rápida -->
+		<div class="w-full overflow-x-auto pb-2">
+			<div class="inline-flex md:grid md:w-full md:grid-cols-6 bg-muted p-1 text-muted-foreground rounded-md">
+				<button 
+					type="button"
+					onclick={() => activeSection = 'fechas'}
+					data-state={activeSection === 'fechas' ? 'active' : ''}
+					class="inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 cursor-pointer hover:bg-background/50 data-[state=active]:border data-[state=active]:border-white/60 data-[state=active]:text-foreground"
+				>
+					Fechas
+				</button>
+				<button 
+					type="button"
+					onclick={() => activeSection = 'incrementables'}
+					data-state={activeSection === 'incrementables' ? 'active' : ''}
+					class="inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 cursor-pointer hover:bg-background/50 data-[state=active]:border data-[state=active]:border-white/60 data-[state=active]:text-foreground"
+				>
+					Incrementables
+				</button>
+				<button 
+					type="button"
+					onclick={() => activeSection = 'identificadores'}
+					data-state={activeSection === 'identificadores' ? 'active' : ''}
+					class="inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 cursor-pointer hover:bg-background/50 data-[state=active]:border data-[state=active]:border-white/60 data-[state=active]:text-foreground"
+				>
+					Identificadores
+				</button>
+				<button 
+					type="button"
+					onclick={() => activeSection = 'indices'}
+					data-state={activeSection === 'indices' ? 'active' : ''}
+					class="inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 cursor-pointer hover:bg-background/50 data-[state=active]:border data-[state=active]:border-white/60 data-[state=active]:text-foreground"
+				>
+					Indices
+				</button>
+				<button 
+					type="button"
+					onclick={() => activeSection = 'adicional'}
+					data-state={activeSection === 'adicional' ? 'active' : ''}
+					class="inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 cursor-pointer hover:bg-background/50 data-[state=active]:border data-[state=active]:border-white/60 data-[state=active]:text-foreground"
+				>
+					Adicional
+				</button>
+				<button 
+					type="button"
+					onclick={() => activeSection = 'decrementable'}
+					data-state={activeSection === 'decrementable' ? 'active' : ''}
+					class="inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 cursor-pointer hover:bg-background/50 data-[state=active]:border data-[state=active]:border-white/60 data-[state=active]:text-foreground"
+				>
+					Decrementable
+				</button>
+			</div>
+		</div>
+
+			<!-- Contenido dinámico según la sección activa -->
+			{#if activeSection === 'fechas'}
+				<!-- Fechas -->
+				<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+					<!-- Fecha de Entrada -->
+					<div class="space-y-2">
+						<Label for="entry_date">Fecha de Entrada</Label>
+						<Input
+							id="entry_date"
+							type="date"
+							bind:value={formData.entry_date}
+						/>
+					</div>
+
+					<!-- Fecha de Presentación -->
+					<div class="space-y-2">
+						<Label for="pedimento_date">Fecha de Presentación</Label>
+						<Input
+							id="pedimento_date"
+							type="date"
+							bind:value={formData.pedimento_date}
+						/>
+					</div>
+
+					<!-- Fecha de Extracción -->
+					<div class="space-y-2">
+						<Label for="extraction_date">Fecha de Extracción</Label>
+						<Input
+							id="extraction_date"
+							type="date"
+							bind:value={formData.extraction_date}
+						/>
+					</div>
+
+					<!-- Fecha de Pago Rectificación -->
+					<div class="space-y-2">
+						<Label for="rectification_payment_date">Fecha de Pago R1</Label>
+						<Input
+							id="rectification_payment_date"
+							type="date"
+							bind:value={formData.rectification_payment_date}
+						/>
+					</div>
+
+					<!-- Fecha Original -->
+					<div class="space-y-2">
+						<Label for="original_date">Fecha de Pago Original</Label>
+						<Input
+							id="original_date"
+							type="date"
+							bind:value={formData.original_date}
+						/>
+					</div>
+
+					<!-- Fecha de Pago -->
+					<div class="space-y-2">
+						<Label for="payment_date">Fecha de Pago</Label>
+						<Input
+							id="payment_date"
+							type="date"
+							bind:value={formData.payment_date}
+						/>
+					</div>
+				</div>
+			{:else if activeSection === 'incrementables'}
+				<!-- Incrementables -->
+				<div class="space-y-4">
+					<!-- Factor informativo -->
+					<div class="text-sm font-medium">
+						Factor: 1.00000
+					</div>
+
+					<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+					<!-- Valor Seguro -->
+					<div class="space-y-2">
+						<Label for="valor_seguro">Valor Seguro</Label>
+						<Input
+							id="valor_seguro"
+							type="number"
+							bind:value={formData.valor_seguro}
+							placeholder="0.00"
+						/>
+					</div>
+
+					<!-- Embalajes -->
+					<div class="space-y-2">
+						<Label for="embalajes">Embalajes</Label>
+						<Input
+							id="embalajes"
+							type="number"
+							bind:value={formData.embalajes}
+							placeholder="0.00"
+						/>
+					</div>
+
+					<!-- Fletes -->
+					<div class="space-y-2">
+						<Label for="fletes">Fletes</Label>
+						<Input
+							id="fletes"
+							type="number"
+							bind:value={formData.fletes}
+							placeholder="0.00"
+						/>
+					</div>
+
+					<!-- Deducibles -->
+					<div class="space-y-2">
+						<Label for="deducibles">Deducibles</Label>
+						<Input
+							id="deducibles"
+							type="number"
+							bind:value={formData.deducibles}
+							placeholder="0.00"
+						/>
+					</div>
+
+					<!-- Moneda -->
+					<div class="space-y-2">
+						<Label for="moneda_incrementables">Moneda</Label>
+						<Input
+							id="moneda_incrementables"
+							type="number"
+							bind:value={formData.moneda_incrementables}
+							placeholder="0.00"
+						/>
+					</div>
+
+					<!-- Checkboxes agrupados -->
+					<div class="space-y-2">
+						<Label class="invisible">Opciones</Label>
+						<div class="space-y-2">
+							<div class="flex items-center space-x-2">
+								<input
+									id="no_afectar_valor_dolares_inc"
+									type="checkbox"
+									bind:checked={formData.no_afectar_valor_dolares_inc}
+									class="h-4 w-4 rounded border-gray-300 text-primary focus:ring-0"
+								/>
+								<Label for="no_afectar_valor_dolares_inc" class="!m-0 cursor-pointer">
+									No Afectar Valor en Dólares del Pedimento
+								</Label>
+							</div>
+							<div class="flex items-center space-x-2">
+								<input
+									id="no_afectar_valor_aduana"
+									type="checkbox"
+									bind:checked={formData.no_afectar_valor_aduana}
+									class="h-4 w-4 rounded border-gray-300 text-primary focus:ring-0"
+								/>
+								<Label for="no_afectar_valor_aduana" class="!m-0 cursor-pointer">
+									No Afectar Valor Aduana del Pedimento
+								</Label>
+							</div>
+						</div>
+					</div>
+					</div>
+				</div>
+			{:else if activeSection === 'identificadores'}
+				<!-- Identificadores -->
+				<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+					<p class="text-muted-foreground col-span-full">Campos de Identificadores - Por configurar</p>
+				</div>
+			{:else if activeSection === 'indices'}
+				<!-- Indices -->
+				<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+					<!-- Tipo de Factor a Actualizar -->
+					<div class="space-y-2">
+						<Label for="tipo_factor">Tipo de Factor a Actualizar</Label>
+						<Select.Root 
+							type="single"
+							value={formData.tipo_factor || ''}
+							onValueChange={(v: string) => formData.tipo_factor = v ?? ''}
+						>
+							<Select.Trigger id="tipo_factor" class="w-full">
+								<span class="truncate">
+									{formData.tipo_factor === 'INPC' ? 'I.N.P.C' : formData.tipo_factor === 'variacion_cambiaria' ? 'Variación Cambiaria' : 'Seleccionar'}
+								</span>
+							</Select.Trigger>
+							<Select.Content>
+								<Select.Item value="INPC">I.N.P.C</Select.Item>
+								<Select.Item value="variacion_cambiaria">Variación Cambiaria</Select.Item>
+							</Select.Content>
+						</Select.Root>
+					</div>
+
+					<!-- Factor Actualización -->
+					<div class="space-y-2">
+						<Label for="factor_actualizacion">Factor Actualización</Label>
+						<Input
+							id="factor_actualizacion"
+							type="number"
+							bind:value={formData.factor_actualizacion}
+							placeholder="0.00"
+						/>
+					</div>
+
+					<!-- Factor Actualización Manual -->
+					<div class="space-y-2">
+						<Label for="factor_actualizacion_manual" class="invisible">Checkbox</Label>
+						<div class="flex items-center space-x-2 h-10">
+							<input
+								id="factor_actualizacion_manual"
+								type="checkbox"
+								bind:checked={formData.factor_actualizacion_manual}
+								class="h-4 w-4 rounded border-gray-300 text-primary focus:ring-0"
+							/>
+							<Label for="factor_actualizacion_manual" class="!m-0 cursor-pointer">
+								Factor Actualización Manual
+							</Label>
+						</div>
+					</div>
+				</div>
+			{:else if activeSection === 'adicional'}
+				<!-- Adicional -->
+				<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+					<!-- Año para la impresión del pedimento -->
+					<div class="space-y-2">
+						<Label for="anio_impresion">Año para la Impresión del Pedimento</Label>
+						<Input
+							id="anio_impresion"
+							type="text"
+							bind:value={formData.anio_impresion}
+							placeholder="25"
+							maxlength={2}
+							class="text-center w-40 focus-visible:ring-0 focus-visible:ring-offset-0"
+						/>
+					</div>
+
+					<!-- Agregar Identificador PO Automáticamente -->
+					<div class="space-y-2">
+						<Label for="agregar_po_auto" class="invisible">Checkbox</Label>
+						<div class="flex items-center space-x-2 h-10">
+							<input
+								id="agregar_po_auto"
+								type="checkbox"
+								bind:checked={formData.agregar_po_auto}
+								class="h-4 w-4 rounded border-gray-300 text-primary focus:ring-primary"
+							/>
+							<Label for="agregar_po_auto" class="!m-0 cursor-pointer">
+								Agregar Identificador PO Automáticamente
+							</Label>
+						</div>
+					</div>
+
+					<!-- No Eximir Normas ComplementoX -->
+					<div class="space-y-2">
+						<Label for="no_eximir_normas" class="invisible">Checkbox</Label>
+						<div class="flex items-center space-x-2 h-10">
+							<input
+								id="no_eximir_normas"
+								type="checkbox"
+								bind:checked={formData.no_eximir_normas}
+								class="h-4 w-4 rounded border-gray-300 text-primary focus:ring-primary"
+							/>
+							<Label for="no_eximir_normas" class="!m-0 cursor-pointer">
+								No Eximir Normas ComplementoX
+							</Label>
+						</div>
+					</div>
+
+					<!-- Activar Destinatario en Facturas -->
+					<div class="space-y-2">
+						<Label for="activar_destinatario" class="invisible">Checkbox</Label>
+						<div class="flex items-center space-x-2 h-10">
+							<input
+								id="activar_destinatario"
+								type="checkbox"
+								bind:checked={formData.activar_destinatario}
+								class="h-4 w-4 rounded border-gray-300 text-primary focus:ring-primary"
+							/>
+							<Label for="activar_destinatario" class="!m-0 cursor-pointer">
+								Activar Destinatario en Facturas
+							</Label>
+						</div>
+					</div>
+
+					<!-- Agregar Registro 502 en Archivo de Validación (Consolidados) -->
+					<div class="space-y-2">
+						<Label for="agregar_registro_502" class="invisible">Checkbox</Label>
+						<div class="flex items-center space-x-2 h-10">
+							<input
+								id="agregar_registro_502"
+								type="checkbox"
+								bind:checked={formData.agregar_registro_502}
+								class="h-4 w-4 rounded border-gray-300 text-primary focus:ring-primary"
+							/>
+							<Label for="agregar_registro_502" class="!m-0 cursor-pointer">
+								Agregar Registro 502 en Archivo de Validación (Consolidados)
+							</Label>
+						</div>
+					</div>
+
+					<!-- Agregar y Quitar Normas -->
+					<div class="space-y-2">
+						<Label for="agregar_quitar_normas" class="invisible">Checkbox</Label>
+						<div class="flex items-center space-x-2 h-10">
+							<input
+								id="agregar_quitar_normas"
+								type="checkbox"
+								bind:checked={formData.agregar_quitar_normas}
+								class="h-4 w-4 rounded border-gray-300 text-primary focus:ring-primary"
+							/>
+							<Label for="agregar_quitar_normas" class="!m-0 cursor-pointer">
+								Agregar y Quitar Normas
+							</Label>
+						</div>
+					</div>
+
+					<!-- Elegir Facturar con COVE en Partidas -->
+					<div class="space-y-2">
+						<Label for="facturar_cove" class="invisible">Checkbox</Label>
+						<div class="flex items-center space-x-2 h-10">
+							<input
+								id="facturar_cove"
+								type="checkbox"
+								bind:checked={formData.facturar_cove}
+								class="h-4 w-4 rounded border-gray-300 text-primary focus:ring-primary"
+							/>
+							<Label for="facturar_cove" class="!m-0 cursor-pointer">
+								Elegir Facturar con COVE en Partidas
+							</Label>
+						</div>
+					</div>
+				</div>
+			{:else if activeSection === 'decrementable'}
+				<!-- Decrementable -->
+				<div class="space-y-4">
+					<!-- Factor informativo -->
+					<div class="text-sm font-medium">
+						Factor: 0.05000
+					</div>
+
+					<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+					<!-- Fletes -->
+					<div class="space-y-2">
+						<Label for="fletes_decrementable">Fletes</Label>
+						<Input
+							id="fletes_decrementable"
+							type="number"
+							bind:value={formData.fletes_decrementable}
+							placeholder="0.00"
+						/>
+					</div>
+
+					<!-- Seguros -->
+					<div class="space-y-2">
+						<Label for="seguros">Seguros</Label>
+						<Input
+							id="seguros"
+							type="number"
+							bind:value={formData.seguros}
+							placeholder="0.00"
+						/>
+					</div>
+
+					<!-- Carga -->
+					<div class="space-y-2">
+						<Label for="carga">Carga</Label>
+						<Input
+							id="carga"
+							type="number"
+							bind:value={formData.carga}
+							placeholder="0.00"
+						/>
+					</div>
+
+					<!-- Descarga -->
+					<div class="space-y-2">
+						<Label for="descarga">Descarga</Label>
+						<Input
+							id="descarga"
+							type="number"
+							bind:value={formData.descarga}
+							placeholder="0.00"
+						/>
+					</div>
+
+					<!-- Otros -->
+					<div class="space-y-2">
+						<Label for="otros">Otros</Label>
+						<Input
+							id="otros"
+							type="number"
+							bind:value={formData.otros}
+							placeholder="0.00"
+						/>
+					</div>
+
+					<!-- Moneda -->
+					<div class="space-y-2">
+						<Label for="moneda_decrementable">Moneda</Label>
+						<Input
+							id="moneda_decrementable"
+							type="text"
+							bind:value={formData.moneda_decrementable}
+							placeholder="USD"
+						/>
+					</div>
+
+					<!-- Afectar Valor en Dólares del Pedimento -->
+					<div class="space-y-2">
+						<Label for="afectar_valor_dolares" class="invisible">Checkbox</Label>
+						<div class="flex items-center space-x-2 h-10">
+							<input
+								id="afectar_valor_dolares"
+								type="checkbox"
+								bind:checked={formData.afectar_valor_dolares}
+								class="h-4 w-4 rounded border-gray-300 text-primary focus:ring-0"
+							/>
+							<Label for="afectar_valor_dolares" class="!m-0 cursor-pointer">
+								Afectar Valor en Dólares del Pedimento
+							</Label>
+						</div>
+						</div>
+					</div>
+				</div>
+			{/if}
 		</div>
 	</Card.Content>
 </Card.Root>
diff --git a/frontend/src/lib/components/dashboard/pedimentos/edit/otros-datos-tab-form.svelte b/frontend/src/lib/components/dashboard/pedimentos/edit/otros-datos-tab-form.svelte
new file mode 100644
index 00000000..82a8e138
--- /dev/null
+++ b/frontend/src/lib/components/dashboard/pedimentos/edit/otros-datos-tab-form.svelte
@@ -0,0 +1,1709 @@
+<script lang="ts">
+	import { Card, CardContent, CardHeader, CardTitle } from '$lib/components/ui/card';
+	import { Button } from '$lib/components/ui/button';
+	import { Input } from '$lib/components/ui/input';
+	import { Label } from '$lib/components/ui/label';
+	import * as Select from '$lib/components/ui/select';
+	import Checkbox from '$lib/components/ui/checkbox/checkbox.svelte';
+	import {
+		Table,
+		TableBody,
+		TableCell,
+		TableHead,
+		TableHeader,
+		TableRow
+	} from '$lib/components/ui/table';
+	import {
+		Calculator,
+		FileText,
+		RotateCw,
+		AlertCircle,
+		FileCheck,
+		FileX,
+		Download,
+		ChevronsLeft,
+		ChevronLeft,
+		ChevronRight,
+		ChevronsRight,
+		Plus,
+		Pencil,
+		Trash2,
+		Printer,
+		Upload,
+		Truck,
+		Car,
+		Package
+	} from 'lucide-svelte';
+
+	interface OtrosDatosFormData {
+		// Parámetros de cálculo
+		tipo_calculo: string;
+		dta_por_operacion_ag_facturas: boolean;
+		dta_por_numero_vehiculos: boolean;
+		paga_iva: boolean;
+		paga_prevalidacion: boolean;
+
+		// Opciones de cálculo
+		aplicar_dta_8_millar_partida: boolean;
+		incluir_eci: boolean;
+		deducible_recargos: boolean;
+		cuota_fija_adicional_vehiculo: boolean;
+		cuota_fija_adicional_fp: string;
+
+		// Actualización Pedimento Normal
+		actualizar_iva: boolean;
+		actualizar_advalorem: boolean;
+		actualizar_dta: boolean;
+		actualizar_cc: boolean;
+		actualizar_ieps: boolean;
+
+		// Parámetros de Pedimento
+		es_embajada: boolean;
+		embajada_dta: string;
+		regla_3_1_21_factores: boolean;
+		cambio_tarifa_anterior: string;
+
+		// Actualización en Rectificación
+		actualizar_iva_rect: boolean;
+		actualizar_advalorem_rect: boolean;
+		actualizar_dta_rect: boolean;
+		actualizar_cc_rect: boolean;
+		actualizar_ieps_rect: boolean;
+		calcular_recargos_diferencias: boolean;
+
+		// Parámetro de cambio de DTA
+		proveedor_nacional_modifico_dta: boolean;
+
+		// Opciones de cálculo de valor
+		calculo_valor_aduana_v2: boolean;
+		calculo_2_decimales_valor_unitario: boolean;
+		calcular_valor_aduana_base_partidas: boolean;
+
+		// Contribuciones para Recargo
+		recargo_igi: boolean;
+		recargo_iva: boolean;
+		recargo_ieps: boolean;
+		recargo_isan: boolean;
+		recargo_cc: boolean;
+
+		// Factor Incrementable Manual
+		factor_incrementable_manual: string;
+
+		// Otros
+		agregar_entidad_federativa_proveedor: boolean;
+	}
+
+	let {
+		formData = $bindable({
+			tipo_calculo: 'ninguno',
+			dta_por_operacion_ag_facturas: false,
+			dta_por_numero_vehiculos: false,
+			paga_iva: false,
+			paga_prevalidacion: false,
+			aplicar_dta_8_millar_partida: false,
+			incluir_eci: false,
+			deducible_recargos: false,
+			cuota_fija_adicional_vehiculo: false,
+			cuota_fija_adicional_fp: '0',
+			actualizar_iva: false,
+			actualizar_advalorem: false,
+			actualizar_dta: false,
+			actualizar_cc: false,
+			actualizar_ieps: false,
+			es_embajada: false,
+			embajada_dta: '0.00',
+			regla_3_1_21_factores: false,
+			cambio_tarifa_anterior: '',
+			actualizar_iva_rect: false,
+			actualizar_advalorem_rect: false,
+			actualizar_dta_rect: false,
+			actualizar_cc_rect: false,
+			actualizar_ieps_rect: false,
+			calcular_recargos_diferencias: false,
+			proveedor_nacional_modifico_dta: false,
+			calculo_valor_aduana_v2: false,
+			calculo_2_decimales_valor_unitario: false,
+			calcular_valor_aduana_base_partidas: false,
+			recargo_igi: false,
+			recargo_iva: false,
+			recargo_ieps: false,
+			recargo_isan: false,
+			recargo_cc: false,
+			factor_incrementable_manual: '0.00000000000000000000',
+			agregar_entidad_federativa_proveedor: false
+		})
+	}: {
+		formData: OtrosDatosFormData;
+	} = $props();
+
+	// Estados para vista de bitácora
+	let showBitacora = $state(false);
+	let currentBitacoraPage = $state(0);
+	let bitacoraPageSize = 10;
+
+	// Estados para vista de Partes II
+	let showPartesII = $state(false);
+	let currentPartesIIPage = $state(0);
+	let partesIIPageSize = 10;
+	let selectedEmbarques = $state<number[]>([]);
+
+	// Variable para rastrear vista activa
+	let activeView = $state<'calculos' | 'bitacora' | 'partesII' | 'rectificacion' | 'rectificacionII' | 'notas' | 'seleccionAutomatizada' | 'multas'>('calculos');
+
+	// Estados para vista de Rectificación
+	let showRectificacion = $state(false);
+	let rectificacionFormData = $state({
+		es_rectificacion: '',
+		pedimento_original: '00-0000:0000000',
+		clave_pedimento_original: '',
+		fecha_pago_original: '',
+		anio_impresion_rect: '',
+		aduana_seccion_original: '',
+		patente_original: '',
+		utilizar_fecha_pago_original: false,
+		calculo_manual_contribuciones: false
+	});
+	let liquidacionDiferencias = $state<
+		{ gravamen: string; forma_pago: string; importe: string }[]
+	>([]);
+
+	// Estados para vista de Rectificación II
+	let showRectificacionII = $state(false);
+	let rectificacionIIFormData = $state({
+		causa: '',
+		motivo: ''
+	});
+
+	// Estados para vista de Notas
+	let showNotas = $state(false);
+	let currentNotasPage = $state(0);
+	let notasPageSize = 10;
+	let notasPedimento = $state<
+		{ usuario: string; fecha: string; hora: string; comentario: string }[]
+	>([]);
+
+	// Estados para vista de Selección Automatizada
+	let showSeleccionAutomatizada = $state(false);
+	let seleccionAutomatizadaFormData = $state({
+		fecha_cruce: '',
+		primera_revision: '',
+		comentario_primera_revision: '',
+		segunda_revision: '',
+		comentario_segunda_revision: ''
+	});
+
+	// Estados para vista de Multas
+	let showMultas = $state(false);
+	let multasFormData = $state({
+		cargo: ''
+	});
+
+	// Datos de ejemplo para bitácora (en producción vendrían del servidor)
+	let bitacoraMovimientos = $state([
+		{
+			modulo: 'wPedimento',
+			pedimento: '16-3633:100:267',
+			movimiento: 'Agregar Pedimento 16-3633',
+			usuario: 'aleandro',
+			fecha: '24/11/2025',
+			hora: '03:01PM'
+		},
+		{
+			modulo: 'wPedimento',
+			pedimento: '16-3633:100:267',
+			movimiento: 'Inicio Pedimento 16-3633 sc',
+			usuario: 'aleandro',
+			fecha: '24/11/2025',
+			hora: '03:13PM'
+		},
+		{
+			modulo: 'wPedimento',
+			pedimento: '16-3633:100:267',
+			movimiento: 'Agregar Pedimento 16-3633 sc',
+			usuario: 'aleandro',
+			fecha: '24/11/2025',
+			hora: '03:13PM'
+		}
+	]);
+
+	const totalBitacoraPages = $derived(
+		Math.ceil(bitacoraMovimientos.length / bitacoraPageSize)
+	);
+
+	const paginatedBitacoraMovimientos = $derived(
+		bitacoraMovimientos.slice(
+			currentBitacoraPage * bitacoraPageSize,
+			(currentBitacoraPage + 1) * bitacoraPageSize
+		)
+	);
+
+	// Datos de ejemplo para Partes II (embarques parciales)
+	let embarquesParciales = $state([
+		{ numero: 1, identificacion: 'EMB001', precintos: 'P001, P002' },
+		{ numero: 2, identificacion: 'EMB002', precintos: 'P003' },
+		{ numero: 3, identificacion: 'EMB003', precintos: 'P004, P005, P006' }
+	]);
+
+	const totalPartesIIPages = $derived(Math.ceil(embarquesParciales.length / partesIIPageSize));
+
+	const paginatedEmbarquesParciales = $derived(
+		embarquesParciales.slice(
+			currentPartesIIPage * partesIIPageSize,
+			(currentPartesIIPage + 1) * partesIIPageSize
+		)
+	);
+
+	const totalNotasPages = $derived(Math.ceil(notasPedimento.length / notasPageSize));
+
+	const visibleNotas = $derived(
+		notasPedimento.slice(
+			currentNotasPage * notasPageSize,
+			(currentNotasPage + 1) * notasPageSize
+		)
+	);
+
+	function handleCalculos() {
+		showBitacora = false;
+		showPartesII = false;
+		showRectificacion = false;
+		showRectificacionII = false;
+		showNotas = false;
+		showSeleccionAutomatizada = false;
+		showMultas = false;
+		activeView = 'calculos';
+	}
+
+	function handleBitacora() {
+		showPartesII = false;
+		showRectificacion = false;
+		showRectificacionII = false;
+		showNotas = false;
+		showSeleccionAutomatizada = false;
+		showMultas = false;
+		showBitacora = !showBitacora;
+		if (showBitacora) {
+			currentBitacoraPage = 0;
+			activeView = 'bitacora';
+		} else {
+			activeView = 'calculos';
+		}
+	}
+
+	function handleExportarBitacora() {
+		alert('Exportar Bitácora no implementado');
+	}
+
+	function goToBitacoraFirstPage() {
+		currentBitacoraPage = 0;
+	}
+
+	function goToBitacoraPreviousPage() {
+		if (currentBitacoraPage > 0) currentBitacoraPage--;
+	}
+
+	function goToBitacoraNextPage() {
+		if (currentBitacoraPage < totalBitacoraPages - 1) currentBitacoraPage++;
+	}
+
+	function goToBitacoraLastPage() {
+		currentBitacoraPage = totalBitacoraPages - 1;
+	}
+
+	function handlePatesII() {
+		showBitacora = false;
+		showRectificacion = false;
+		showRectificacionII = false;
+		showNotas = false;
+		showSeleccionAutomatizada = false;
+		showMultas = false;
+		showPartesII = !showPartesII;
+		if (showPartesII) {
+			currentPartesIIPage = 0;
+			selectedEmbarques = [];
+			activeView = 'partesII';
+		} else {
+			activeView = 'calculos';
+		}
+	}
+
+	function goToPartesIIFirstPage() {
+		currentPartesIIPage = 0;
+	}
+
+	function goToPartesIIPreviousPage() {
+		if (currentPartesIIPage > 0) currentPartesIIPage--;
+	}
+
+	function goToPartesIINextPage() {
+		if (currentPartesIIPage < totalPartesIIPages - 1) currentPartesIIPage++;
+	}
+
+	function goToPartesIILastPage() {
+		currentPartesIIPage = totalPartesIIPages - 1;
+	}
+
+	function goToNotasFirstPage() {
+		currentNotasPage = 0;
+	}
+
+	function goToNotasPreviousPage() {
+		if (currentNotasPage > 0) currentNotasPage--;
+	}
+
+	function goToNotasNextPage() {
+		if (currentNotasPage < totalNotasPages - 1) currentNotasPage++;
+	}
+
+	function goToNotasLastPage() {
+		currentNotasPage = totalNotasPages - 1;
+	}
+
+	function toggleSelectAll() {
+		if (selectedEmbarques.length === embarquesParciales.length) {
+			selectedEmbarques = [];
+		} else {
+			selectedEmbarques = embarquesParciales.map((_, i) => i);
+		}
+	}
+
+	function handleNuevoEmbarque() {
+		alert('Nuevo Embarque no implementado');
+	}
+
+	function handleEditarEmbarque() {
+		alert('Editar Embarque no implementado');
+	}
+
+	function handleBorrarEmbarque() {
+		alert('Borrar Embarque no implementado');
+	}
+
+	function handleImprimirEmbarque() {
+		alert('Imprimir no implementado');
+	}
+
+	function handleImportarExcel() {
+		alert('Importar de Excel no implementado');
+	}
+
+	function handleTraerContenedores() {
+		alert('Traer Contenedores no implementado');
+	}
+
+	function handleTraerVehiculos() {
+		alert('Traer Vehículos no implementado');
+	}
+
+	function handleTraerTransportes() {
+		alert('Traer Transportes no implementado');
+	}
+
+	function handleRectificacion() {
+		showBitacora = false;
+		showPartesII = false;
+		showRectificacionII = false;
+		showNotas = false;
+		showSeleccionAutomatizada = false;
+		showMultas = false;
+		showRectificacion = !showRectificacion;
+		if (showRectificacion) {
+			activeView = 'rectificacion';
+		} else {
+			activeView = 'calculos';
+		}
+	}
+
+	function handleRectificacionII() {
+		showBitacora = false;
+		showPartesII = false;
+		showRectificacion = false;
+		showNotas = false;
+		showSeleccionAutomatizada = false;
+		showMultas = false;
+		showRectificacionII = !showRectificacionII;
+		if (showRectificacionII) {
+			activeView = 'rectificacionII';
+		} else {
+			activeView = 'calculos';
+		}
+	}
+
+	function handleNotas() {
+		showBitacora = false;
+		showPartesII = false;
+		showRectificacion = false;
+		showRectificacionII = false;
+		showSeleccionAutomatizada = false;
+		showMultas = false;
+		showNotas = !showNotas;
+		if (showNotas) {
+			currentNotasPage = 0;
+			activeView = 'notas';
+		} else {
+			activeView = 'calculos';
+		}
+	}
+
+	function handleSeleccionAutomatizada() {
+		showBitacora = false;
+		showPartesII = false;
+		showRectificacion = false;
+		showRectificacionII = false;
+		showNotas = false;
+		showMultas = false;
+		showSeleccionAutomatizada = !showSeleccionAutomatizada;
+		if (showSeleccionAutomatizada) {
+			activeView = 'seleccionAutomatizada';
+		} else {
+			activeView = 'calculos';
+		}
+	}
+
+	function handleExpDocumentos() {
+		showBitacora = false;
+		showPartesII = false;
+		showRectificacion = false;
+		showRectificacionII = false;
+		showNotas = false;
+		showSeleccionAutomatizada = false;
+		showMultas = false;
+		activeView = 'calculos';
+		alert('Exp. Documentos a Expediente no implementado');
+	}
+
+	function handleMultas() {
+		showBitacora = false;
+		showPartesII = false;
+		showRectificacion = false;
+		showRectificacionII = false;
+		showNotas = false;
+		showSeleccionAutomatizada = false;
+		showMultas = !showMultas;
+		if (showMultas) {
+			activeView = 'multas';
+		} else {
+			activeView = 'calculos';
+		}
+	}
+</script>
+
+<div class="grid grid-cols-1 lg:grid-cols-[1fr_auto] gap-4">
+	<!-- Panel principal con formularios -->
+	<div class="space-y-4">
+		{#if !showBitacora && !showPartesII && !showRectificacion && !showRectificacionII && !showNotas && !showSeleccionAutomatizada && !showMultas}
+			<!-- Opciones para el cálculo del Pedimento -->
+		<Card>
+			<CardHeader>
+				<CardTitle class="text-base">Opciones para el cálculo del Pedimento</CardTitle>
+			</CardHeader>
+			<CardContent class="space-y-6">
+				<!-- Primera fila: Parámetros de cálculo y Parámetros de Pedimento -->
+				<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
+					<!-- Parámetros de cálculo -->
+					<div class="space-y-3">
+						<h3 class="text-sm font-semibold">Parámetros de cálculo:</h3>
+						<div class="space-y-2">
+							<div class="space-y-1.5">
+								<Label for="tipo_calculo" class="text-xs">Tipo de Cálculo</Label>
+								<Select.Root
+									type="single"
+									value={formData?.tipo_calculo}
+									onValueChange={(v) => {
+										if (formData && v) formData.tipo_calculo = v;
+									}}
+								>
+									<Select.Trigger id="tipo_calculo" class="h-8">
+									<span class="truncate">
+										{formData?.tipo_calculo === 'ninguno'
+											? 'Ninguno'
+											: formData?.tipo_calculo === 'normal'
+												? 'Normal'
+												: formData?.tipo_calculo === 'simplificado'
+													? 'Simplificado'
+													: 'Seleccionar'}
+									</span>
+									</Select.Trigger>
+									<Select.Content>
+										<Select.Item value="ninguno">Ninguno</Select.Item>
+										<Select.Item value="normal">Normal</Select.Item>
+										<Select.Item value="simplificado">Simplificado</Select.Item>
+									</Select.Content>
+								</Select.Root>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox
+									id="dta_operacion"
+									bind:checked={formData.dta_por_operacion_ag_facturas}
+								/>
+								<Label for="dta_operacion" class="text-xs font-normal cursor-pointer">
+									DTA Por Operación (Ag. Facturas)
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox
+									id="dta_vehiculos"
+									bind:checked={formData.dta_por_numero_vehiculos}
+								/>
+								<Label for="dta_vehiculos" class="text-xs font-normal cursor-pointer">
+									DTA por Número de Vehículos
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox id="paga_iva" bind:checked={formData.paga_iva} />
+								<Label for="paga_iva" class="text-xs font-normal cursor-pointer">Paga IVA</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox id="paga_prev" bind:checked={formData.paga_prevalidacion} />
+								<Label for="paga_prev" class="text-xs font-normal cursor-pointer">
+									Paga Prevalidación
+								</Label>
+							</div>
+						</div>
+
+						<div class="space-y-2 border-t pt-3 mt-3">
+							<div class="flex items-center gap-2">
+								<Checkbox
+									id="aplicar_dta"
+									bind:checked={formData.aplicar_dta_8_millar_partida}
+								/>
+								<Label for="aplicar_dta" class="text-xs font-normal cursor-pointer">
+									Aplicar DTA 8 al millar por Partida
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox id="incluir_eci" bind:checked={formData.incluir_eci} />
+								<Label for="incluir_eci" class="text-xs font-normal cursor-pointer">
+									Incluir ECI
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox id="deducible_rec" bind:checked={formData.deducible_recargos} />
+								<Label for="deducible_rec" class="text-xs font-normal cursor-pointer">
+									Deducible Recargos
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox
+									id="cuota_fija_veh"
+									bind:checked={formData.cuota_fija_adicional_vehiculo}
+								/>
+								<Label for="cuota_fija_veh" class="text-xs font-normal cursor-pointer">
+									Cuota Fija Adicional por Vehículo
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Label for="cuota_fp" class="text-xs whitespace-nowrap">Cuota Fija Adicional F.P.:</Label>
+								<Input
+									id="cuota_fp"
+									type="number"
+									step="0.01"
+									bind:value={formData.cuota_fija_adicional_fp}
+									class="h-7 w-24"
+								/>
+							</div>
+						</div>
+					</div>
+
+					<!-- Parámetros de Pedimento -->
+					<div class="space-y-3">
+						<h3 class="text-sm font-semibold">Parámetros de Pedimento:</h3>
+						<div class="space-y-2">
+							<div class="flex items-center gap-2">
+								<Checkbox id="es_embajada" bind:checked={formData.es_embajada} />
+								<Label for="es_embajada" class="text-xs font-normal cursor-pointer">
+									Es Embajada
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Label for="embajada_dta" class="text-xs whitespace-nowrap">Embajada DTA:</Label>
+								<Input
+									id="embajada_dta"
+									type="number"
+									step="0.01"
+									bind:value={formData.embajada_dta}
+									class="h-7 w-24"
+								/>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox id="regla_3121" bind:checked={formData.regla_3_1_21_factores} />
+								<Label for="regla_3121" class="text-xs font-normal cursor-pointer">
+									Regla 3.1.21 (Factores)
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Label for="cambio_tarifa" class="text-xs whitespace-nowrap">
+									Cambio de Tarifa anterior:
+								</Label>
+								<Input
+									id="cambio_tarifa"
+									type="date"
+									bind:value={formData.cambio_tarifa_anterior}
+									class="h-7 w-40"
+								/>
+							</div>
+						</div>
+					</div>
+				</div>
+
+				<!-- Segunda fila: Parámetros de actualización -->
+				<div class="grid grid-cols-1 md:grid-cols-2 gap-6 border-t pt-4">
+					<!-- Parámetros para actualización en Pedimento Normal -->
+					<div class="space-y-3">
+						<h3 class="text-sm font-semibold">Parámetros para actualización en Pedimento Normal:</h3>
+						<div class="space-y-2">
+							<div class="flex items-center gap-2">
+								<Checkbox id="act_iva" bind:checked={formData.actualizar_iva} />
+								<Label for="act_iva" class="text-xs font-normal cursor-pointer">
+									Actualizar IVA
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox id="act_adv" bind:checked={formData.actualizar_advalorem} />
+								<Label for="act_adv" class="text-xs font-normal cursor-pointer">
+									Actualizar Advalorem
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox id="act_dta" bind:checked={formData.actualizar_dta} />
+								<Label for="act_dta" class="text-xs font-normal cursor-pointer">
+									Actualizar DTA
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox id="act_cc" bind:checked={formData.actualizar_cc} />
+								<Label for="act_cc" class="text-xs font-normal cursor-pointer">
+									Actualizar C.C
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox id="act_ieps" bind:checked={formData.actualizar_ieps} />
+								<Label for="act_ieps" class="text-xs font-normal cursor-pointer">
+									Actualizar IEPS
+								</Label>
+							</div>
+						</div>
+					</div>
+
+					<!-- Parámetros de actualización en Rectificación -->
+					<div class="space-y-3">
+						<h3 class="text-sm font-semibold">Parámetros de actualización en Rectificación:</h3>
+						<div class="space-y-2">
+							<div class="flex items-center gap-2">
+								<Checkbox id="act_iva_rect" bind:checked={formData.actualizar_iva_rect} />
+								<Label for="act_iva_rect" class="text-xs font-normal cursor-pointer">
+									Actualizar IVA
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox id="act_adv_rect" bind:checked={formData.actualizar_advalorem_rect} />
+								<Label for="act_adv_rect" class="text-xs font-normal cursor-pointer">
+									Actualizar Advalorem
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox id="act_dta_rect" bind:checked={formData.actualizar_dta_rect} />
+								<Label for="act_dta_rect" class="text-xs font-normal cursor-pointer">
+									Actualizar DTA
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox id="act_cc_rect" bind:checked={formData.actualizar_cc_rect} />
+								<Label for="act_cc_rect" class="text-xs font-normal cursor-pointer">
+									Actualizar C.C
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox id="act_ieps_rect" bind:checked={formData.actualizar_ieps_rect} />
+								<Label for="act_ieps_rect" class="text-xs font-normal cursor-pointer">
+									Actualizar IEPS
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox
+									id="calc_recargos"
+									bind:checked={formData.calcular_recargos_diferencias}
+								/>
+								<Label for="calc_recargos" class="text-xs font-normal cursor-pointer">
+									Calcular recargos sobre diferencias
+								</Label>
+							</div>
+						</div>
+					</div>
+				</div>
+
+				<!-- Tercera fila: Otras opciones -->
+				<div class="grid grid-cols-1 md:grid-cols-2 gap-6 border-t pt-4">
+					<!-- Parámetro de cambio de DTA -->
+					<div class="space-y-3">
+						<h3 class="text-sm font-semibold">Parámetro de cambio de DTA:</h3>
+						<div class="flex items-center gap-2">
+							<Checkbox
+								id="prov_nacional"
+								bind:checked={formData.proveedor_nacional_modifico_dta}
+							/>
+							<Label for="prov_nacional" class="text-xs font-normal cursor-pointer">
+								Proveedor Naconal [Modificó también DTA]
+							</Label>
+						</div>
+
+						<div class="space-y-2 mt-4">
+							<div class="flex items-center gap-2">
+								<Checkbox id="calc_v2" bind:checked={formData.calculo_valor_aduana_v2} />
+								<Label for="calc_v2" class="text-xs font-normal cursor-pointer">
+									Calculo del Valor Aduana Version 2.0
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox
+									id="calc_2dec"
+									bind:checked={formData.calculo_2_decimales_valor_unitario}
+								/>
+								<Label for="calc_2dec" class="text-xs font-normal cursor-pointer">
+									Calculo con 2 decimales de valor unitario
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox
+									id="calc_base_part"
+									bind:checked={formData.calcular_valor_aduana_base_partidas}
+								/>
+								<Label for="calc_base_part" class="text-xs font-normal cursor-pointer">
+									Calcular Valor Aduana a Base de Partidas
+								</Label>
+							</div>
+						</div>
+					</div>
+
+					<!-- Contribuciones tomadas para el Recargo -->
+					<div class="space-y-3">
+						<h3 class="text-sm font-semibold">
+							Contribuciones tomadas para el Recargo en Pedimento Normal:
+						</h3>
+						<div class="space-y-2">
+							<div class="flex items-center gap-2">
+								<Checkbox id="rec_igi" bind:checked={formData.recargo_igi} />
+								<Label for="rec_igi" class="text-xs font-normal cursor-pointer">
+									Recargo IGI
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox id="rec_iva" bind:checked={formData.recargo_iva} />
+								<Label for="rec_iva" class="text-xs font-normal cursor-pointer">
+									Recargo IVA
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox id="rec_ieps" bind:checked={formData.recargo_ieps} />
+								<Label for="rec_ieps" class="text-xs font-normal cursor-pointer">
+									Recargo IEPS
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox id="rec_isan" bind:checked={formData.recargo_isan} />
+								<Label for="rec_isan" class="text-xs font-normal cursor-pointer">
+									Recargo ISAN
+								</Label>
+							</div>
+
+							<div class="flex items-center gap-2">
+								<Checkbox id="rec_cc" bind:checked={formData.recargo_cc} />
+								<Label for="rec_cc" class="text-xs font-normal cursor-pointer">Recargo C.C</Label>
+							</div>
+						</div>
+					</div>
+				</div>
+
+				<!-- Factor Incrementable y otros -->
+				<div class="border-t pt-4 space-y-3">
+					<div class="flex items-center gap-2">
+						<Label for="factor_inc" class="text-xs whitespace-nowrap">
+							Factor Incrementable Manual:
+						</Label>
+						<Input
+							id="factor_inc"
+							type="text"
+							bind:value={formData.factor_incrementable_manual}
+							class="h-7 font-mono text-xs"
+							placeholder="0.00000000000000000000"
+						/>
+					</div>
+
+					<div class="flex items-center gap-2">
+						<Checkbox
+							id="agregar_entidad"
+							bind:checked={formData.agregar_entidad_federativa_proveedor}
+						/>
+						<Label for="agregar_entidad" class="text-xs font-normal cursor-pointer">
+							Agregar entidad federativa de proveedor, registro 505, campo 10
+						</Label>
+					</div>
+				</div>
+			</CardContent>
+		</Card>
+
+		{:else if showBitacora}
+			<!-- Vista de Bitácora -->
+			<Card>
+				<CardHeader>
+					<CardTitle class="text-base">Registro de movimientos sobre el Pedimento</CardTitle>
+				</CardHeader>
+				<CardContent class="space-y-4">
+					<div class="border rounded-lg overflow-hidden">
+						<Table>
+							<TableHeader>
+								<TableRow>
+									<TableHead class="w-[120px]">Módulo</TableHead>
+									<TableHead class="w-[150px]">Pedimento</TableHead>
+									<TableHead>Movimiento</TableHead>
+									<TableHead class="w-[100px]">Usuario</TableHead>
+									<TableHead class="w-[110px]">Fecha</TableHead>
+									<TableHead class="w-[90px]">Hora</TableHead>
+								</TableRow>
+							</TableHeader>
+							<TableBody>
+								{#if bitacoraMovimientos.length === 0}
+									<TableRow>
+										<TableCell colspan={6} class="text-center text-muted-foreground py-8">
+											No hay movimientos registrados
+										</TableCell>
+									</TableRow>
+								{:else if paginatedBitacoraMovimientos.length === 0}
+									<TableRow>
+										<TableCell colspan={6} class="text-center text-muted-foreground py-8">
+											No hay datos en esta página
+										</TableCell>
+									</TableRow>
+								{:else}
+									{#each paginatedBitacoraMovimientos as movimiento}
+										<TableRow>
+											<TableCell class="font-medium">{movimiento.modulo}</TableCell>
+											<TableCell>{movimiento.pedimento}</TableCell>
+											<TableCell>{movimiento.movimiento}</TableCell>
+											<TableCell>{movimiento.usuario}</TableCell>
+											<TableCell>{movimiento.fecha}</TableCell>
+											<TableCell>{movimiento.hora}</TableCell>
+										</TableRow>
+									{/each}
+								{/if}
+							</TableBody>
+						</Table>
+					</div>
+
+					<!-- Controles de paginación -->
+					{#if bitacoraMovimientos.length > 0}
+						<div class="flex items-center justify-center gap-2 border-t pt-3">
+							<Button
+								size="sm"
+								variant="outline"
+								onclick={goToBitacoraFirstPage}
+								disabled={currentBitacoraPage === 0}
+								class="w-8 h-8 p-0"
+							>
+								<ChevronsLeft size={16} />
+							</Button>
+							<Button
+								size="sm"
+								variant="outline"
+								onclick={goToBitacoraPreviousPage}
+								disabled={currentBitacoraPage === 0}
+								class="w-8 h-8 p-0"
+							>
+								<ChevronLeft size={16} />
+							</Button>
+							<span class="text-sm text-muted-foreground px-2">
+								Página {currentBitacoraPage + 1} de {totalBitacoraPages || 1}
+							</span>
+							<Button
+								size="sm"
+								variant="outline"
+								onclick={goToBitacoraNextPage}
+								disabled={currentBitacoraPage >= totalBitacoraPages - 1}
+								class="w-8 h-8 p-0"
+							>
+								<ChevronRight size={16} />
+							</Button>
+							<Button
+								size="sm"
+								variant="outline"
+								onclick={goToBitacoraLastPage}
+								disabled={currentBitacoraPage >= totalBitacoraPages - 1}
+								class="w-8 h-8 p-0"
+							>
+								<ChevronsRight size={16} />
+							</Button>
+						</div>
+					{/if}
+
+					<!-- Botón de exportar -->
+					<div class="border-t pt-3">
+						<Button size="sm" variant="outline" onclick={handleExportarBitacora}>
+							<Download class="mr-2" size={14} />
+							Exportar Bitácora
+						</Button>
+					</div>
+				</CardContent>
+			</Card>
+
+		{:else if showPartesII}
+			<!-- Vista de Partes II (Embarques Parciales) -->
+			<div class="grid grid-cols-1 lg:grid-cols-[1fr_auto] gap-4">
+				<!-- Tabla de embarques -->
+				<Card>
+					<CardHeader>
+						<CardTitle class="text-base">Embarques Parciales</CardTitle>
+					</CardHeader>
+					<CardContent class="space-y-4">
+						<div class="border rounded-lg overflow-hidden">
+							<Table>
+								<TableHeader>
+									<TableRow>
+										<TableHead class="w-[50px]">
+											<Checkbox
+												checked={selectedEmbarques.length === embarquesParciales.length &&
+													embarquesParciales.length > 0}
+												onclick={toggleSelectAll}
+											/>
+										</TableHead>
+										<TableHead class="w-[100px]">Número</TableHead>
+										<TableHead>Identificación</TableHead>
+										<TableHead>Precintos</TableHead>
+									</TableRow>
+								</TableHeader>
+								<TableBody>
+									{#if embarquesParciales.length === 0}
+										<TableRow>
+											<TableCell colspan={4} class="text-center text-muted-foreground py-8">
+												No hay embarques registrados
+											</TableCell>
+										</TableRow>
+									{:else if paginatedEmbarquesParciales.length === 0}
+										<TableRow>
+											<TableCell colspan={4} class="text-center text-muted-foreground py-8">
+												No hay datos en esta página
+											</TableCell>
+										</TableRow>
+									{:else}
+										{#each paginatedEmbarquesParciales as embarque, index}
+											<TableRow>
+												<TableCell>
+													<Checkbox
+														checked={selectedEmbarques.includes(
+															currentPartesIIPage * partesIIPageSize + index
+														)}
+														onclick={() => {
+															const globalIndex = currentPartesIIPage * partesIIPageSize + index;
+															if (selectedEmbarques.includes(globalIndex)) {
+																selectedEmbarques = selectedEmbarques.filter((i) => i !== globalIndex);
+															} else {
+																selectedEmbarques = [...selectedEmbarques, globalIndex];
+															}
+														}}
+													/>
+												</TableCell>
+												<TableCell class="font-medium">{embarque.numero}</TableCell>
+												<TableCell>{embarque.identificacion}</TableCell>
+												<TableCell>{embarque.precintos}</TableCell>
+											</TableRow>
+										{/each}
+									{/if}
+								</TableBody>
+							</Table>
+						</div>
+
+						<!-- Controles de paginación -->
+						{#if embarquesParciales.length > 0}
+							<div class="flex items-center justify-center gap-2 border-t pt-3">
+								<Button
+									size="sm"
+									variant="outline"
+									onclick={goToPartesIIFirstPage}
+									disabled={currentPartesIIPage === 0}
+									class="w-8 h-8 p-0"
+								>
+									<ChevronsLeft size={16} />
+								</Button>
+								<Button
+									size="sm"
+									variant="outline"
+									onclick={goToPartesIIPreviousPage}
+									disabled={currentPartesIIPage === 0}
+									class="w-8 h-8 p-0"
+								>
+									<ChevronLeft size={16} />
+								</Button>
+								<span class="text-sm text-muted-foreground px-2">
+									Página {currentPartesIIPage + 1} de {totalPartesIIPages || 1}
+								</span>
+								<Button
+									size="sm"
+									variant="outline"
+									onclick={goToPartesIINextPage}
+									disabled={currentPartesIIPage >= totalPartesIIPages - 1}
+									class="w-8 h-8 p-0"
+								>
+									<ChevronRight size={16} />
+								</Button>
+								<Button
+									size="sm"
+									variant="outline"
+									onclick={goToPartesIILastPage}
+									disabled={currentPartesIIPage >= totalPartesIIPages - 1}
+									class="w-8 h-8 p-0"
+								>
+									<ChevronsRight size={16} />
+								</Button>
+							</div>
+						{/if}
+
+						<!-- Botones de acción -->
+						<div class="flex flex-wrap gap-2 border-t pt-3">
+							<Button size="sm" variant="outline" onclick={toggleSelectAll}>
+								Seleccionar/Des Todo
+							</Button>
+							<Button size="sm" onclick={handleNuevoEmbarque}>
+								<Plus class="mr-1.5" size={14} />
+								Nuevo
+							</Button>
+							<Button
+								size="sm"
+								variant="outline"
+								disabled={embarquesParciales.length === 0}
+								onclick={handleEditarEmbarque}
+							>
+								<Pencil class="mr-1.5" size={14} />
+								Editar
+							</Button>
+							<Button
+								size="sm"
+								variant="destructive"
+								disabled={selectedEmbarques.length === 0}
+								onclick={handleBorrarEmbarque}
+							>
+								<Trash2 class="mr-1.5" size={14} />
+								Borrar
+							</Button>
+							<Button size="sm" variant="outline" onclick={handleImprimirEmbarque}>
+								<Printer class="mr-1.5" size={14} />
+								Imprimir
+							</Button>
+							<Button size="sm" variant="outline" onclick={handleImportarExcel}>
+								<Upload class="mr-1.5" size={14} />
+								Importar de Excel
+							</Button>
+						</div>
+					</CardContent>
+				</Card>
+
+				<!-- Panel derecho con estadísticas y botones -->
+				<div class="lg:w-80 space-y-4">
+					<!-- Estadísticas -->
+					<Card>
+						<CardContent class="p-4 space-y-4">
+							<div class="space-y-2">
+								<div class="flex justify-between items-center">
+									<Label class="text-xs">Cantidad de Transportes:</Label>
+									<Input value="0" readonly class="w-20 h-7 text-right" />
+								</div>
+							</div>
+
+							<div class="space-y-2 border-t pt-3">
+								<h4 class="text-xs font-semibold">Partidas del Pedimento</h4>
+								<div class="flex justify-between items-center">
+									<Label class="text-xs">Cantidad de Partidas:</Label>
+									<Input value="0" readonly class="w-20 h-7 text-right" />
+								</div>
+								<div class="flex justify-between items-center">
+									<Label class="text-xs">Suma de cantidad UMC:</Label>
+									<Input value="0.000" readonly class="w-24 h-7 text-right" />
+								</div>
+							</div>
+
+							<div class="space-y-2 border-t pt-3">
+								<h4 class="text-xs font-semibold">Embarques</h4>
+								<div class="flex justify-between items-center">
+									<Label class="text-xs">Cantidad de Embarques:</Label>
+									<Input value="0" readonly class="w-20 h-7 text-right" />
+								</div>
+								<div class="flex justify-between items-center">
+									<Label class="text-xs">Cantidad de Mercancias:</Label>
+									<Input value="0" readonly class="w-20 h-7 text-right" />
+								</div>
+								<div class="flex justify-between items-center">
+									<Label class="text-xs">Suma de cantidad UMC:</Label>
+									<Input value="0.000" readonly class="w-24 h-7 text-right" />
+								</div>
+							</div>
+
+							<div class="space-y-2 border-t pt-3">
+								<Button
+									size="sm"
+									variant="outline"
+									class="w-full justify-start"
+									onclick={handleTraerContenedores}
+								>
+									<Package class="mr-2" size={14} />
+									Traer Contenedores
+								</Button>
+								<Button
+									size="sm"
+									variant="outline"
+									class="w-full justify-start"
+									onclick={handleTraerVehiculos}
+								>
+									<Car class="mr-2" size={14} />
+									Traer Vehículos
+								</Button>
+								<Button
+									size="sm"
+									variant="outline"
+									class="w-full justify-start"
+									onclick={handleTraerTransportes}
+								>
+									<Truck class="mr-2" size={14} />
+									Traer Transportes
+								</Button>
+							</div>
+						</CardContent>
+					</Card>
+				</div>
+			</div>
+		{/if}
+
+		<!-- Vista de Rectificación -->
+		{#if showRectificacion}
+			<Card>
+				<CardHeader>
+					<CardTitle>Rectificación</CardTitle>
+				</CardHeader>
+				<CardContent>
+					<div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
+						<div class="space-y-2">
+							<Label for="es-rectificacion">Es Rectificación</Label>
+							<Select.Root
+								type="single"
+								value={rectificacionFormData.es_rectificacion}
+								onValueChange={(v) => {
+									if (v) rectificacionFormData.es_rectificacion = v;
+								}}
+							>
+								<Select.Trigger id="es-rectificacion" class="w-full">
+									<span class="truncate">
+										{rectificacionFormData.es_rectificacion === 'si'
+											? 'Sí'
+											: rectificacionFormData.es_rectificacion === 'no'
+												? 'No'
+												: 'Seleccionar'}
+									</span>
+								</Select.Trigger>
+								<Select.Content>
+									<Select.Item value="si">Sí</Select.Item>
+									<Select.Item value="no">No</Select.Item>
+								</Select.Content>
+							</Select.Root>
+						</div>
+
+						<div class="space-y-2">
+							<Label for="clave-pedimento-original">Clave de pedimento original</Label>
+							<Input
+								id="clave-pedimento-original"
+								bind:value={rectificacionFormData.clave_pedimento_original}
+							/>
+						</div>
+
+						<div class="space-y-2">
+							<Label for="pedimento-original"
+								>Pedimento Original <span class="text-xs text-muted-foreground"
+									>(VWnSAAI)</span
+								></Label
+							>
+							<Input
+								id="pedimento-original"
+								bind:value={rectificacionFormData.pedimento_original}
+							/>
+						</div>
+
+						<div class="space-y-2">
+							<Label for="fecha-pago-original">Fecha de pago original</Label>
+							<Input
+								id="fecha-pago-original"
+								type="date"
+								bind:value={rectificacionFormData.fecha_pago_original}
+							/>
+						</div>
+
+						<div class="space-y-2">
+							<Label for="aduana-seccion-original">Aduana/Sección Original</Label>
+							<Input
+								id="aduana-seccion-original"
+								bind:value={rectificacionFormData.aduana_seccion_original}
+							/>
+						</div>
+
+						<div class="space-y-2">
+							<Label for="anio-impresion-rect"
+								>Año para impresión de pedimento de Rect</Label
+							>
+							<Input
+								id="anio-impresion-rect"
+								bind:value={rectificacionFormData.anio_impresion_rect}
+							/>
+						</div>
+
+						<div class="space-y-2">
+							<Label for="patente-original">Patente Original</Label>
+							<Input
+								id="patente-original"
+								bind:value={rectificacionFormData.patente_original}
+							/>
+						</div>
+					</div>
+
+					<div class="mb-6">
+						<div class="flex items-center space-x-2">
+							<Checkbox
+								id="utilizar-fecha-pago"
+								checked={rectificacionFormData.utilizar_fecha_pago_original}
+								onclick={() => {
+									rectificacionFormData.utilizar_fecha_pago_original =
+										!rectificacionFormData.utilizar_fecha_pago_original;
+								}}
+							/>
+							<Label for="utilizar-fecha-pago" class="text-sm font-normal">
+								Utilizar fecha de pago original para el cálculo del FI y recargos de la
+								rectificación
+							</Label>
+						</div>
+					</div>
+
+					<!-- Cuadro de liquidación -->
+					<div class="border rounded-lg p-4">
+						<div class="flex items-center justify-between mb-4">
+							<h3 class="font-semibold">Cuadro de liquidación para diferencias en contribuciones</h3>
+							<div class="flex items-center space-x-2">
+								<Checkbox
+									id="calculo-manual"
+									checked={rectificacionFormData.calculo_manual_contribuciones}
+									onclick={() => {
+										rectificacionFormData.calculo_manual_contribuciones =
+											!rectificacionFormData.calculo_manual_contribuciones;
+									}}
+								/>
+								<Label for="calculo-manual" class="text-sm font-normal">
+									Cálculo manual de contribuciones
+								</Label>
+							</div>
+						</div>
+
+						<!-- Tabla de liquidación -->
+						<div class="border rounded-md mb-4">
+							<Table>
+								<TableHeader>
+									<TableRow>
+										<TableHead>Gravamen</TableHead>
+										<TableHead>Forma de pago</TableHead>
+										<TableHead>Importe</TableHead>
+									</TableRow>
+								</TableHeader>
+								<TableBody>
+									{#if liquidacionDiferencias.length === 0}
+										<TableRow>
+											<TableCell colspan={3} class="text-center text-muted-foreground">
+												No hay registros
+											</TableCell>
+										</TableRow>
+									{:else}
+										{#each liquidacionDiferencias as item}
+											<TableRow>
+												<TableCell>{item.gravamen}</TableCell>
+												<TableCell>{item.forma_pago}</TableCell>
+												<TableCell>{item.importe}</TableCell>
+											</TableRow>
+										{/each}
+									{/if}
+								</TableBody>
+							</Table>
+						</div>
+
+						<!-- Botones de acción -->
+						<div class="flex gap-2">
+							<Button size="sm" variant="outline" onclick={() => alert('Nuevo no implementado')}>
+								<Plus class="mr-2" size={14} />
+								Nuevo
+							</Button>
+							<Button size="sm" variant="outline" onclick={() => alert('Editar no implementado')}>
+								<Pencil class="mr-2" size={14} />
+								Editar
+							</Button>
+							<Button size="sm" variant="outline" onclick={() => alert('Borrar no implementado')}>
+								<Trash2 class="mr-2" size={14} />
+								Borrar
+							</Button>
+						</div>
+					</div>
+				</CardContent>
+			</Card>
+		{/if}
+
+		<!-- Vista de Rectificación II -->
+		{#if showRectificacionII}
+			<Card>
+				<CardHeader>
+					<CardTitle>Causa de la Rectificación</CardTitle>
+				</CardHeader>
+				<CardContent>
+					<div class="space-y-4">
+						<div class="space-y-2">
+							<Label for="causa">Causa:</Label>
+							<textarea
+								id="causa"
+								bind:value={rectificacionIIFormData.causa}
+								class="w-full min-h-[120px] rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 resize-y"
+								placeholder="Ingrese la causa de la rectificación"
+							></textarea>
+						</div>
+
+						<div class="space-y-2">
+							<Label for="motivo">Motivo:</Label>
+							<textarea
+								id="motivo"
+								bind:value={rectificacionIIFormData.motivo}
+								class="w-full min-h-[120px] rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 resize-y"
+								placeholder="Ingrese el motivo de la rectificación"
+							></textarea>
+						</div>
+					</div>
+				</CardContent>
+			</Card>
+		{/if}
+
+		<!-- Vista de Notas del Pedimento -->
+		{#if showNotas}
+			<Card>
+				<CardHeader>
+					<CardTitle>Notas del Pedimento</CardTitle>
+				</CardHeader>
+				<CardContent>
+					<!-- Tabla de Notas -->
+					<div class="border rounded-md mb-4">
+						<Table>
+							<TableHeader>
+								<TableRow>
+									<TableHead>Usuario</TableHead>
+									<TableHead colspan={2}>Creada</TableHead>
+									<TableHead>Comentario</TableHead>
+								</TableRow>
+								<TableRow class="border-t">
+									<TableHead class="h-0 p-0 border-0"></TableHead>
+									<TableHead class="text-xs">Fecha</TableHead>
+									<TableHead class="text-xs">Hora</TableHead>
+									<TableHead class="h-0 p-0 border-0"></TableHead>
+								</TableRow>
+							</TableHeader>
+							<TableBody>
+								{#if notasPedimento.length === 0}
+									<TableRow>
+										<TableCell colspan={4} class="text-center text-muted-foreground h-32">
+											No hay notas registradas
+										</TableCell>
+									</TableRow>
+								{:else}
+									{#each visibleNotas as nota}
+										<TableRow>
+											<TableCell>{nota.usuario}</TableCell>
+											<TableCell>{nota.fecha}</TableCell>
+											<TableCell>{nota.hora}</TableCell>
+											<TableCell>{nota.comentario}</TableCell>
+										</TableRow>
+									{/each}
+								{/if}
+							</TableBody>
+						</Table>
+					</div>
+
+					<!-- Paginación -->
+					<div class="flex items-center justify-between mb-4">
+						<div class="flex items-center gap-1">
+							<Button
+								size="sm"
+								variant="outline"
+								onclick={goToNotasFirstPage}
+								disabled={currentNotasPage === 0}
+							>
+								<ChevronsLeft size={14} />
+							</Button>
+							<Button
+								size="sm"
+								variant="outline"
+								onclick={goToNotasPreviousPage}
+								disabled={currentNotasPage === 0}
+							>
+								<ChevronLeft size={14} />
+							</Button>
+							<span class="text-sm px-3">
+								Página {currentNotasPage + 1} de {totalNotasPages || 1}
+							</span>
+							<Button
+								size="sm"
+								variant="outline"
+								onclick={goToNotasNextPage}
+								disabled={currentNotasPage >= totalNotasPages - 1}
+							>
+								<ChevronRight size={14} />
+							</Button>
+							<Button
+								size="sm"
+								variant="outline"
+								onclick={goToNotasLastPage}
+								disabled={currentNotasPage >= totalNotasPages - 1}
+							>
+								<ChevronsRight size={14} />
+							</Button>
+						</div>
+					</div>
+
+					<!-- Botones de acción -->
+					<div class="flex gap-2">
+						<Button size="sm" variant="outline" onclick={() => alert('Nuevo no implementado')}>
+							<Plus class="mr-2" size={14} />
+							Nuevo
+						</Button>
+						<Button size="sm" variant="outline" onclick={() => alert('Editar no implementado')}>
+							<Pencil class="mr-2" size={14} />
+							Editar
+						</Button>
+						<Button size="sm" variant="outline" onclick={() => alert('Borrar no implementado')}>
+							<Trash2 class="mr-2" size={14} />
+							Borrar
+						</Button>
+					</div>
+				</CardContent>
+			</Card>
+		{/if}
+
+		<!-- Vista de Selección Automatizada -->
+		{#if showSeleccionAutomatizada}
+			<Card>
+				<CardHeader>
+					<CardTitle>Selección Automatizada</CardTitle>
+				</CardHeader>
+				<CardContent>
+					<div class="space-y-6">
+						<div class="space-y-2">
+							<Label for="fecha-cruce">Fecha de Cruce:</Label>
+							<Input
+								id="fecha-cruce"
+								type="date"
+								bind:value={seleccionAutomatizadaFormData.fecha_cruce}
+							/>
+						</div>
+
+						<div class="space-y-2">
+							<Label for="primera-revision">1era Revisión</Label>
+							<Select.Root
+								type="single"
+								value={seleccionAutomatizadaFormData.primera_revision}
+								onValueChange={(v) => {
+									if (v) seleccionAutomatizadaFormData.primera_revision = v;
+								}}
+							>
+								<Select.Trigger id="primera-revision" class="w-full">
+									<span class="truncate">
+										{seleccionAutomatizadaFormData.primera_revision || 'Seleccionar'}
+									</span>
+								</Select.Trigger>
+								<Select.Content>
+									<Select.Item value="Rojo">Rojo</Select.Item>
+									<Select.Item value="Verde">Verde</Select.Item>
+								</Select.Content>
+							</Select.Root>
+						</div>
+
+						<div class="space-y-2">
+							<Label for="comentario-primera">Comentario 1era revisión:</Label>
+							<textarea
+								id="comentario-primera"
+								bind:value={seleccionAutomatizadaFormData.comentario_primera_revision}
+								class="w-full min-h-[100px] rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 resize-y"
+								placeholder="Ingrese el comentario de la primera revisión"
+							></textarea>
+						</div>
+
+						<div class="space-y-2">
+							<Label for="segunda-revision">2a Revisión</Label>
+							<Select.Root
+								type="single"
+								value={seleccionAutomatizadaFormData.segunda_revision}
+								onValueChange={(v) => {
+									if (v) seleccionAutomatizadaFormData.segunda_revision = v;
+								}}
+							>
+								<Select.Trigger id="segunda-revision" class="w-full">
+									<span class="truncate">
+										{seleccionAutomatizadaFormData.segunda_revision || 'Seleccionar'}
+									</span>
+								</Select.Trigger>
+								<Select.Content>
+									<Select.Item value="Rojo">Rojo</Select.Item>
+									<Select.Item value="Verde">Verde</Select.Item>
+								</Select.Content>
+							</Select.Root>
+						</div>
+
+						<div class="space-y-2">
+							<Label for="comentario-segunda">Comentario 2a revisión:</Label>
+							<textarea
+								id="comentario-segunda"
+								bind:value={seleccionAutomatizadaFormData.comentario_segunda_revision}
+								class="w-full min-h-[100px] rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 resize-y"
+								placeholder="Ingrese el comentario de la segunda revisión"
+							></textarea>
+						</div>
+					</div>
+				</CardContent>
+			</Card>
+		{/if}
+
+		<!-- Vista de Multas -->
+		{#if showMultas}
+			<Card>
+				<CardHeader>
+					<CardTitle>Multas</CardTitle>
+				</CardHeader>
+				<CardContent>
+					<div class="space-y-2">
+						<Label for="cargo-multa">Cargo</Label>
+						<Select.Root
+							type="single"
+							value={multasFormData.cargo}
+							onValueChange={(v) => {
+								if (v) multasFormData.cargo = v;
+							}}
+						>
+							<Select.Trigger id="cargo-multa" class="w-full">
+								<span class="truncate">
+									{multasFormData.cargo || 'Seleccionar'}
+								</span>
+							</Select.Trigger>
+							<Select.Content>
+								<Select.Item value="cargo oficina">cargo oficina</Select.Item>
+								<Select.Item value="cargo cliente">cargo cliente</Select.Item>
+							</Select.Content>
+						</Select.Root>
+					</div>
+				</CardContent>
+			</Card>
+		{/if}
+	</div>
+
+	<!-- Panel de botones laterales -->
+	<div class="lg:w-48">
+		<Card>
+			<CardContent class="p-3 space-y-2">
+				<Button
+					size="sm"
+					variant={activeView === 'calculos' ? 'default' : 'outline'}
+					class="w-full justify-start"
+					onclick={handleCalculos}
+				>
+					<Calculator class="mr-2" size={14} />
+					Cálculos
+				</Button>
+
+				<Button
+					size="sm"
+					variant={activeView === 'bitacora' ? 'default' : 'outline'}
+					class="w-full justify-start"
+					onclick={handleBitacora}
+				>
+					<FileText class="mr-2" size={14} />
+					Bitácora
+				</Button>
+
+				<Button
+					size="sm"
+					variant={activeView === 'partesII' ? 'default' : 'outline'}
+					class="w-full justify-start"
+					onclick={handlePatesII}
+				>
+					<FileCheck class="mr-2" size={14} />
+					Partes II
+				</Button>
+
+				<Button
+					size="sm"
+					variant={activeView === 'rectificacion' ? 'default' : 'outline'}
+					class="w-full justify-start"
+					onclick={handleRectificacion}
+				>
+					<RotateCw class="mr-2" size={14} />
+					Rectificación
+				</Button>
+
+				<Button
+					size="sm"
+					variant={activeView === 'rectificacionII' ? 'default' : 'outline'}
+					class="w-full justify-start"
+					onclick={handleRectificacionII}
+				>
+					<RotateCw class="mr-2" size={14} />
+					Rectificación II
+				</Button>
+
+				<Button size="sm" variant={activeView === 'notas' ? 'default' : 'outline'} class="w-full justify-start" onclick={handleNotas}>
+					<FileText class="mr-2" size={14} />
+					Notas
+				</Button>
+
+				<Button
+					size="sm"
+					variant={activeView === 'seleccionAutomatizada' ? 'default' : 'outline'}
+					class="w-full justify-start text-xs whitespace-normal h-auto py-2"
+					onclick={handleSeleccionAutomatizada}
+				>
+					<AlertCircle class="mr-2 flex-shrink-0" size={14} />
+					<span class="text-left">Selección Automatizada</span>
+				</Button>
+
+				<Button
+					size="sm"
+					variant="outline"
+					class="w-full justify-start text-xs whitespace-normal h-auto py-2"
+					onclick={handleExpDocumentos}
+				>
+					<FileText class="mr-2 flex-shrink-0" size={14} />
+					<span class="text-left">Exp. Documentos</span>
+				</Button>
+
+				<Button size="sm" variant={activeView === 'multas' ? 'default' : 'outline'} class="w-full justify-start" onclick={handleMultas}>
+					<FileX class="mr-2" size={14} />
+					Multas
+				</Button>
+			</CardContent>
+		</Card>
+	</div>
+</div>
diff --git a/frontend/src/lib/components/dashboard/pedimentos/edit/partidas-tab-form.svelte b/frontend/src/lib/components/dashboard/pedimentos/edit/partidas-tab-form.svelte
new file mode 100644
index 00000000..6e90abf8
--- /dev/null
+++ b/frontend/src/lib/components/dashboard/pedimentos/edit/partidas-tab-form.svelte
@@ -0,0 +1,543 @@
+<script lang="ts">
+	import { Card, CardContent } from '$lib/components/ui/card';
+	import { Button } from '$lib/components/ui/button';
+	import { Input } from '$lib/components/ui/input';
+	import { Label } from '$lib/components/ui/label';
+	import {
+		Table,
+		TableBody,
+		TableCell,
+		TableHead,
+		TableHeader,
+		TableRow
+	} from '$lib/components/ui/table';
+	import {
+		Dialog,
+		DialogContent,
+		DialogHeader,
+		DialogTitle,
+		DialogFooter
+	} from '$lib/components/ui/dialog';
+	import * as Select from '$lib/components/ui/select';
+	import Checkbox from '$lib/components/ui/checkbox/checkbox.svelte';
+	import { Textarea } from '$lib/components/ui/textarea';
+	import {
+		Plus,
+		Pencil,
+		Trash2,
+		FileText,
+		RotateCw,
+		Info
+	} from 'lucide-svelte';
+
+	interface Partida {
+		id?: number;
+		linea: number;
+		fraccion: string;
+		sub: string;
+		descripcion: string;
+		tipo: string;
+		sector: string;
+		origen: string;
+		cantidad_comercial: number;
+		umc: string;
+		dolares: number;
+	}
+
+	let {
+		formData = $bindable({
+			partidas: [] as Partida[],
+			convertir_uma_umc: false
+		})
+	}: {
+		formData: {
+			partidas: Partida[];
+			convertir_uma_umc: boolean;
+		};
+	} = $props();
+
+	let isDialogOpen = $state(false);
+	let editingIndex = $state<number | null>(null);
+	let selectedPartidas = $state<Set<number>>(new Set());
+
+	let currentPartida = $state<Partida>({
+		linea: 0,
+		fraccion: '',
+		sub: '',
+		descripcion: '',
+		tipo: '',
+		sector: '',
+		origen: '',
+		cantidad_comercial: 0,
+		umc: '',
+		dolares: 0
+	});
+
+	const unidadesMedida = ['KG', 'LT', 'PZ', 'MT', 'M2', 'M3', 'TON', 'CAJ', 'PAR'];
+	const tipos = ['Importación', 'Exportación', 'Retorno'];
+	const sectores = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10'];
+	const origenes = [
+		'Estados Unidos',
+		'México',
+		'Canadá',
+		'China',
+		'Alemania',
+		'Japón',
+		'Reino Unido',
+		'Francia',
+		'Italia',
+		'España'
+	];
+
+	const totalPartidas = $derived(formData?.partidas?.length ?? 0);
+	const totalDolares = $derived(
+		formData?.partidas?.reduce((sum, p) => sum + (p.dolares || 0), 0) ?? 0
+	);
+	const totalCantidadComercial = $derived(
+		formData?.partidas?.reduce((sum, p) => sum + (p.cantidad_comercial || 0), 0) ?? 0
+	);
+
+	function openNewPartida() {
+		editingIndex = null;
+		const nextLinea = formData?.partidas?.length ? Math.max(...formData.partidas.map(p => p.linea)) + 1 : 1;
+		currentPartida = {
+			linea: nextLinea,
+			fraccion: '',
+			sub: '',
+			descripcion: '',
+			tipo: '',
+			sector: '',
+			origen: '',
+			cantidad_comercial: 0,
+			umc: '',
+			dolares: 0
+		};
+		isDialogOpen = true;
+	}
+
+	function openEditPartida(index: number) {
+		if (!formData?.partidas) return;
+		editingIndex = index;
+		currentPartida = { ...formData.partidas[index] };
+		isDialogOpen = true;
+	}
+
+	function savePartida() {
+		if (!formData?.partidas) return;
+		if (editingIndex !== null) {
+			formData.partidas[editingIndex] = { ...currentPartida };
+		} else {
+			formData.partidas = [...formData.partidas, { ...currentPartida }];
+		}
+		isDialogOpen = false;
+	}
+
+	function deletePartida(index: number) {
+		if (!formData?.partidas) return;
+		if (confirm('¿Está seguro de eliminar esta partida?')) {
+			formData.partidas = formData.partidas.filter((_, i) => i !== index);
+			// Reordenar líneas
+			formData.partidas = formData.partidas.map((p, idx) => ({ ...p, linea: idx + 1 }));
+		}
+	}
+
+	function clearForm() {
+		currentPartida = {
+			linea: 0,
+			fraccion: '',
+			sub: '',
+			descripcion: '',
+			tipo: '',
+			sector: '',
+			origen: '',
+			cantidad_comercial: 0,
+			umc: '',
+			dolares: 0
+		};
+	}
+
+	function toggleSelectPartida(index: number) {
+		if (selectedPartidas.has(index)) {
+			selectedPartidas.delete(index);
+		} else {
+			selectedPartidas.add(index);
+		}
+		selectedPartidas = new Set(selectedPartidas);
+	}
+
+	function deleteSelectedPartidas() {
+		if (!formData?.partidas) return;
+		if (selectedPartidas.size === 0) {
+			alert('No hay partidas seleccionadas');
+			return;
+		}
+		if (confirm(`¿Está seguro de eliminar ${selectedPartidas.size} partida(s)?`)) {
+			formData.partidas = formData.partidas.filter((_, i) => !selectedPartidas.has(i));
+			// Reordenar líneas
+			formData.partidas = formData.partidas.map((p, idx) => ({ ...p, linea: idx + 1 }));
+			selectedPartidas = new Set();
+		}
+	}
+
+	function detallesConsolidacion() {
+		alert('Detalles de Consolidación no implementado aún');
+	}
+
+	function datosSonana() {
+		alert('Datos Sonana no implementado aún');
+	}
+
+	function refreshPartidas() {
+		alert('Actualizar partidas no implementado aún');
+	}
+</script>
+
+<Card>
+	<CardContent class="p-6 space-y-4">
+		<!-- Barra de herramientas superior -->
+		<div class="flex flex-wrap gap-2 border-b pb-4">
+			<Button size="sm" variant="outline" onclick={clearForm}>
+				<RotateCw class="mr-1.5" size={14} />
+				Limpiar
+			</Button>
+			<Button size="sm" onclick={openNewPartida}>
+				<Plus class="mr-1.5" size={14} />
+				Nuevo
+			</Button>
+			<Button
+				size="sm"
+				variant="outline"
+				disabled={selectedPartidas.size !== 1}
+				onclick={() => {
+					const index = Array.from(selectedPartidas)[0];
+					if (index !== undefined) openEditPartida(index);
+				}}
+			>
+				<Pencil class="mr-1.5" size={14} />
+				Editar
+			</Button>
+			<Button
+				size="sm"
+				variant="destructive"
+				disabled={selectedPartidas.size !== 1}
+				onclick={() => {
+					const index = Array.from(selectedPartidas)[0];
+					if (index !== undefined) deletePartida(index);
+				}}
+			>
+				<Trash2 class="mr-1.5" size={14} />
+				Borrar
+			</Button>
+			<Button
+				size="sm"
+				variant="destructive"
+				disabled={selectedPartidas.size === 0}
+				onclick={deleteSelectedPartidas}
+			>
+				<Trash2 class="mr-1.5" size={14} />
+				Borrar Partidas
+			</Button>
+			<Button size="sm" variant="outline" onclick={detallesConsolidacion}>
+				<Info class="mr-1.5" size={14} />
+				Detalles de Consolidación
+			</Button>
+			<Button size="sm" variant="outline" onclick={datosSonana}>
+				<FileText class="mr-1.5" size={14} />
+				Datos Sonana
+			</Button>
+			<Button size="sm" variant="outline" onclick={refreshPartidas}>
+				<RotateCw size={14} />
+			</Button>
+		</div>
+
+		<!-- Tabla de partidas -->
+		<div class="border rounded-lg overflow-hidden">
+			<Table>
+				<TableHeader>
+					<TableRow>
+						<TableHead class="w-[50px]">Sel.</TableHead>
+						<TableHead class="w-[80px]">Línea</TableHead>
+						<TableHead>Fracción</TableHead>
+						<TableHead>Sub</TableHead>
+						<TableHead>Descripción</TableHead>
+						<TableHead>Tipo</TableHead>
+						<TableHead>Sector</TableHead>
+						<TableHead>Origen</TableHead>
+						<TableHead class="text-right">Cant. Comercial</TableHead>
+						<TableHead>UMC</TableHead>
+						<TableHead class="text-right">Dólares</TableHead>
+						<TableHead class="w-[100px]">Acciones</TableHead>
+					</TableRow>
+				</TableHeader>
+				<TableBody>
+					{#if !formData?.partidas || formData.partidas.length === 0}
+						<TableRow>
+							<TableCell colspan={12} class="text-center text-muted-foreground py-8">
+								No hay partidas registradas. Haga clic en "Nuevo" para agregar una.
+							</TableCell>
+						</TableRow>
+					{:else}
+						{#each formData.partidas as partida, index}
+							<TableRow>
+								<TableCell>
+									<Checkbox
+										checked={selectedPartidas.has(index)}
+										onCheckedChange={() => toggleSelectPartida(index)}
+									/>
+								</TableCell>
+								<TableCell class="font-medium">{partida.linea}</TableCell>
+								<TableCell>{partida.fraccion}</TableCell>
+								<TableCell>{partida.sub}</TableCell>
+								<TableCell class="max-w-[200px] truncate" title={partida.descripcion}>
+									{partida.descripcion}
+								</TableCell>
+								<TableCell>{partida.tipo}</TableCell>
+								<TableCell>{partida.sector}</TableCell>
+								<TableCell>{partida.origen}</TableCell>
+								<TableCell class="text-right"
+									>{partida.cantidad_comercial.toLocaleString('es-MX', {
+										minimumFractionDigits: 2,
+										maximumFractionDigits: 2
+									})}</TableCell
+								>
+								<TableCell>{partida.umc}</TableCell>
+								<TableCell class="text-right"
+									>{partida.dolares.toLocaleString('es-MX', {
+										minimumFractionDigits: 2,
+										maximumFractionDigits: 2
+									})}</TableCell
+								>
+								<TableCell>
+									<div class="flex gap-1">
+										<Button size="sm" variant="ghost" onclick={() => openEditPartida(index)}>
+											<Pencil size={14} />
+										</Button>
+										<Button size="sm" variant="ghost" onclick={() => deletePartida(index)}>
+											<Trash2 size={14} />
+										</Button>
+									</div>
+								</TableCell>
+							</TableRow>
+						{/each}
+					{/if}
+				</TableBody>
+			</Table>
+		</div>
+
+		<!-- Totales y opciones -->
+		<div class="grid grid-cols-2 gap-6 border-t pt-4">
+			<div class="space-y-2 text-sm">
+				<div class="flex justify-between">
+					<span>Partidas:</span>
+					<span class="font-medium text-primary">{totalPartidas}</span>
+				</div>
+				<div class="flex justify-between">
+					<span>Dólares:</span>
+					<span class="font-medium text-primary"
+						>{totalDolares.toLocaleString('es-MX', {
+							minimumFractionDigits: 2,
+							maximumFractionDigits: 2
+						})} USD</span
+					>
+				</div>
+				<div class="flex justify-between">
+					<span>Pesos:</span>
+					<span class="font-medium text-primary">0.00 MXN</span>
+				</div>
+				<div class="flex justify-between">
+					<span>Valor Comercial:</span>
+					<span class="font-medium text-primary">0.00</span>
+				</div>
+			</div>
+
+			<div class="space-y-2 text-sm">
+				<div class="flex justify-between">
+					<span>Cant. UMC:</span>
+					<span class="font-medium text-primary"
+						>{totalCantidadComercial.toLocaleString('es-MX', {
+							minimumFractionDigits: 2,
+							maximumFractionDigits: 2
+						})}</span
+					>
+				</div>
+				<div class="flex justify-between">
+					<span>Cant. UMT:</span>
+					<span class="font-medium text-primary">0.00</span>
+				</div>
+				<div class="flex justify-between">
+					<span>Val Agreg. Pesos:</span>
+					<span class="font-medium text-primary">0.00 MXN</span>
+				</div>
+				<div class="flex justify-between">
+					<span>Val Agreg. Dólares:</span>
+					<span class="font-medium text-primary">0.00 USD</span>
+				</div>
+			</div>
+		</div>
+
+		<!-- Opciones adicionales -->
+		<div class="flex items-center space-x-2 border-t pt-4">
+			<Checkbox
+				id="convertir_uma_umc"
+				checked={formData?.convertir_uma_umc ?? false}
+				onCheckedChange={(checked: boolean | 'indeterminate') =>
+					formData && (formData.convertir_uma_umc = checked === true)}
+			/>
+			<Label for="convertir_uma_umc" class="font-normal cursor-pointer text-sm"
+				>Captura Partidas: Convertir de UMA a UMC</Label
+			>
+		</div>
+	</CardContent>
+</Card>
+
+<!-- Dialog para agregar/editar partida -->
+<Dialog bind:open={isDialogOpen}>
+	<DialogContent class="max-w-3xl max-h-[90vh] overflow-y-auto">
+		<DialogHeader>
+			<DialogTitle>{editingIndex !== null ? 'Editar Partida' : 'Nueva Partida'}</DialogTitle>
+		</DialogHeader>
+
+		<div class="grid gap-4 py-4">
+			<div class="grid grid-cols-3 gap-4">
+				<div class="space-y-2">
+					<Label for="linea">Línea *</Label>
+					<Input
+						id="linea"
+						type="number"
+						bind:value={currentPartida.linea}
+						placeholder="1"
+						readonly
+					/>
+				</div>
+				<div class="space-y-2">
+					<Label for="fraccion">Fracción *</Label>
+					<Input id="fraccion" bind:value={currentPartida.fraccion} placeholder="0000.00.00" />
+				</div>
+				<div class="space-y-2">
+					<Label for="sub">Sub</Label>
+					<Input id="sub" bind:value={currentPartida.sub} placeholder="00" />
+				</div>
+			</div>
+
+			<div class="space-y-2">
+				<Label for="descripcion">Descripción *</Label>
+				<Textarea
+					id="descripcion"
+					bind:value={currentPartida.descripcion}
+					placeholder="Descripción detallada de la partida"
+					rows={3}
+				/>
+			</div>
+
+			<div class="grid grid-cols-2 gap-4">
+				<div class="space-y-2">
+					<Label for="tipo">Tipo *</Label>
+					<Select.Root
+						type="single"
+						value={currentPartida.tipo}
+						onValueChange={(v: string | undefined) => v && (currentPartida.tipo = v)}
+					>
+						<Select.Trigger id="tipo">
+							{currentPartida.tipo || 'Seleccionar tipo'}
+						</Select.Trigger>
+						<Select.Content>
+							{#each tipos as tipo}
+								<Select.Item value={tipo}>{tipo}</Select.Item>
+							{/each}
+						</Select.Content>
+					</Select.Root>
+				</div>
+				<div class="space-y-2">
+					<Label for="sector">Sector *</Label>
+					<Select.Root
+						type="single"
+						value={currentPartida.sector}
+						onValueChange={(v: string | undefined) => v && (currentPartida.sector = v)}
+					>
+						<Select.Trigger id="sector">
+							{currentPartida.sector || 'Seleccionar sector'}
+						</Select.Trigger>
+						<Select.Content>
+							{#each sectores as sector}
+								<Select.Item value={sector}>{sector}</Select.Item>
+							{/each}
+						</Select.Content>
+					</Select.Root>
+				</div>
+			</div>
+
+			<div class="space-y-2">
+				<Label for="origen">Origen *</Label>
+				<Select.Root
+					type="single"
+					value={currentPartida.origen}
+					onValueChange={(v: string | undefined) => v && (currentPartida.origen = v)}
+				>
+					<Select.Trigger id="origen">
+						{currentPartida.origen || 'Seleccionar origen'}
+					</Select.Trigger>
+					<Select.Content>
+						{#each origenes as origen}
+							<Select.Item value={origen}>{origen}</Select.Item>
+						{/each}
+					</Select.Content>
+				</Select.Root>
+			</div>
+
+			<div class="grid grid-cols-3 gap-4">
+				<div class="space-y-2">
+					<Label for="cantidad_comercial">Cant. Comercial *</Label>
+					<Input
+						id="cantidad_comercial"
+						type="number"
+						step="0.01"
+						bind:value={currentPartida.cantidad_comercial}
+						placeholder="0.00"
+					/>
+				</div>
+				<div class="space-y-2">
+					<Label for="umc">UMC *</Label>
+					<Select.Root
+						type="single"
+						value={currentPartida.umc}
+						onValueChange={(v: string | undefined) => v && (currentPartida.umc = v)}
+					>
+						<Select.Trigger id="umc">
+							{currentPartida.umc || 'Seleccionar UMC'}
+						</Select.Trigger>
+						<Select.Content>
+							{#each unidadesMedida as unidad}
+								<Select.Item value={unidad}>{unidad}</Select.Item>
+							{/each}
+						</Select.Content>
+					</Select.Root>
+				</div>
+				<div class="space-y-2">
+					<Label for="dolares">Dólares *</Label>
+					<Input
+						id="dolares"
+						type="number"
+						step="0.01"
+						bind:value={currentPartida.dolares}
+						placeholder="0.00"
+					/>
+				</div>
+			</div>
+		</div>
+
+		<DialogFooter>
+			<Button variant="outline" onclick={() => (isDialogOpen = false)}>Cancelar</Button>
+			<Button
+				onclick={savePartida}
+				disabled={!currentPartida.fraccion ||
+					!currentPartida.descripcion ||
+					!currentPartida.tipo ||
+					!currentPartida.sector ||
+					!currentPartida.origen ||
+					!currentPartida.umc}
+			>
+				{editingIndex !== null ? 'Actualizar' : 'Guardar'}
+			</Button>
+		</DialogFooter>
+	</DialogContent>
+</Dialog>
diff --git a/frontend/src/lib/components/ui/checkbox/checkbox.svelte b/frontend/src/lib/components/ui/checkbox/checkbox.svelte
new file mode 100644
index 00000000..0a2b0101
--- /dev/null
+++ b/frontend/src/lib/components/ui/checkbox/checkbox.svelte
@@ -0,0 +1,36 @@
+<script lang="ts">
+	import { Checkbox as CheckboxPrimitive } from "bits-ui";
+	import CheckIcon from "@lucide/svelte/icons/check";
+	import MinusIcon from "@lucide/svelte/icons/minus";
+	import { cn, type WithoutChildrenOrChild } from "$lib/utils.js";
+
+	let {
+		ref = $bindable(null),
+		checked = $bindable(false),
+		indeterminate = $bindable(false),
+		class: className,
+		...restProps
+	}: WithoutChildrenOrChild<CheckboxPrimitive.RootProps> = $props();
+</script>
+
+<CheckboxPrimitive.Root
+	bind:ref
+	data-slot="checkbox"
+	class={cn(
+		"border-input dark:bg-input/30 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive peer flex size-4 shrink-0 items-center justify-center rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
+		className
+	)}
+	bind:checked
+	bind:indeterminate
+	{...restProps}
+>
+	{#snippet children({ checked, indeterminate })}
+		<div data-slot="checkbox-indicator" class="text-current transition-none">
+			{#if checked}
+				<CheckIcon class="size-3.5" />
+			{:else if indeterminate}
+				<MinusIcon class="size-3.5" />
+			{/if}
+		</div>
+	{/snippet}
+</CheckboxPrimitive.Root>
diff --git a/frontend/src/lib/components/ui/checkbox/index.ts b/frontend/src/lib/components/ui/checkbox/index.ts
new file mode 100644
index 00000000..6d92d945
--- /dev/null
+++ b/frontend/src/lib/components/ui/checkbox/index.ts
@@ -0,0 +1,6 @@
+import Root from "./checkbox.svelte";
+export {
+	Root,
+	//
+	Root as Checkbox,
+};
diff --git a/frontend/src/routes/dashboard/pedimentos/edit/[id]/+page.svelte b/frontend/src/routes/dashboard/pedimentos/edit/[id]/+page.svelte
index 4983d34c..c95d72d5 100644
--- a/frontend/src/routes/dashboard/pedimentos/edit/[id]/+page.svelte
+++ b/frontend/src/routes/dashboard/pedimentos/edit/[id]/+page.svelte
@@ -10,10 +10,15 @@
 		CircleAlert, 
 		CircleCheck, 
 		FileText, 
-		Calendar, 
-		CreditCard, 
-		Truck, 
-		ShieldCheck, 
+		MessageSquare,
+		FileSpreadsheet,
+		Package,
+		Box,
+		Download,
+		Coins,
+		Wallet,
+		FileStack,
+		Scan,
 		LoaderCircle, 
 		Save 
 	} from 'lucide-svelte';	
@@ -22,6 +27,14 @@
 	// Importar los componentes de cada pestaña (ahora sin botones de guardar propios)
 	import GeneralTabForm from '$lib/components/dashboard/pedimentos/edit/general-tab-form.svelte';
 	import DatesTabForm from '$lib/components/dashboard/pedimentos/edit/dates-tab-form.svelte';
+	import FacturasTabForm from '$lib/components/dashboard/pedimentos/edit/facturas-tab-form.svelte';
+	import PartidasTabForm from '$lib/components/dashboard/pedimentos/edit/partidas-tab-form.svelte';
+	import BultosTransportesTabForm from '$lib/components/dashboard/pedimentos/edit/bultos-transportes-tab-form.svelte';
+	import DescargasTabForm from '$lib/components/dashboard/pedimentos/edit/descargas-tab-form.svelte';
+	import ContribucionesTabForm from '$lib/components/dashboard/pedimentos/edit/contribuciones-tab-form.svelte';
+	import CuentasCompensacionTabForm from '$lib/components/dashboard/pedimentos/edit/cuentas-compensacion-tab-form.svelte';
+	import DigitalizacionTabForm from '$lib/components/dashboard/pedimentos/edit/digitalizacion-tab-form.svelte';
+	import OtrosDatosTabForm from '$lib/components/dashboard/pedimentos/edit/otros-datos-tab-form.svelte';
 	import PaymentsTabForm from '$lib/components/dashboard/pedimentos/edit/payments-tab-form.svelte';
 	import TransportTabForm from '$lib/components/dashboard/pedimentos/edit/transport-tab-form.svelte';
 	import ValidationTabForm from '$lib/components/dashboard/pedimentos/edit/validation-tab-form.svelte';
@@ -63,16 +76,83 @@
 
 	// Referencias a los componentes de formulario para obtener sus datos
 	let generalFormData = $state<any>(null);
-	let datesFormData = $state<any>(null);
-	let paymentsFormData = $state<any>(null);
-	let transportFormData = $state<any>(null);
-	let validationFormData = $state<any>(null);
+	let observacionesFormData = $state<any>(null);
+	let facturasFormData = $state<any>(null);
+	let partidasFormData = $state<any>({ partidas: [], convertir_uma_umc: false });
+	let bultosTransportesFormData = $state<any>({
+		bultos: { cantidad: 0, marcas: 'S/M', numero: 'S/N', vehiculos: 1 },
+		transportes: [],
+		precintos: [],
+		contenedores: []
+	});
+	let descargasFormData = $state<any>({ descargos: [], destinatarios: [] });
+	let contribucionesFormData = $state<any>({
+		dta: { forma_pago_recargo: 0, tasa_recargo: 0.0, importe_recargo: 0 },
+		prev: { forma_pago_prevalidacion: 0 },
+		eci: { forma_pago_eci: 0, importe_eci: 0 },
+		mult: { forma_pago_multa: 0, importe_multa: 0 },
+		rec: { forma_pago_uia: 0, importe_compensar: 0 },
+		calculo_manual: false,
+		operaciones_regla_31_40: false,
+		contribuciones: []
+	});
+	let cuentasCompensacionFormData = $state<any>({
+		cuentas_garantia: [],
+		compensaciones: [],
+		documentos_pago: []
+	});
+	let digitalizacionFormData = $state({
+		digitalizaciones: []
+	});
+	let otrosDatosFormData = $state({
+		tipo_calculo: 'ninguno',
+		dta_por_operacion_ag_facturas: false,
+		dta_por_numero_vehiculos: false,
+		paga_iva: false,
+		paga_prevalidacion: false,
+		aplicar_dta_8_millar_partida: false,
+		incluir_eci: false,
+		deducible_recargos: false,
+		cuota_fija_adicional_vehiculo: false,
+		cuota_fija_adicional_fp: '0',
+		actualizar_iva: false,
+		actualizar_advalorem: false,
+		actualizar_dta: false,
+		actualizar_cc: false,
+		actualizar_ieps: false,
+		es_embajada: false,
+		embajada_dta: '0.00',
+		regla_3_1_21_factores: false,
+		cambio_tarifa_anterior: '',
+		actualizar_iva_rect: false,
+		actualizar_advalorem_rect: false,
+		actualizar_dta_rect: false,
+		actualizar_cc_rect: false,
+		actualizar_ieps_rect: false,
+		calcular_recargos_diferencias: false,
+		proveedor_nacional_modifico_dta: false,
+		calculo_valor_aduana_v2: false,
+		calculo_2_decimales_valor_unitario: false,
+		calcular_valor_aduana_base_partidas: false,
+		recargo_igi: false,
+		recargo_iva: false,
+		recargo_ieps: false,
+		recargo_isan: false,
+		recargo_cc: false,
+		factor_incrementable_manual: '0.00000000000000000000',
+		agregar_entidad_federativa_proveedor: false
+	});
 
 	// Estados para saber si existen datos previos (para compatibilidad con componentes hijos)
-	let datesExists = $state(false);
-	let paymentsExists = $state(false);
-	let transportExists = $state(false);
-	let validationExists = $state(false);
+	let observacionesExists = $state(false);
+	let facturasExists = $state(false);
+	let partidasExists = $state(false);
+	let bultosTransportesExists = $state(false);
+	let descargasExists = $state(false);
+	let contribucionesExists = $state(false);
+	let cuentasCompensacionExists = $state(false);
+	let otrosDatosExists = $state(false);
+	let digitalizacionExists = $state(false);
 
 	function handleBack() {
 		goto('/dashboard/pedimentos');
@@ -149,87 +229,86 @@
 			// Solo agregar sub-recursos en modo UPDATE (no en CREATE)
 			// Y solo si tienen valores reales (no enviar objetos vacíos/null)
 			
-				// Dates - solo enviar si hay al menos un campo con valor
-				if (datesFormData) {
-					const hasDateValue = datesFormData.entry_date || datesFormData.pedimento_date || 
-						datesFormData.payment_date || datesFormData.rectification_payment_date ||
-						datesFormData.extraction_date || datesFormData.submission_date ||
-						datesFormData.eucan_date || datesFormData.original_date ||
-						datesFormData.start_date || datesFormData.end_date;
-					
-					if (hasDateValue) {
-						payload.pedimento_dates = {
-							entry_date: datesFormData.entry_date || null,
-							pedimento_date: datesFormData.pedimento_date || null,
-							payment_date: datesFormData.payment_date || null,
-							rectification_payment_date: datesFormData.rectification_payment_date || null,
-							extraction_date: datesFormData.extraction_date || null,
-							submission_date: datesFormData.submission_date || null,
-							eucan_date: datesFormData.eucan_date || null,
-							original_date: datesFormData.original_date || null,
-							start_date: datesFormData.start_date || null,
-							end_date: datesFormData.end_date || null,
+			// Observaciones - solo enviar si hay valor
+			if (observacionesFormData?.observaciones) {
+				payload.observaciones = observacionesFormData.observaciones;
+			}
+			
+			// Incrementables - solo enviar si hay al menos un campo con valor
+			if (generalFormData) {
+					const hasIncrementablesValue = generalFormData.valor_seguro || generalFormData.embalajes ||
+						generalFormData.fletes || generalFormData.deducibles || generalFormData.moneda_incrementables ||
+						generalFormData.no_afectar_valor_dolares_inc !== undefined || generalFormData.no_afectar_valor_aduana !== undefined;
+					if (hasIncrementablesValue) {
+						payload.pedimento_incrementables = {
+							insured_value: generalFormData.valor_seguro || null,
+							packaging: generalFormData.embalajes || null,
+							freight: generalFormData.fletes || null,
+							deductibles: generalFormData.deducibles || null,
+							currency: generalFormData.moneda_incrementables || null,
+							not_affect_usd_value: generalFormData.no_afectar_valor_dolares_inc ? 1 : 0,
+							not_affect_customs_value: generalFormData.no_afectar_valor_aduana ? 1 : 0
 						};
 					}
 				}
 				
-				// Payments - solo enviar si hay al menos un campo con valor
-				if (paymentsFormData) {
-					const hasPaymentValue = paymentsFormData.acknowledgment || paymentsFormData.operation_number ||
-						paymentsFormData.bank_code || paymentsFormData.cashier || paymentsFormData.date ||
-						paymentsFormData.time || paymentsFormData.shift || paymentsFormData.total_cash_paid ||
-						paymentsFormData.total_contributions || paymentsFormData.counter_payment ||
-						paymentsFormData.pece_code;
-					if (hasPaymentValue) {
-						payload.pedimento_payments = {
-							acknowledgment: paymentsFormData.acknowledgment || null,
-							operation_number: paymentsFormData.operation_number || null,
-							bank_code: paymentsFormData.bank_code || null,
-							cashier: paymentsFormData.cashier || null,
-							date: paymentsFormData.date || null,
-							time: paymentsFormData.time || null,
-							shift: paymentsFormData.shift || null,
-							total_cash_paid: paymentsFormData.total_cash_paid || null,
-							total_contributions: paymentsFormData.total_contributions || null,
-							counter_payment: paymentsFormData.counter_payment || null,
-							pece_code: paymentsFormData.pece_code || null,							
+				// Decrementables - solo enviar si hay al menos un campo con valor
+				if (generalFormData) {
+					const hasDecrementablesValue = generalFormData.fletes_decrementable || generalFormData.seguros ||
+						generalFormData.carga || generalFormData.descarga || generalFormData.otros ||
+						generalFormData.moneda_decrementable || generalFormData.afectar_valor_dolares !== undefined;
+					if (hasDecrementablesValue) {
+						payload.pedimento_decrementables = {
+							freight: generalFormData.fletes_decrementable || null,
+							insurance: generalFormData.seguros || null,
+							loading: generalFormData.carga || null,
+							unloading: generalFormData.descarga || null,
+							others: generalFormData.otros || null,
+							currency: generalFormData.moneda_decrementable || null,
+							not_affect_usd_value: generalFormData.afectar_valor_dolares ? 1 : 0
 						};
 					}
 				}
 				
-				// Transport - solo enviar si hay al menos un campo con valor
-				if (transportFormData) {
-					const hasTransportValue = transportFormData.destination || transportFormData.entry_exit || 
-						transportFormData.arrival || transportFormData.departure;
-					if (hasTransportValue) {
-						payload.pedimento_transport_means = {
-							destination: transportFormData.destination || null,
-							entry_exit: transportFormData.entry_exit || null,
-							arrival: transportFormData.arrival || null,
-							departure: transportFormData.departure || null
+				// Indexes - solo enviar si hay al menos un campo con valor
+				if (generalFormData) {
+					const hasIndexesValue = generalFormData.tipo_factor || generalFormData.factor_actualizacion ||
+						generalFormData.factor_actualizacion_manual !== undefined;
+					if (hasIndexesValue) {
+						// Mapear tipo_factor de string a número
+						let updateFactorType = null;
+						if (generalFormData.tipo_factor === 'INPC') {
+							updateFactorType = 1;
+						} else if (generalFormData.tipo_factor === 'variacion_cambiaria') {
+							updateFactorType = 2;
+						}
+						
+						payload.pedimento_indexes = {
+							update_factor_type: updateFactorType,
+							update_factor: generalFormData.factor_actualizacion || null,
+							manual_update_factor: generalFormData.factor_actualizacion_manual ? 1 : 0
 						};
 					}
 				}
 				
-				// Validation - solo enviar si hay al menos un campo con valor
-				if (validationFormData) {
-					const hasValidationValue = validationFormData.validator || validationFormData.validation_ack ||
-						validationFormData.pre_ack || validationFormData.line_signature ||
-						validationFormData.electronic_signature || validationFormData.certificate_number ||
-						validationFormData.validator_id || validationFormData.responsible_id;
-					if (hasValidationValue) {
-						payload.pedimento_validation = {
-							validator: validationFormData.validator || null,
-							validation_ack: validationFormData.validation_ack || null,
-							pre_ack: validationFormData.pre_ack || null,
-							line_signature: validationFormData.line_signature || null,
-							electronic_signature: validationFormData.electronic_signature || null,
-							certificate_number: validationFormData.certificate_number || null,
-							validator_id: validationFormData.validator_id || null,
-							responsible_id: validationFormData.responsible_id || null
+				// Config Additional - solo enviar si hay al menos un campo con valor
+				if (generalFormData) {
+					const hasConfigAdditionalValue = generalFormData.anio_impresion || 
+						generalFormData.agregar_po_auto !== undefined || generalFormData.no_eximir_normas !== undefined ||
+						generalFormData.activar_destinatario !== undefined || generalFormData.agregar_registro_502 !== undefined ||
+						generalFormData.agregar_quitar_normas !== undefined || generalFormData.facturar_cove !== undefined;
+					if (hasConfigAdditionalValue) {
+						payload.pedimento_config_additional = {
+							manual_pedimento_year: generalFormData.anio_impresion || null,
+							add_po_identifier: generalFormData.agregar_po_auto ? 1 : 0,
+							do_not_exempt_norms_complement_x: generalFormData.no_eximir_normas ? 1 : 0,
+							enable_import_invoice_recipient: generalFormData.activar_destinatario ? 1 : 0,
+							send_502_validation_file_for_consolidated: generalFormData.agregar_registro_502 ? 1 : 0,
+							add_remove_norms: generalFormData.agregar_quitar_normas ? 1 : 0
 						};
 					}
-				}			
+				}
+			
 
 			// Eliminar campos undefined para no enviarlos
 			Object.keys(payload).forEach(key => {
@@ -296,14 +375,17 @@
 				</h1>
 				{#if data.isCreate}
 					<Badge variant="default">Nuevo</Badge>
-				{:else}
-					<Badge variant={getStatusColor(data.pedimento.status)}>
-						{data.pedimento.status || 'Sin estado'}
+				{/if}
+				{#if generalFormData?.status || data.pedimento?.status}
+					<Badge variant={getStatusColor(generalFormData?.status || data.pedimento?.status)}>
+						{generalFormData?.status || data.pedimento?.status}
 					</Badge>
 				{/if}
 			</div>
 			<p class="text-muted-foreground">
-				{#if !data.isCreate && data.pedimento.pedimento_number}
+				{#if generalFormData?.year && generalFormData?.customs_office && generalFormData?.license && generalFormData?.pedimento_number}
+					Número: {generalFormData.year}-{generalFormData.customs_office}-{generalFormData.license}-{generalFormData.pedimento_number}
+				{:else if !data.isCreate && data.pedimento?.pedimento_number}
 					Número: {data.pedimento.year}-{data.pedimento.customs_office}-{data.pedimento.license}-{data.pedimento.pedimento_number}
 				{:else}
 					Edita los detalles del pedimento
@@ -332,7 +414,7 @@
 	{/if}
 
 	<!-- Contenido de las tabs con padding inferior para el footer flotante -->
-	<div class="pb-48">
+	<div class="pb-56">
 		<Tabs.Root bind:value={activeTab} class="space-y-4">
 			<Tabs.Content value="general">
 				<GeneralTabForm 
@@ -349,86 +431,130 @@
 			<Tabs.Content value="dates">
 				<DatesTabForm 
 					pedimento={data.pedimento} 
-					bind:formData={datesFormData}
-					bind:exists={datesExists}
-				/>
+					bind:formData={observacionesFormData}
+					bind:exists={observacionesExists}
+					pedimentoType={generalFormData?.pedimento_type || data.pedimento?.pedimento_type || ''}
+				pedimentoNumber={
+					generalFormData?.year && generalFormData?.customs_office && generalFormData?.license && generalFormData?.pedimento_number
+						? `${generalFormData.year}-${generalFormData.customs_office}-${generalFormData.license}-${generalFormData.pedimento_number}`
+						: (!data.isCreate && data.pedimento?.pedimento_number
+							? `${data.pedimento.year}-${data.pedimento.customs_office}-${data.pedimento.license}-${data.pedimento.pedimento_number}`
+							: '')
+				}
+			/>
+		</Tabs.Content>
+
+		<!-- <Tabs.Content value="facturas">
+			<FacturasTabForm 
+			bind:formData={facturasFormData}
+		/>
+	</Tabs.Content> -->
+
+		<!-- <!-- <Tabs.Content value="partidas">
+		<PartidasTabForm 
+			bind:formData={partidasFormData}
+		/>
+	</Tabs.Content> -->
+
+	<Tabs.Content value="bultos-transportes">
+		<BultosTransportesTabForm 
+			bind:formData={bultosTransportesFormData}
+		/>
+	</Tabs.Content>
+			<!-- <Tabs.Content value="descargas">
+		<DescargasTabForm 
+			bind:formData={descargasFormData}
+		/>
+	</Tabs.Content> -->
+			<Tabs.Content value="contribuciones">
+		<ContribucionesTabForm 
+			bind:formData={contribucionesFormData}
+		/>
+	</Tabs.Content>
+			<Tabs.Content value="cuentas-compensacion">
+		<CuentasCompensacionTabForm 
+			bind:formData={cuentasCompensacionFormData}
+		/>
+	</Tabs.Content>
+			<Tabs.Content value="otros-datos">
+				<OtrosDatosTabForm bind:formData={otrosDatosFormData} />
 			</Tabs.Content>
 
-			<Tabs.Content value="payments">
-				<PaymentsTabForm 
-					pedimento={data.pedimento} 
-					bind:formData={paymentsFormData}
-					bind:exists={paymentsExists}
-				/>
-			</Tabs.Content>
-
-			<Tabs.Content value="transport">
-				<TransportTabForm 
-					pedimento={data.pedimento} 
-					bind:formData={transportFormData}
-					bind:exists={transportExists}
-				/>
-			</Tabs.Content>
-
-			<Tabs.Content value="validation">
-				<ValidationTabForm 
-					pedimento={data.pedimento} 
-					bind:formData={validationFormData}
-					bind:exists={validationExists}
-				/>
+			<Tabs.Content value="digitalizacion">
+				<DigitalizacionTabForm bind:formData={digitalizacionFormData} />
 			</Tabs.Content>
 		</Tabs.Root>
 	</div>
 </div>
 
 <!-- Footer fijo en la parte inferior - Fuera del contenedor principal -->
-<div 
-	class="fixed bottom-0 left-0 right-0 bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/80 border-t shadow-lg z-[5] transition-[left] duration-200 ease-linear"
-	style:left={sidebar.isMobile ? '0' : (sidebar.open ? 'var(--sidebar-width)' : '0')}
->
-	<div class="px-4 py-4 space-y-4 max-w-[1400px] mx-auto">
-		<!-- Tabs Navigation -->
-		<Tabs.Root bind:value={activeTab}>
+<Tabs.Root bind:value={activeTab}>
+	<div 
+		class="fixed bottom-0 left-0 right-0 bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/80 border-t shadow-lg z-[5] transition-[left] duration-200 ease-linear"
+		style:left={sidebar.isMobile ? '0' : (sidebar.open ? 'var(--sidebar-width)' : '0')}
+	>
+		<div class="px-4 py-4 space-y-4 max-w-[1400px] mx-auto">
+			<!-- Tabs Navigation -->
 			<div class="w-full overflow-x-auto pb-2">
-				<Tabs.List class="inline-flex md:grid md:w-full md:grid-cols-5">
-					<Tabs.Trigger value="general" disabled={false} class="whitespace-nowrap">
-						<FileText size={16} class="mr-2" />
-						General
-					</Tabs.Trigger>
-					<Tabs.Trigger value="dates" disabled={false} class="whitespace-nowrap">
-						<Calendar size={16} class="mr-2" />
-						Fechas
-					</Tabs.Trigger>
-					<Tabs.Trigger value="payments" disabled={false} class="whitespace-nowrap">
-						<CreditCard size={16} class="mr-2" />
-						Pagos
-					</Tabs.Trigger>
-					<Tabs.Trigger value="transport" disabled={false} class="whitespace-nowrap">
-						<Truck size={16} class="mr-2" />
-						Transporte
-					</Tabs.Trigger>
-					<Tabs.Trigger value="validation" disabled={false} class="whitespace-nowrap">
-						<ShieldCheck size={16} class="mr-2" />
-						Validación
-					</Tabs.Trigger>
-				</Tabs.List>
+			<Tabs.List class="inline-flex w-full gap-1">
+				<Tabs.Trigger value="general" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm">
+					<FileText size={14} />
+					<span>General</span>
+				</Tabs.Trigger>
+				<Tabs.Trigger value="dates" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm">
+					<MessageSquare size={14} />
+					<span>Observ.</span>
+				</Tabs.Trigger>
+				<!-- <Tabs.Trigger value="facturas" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm">
+					<FileSpreadsheet size={14} />
+					<span>Facturas</span>
+				</Tabs.Trigger> -->
+				<!-- <Tabs.Trigger value="partidas" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm">
+					<Package size={14} />
+					<span>Partidas</span>
+				</Tabs.Trigger> -->
+				<Tabs.Trigger value="bultos-transportes" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm">
+					<Box size={14} />
+					<span>Bultos/Trans.</span>
+				</Tabs.Trigger>
+				<!-- <Tabs.Trigger value="descargas" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm">
+					<Download size={14} />
+					<span>Descargas</span>
+				</Tabs.Trigger> -->
+				<Tabs.Trigger value="contribuciones" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm">
+					<Coins size={14} />
+					<span>Contribuc.</span>
+				</Tabs.Trigger>
+				<Tabs.Trigger value="cuentas-compensacion" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm">
+					<Wallet size={14} />
+					<span>Cuentas/Comp.</span>
+				</Tabs.Trigger>
+				<Tabs.Trigger value="otros-datos" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm">
+					<FileStack size={14} />
+					<span>Otros</span>
+				</Tabs.Trigger>
+				<Tabs.Trigger value="digitalizacion" class="flex items-center gap-1.5 px-2.5 py-1.5 text-sm">
+					<Scan size={14} />
+					<span>Digital.</span>
+				</Tabs.Trigger>
+			</Tabs.List>
 			</div>
-		</Tabs.Root>
 
-		<!-- Botones de acción -->
-		<div class="flex justify-end gap-3">
-			<Button type="button" variant="outline" onclick={handleBack} disabled={saving}>
-				Cancelar
-			</Button>
-			<Button onclick={handleSaveAll} disabled={saving}>
-				{#if saving}
-					<LoaderCircle class="mr-2 h-4 w-4 animate-spin" />
-					Guardando todos los cambios...
-				{:else}
-					<Save size={16} class="mr-2" />
-					Guardar Todos los Cambios
-				{/if}
-			</Button>
+			<!-- Botones de acción -->
+			<div class="flex justify-end gap-3">
+				<Button type="button" variant="outline" onclick={handleBack} disabled={saving}>
+					Cancelar
+				</Button>
+				<Button onclick={handleSaveAll} disabled={saving}>
+					{#if saving}
+						<LoaderCircle class="mr-2 h-4 w-4 animate-spin" />
+						Guardando todos los cambios...
+					{:else}
+						<Save size={16} class="mr-2" />
+						Guardar Todos los Cambios
+					{/if}
+				</Button>
+			</div>
+		</div>
 	</div>
-</div>
-</div>
+</Tabs.Root>
\ No newline at end of file