Cambios en admin

Merge pull request 'Modificaciones a pedimento Detail' (#3 ) from PedimentoDetail into main
Reviewed-on: #3
2025-10-15 19:41:21 -06:00 · 2025-10-15 00:07:47 +00:00 · 2025-10-14 18:05:02 -06:00 · 2025-10-13 19:38:33 +00:00 · 2025-10-13 14:25:01 -05:00 · 2025-10-12 08:04:10 -06:00
8 changed files with 1348 additions and 1509 deletions
--- a/src/api/procesos.ts
+++ b/src/api/procesos.ts
@@ -1,31 +1,29 @@
 import { fetchWithAuth } from '../fetchWithAuth';

 // Tipos para la respuesta y registros
-export interface ProcesamientoPedimento {
-  id: number;
-  created_at: string;
-  updated_at: string;
-  organizacion: string;
-  organizacion_name: string;
-  estado: number;
-  tipo_procesamiento: number;
+export interface Task {
+  task_id: string;
+  timestamp: string;
+  message: string;
+  status: string;
  pedimento: string;
+  organizacion: string;
  servicio: number;
 }

-export interface ProcesamientoPedimentosResponse {
+export interface TasksResponse {
  count: number;
  next: string | null;
  previous: string | null;
-  results: ProcesamientoPedimento[];
+  results: Task[];
 }

-// API para customs/procesamientopedimentos/
-export async function fetchProcesamientoPedimentos(
+// API para tasks/tasks/
+export async function fetchTasks(
  page: number = 1,
  pageSize: number = 20,
  filters: Record<string, any> = {}
-): Promise<ProcesamientoPedimentosResponse> {
+): Promise<TasksResponse> {
  try {
    const API_URL = (import.meta as any).env.VITE_EFC_API_URL;
    
@@ -41,15 +39,15 @@ export async function fetchProcesamientoPedimentos(
      }
    });
    
-    const res = await fetchWithAuth(`${API_URL}/customs/procesamientopedimentos/?${params.toString()}`);
+    const res = await fetchWithAuth(`${API_URL}/tasks/tasks/?${params.toString()}`);
    
    if (!res.ok) {
-      throw new Error('Error al obtener procesamiento de pedimentos');
+      throw new Error('Error al obtener tareas');
    }
    
    return await res.json();
  } catch (error) {
-    console.error('Error in fetchProcesamientoPedimentos:', error);
+    console.error('Error in fetchTasks:', error);
    throw error;
  }
 }
--- a/src/api/taskStatus.js
+++ b/src/api/taskStatus.js
@@ -0,0 +1,36 @@
+// Helper functions for task status display
+
+export const getTaskStatusLabel = (status) => {
+  const statuses = {
+    'submitted': 'Enviado',
+    'pending': 'Pendiente',
+    'processing': 'Procesando',
+    'completed': 'Completado',
+    'failed': 'Error',
+    'cancelled': 'Cancelado'
+  };
+  return statuses[status] || `Estado ${status}`;
+};
+
+export const getTaskStatusColor = (status) => {
+  const colors = {
+    'submitted': 'bg-blue-100 text-blue-800',
+    'pending': 'bg-yellow-100 text-yellow-800',
+    'processing': 'bg-indigo-100 text-indigo-800',
+    'completed': 'bg-green-100 text-green-800', 
+    'failed': 'bg-red-100 text-red-800',
+    'cancelled': 'bg-gray-100 text-gray-800'
+  };
+  return colors[status] || 'bg-gray-100 text-gray-800';
+};
+
+// Ayuda a determinar si el estado permite ciertas acciones
+export const isTaskActionable = (status) => {
+  const nonActionableStatuses = ['processing', 'completed', 'cancelled'];
+  return !nonActionableStatuses.includes(status);
+};
+
+export const isTaskFinal = (status) => {
+  const finalStatuses = ['completed', 'failed', 'cancelled'];
+  return finalStatuses.includes(status);
+};
--- a/src/pages/Admin.jsx
+++ b/src/pages/Admin.jsx
@@ -312,72 +312,6 @@ export default function Admin() {
            </div>
          </div>
        </div>
-        {/* Análisis de actividad de usuario */}
-        {!(typeof window !== 'undefined' && localStorage.getItem('user_is_importador') === 'true') && !isGroup35 && (
-          <div className="bg-white rounded-3xl shadow-2xl border border-gray-100 p-4 sm:p-6 mb-6 sm:mb-8 animate-fadein-slideup opacity-0 relative overflow-hidden"
-            style={{
-              animation: 'fadein-slideup 0.7s cubic-bezier(0.22,1,0.36,1) 0.65s forwards',
-            }}
-          >
-            <div className="absolute inset-0 bg-gradient-to-br from-indigo-500/3 to-purple-500/3"></div>
-            <div className="relative z-10">
-              <div className="flex items-center gap-3 mb-4 sm:mb-6">
-                <div className="bg-gradient-to-br from-indigo-500 to-purple-600 rounded-full p-3 shadow-lg">
-                  <svg className="h-6 w-6 sm:h-7 sm:w-7 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                    <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M16 8v8m-4-5v5m-4-2v2m-2 4h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z" />
-                  </svg>
-                </div>
-                <h3 className="text-xl sm:text-2xl font-bold text-gray-900">Actividad de Usuarios</h3>
-              </div>
-              {loading ? (
-                <div className="flex items-center justify-center py-8">
-                  <div className="animate-spin rounded-full h-8 w-8 border-b-2 border-indigo-600"></div>
-                  <span className="ml-3 text-gray-500">Cargando...</span>
-                </div>
-              ) : error ? (
-                <div className="text-red-600 bg-red-50 p-4 rounded-xl border border-red-200">{error}</div>
-              ) : userActivity ? (
-                <div className="grid grid-cols-1 lg:grid-cols-2 gap-6 sm:gap-8">
-                  <div className="bg-gradient-to-br from-blue-50 to-indigo-50 rounded-2xl p-4 sm:p-6 border border-blue-100">
-                    <h4 className="font-bold text-gray-800 mb-4 flex items-center gap-2">
-                      <div className="w-2 h-2 bg-blue-500 rounded-full"></div>
-                      Resumen de acciones
-                    </h4>
-                    <div className="space-y-3">
-                      {Object.entries(userActivity.actions_count).map(([action, count]) => (
-                        <div key={action} className="flex justify-between items-center bg-white rounded-xl p-3 shadow-sm border border-blue-100">
-                          <span className="capitalize text-gray-700 font-medium">{action}</span>
-                          <span className="font-mono text-blue-700 bg-blue-100 px-2 py-1 rounded-lg text-sm font-bold">{count}</span>
-                        </div>
-                      ))}
-                      <div className="flex justify-between items-center bg-gradient-to-r from-blue-600 to-indigo-600 text-white rounded-xl p-3 shadow-lg font-semibold">
-                        <span>Total actividades</span>
-                        <span className="font-mono bg-white/20 px-2 py-1 rounded-lg">{userActivity.actividades_filtradas}</span>
-                      </div>
-                    </div>
-                  </div>
-                  <div className="bg-gradient-to-br from-green-50 to-emerald-50 rounded-2xl p-4 sm:p-6 border border-green-100">
-                    <h4 className="font-bold text-gray-800 mb-4 flex items-center gap-2">
-                      <div className="w-2 h-2 bg-green-500 rounded-full"></div>
-                      Top usuarios
-                    </h4>
-                    <div className="space-y-3">
-                      {userActivity.top_users.map((user, idx) => (
-                        <div key={user.username} className="flex justify-between items-center bg-white rounded-xl p-3 shadow-sm border border-green-100">
-                          <div className="flex items-center gap-3">
-                            <span className="bg-green-100 text-green-800 rounded-full w-6 h-6 flex items-center justify-center text-xs font-bold">{idx + 1}</span>
-                            <span className="text-gray-700 font-medium">{user.username}</span>
-                          </div>
-                          <span className="font-mono text-green-700 bg-green-100 px-2 py-1 rounded-lg text-sm font-bold">{user.activity_count}</span>
-                        </div>
-                      ))}
-                    </div>
-                  </div>
-                </div>
-              ) : null}
-            </div>
-          </div>
-        )}

        {/* Tabla de últimos documentos */}
        <div className="bg-white rounded-3xl shadow-2xl border border-gray-100 p-4 sm:p-6 mb-6 sm:mb-8 animate-fadein-slideup opacity-0 relative overflow-hidden"
--- a/src/pages/Auditor.jsx
+++ b/src/pages/Auditor.jsx
@@ -1,4 +1,6 @@
+
 import React, { useState, useEffect } from 'react';
+import { Link } from 'react-router-dom';
 import { getWithAuth, postWithAuth } from '../fetchWithAuth';
 const API_URL = import.meta.env.VITE_EFC_API_URL;

@@ -15,6 +17,85 @@ function Auditor() {
  const [auditandoRemesas, setAuditandoRemesas] = useState(false);
  const [procesandoPedimento, setProcesandoPedimento] = useState(null);
  const [procesandoRemesa, setProcesandoRemesa] = useState(null);
+  const [procesandoAcuse, setProcesandoAcuse] = useState(null);
+  const [procesandoCove, setProcesandoCove] = useState(null);
+  const [auditandoAcusesCove, setAuditandoAcusesCove] = useState(false);
+  const [pedimentoFilter, setPedimentoFilter] = useState('');
+  const [auditandoEDocuments, setAuditandoEDocuments] = useState(false);
+  const [auditandoAcuses, setAuditandoAcuses] = useState(false);
+
+  // Handler para auditar acuses (general)
+  const handleAuditarAcuses = async () => {
+    if (auditandoAcuses) return;
+    try {
+      setAuditandoAcuses(true);
+      const organizacionId = pedimentos[0]?.organizacion;
+      if (!organizacionId) {
+        throw new Error('No hay organización disponible para auditar');
+      }
+      const response = await postWithAuth(`${API_URL}/customs/auditor/auditar-acuse/`, {
+        organizacion_id: organizacionId
+      });
+      if (!response.ok) {
+        throw new Error('Error al iniciar la auditoría de acuses');
+      }
+      alert('La auditoría de acuses se ha iniciado correctamente');
+    } catch (error) {
+      console.error('Error:', error);
+      alert(error.message);
+    } finally {
+      setAuditandoAcuses(false);
+    }
+  };
+
+  // Handler para auditar EDocuments (general)
+  const handleAuditarEDocuments = async () => {
+    if (auditandoEDocuments) return;
+    try {
+      setAuditandoEDocuments(true);
+      const organizacionId = pedimentos[0]?.organizacion;
+      if (!organizacionId) {
+        throw new Error('No hay organización disponible para auditar');
+      }
+      const response = await postWithAuth(`${API_URL}/customs/auditor/auditar-edocuments/`, {
+        organizacion_id: organizacionId
+      });
+      if (!response.ok) {
+        throw new Error('Error al iniciar la auditoría de EDocuments');
+      }
+      alert('La auditoría de EDocuments se ha iniciado correctamente');
+    } catch (error) {
+      console.error('Error:', error);
+      alert(error.message);
+    } finally {
+      setAuditandoEDocuments(false);
+    }
+  };
+
+  // Handler para auditar acuses cove (general)
+  const handleAuditarAcusesCove = async () => {
+    if (auditandoAcusesCove) return;
+    try {
+      setAuditandoAcusesCove(true);
+      // Obtener el organizacion_id del primer pedimento
+      const organizacionId = pedimentos[0]?.organizacion;
+      if (!organizacionId) {
+        throw new Error('No hay organización disponible para auditar');
+      }
+      const response = await postWithAuth(`${API_URL}/customs/auditor/auditar-acuse-cove/`, {
+        organizacion_id: organizacionId
+      });
+      if (!response.ok) {
+        throw new Error('Error al iniciar la auditoría de acuses cove');
+      }
+      alert('La auditoría de acuses cove se ha iniciado correctamente');
+    } catch (error) {
+      console.error('Error:', error);
+      alert(error.message);
+    } finally {
+      setAuditandoAcusesCove(false);
+    }
+  };

  const handleAuditarRemesaPedimento = async (pedimentoId) => {
    if (procesandoRemesa) return;
@@ -159,11 +240,54 @@ function Auditor() {
    }
  };

+  const handleAuditarAcusePedimento = async (pedimentoId) => {
+    if (procesandoAcuse) return;
+    try {
+      setProcesandoAcuse(pedimentoId);
+      const response = await postWithAuth(`${API_URL}/customs/auditor/auditar-acuse/pedimento/`, {
+        pedimento_id: pedimentoId
+      });
+      if (!response.ok) {
+        throw new Error('Error al auditar acuse del pedimento');
+      }
+      alert('El acuse del pedimento se está auditando');
+    } catch (error) {
+      console.error('Error:', error);
+      alert(error.message);
+    } finally {
+      setProcesandoAcuse(null);
+    }
+  };
+
+  const handleAuditarCovePedimento = async (pedimentoId) => {
+    if (procesandoCove) return;
+    try {
+      setProcesandoCove(pedimentoId);
+      const response = await postWithAuth(`${API_URL}/customs/auditor/auditar-cove/pedimento/`, {
+        pedimento_id: pedimentoId
+      });
+      if (!response.ok) {
+        throw new Error('Error al auditar COVE del pedimento');
+      }
+      alert('El COVE del pedimento se está auditando');
+    } catch (error) {
+      console.error('Error:', error);
+      alert(error.message);
+    } finally {
+      setProcesandoCove(null);
+    }
+  };
+
  useEffect(() => {
    const fetchPedimentos = async () => {
      setLoading(true);
      try {
-        const response = await getWithAuth(`${API_URL}/customs/pedimentos/?page=${page}&page_size=${itemsPerPage}`);
+        const queryParams = new URLSearchParams({
+          page: page.toString(),
+          page_size: itemsPerPage.toString(),
+          ...(pedimentoFilter && { pedimento_app: pedimentoFilter })
+        });
+        const response = await getWithAuth(`${API_URL}/customs/pedimentos/?${queryParams}`);
        if (!response.ok) throw new Error('Error al cargar los pedimentos');
        const data = await response.json();
        setPedimentos(data.results);
@@ -174,8 +298,14 @@ function Auditor() {
        setLoading(false);
      }
    };
+
+    // Aplicar debounce al fetchPedimentos
+    const timeoutId = setTimeout(() => {
      fetchPedimentos();
-  }, [page, itemsPerPage]);
+    }, 300);
+
+    return () => clearTimeout(timeoutId);
+  }, [page, itemsPerPage, pedimentoFilter]);

  return (
    <div className="min-h-screen bg-gradient-to-br from-slate-50 via-blue-50 to-indigo-100 p-4 sm:p-6 lg:p-8">
@@ -247,6 +377,7 @@ function Auditor() {
          ) : (
            <div className="space-y-6">
              <div className="bg-white rounded-2xl p-4 sm:p-6 border border-gray-200 shadow-sm">
+
                <div className="flex justify-between items-center mb-6">
                  <h3 className="text-xl font-semibold text-gray-900 flex items-center gap-2">
                    <svg className="w-6 h-6 text-indigo-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -254,8 +385,91 @@ function Auditor() {
                    </svg>
                    Servicios de Auditoría
                  </h3>
-                  
                  <div className="flex gap-4">
+                    <button
+                      onClick={handleAuditarAcusesCove}
+                      disabled={auditandoAcusesCove || pedimentos.length === 0}
+                      className={`inline-flex items-center px-4 py-2 rounded-lg shadow-sm text-white transition-all duration-200 
+                        ${auditandoAcusesCove
+                          ? 'bg-gray-400 cursor-not-allowed'
+                          : 'bg-pink-600 hover:bg-pink-700 hover:shadow-md transform hover:scale-105'
+                        }
+                      `}
+                    >
+                      {auditandoAcusesCove ? (
+                        <>
+                          <svg className="animate-spin -ml-1 mr-3 h-5 w-5 text-white" fill="none" viewBox="0 0 24 24">
+                            <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4"></circle>
+                            <path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
+                          </svg>
+                          Auditando Acuses Cove...
+                        </>
+                      ) : (
+                        <>
+                          <svg className="mr-2 h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M9 17v-2m3 2v-4m3 4v-6m2 10H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
+                          </svg>
+                          Auditar Acuses Cove
+                        </>
+                      )}
+                    </button>
+
+                    <button
+                      onClick={handleAuditarEDocuments}
+                      disabled={auditandoEDocuments || pedimentos.length === 0}
+                      className={`inline-flex items-center px-4 py-2 rounded-lg shadow-sm text-white transition-all duration-200 
+                        ${auditandoEDocuments
+                          ? 'bg-gray-400 cursor-not-allowed'
+                          : 'bg-yellow-600 hover:bg-yellow-700 hover:shadow-md transform hover:scale-105'
+                        }
+                      `}
+                    >
+                      {auditandoEDocuments ? (
+                        <>
+                          <svg className="animate-spin -ml-1 mr-3 h-5 w-5 text-white" fill="none" viewBox="0 0 24 24">
+                            <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4"></circle>
+                            <path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
+                          </svg>
+                          Auditando EDocuments...
+                        </>
+                      ) : (
+                        <>
+                          <svg className="mr-2 h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M9 17v-2m3 2v-4m3 4v-6m2 10H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
+                          </svg>
+                          Auditar EDocuments
+                        </>
+                      )}
+                    </button>
+
+                    <button
+                      onClick={handleAuditarAcuses}
+                      disabled={auditandoAcuses || pedimentos.length === 0}
+                      className={`inline-flex items-center px-4 py-2 rounded-lg shadow-sm text-white transition-all duration-200 
+                        ${auditandoAcuses
+                          ? 'bg-gray-400 cursor-not-allowed'
+                          : 'bg-blue-600 hover:bg-blue-700 hover:shadow-md transform hover:scale-105'
+                        }
+                      `}
+                    >
+                      {auditandoAcuses ? (
+                        <>
+                          <svg className="animate-spin -ml-1 mr-3 h-5 w-5 text-white" fill="none" viewBox="0 0 24 24">
+                            <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4"></circle>
+                            <path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
+                          </svg>
+                          Auditando Acuses...
+                        </>
+                      ) : (
+                        <>
+                          <svg className="mr-2 h-5 w-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M9 17v-2m3 2v-4m3 4v-6m2 10H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
+                          </svg>
+                          Auditar Acuses
+                        </>
+                      )}
+                    </button>
+
                    <button
                      onClick={handleAuditarTodos}
                      disabled={auditando || auditandoPartidas || pedimentos.length === 0}
@@ -342,6 +556,39 @@ function Auditor() {
                  </div>
                </div>

+                {/* Sección de Filtros */}
+                <div className="mt-6 bg-white rounded-lg border border-gray-200 p-6">
+                  <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
+                    {/* Contenedor para los filtros - esperando instrucciones */}
+                    <div className="col-span-full">
+                      <h3 className="text-lg font-medium text-gray-900 mb-4">
+                        Filtros de Búsqueda
+                      </h3>
+                    </div>
+                    <div className="col-span-1">
+                      <label htmlFor="pedimento" className="block text-sm font-medium text-gray-700 mb-2">
+                        Número de Pedimento
+                      </label>
+                      <div className="relative rounded-md shadow-sm">
+                        <input
+                          type="text"
+                          name="pedimento"
+                          id="pedimento"
+                          value={pedimentoFilter}
+                          onChange={(e) => setPedimentoFilter(e.target.value)}
+                          className="focus:ring-indigo-500 focus:border-indigo-500 block w-full pl-3 pr-10 py-2 sm:text-sm border-gray-300 rounded-md"
+                          placeholder="Buscar por pedimento..."
+                        />
+                        <div className="absolute inset-y-0 right-0 pr-3 flex items-center pointer-events-none">
+                          <svg className="h-5 w-5 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
+                          </svg>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+
                {/* Tabla de pedimentos */}
                <div className="overflow-x-auto">
                  <table className="min-w-full divide-y divide-gray-300">
@@ -384,7 +631,7 @@ function Auditor() {
                      {pedimentos.map((pedimento) => (
                        <tr key={pedimento.id} className="hover:bg-gray-50">
                          <td className="whitespace-nowrap py-4 pl-4 pr-3 text-sm font-medium text-gray-900">
-                            {pedimento.pedimento_app}
+                            <Link to={`/expedientes/pedimento/${pedimento.id}`} className='hover:text-blue-500 hover:text-bold hover:text-underline'>{pedimento.pedimento_app}</Link>
                          </td>
                          {/* PC - Pedimento Completo */}
                          <td className="whitespace-nowrap px-3 py-4 text-sm text-gray-500 text-center">
@@ -444,18 +691,46 @@ function Auditor() {
                          </td>
                          {/* AC - Acuse */}
                          <td className="whitespace-nowrap px-3 py-4 text-sm text-gray-500 text-center">
-                            <button className="inline-flex items-center justify-center w-8 h-8 rounded-full bg-white border border-gray-200 shadow-sm hover:shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 transition-all duration-200 hover:scale-110">
+                            <button
+                              onClick={() => handleAuditarAcusePedimento(pedimento.id)}
+                              disabled={procesandoAcuse === pedimento.id}
+                              className={`inline-flex items-center justify-center w-8 h-8 rounded-full bg-white border border-gray-200 ${procesandoAcuse === pedimento.id
+                                ? 'opacity-50 cursor-not-allowed'
+                                : 'shadow-sm hover:shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 transition-all duration-200 hover:scale-110'
+                                }`}
+                            >
+                              {procesandoAcuse === pedimento.id ? (
+                                <svg className="h-4 w-4 text-gray-600 animate-spin" fill="none" viewBox="0 0 24 24">
+                                  <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4"></circle>
+                                  <path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
+                                </svg>
+                              ) : (
                                <svg className="h-4 w-4 text-green-600" fill="currentColor" viewBox="0 0 24 24">
                                  <path d="M8 5v14l11-7z" />
                                </svg>
+                              )}
                            </button>
                          </td>
                          {/* COVE */}
                          <td className="whitespace-nowrap px-3 py-4 text-sm text-gray-500 text-center">
-                            <button className="inline-flex items-center justify-center w-8 h-8 rounded-full bg-white border border-gray-200 shadow-sm hover:shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 transition-all duration-200 hover:scale-110">
+                            <button
+                              onClick={() => handleAuditarCovePedimento(pedimento.id)}
+                              disabled={procesandoCove === pedimento.id}
+                              className={`inline-flex items-center justify-center w-8 h-8 rounded-full bg-white border border-gray-200 ${procesandoCove === pedimento.id
+                                ? 'opacity-50 cursor-not-allowed'
+                                : 'shadow-sm hover:shadow-md focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 transition-all duration-200 hover:scale-110'
+                                }`}
+                            >
+                              {procesandoCove === pedimento.id ? (
+                                <svg className="h-4 w-4 text-gray-600 animate-spin" fill="none" viewBox="0 0 24 24">
+                                  <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4"></circle>
+                                  <path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
+                                </svg>
+                              ) : (
                                <svg className="h-4 w-4 text-green-600" fill="currentColor" viewBox="0 0 24 24">
                                  <path d="M8 5v14l11-7z" />
                                </svg>
+                              )}
                            </button>
                          </td>
                          {/* AC_COVE */}
--- a/src/pages/Documents.jsx
+++ b/src/pages/Documents.jsx
@@ -13,68 +13,11 @@ import { fetchPedimentoDocuments } from '../api/documentos.ts';
 import { useNotification } from '../context/NotificationContext';
 // import { usePolling } from '../hooks/usePolling';
 import { Link } from 'react-router-dom';
+import { downloadFile, downloadBulkZip } from '../utils/downloadUtils';

 const API_URL = import.meta.env.VITE_EFC_API_URL;

-// Descarga individual
-const downloadFile = async (id, filename = 'archivo', setSuccess, setError, showMessage) => {
-  try {
-    const res = await fetchWithAuth(`${API_URL}/record/documents/descargar/${id}/`);

-    if (!res.ok) {
-      alert('No autorizado o error en la descarga');
-      return;
-    }
-    
-    const blob = await res.blob();
-    const url = window.URL.createObjectURL(blob);
-    const a = document.createElement('a');
-    a.href = url;
-    a.download = filename;
-    document.body.appendChild(a);
-    a.click();
-    a.remove();
-    window.URL.revokeObjectURL(url);
-    if (setSuccess) setSuccess('Descarga exitosa');
-  } catch (error) {
-    console.error('Error downloading file:', error);
-    showMessage('Error al descargar el archivo', 'error');
-  }
-};
-
-// Descarga masiva (bulk)
-const downloadBulkZip = async (ids, showMessage, setSuccess, nombreZip = 'documentos') => {
-  if (!ids.length) {
-    showMessage('Selecciona al menos un documento.', 'error');
-    return;
-  }
-  
-  try {
-    const res = await postWithAuth(`${API_URL}/record/documents/bulk-download/`, {
-      document_ids: ids, 
-      pedimento_nombre: nombreZip
-    });
-    
-    if (!res.ok) {
-      showMessage('No autorizado o error en la descarga masiva', 'error');
-      return;
-    }
-    
-    const blob = await res.blob();
-    const url = window.URL.createObjectURL(blob);
-    const a = document.createElement('a');
-    a.href = url;
-    a.download = `${nombreZip || 'documentos'}.zip`;
-    document.body.appendChild(a);
-    a.click();
-    a.remove();
-    window.URL.revokeObjectURL(url);
-    if (setSuccess) setSuccess('Descarga(s) completada(s)');
-  } catch (error) {
-    console.error('Error in bulk download:', error);
-    showMessage('Error en la descarga masiva', 'error');
-  }
-};

 export default function Documents() {
  const focusKeeperRef = useRef(null);
--- a/src/pages/PedimentoDetail.jsx
+++ b/src/pages/PedimentoDetail.jsx
@@ -17,11 +17,13 @@ import 'highlight.js/styles/github.css';
 hljs.registerLanguage('xml', xml);
 import { fetchPedimentoDocuments } from '../api/pedimentoDocuments';
 import { fetchWithAuth, postWithAuth, putWithAuth } from '../fetchWithAuth';
-import { fetchProcesamientoPedimentos } from '../api/procesos.ts';
+import { fetchTasks } from '../api/procesos.ts';
 import { fetchPedimentoCoves, downloadCove, downloadAcuseCove } from '../api/coves';
 import { fetchPedimentoEdocuments, downloadEdocument, downloadAcuseEdocument } from '../api/edocuments';
+import { getTaskStatusLabel, getTaskStatusColor, isTaskActionable, isTaskFinal } from '../api/taskStatus';
 import { useParams, Link } from 'react-router-dom';
 import { useNotification } from '../context/NotificationContext';
+import { downloadFile, downloadBulkZip } from '../utils/downloadUtils';

 const API_URL = import.meta.env.VITE_EFC_API_URL;
 const MICROSERVICE_URL = import.meta.env.VITE_EFC_MICROSERVICE_URL;
@@ -101,7 +103,7 @@ function formatXml(xml) {
  return formatted.trim();
 }

-// Funci\u00f3n auxiliar para descargas individuales\nconst downloadFile = async (id, filename = 'archivo', showMessage) => {\n  try {\n    const res = await fetchWithAuth(`${API_URL}/record/documents/descargar/${id}/`);\n    \n    if (!res.ok) {\n      showMessage('Error en la descarga del archivo', 'error');\n      return;\n    }\n    \n    const blob = await res.blob();\n    const url = window.URL.createObjectURL(blob);\n    const a = document.createElement('a');\n    a.href = url;\n    a.download = filename;\n    document.body.appendChild(a);\n    a.click();\n    a.remove();\n    window.URL.revokeObjectURL(url);\n  } catch (error) {\n    console.error('Error downloading file:', error);\n    if (error.message === 'SESSION_EXPIRED') {\n      showMessage('Tu sesi\u00f3n ha expirado, por favor inicia sesi\u00f3n de nuevo.', 'error');\n    } else {\n      showMessage('Error al descargar el archivo', 'error');\n    }\n  }\n};\n\n// Funci\u00f3n auxiliar para descargas\nconst downloadBulkZip = async (ids, showMessage, pedimentoName) => {\n  try {\n    const response = await fetchWithAuth(`${API_URL}/record/documents/bulk-download/`, {\n      method: 'POST',\n      headers: { 'Content-Type': 'application/json' },\n      body: JSON.stringify({ document_ids: ids })\n    });\n    \n    if (!response.ok) throw new Error('Error en la descarga');\n    \n    const blob = await response.blob();\n    const url = window.URL.createObjectURL(blob);\n    const a = document.createElement('a');\n    a.href = url;\n    a.download = `documentos_${pedimentoName || 'pedimento'}.zip`;\n    document.body.appendChild(a);\n    a.click();\n    window.URL.revokeObjectURL(url);\n    document.body.removeChild(a);\n    \n    showMessage('Descarga iniciada exitosamente', 'success');\n  } catch (error) {\n    showMessage('Error en la descarga: ' + error.message, 'error');\n  }\n};
+

 export default function PedimentoDetail() {
  // Estados principales
@@ -370,12 +372,22 @@ export default function PedimentoDetail() {
  const [procesosPage, setProcesosPage] = useState(1);
  const [procesosPageSize, setProcesosPageSize] = useState(10);
  const [procesosFilters, setProcesosFilters] = useState({});
+  const [sortField, setSortField] = useState('');
+  const [sortOrder, setSortOrder] = useState('asc');
+  const [selectedProcesos, setSelectedProcesos] = useState([]);
+  const [isSelectAll, setIsSelectAll] = useState(false);
  
  // Estados para las acciones de procesos
  const [executingId, setExecutingId] = useState(null);
  const [changingStateId, setChangingStateId] = useState(null);
  const [creatingService, setCreatingService] = useState(null);

+  // Ref para rastrear valores previos de filtros
+  const prevFiltersRef = useRef({
+    sortField: '',
+    sortOrder: 'asc'
+  });
+  
  // Estados para modal de preview
  const [previewOpen, setPreviewOpen] = useState(false);
  const [previewUrl, setPreviewUrl] = useState('');
@@ -448,7 +460,7 @@ export default function PedimentoDetail() {
    setSelected(prev => prev.includes(id) ? prev.filter(x => x !== id) : [...prev, id]);
  };

-  const handleSelectAll = () => {
+  const handleSelectAllDocs = () => {
    if (allSelected) setSelected([]);
    else setSelected(allDocIds);
  };
@@ -824,10 +836,22 @@ export default function PedimentoDetail() {
  }, [edocsFilters]);

  // Funciones para acciones de Procesos
+  // Map legacy estado values to new status values
+  const mapEstadoToStatus = (estado) => {
+    const mapping = {
+      1: 'pending',    // Pendiente
+      2: 'processing', // En Proceso
+      3: 'completed',  // Completado
+      4: 'failed',     // Error
+      5: 'cancelled'   // Cancelado
+    };
+    return mapping[estado] || 'pending';
+  };
+
  const updateProcesoEstado = (procId, nuevoEstado) => {
    setProcesos(procesos =>
      procesos.map(proc =>
-        proc.id === procId ? { ...proc, estado: nuevoEstado } : proc
+        proc.id === procId ? { ...proc, status: mapEstadoToStatus(nuevoEstado) } : proc
      )
    );
  };
@@ -850,7 +874,7 @@ export default function PedimentoDetail() {
        organizacion: pedimentoData?.organizacion || 1 // Usar la organización del pedimento o default
      };
      
-      const res = await postWithAuth(`${API_URL}/customs/procesamientopedimentos/`, body);
+      const res = await postWithAuth(`${API_URL}/tasks/tasks/`, body);
      
      if (!res.ok) {
        throw new Error(`Error al crear el servicio: ${nombreServicio}`);
@@ -871,7 +895,7 @@ export default function PedimentoDetail() {
          ...procesosFilters,
          pedimento: id
        };
-        fetchProcesamientoPedimentos(procesosPage, procesosPageSize, filters)
+        fetchTasks(procesosPage, procesosPageSize, filters)
          .then((data) => {
            setProcesos(data.results);
            setProcesosCount(data.count);
@@ -893,33 +917,33 @@ export default function PedimentoDetail() {
    setChangingStateId(proc.id);
    
    // Cambiar estado visual a "Procesando" inmediatamente
-    updateProcesoEstado(proc.id, 2); // 2 = Procesando
+    updateProcesoEstado(proc.id, 'processing');
    
    try {
      const body = {
-        estado: 1, // Cambiar a En Espera
+        status: 'pending', // Cambiar a Pendiente
        tipo_procesamiento: 2,
        pedimento: typeof proc.pedimento === 'object' && proc.pedimento !== null ? proc.pedimento.id : proc.pedimento,
        servicio: proc.servicio,
        organizacion: proc.organizacion_id || proc.organizacion || proc.organizacionId
      };
      
-      const res = await putWithAuth(`${API_URL}/customs/procesamientopedimentos/${proc.id}/`, body);
+      const res = await putWithAuth(`${API_URL}/tasks/tasks/${proc.task_id}/`, body);
      
      if (!res.ok) {
-        // Si falla, revertir a estado Error
-        updateProcesoEstado(proc.id, 4); // 4 = Error
+        // Si falla, cambiar a estado Error
+        updateProcesoEstado(proc.id, 'failed'); // Failed
        throw new Error('Error al cambiar el estado del proceso');
      }
      
      // Cambiar estado visual a "En Espera" si fue exitoso
-      updateProcesoEstado(proc.id, 1); // 1 = En Espera
+      updateProcesoEstado(proc.id, 'pending');
      
      showMessage('Estado cambiado a "En Espera" correctamente', 'success');
      
    } catch (err) {
      console.error('Error cambiando estado:', err);
-      updateProcesoEstado(proc.id, 4); // 4 = Error
+      updateProcesoEstado(proc.id, 'failed');
      showMessage('Error al cambiar el estado del proceso: ' + err.message, 'error');
    } finally {
      setChangingStateId(null);
@@ -930,7 +954,7 @@ export default function PedimentoDetail() {
    setExecutingId(proc.id);
    
    // Cambiar estado visual a "Procesando" inmediatamente
-    updateProcesoEstado(proc.id, 2); // 2 = Procesando
+    updateProcesoEstado(proc.id, 'processing');
    
    let endpoint = '';
    // Determinar endpoint según el tipo de servicio
@@ -958,7 +982,7 @@ export default function PedimentoDetail() {
        break;
      default:
        // Revertir estado si el servicio no es soportado
-        updateProcesoEstado(proc.id, proc.estado); // Revertir al estado original
+        updateProcesoEstado(proc.id, proc.status); // Revertir al estado original
        showMessage('Este servicio no es compatible para ejecución directa.', 'error');
        setExecutingId(null);
        return;
@@ -974,17 +998,17 @@ export default function PedimentoDetail() {
      
      if (!res.ok) {
        // Si falla, cambiar estado a Error
-        updateProcesoEstado(proc.id, 4); // 4 = Error
+        updateProcesoEstado(proc.id, 'failed');
        throw new Error('Error al ejecutar el servicio');
      }
      
      // Si es exitoso, cambiar estado a Finalizado
-      updateProcesoEstado(proc.id, 3); // 3 = Finalizado
+      updateProcesoEstado(proc.id, 'completed');
      
      showMessage('El servicio se ha ejecutado correctamente', 'success');
    } catch (err) {
      // Cambiar estado a Error en caso de excepción
-      updateProcesoEstado(proc.id, 4); // 4 = Error
+      updateProcesoEstado(proc.id, 'failed');
      
      if (err.message === 'SESSION_EXPIRED') {
        showMessage('Tu sesión ha expirado. Por favor, inicia sesión nuevamente.', 'error');
@@ -1258,6 +1282,57 @@ export default function PedimentoDetail() {
    }
  };
  
+  // Funciones de manejo de procesos
+  // Removed duplicate definitions
+  
+  // Handle select all process checkboxes
+  const handleSelectAllProcesos = (e) => {
+    if (e.target.checked) {
+      const availableProcesos = procesos
+        .filter(proc => proc.status !== 'running' && proc.status !== 'completed')
+        .map(proc => proc.task_id);
+      setSelectedProcesos(availableProcesos);
+      setIsSelectAll(true);
+    } else {
+      setSelectedProcesos([]);
+      setIsSelectAll(false);
+    }
+  };
+
+  // Handle select individual process checkbox
+  const handleSelectProceso = (id, checked) => {
+    if (checked) {
+      setSelectedProcesos(prev => [...prev, id]);
+    } else {
+      setSelectedProcesos(prev => prev.filter(i => i !== id));
+    }
+    // Update isSelectAll
+    const availableProcesos = procesos
+      .filter(proc => proc.status !== 'running' && proc.status !== 'completed')
+      .map(proc => proc.task_id);
+    setIsSelectAll(availableProcesos.length === selectedProcesos.length + (checked ? 1 : -1));
+  };
+
+  const handlePasarPaginaAEspera = async () => {
+    const failedProcesses = procesos.filter(proc => proc.status === 'failed');
+    if (failedProcesses.length === 0) return;
+    
+    for (const proceso of failedProcesses) {
+      await handlePasarAEspera(proceso);
+    }
+  };
+
+  const handlePasarSeleccionadosAEspera = async () => {
+    const failedSelectedProcesses = procesos.filter(
+      proc => selectedProcesos.includes(proc.task_id) && proc.status === 'failed'
+    );
+    if (failedSelectedProcesses.length === 0) return;
+    
+    for (const proceso of failedSelectedProcesses) {
+      await handlePasarAEspera(proceso);
+    }
+  };
+
  // Función para verificar servicios creados
  const handleVerificarServiciosCreados = async () => {
    try {
@@ -1348,16 +1423,47 @@ export default function PedimentoDetail() {
  useEffect(() => {
    if (!id || activeTab !== 'procesos') return;

+    // Detectar si algún filtro cambió
+    const currentFilters = {
+      sortField,
+      sortOrder
+    };
+    
+    const filtersChanged = Object.keys(currentFilters).some(
+      key => currentFilters[key] !== prevFiltersRef.current[key]
+    );
+    
+    // Si los filtros cambiaron y no estamos en la página 1, resetear página
+    if (filtersChanged && procesosPage !== 1) {
+      setProcesosPage(1);
+      // Actualizar ref con valores actuales
+      prevFiltersRef.current = { ...currentFilters };
+      return; // Salir temprano, el efecto se ejecutará de nuevo con page = 1
+    }
+    
+    // Actualizar ref con valores actuales
+    prevFiltersRef.current = { ...currentFilters };
+    
    setProcesosLoading(true);
    setProcesosError('');
    
-    // Crear filtros incluyendo el pedimento
+    // Construir filtros
    const filters = {
      ...procesosFilters,
      pedimento: id // Filtrar por el pedimento actual
    };
    
-    fetchProcesamientoPedimentos(procesosPage, procesosPageSize, filters)
+    if (sortField) {
+      const fieldMapping = {
+        'id': 'task_id',
+        'estado': 'status',
+        'pedimento': 'pedimento_app'
+      };
+      const mappedField = fieldMapping[sortField] || sortField;
+      filters['ordering'] = (sortOrder === 'desc' ? '-' : '') + mappedField;
+    }
+    
+    fetchTasks(procesosPage, procesosPageSize, filters)
      .then((data) => {
        setProcesos(data.results);
        setProcesosCount(data.count);
@@ -1372,7 +1478,7 @@ export default function PedimentoDetail() {
        }
        setProcesosLoading(false);
      });
-  }, [id, activeTab, procesosPage, procesosPageSize, showMessage]);
+  }, [id, activeTab, procesosPage, procesosPageSize, sortField, sortOrder, procesosFilters, showMessage]);

  // Resetear página de Procesos cuando cambie el pedimento
  useEffect(() => {
@@ -1418,6 +1524,65 @@ export default function PedimentoDetail() {
  };

  // Funciones para procesar peticiones
+  // Descargar todos los AcuseCoves
+  // Ejecutar la acción de procesar AcuseCove para todos los COVEs visibles
+  // Ejecutar la acción de procesar AcuseCove solo para los que no están descargados
+  const handleDownloadAllAcuseCoves = async () => {
+    if (!coves || coves.length === 0) {
+      showMessage('No hay AcuseCoves por descargar', 'info');
+      return;
+    }
+    const pendientes = coves.filter(cove => !cove.acuse_cove_descargado);
+    if (pendientes.length === 0) {
+      showMessage('No hay AcuseCoves pendientes por descargar', 'info');
+      return;
+    }
+    let successCount = 0;
+    let errorCount = 0;
+    for (const cove of pendientes) {
+      try {
+        await handleAcuseCoveProcess(cove);
+        successCount++;
+      } catch (error) {
+        errorCount++;
+      }
+    }
+    if (successCount > 0) {
+      showMessage(`${successCount} AcuseCove(s) procesados exitosamente`, 'success');
+    }
+    if (errorCount > 0) {
+      showMessage(`${errorCount} AcuseCove(s) no se pudieron procesar`, 'error');
+    }
+  };
+
+  // Ejecutar la acción de procesar COVE solo para los que no están descargados
+  const handleDownloadAllCoves = async () => {
+    if (!coves || coves.length === 0) {
+      showMessage('No hay COVEs por descargar', 'info');
+      return;
+    }
+    const pendientes = coves.filter(cove => !cove.cove_descargado);
+    if (pendientes.length === 0) {
+      showMessage('No hay COVEs pendientes por descargar', 'info');
+      return;
+    }
+    let successCount = 0;
+    let errorCount = 0;
+    for (const cove of pendientes) {
+      try {
+        await handleCoveProcess(cove);
+        successCount++;
+      } catch (error) {
+        errorCount++;
+      }
+    }
+    if (successCount > 0) {
+      showMessage(`${successCount} COVE(s) procesados exitosamente`, 'success');
+    }
+    if (errorCount > 0) {
+      showMessage(`${errorCount} COVE(s) no se pudieron procesar`, 'error');
+    }
+  };
  const handleCoveRequest = async (cove) => {
    console.log('Request cove:', cove);
    showMessage(`Procesando petición para COVE #${cove.numero_cove}...`, 'info');
@@ -2656,7 +2821,37 @@ export default function PedimentoDetail() {
                </div>
              ) : (
                <div className="space-y-4">
-                  {/* Tabla de partidas */}
+                  {/* Botón Descargar partidas y tabla de partidas */}
+                  <div className="flex justify-end mb-2">
+                    <button
+                      className="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 transition-colors"
+                      onClick={async () => {
+                        if (!partidas || partidas.length === 0) {
+                          showMessage('No hay partidas para procesar', 'info');
+                          return;
+                        }
+                        const pendientes = partidas.filter(p => !p.descargado);
+                        if (pendientes.length === 0) {
+                          showMessage('No hay partidas pendientes por descargar', 'info');
+                          return;
+                        }
+                        let successCount = 0;
+                        let errorCount = 0;
+                        for (const partida of pendientes) {
+                          try {
+                            await handlePartidaRequest(partida);
+                            successCount++;
+                          } catch (error) {
+                            errorCount++;
+                          }
+                        }
+                        if (successCount > 0) showMessage(`${successCount} partida(s) procesadas exitosamente`, 'success');
+                        if (errorCount > 0) showMessage(`${errorCount} partida(s) no se pudieron procesar`, 'error');
+                      }}
+                    >
+                      Descargar partidas
+                    </button>
+                  </div>
                  <div className="overflow-hidden shadow ring-1 ring-black ring-opacity-5 rounded-lg">
                    <div className="overflow-x-auto">
                      <table className="min-w-full divide-y divide-gray-300">
@@ -2851,6 +3046,24 @@ export default function PedimentoDetail() {
                  </div>
                </div>

+                {/* Botones para descargar todos los AcuseCoves y COVEs */}
+                {coves.length > 0 && (
+                  <div className="mb-2 flex flex-col sm:flex-row gap-2 justify-end">
+                    <button
+                      onClick={handleDownloadAllAcuseCoves}
+                      className="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-green-600 hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500"
+                    >
+                      Descargar todos los AcuseCoves
+                    </button>
+                    <button
+                      onClick={handleDownloadAllCoves}
+                      className="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
+                    >
+                      Descargar todos los COVEs
+                    </button>
+                  </div>
+                )}
+
                {/* Filtros */}
                <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3 sm:gap-4 p-3 sm:p-4 bg-gray-50 rounded-lg border">
                  <div>
@@ -3124,6 +3337,64 @@ export default function PedimentoDetail() {
            <div className="p-6">
              {/* Header de la sección */}
              <div className="mb-6 space-y-4">
+            <div className="flex flex-col gap-2 mb-2 sm:flex-row sm:justify-end">
+              <button
+                      className="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 transition-colors"
+                      onClick={async () => {
+                        if (!edocs || edocs.length === 0) {
+                          showMessage('No hay EDocs para procesar', 'info');
+                          return;
+                        }
+                        const pendientes = edocs.filter(e => !e.edocument_descargado);
+                        if (pendientes.length === 0) {
+                          showMessage('No hay EDocs pendientes por procesar', 'info');
+                          return;
+                        }
+                        let successCount = 0;
+                        let errorCount = 0;
+                        for (const edoc of pendientes) {
+                          try {
+                            await handleEdocProcess(edoc);
+                            successCount++;
+                          } catch (error) {
+                            errorCount++;
+                          }
+                        }
+                        if (successCount > 0) showMessage(`${successCount} EDoc(s) procesados exitosamente`, 'success');
+                        if (errorCount > 0) showMessage(`${errorCount} EDoc(s) no se pudieron procesar`, 'error');
+                      }}
+                    >
+                      Descargar todos los EDocs
+                    </button>
+              <button
+                className="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-green-600 hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 transition-colors"
+                onClick={async () => {
+                  if (!edocs || edocs.length === 0) {
+                    showMessage('No hay acuses de EDocs para descargar', 'info');
+                    return;
+                  }
+                  const pendientes = edocs.filter(e => !e.acuse_descargado);
+                  if (pendientes.length === 0) {
+                    showMessage('No hay acuses de EDocs pendientes por descargar', 'info');
+                    return;
+                  }
+                  let successCount = 0;
+                  let errorCount = 0;
+                  for (const edoc of pendientes) {
+                    try {
+                      await handleAcuseEdocDownload(edoc);
+                      successCount++;
+                    } catch (error) {
+                      errorCount++;
+                    }
+                  }
+                  if (successCount > 0) showMessage(`${successCount} acuse(s) de EDoc descargados exitosamente`, 'success');
+                  if (errorCount > 0) showMessage(`${errorCount} acuse(s) de EDoc no se pudieron descargar`, 'error');
+                }}
+              >
+                Descargar Todos los acuses
+              </button>
+            </div>
                <div className="flex flex-wrap items-center justify-between gap-4">
                  <div className="flex items-center space-x-4">
                    <h3 className="text-lg font-semibold text-gray-900">
@@ -3580,6 +3851,64 @@ export default function PedimentoDetail() {
              ) : (
                <div className="space-y-4">
                  {/* Tabla de Procesos */}
+                  <div className="flex flex-col gap-2 mb-2 sm:flex-row sm:justify-end">
+                    <button
+                      className="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500 transition-colors"
+                      onClick={async () => {
+                        if (!edocs || edocs.length === 0) {
+                          showMessage('No hay EDocs para procesar', 'info');
+                          return;
+                        }
+                        const pendientes = edocs.filter(e => !e.edocument_descargado);
+                        if (pendientes.length === 0) {
+                          showMessage('No hay EDocs pendientes por descargar', 'info');
+                          return;
+                        }
+                        let successCount = 0;
+                        let errorCount = 0;
+                        for (const edoc of pendientes) {
+                          try {
+                            await handleEdocProcess(edoc);
+                            successCount++;
+                          } catch (error) {
+                            errorCount++;
+                          }
+                        }
+                        if (successCount > 0) showMessage(`${successCount} EDoc(s) procesados exitosamente`, 'success');
+                        if (errorCount > 0) showMessage(`${errorCount} EDoc(s) no se pudieron procesar`, 'error');
+                      }}
+                    >
+                      Descargar todos los EDocs
+                    </button>
+                    <button
+                      className="inline-flex items-center px-4 py-2 border border-transparent text-sm font-medium rounded-md shadow-sm text-white bg-green-600 hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 transition-colors"
+                      onClick={async () => {
+                        if (!edocs || edocs.length === 0) {
+                          showMessage('No hay Acuses de EDocs para procesar', 'info');
+                          return;
+                        }
+                        const pendientes = edocs.filter(e => !e.acuse_descargado);
+                        if (pendientes.length === 0) {
+                          showMessage('No hay Acuses de EDocs pendientes por descargar', 'info');
+                          return;
+                        }
+                        let successCount = 0;
+                        let errorCount = 0;
+                        for (const edoc of pendientes) {
+                          try {
+                            await handleAcuseEdocProcess(edoc);
+                            successCount++;
+                          } catch (error) {
+                            errorCount++;
+                          }
+                        }
+                        if (successCount > 0) showMessage(`${successCount} Acuse(s) de EDoc procesados exitosamente`, 'success');
+                        if (errorCount > 0) showMessage(`${errorCount} Acuse(s) de EDoc no se pudieron procesar`, 'error');
+                      }}
+                    >
+                      Descargar todos los Acuses de EDocs
+                    </button>
+                  </div>
                  <div className="overflow-hidden shadow ring-1 ring-black ring-opacity-5 rounded-lg">
                    <div className="overflow-x-auto">
                      <table className="min-w-full divide-y divide-gray-300">
@@ -3610,7 +3939,18 @@ export default function PedimentoDetail() {
                      </thead>
                      <tbody className="bg-white divide-y divide-gray-200">
                        {procesos.map((proceso, index) => (
-                          <tr key={`${proceso.id}-${index}`} className="hover:bg-gray-50">
+                          <tr key={`${proceso.task_id}-${index}`} className={`hover:bg-gray-50 ${selectedProcesos.includes(proceso.task_id) ? 'bg-blue-50' : ''}`}>
+                            <td className="px-3 py-4">
+                              <div className="flex items-center justify-center">
+                                <input
+                                  type="checkbox"
+                                  checked={selectedProcesos.includes(proceso.task_id)}
+                                  onChange={(e) => handleSelectProceso(proceso.task_id, e.target.checked)}
+                                  disabled={proceso.status === 'running' || proceso.status === 'completed'}
+                                  className="h-4 w-4 text-blue-600 focus:ring-blue-500 border-gray-300 rounded disabled:opacity-50"
+                                />
+                              </div>
+                            </td>
                            <td className="px-6 py-4 whitespace-nowrap">
                              <div className="flex items-center">
                                <div className="flex-shrink-0 h-10 w-10">
@@ -3622,7 +3962,10 @@ export default function PedimentoDetail() {
                                </div>
                                <div className="ml-4">
                                  <div className="text-sm font-medium text-gray-900">
-                                    #{proceso.id}
+                                    #{proceso.task_id}
+                                  </div>
+                                  <div className="text-sm text-gray-500">
+                                    {proceso.pedimento_app}
                                  </div>
                                </div>
                              </div>
@@ -3633,9 +3976,17 @@ export default function PedimentoDetail() {
                              </span>
                            </td>
                            <td className="px-6 py-4 whitespace-nowrap">
-                              <span className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${getEstadoColor(proceso.estado)}`}>
-                                {getEstadoLabel(proceso.estado)}
+                              <span className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${getTaskStatusColor(proceso.status)}`}>
+                                {getTaskStatusLabel(proceso.status)}
                              </span>
+                              {proceso.status === 'running' && (
+                                <span className="ml-2 inline-flex items-center">
+                                  <svg className="animate-spin h-4 w-4 text-blue-600" fill="none" viewBox="0 0 24 24">
+                                    <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4"></circle>
+                                    <path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
+                                  </svg>
+                                </span>
+                              )}
                            </td>
                            <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-900">
                              {proceso.organizacion_name || 'N/A'}
@@ -3649,81 +4000,58 @@ export default function PedimentoDetail() {
                            <td className="px-6 py-4 whitespace-nowrap text-sm font-medium">
                              <div className="flex items-center space-x-2">
                                {/* Botón Play (Ejecutar Servicio) */}
+                                {isTaskActionable(proceso.status) && (
                                  <button
-                                  onClick={() => handleEjecutarServicio(proceso)}
-                                  disabled={
-                                    executingId === proceso.id || 
-                                    proceso.estado === 2 || // En Proceso
-                                    proceso.estado === 3 || // Completado
-                                    proceso.estado === 5    // Cancelado
-                                  }
-                                  className={`inline-flex items-center p-2 border border-transparent rounded-md transition-colors duration-200 ${
-                                    executingId === proceso.id || 
-                                    proceso.estado === 2 || 
-                                    proceso.estado === 3 || 
-                                    proceso.estado === 5
-                                      ? 'bg-gray-200 text-gray-400 cursor-not-allowed'
-                                      : 'bg-green-100 text-green-700 hover:bg-green-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500'
+                                    onClick={() => handleEjecutarProceso(proceso)}
+                                    disabled={executingId === proceso.task_id || proceso.status === 'running'}
+                                    className={`group inline-flex items-center justify-center w-8 h-8 rounded-lg transition-all duration-200 ${
+                                      executingId === proceso.task_id || proceso.status === 'running'
+                                        ? 'bg-gray-100 text-gray-400 cursor-not-allowed'
+                                        : 'text-green-700 bg-green-100 hover:bg-green-200 hover:text-green-800'
                                    }`}
                                    title={
-                                    executingId === proceso.id ? 'Ejecutando...' :
-                                    proceso.estado === 2 ? 'No disponible - En proceso' :
-                                    proceso.estado === 3 ? 'No disponible - Completado' :
-                                    proceso.estado === 5 ? 'No disponible - Cancelado' :
+                                      executingId === proceso.task_id ? 'Ejecutando...' :
+                                      proceso.status === 'running' ? 'En proceso...' :
                                      'Ejecutar servicio'
                                    }
                                  >
-                                  {executingId === proceso.id ? (
+                                    {executingId === proceso.task_id ? (
                                      <svg className="animate-spin h-4 w-4" fill="none" viewBox="0 0 24 24">
                                        <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4"></circle>
                                        <path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
                                      </svg>
                                    ) : (
-                                    <svg className="h-4 w-4" fill="currentColor" viewBox="0 0 24 24">
+                                      <svg className="h-4 w-4 transition-transform group-hover:scale-110" fill="currentColor" viewBox="0 0 24 24">
                                        <path d="M8 5v14l11-7z"/>
                                      </svg>
                                    )}
                                  </button>
+                                )}

-                                {/* Botón Refresh (Pasar a Espera) */}
+                                {/* Botón Retry (Reintentar) */}
+                                {proceso.status === 'failed' && (
                                  <button
                                    onClick={() => handlePasarAEspera(proceso)}
-                                  disabled={
-                                    changingStateId === proceso.id ||
-                                    proceso.estado === 1 || // Pendiente
-                                    proceso.estado === 2 || // En Proceso
-                                    proceso.estado === 3 || // Completado
-                                    proceso.estado === 5    // Cancelado
-                                  }
-                                  className={`inline-flex items-center p-2 border border-transparent rounded-md transition-colors duration-200 ${
-                                    changingStateId === proceso.id ||
-                                    proceso.estado === 1 ||
-                                    proceso.estado === 2 ||
-                                    proceso.estado === 3 ||
-                                    proceso.estado === 5
-                                      ? 'bg-gray-200 text-gray-400 cursor-not-allowed'
-                                      : 'bg-yellow-100 text-yellow-700 hover:bg-yellow-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-yellow-500'
+                                    disabled={changingStateId === proceso.task_id}
+                                    className={`group inline-flex items-center justify-center w-8 h-8 rounded-lg transition-all duration-200 ${
+                                      changingStateId === proceso.task_id
+                                        ? 'bg-gray-100 text-gray-400 cursor-not-allowed'
+                                        : 'text-yellow-700 bg-yellow-100 hover:bg-yellow-200 hover:text-yellow-800'
                                    }`}
-                                  title={
-                                    changingStateId === proceso.id ? 'Cambiando estado...' :
-                                    proceso.estado === 1 ? 'No disponible - Use Play para ejecutar' :
-                                    proceso.estado === 2 ? 'No disponible - En proceso' :
-                                    proceso.estado === 3 ? 'No disponible - Completado' :
-                                    proceso.estado === 5 ? 'No disponible - Cancelado' :
-                                    'Pasar a espera'
-                                  }
+                                    title={changingStateId === proceso.task_id ? 'Reiniciando...' : 'Reintentar proceso'}
                                  >
-                                  {changingStateId === proceso.id ? (
+                                    {changingStateId === proceso.task_id ? (
                                      <svg className="animate-spin h-4 w-4" fill="none" viewBox="0 0 24 24">
                                        <circle className="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" strokeWidth="4"></circle>
                                        <path className="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path>
                                      </svg>
                                    ) : (
-                                    <svg className="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                                      <svg className="h-4 w-4 transition-transform group-hover:scale-110" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15" />
                                      </svg>
                                    )}
                                  </button>
+                                )}
                              </div>
                            </td>
                          </tr>
--- a/src/pages/Procesos.jsx
+++ b/src/pages/Procesos.jsx
--- a/src/utils/downloadUtils.js
+++ b/src/utils/downloadUtils.js
@@ -0,0 +1,69 @@
+import { fetchWithAuth } from '../fetchWithAuth';
+
+const API_URL = import.meta.env.VITE_EFC_API_URL;
+
+/**
+ * Función auxiliar para descargas individuales
+ * @param {string} id - ID del documento
+ * @param {string} filename - Nombre del archivo (opcional)
+ * @param {function} showMessage - Función para mostrar mensajes
+ */
+export const downloadFile = async (id, filename = 'archivo', showMessage) => {
+  try {
+    const res = await fetchWithAuth(`${API_URL}/record/documents/descargar/${id}/`);
+    
+    if (!res.ok) {
+      showMessage('Error en la descarga del archivo', 'error');
+      return;
+    }
+    
+    const blob = await res.blob();
+    const url = window.URL.createObjectURL(blob);
+    const a = document.createElement('a');
+    a.href = url;
+    a.download = filename;
+    document.body.appendChild(a);
+    a.click();
+    a.remove();
+    window.URL.revokeObjectURL(url);
+  } catch (error) {
+    console.error('Error downloading file:', error);
+    if (error.message === 'SESSION_EXPIRED') {
+      showMessage('Tu sesión ha expirado, por favor inicia sesión de nuevo.', 'error');
+    } else {
+      showMessage('Error al descargar el archivo', 'error');
+    }
+  }
+};
+
+/**
+ * Función auxiliar para descargas masivas en ZIP
+ * @param {array} ids - Array de IDs de documentos
+ * @param {function} showMessage - Función para mostrar mensajes
+ * @param {string} pedimentoName - Nombre del pedimento para el archivo ZIP (opcional)
+ */
+export const downloadBulkZip = async (ids, showMessage, pedimentoName) => {
+  try {
+    const response = await fetchWithAuth(`${API_URL}/record/documents/bulk-download/`, {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ document_ids: ids })
+    });
+    
+    if (!response.ok) throw new Error('Error en la descarga');
+    
+    const blob = await response.blob();
+    const url = window.URL.createObjectURL(blob);
+    const a = document.createElement('a');
+    a.href = url;
+    a.download = `documentos_${pedimentoName || 'pedimento'}.zip`;
+    document.body.appendChild(a);
+    a.click();
+    window.URL.revokeObjectURL(url);
+    document.body.removeChild(a);
+    
+    showMessage('Descarga iniciada exitosamente', 'success');
+  } catch (error) {
+    showMessage('Error en la descarga: ' + error.message, 'error');
+  }
+};
Author	SHA1	Message	Date
Kevin Rosales	e69fca99c0	Cambios en admin	2025-10-15 19:41:21 -06:00
krosales	e371af3706	Merge pull request 'Modificaciones a pedimento Detail' (#3 ) from PedimentoDetail into main Reviewed-on: #3	2025-10-15 00:07:47 +00:00
Kevin Rosales	3f640307f8	Modificaciones a pedimento Detail	2025-10-14 18:05:02 -06:00
jcedilloAS	791bd2f87e	Merge pull request 'refactor: centralize download functions into utils' (#2 ) from feature/download-utils-clean into main Reviewed-on: #2	2025-10-13 19:38:33 +00:00
JCedillo	5f4a797c3c	refactor: centralize download functions into utils - Create src/utils/downloadUtils.js with downloadFile and downloadBulkZip - Remove duplicated download functions from PedimentoDetail.jsx - Remove duplicated download functions from Documents.jsx - Add proper imports to use centralized functions - Improve code reusability and maintainability - Ensure consistent download behavior across components	2025-10-13 14:25:01 -05:00
Kevin Rosales	5c8380a772	se agrego referencia a pedimento	2025-10-12 08:04:10 -06:00
Kevin Rosales	03a9f793b1	se modifico auditor y pagina de procesos	2025-10-12 07:52:06 -06:00
krosales	c924aab9c1	Merge pull request 'feat: Add checkbox selection and bulk operations' (#1 ) from feature/checkbox-bulk-operations into main Reviewed-on: #1	2025-10-10 01:38:42 +00:00