import React, { useRef, useState, useEffect } from "react"; import { Card, Col, Container, Row, Button, Table, Badge, Accordion, Nav } from "react-bootstrap"; import BreadCrumb from "../../../../Components/Common/BreadCrumb"; import Swal from "sweetalert2"; import { Head, router } from "@inertiajs/react"; import Layout from "../../../../Layouts"; import 'react-bootstrap-typeahead/css/Typeahead.css'; import { Printer, Download, FileText, Flame, Zap } from "lucide-react"; import { PropuestaComercial } from "../Interfaces/Interfaces"; //import TabNavigator from "../UniClienteMultiPunto/components/TabNavigator"; //import { EmptyState } from "../Edicion/components/EmptyState"; import { useDocumentosTramitados } from "../Edicion/hooks/useDocumentosTramitados"; import { DocumentosTramitadosTable } from "../Edicion/components/DocumentosTramitadosTable"; import { formatCalendarDateEs } from "../../../../utils/serverCalendarDate"; const FormWizard = ({datos}: { datos: PropuestaComercial }) => { const [activeKey, setActiveKey] = useState("0"); const [activeTab, setActiveTab] = useState<'electrico' | 'gas' | 'documentos'>('electrico'); const printRef = useRef(null); const { descargarDocumento } = useDocumentosTramitados(); // Imprimir datos recibidos para depuración useEffect(() => { console.log("Datos recibidos en ConsultaContrato:", datos); }, [datos]); // Validar si tenemos los datos necesarios const hasClienteData = datos && datos.propuesta_comercial_cliente && Array.isArray(datos.propuesta_comercial_cliente); // Contar CUPS eléctricos y de gas const cupsElectricosCount = datos.propuesta_comercial_cliente?.reduce((count, cliente) => count + cliente.propuesta_comercial_cups.filter(cups => cups.TipCups === 1).length, 0) || 0; const cupsGasCount = datos.propuesta_comercial_cliente?.reduce((count, cliente) => count + cliente.propuesta_comercial_cups.filter(cups => cups.TipCups === 2).length, 0) || 0; const handlePrint = () => { if (printRef.current) { const printContents = printRef.current.innerHTML; const originalContents = document.body.innerHTML; document.body.innerHTML = ` Propuesta Comercial ${datos.RefProCom}

Propuesta Comercial: ${datos.RefProCom}

Fecha: ${formatCalendarDateEs(datos.FecProCom)}

${printContents} `; window.print(); document.body.innerHTML = originalContents; } }; const handleDownloadPDF = () => { // Función para descargar como PDF - Se implementaría con una librería como jsPDF Swal.fire({ title: 'Descargando...', text: 'La funcionalidad de descarga PDF será implementada próximamente', icon: 'info', timer: 2000, showConfirmButton: false, }); }; const getEstadoLabel = (estado: string) => { switch (estado) { case 'P': return Pendiente; case 'A': return Aprobado; case 'R': return Rechazado; default: return {estado}; } }; const getTipoContratoLabel = (tipo: number) => { switch (tipo) { case 1: return "Contrato Simple"; case 2: return "Contrato Multi-Punto"; case 3: return "Contrato Multi-Cliente Multi-Punto"; default: return `Tipo ${tipo}`; } }; const formatFecha = (fecha: string | undefined) => { if (!fecha) return "-"; return formatCalendarDateEs(fecha); }; return (

Propuesta Comercial: {datos.RefProCom}
{/* Información general de la propuesta */}
Información General
{datos.ObsProCom && ( )}
Número de Referencia {datos.RefProCom}
Fecha de Propuesta {formatFecha(datos.FecProCom)}
Tipo de Contrato {getTipoContratoLabel(datos.TipProCom)}
Estado {getEstadoLabel(datos.EstProCom)}
Observaciones {datos.ObsProCom}
{/* Clientes y sus puntos de suministro */}
Clientes y Puntos de Suministro
{hasClienteData ? ( setActiveKey(k as string)} className="mt-3"> {datos.propuesta_comercial_cliente.map((clienteData, clienteIndex) => ( {clienteData?.cliente?.RazSocCli || 'Cliente sin nombre'} NIF: {clienteData?.cliente?.NumCifCli || 'N/A'} {/* Datos del cliente */}
Información del Cliente
Razón Social {clienteData.cliente?.RazSocCli ?? 'N/A'}
NIF/CIF {clienteData.cliente?.NumCifCli ?? 'N/A'}
Dirección {clienteData.cliente?.NomViaDomSoc ?? ''} {clienteData.cliente?.NumViaDomSoc ?? ''}
Código Postal {clienteData.cliente?.CPLocSoc ?? 'N/A'}
Teléfono {clienteData.cliente?.TelFijCli || clienteData.cliente?.TelMovCli || 'N/A'}
Email {clienteData.cliente?.EmaCli || 'N/A'}
Información de Contacto
{clienteData.contacto ? (
Nombre {clienteData.contacto.NomConCli}
NIF {clienteData.contacto.NIFConCli}
Teléfono {clienteData.contacto.TelFijConCli || clienteData.contacto.TelCelConCli || 'N/A'}
Email {clienteData.contacto.EmaConCli || 'N/A'}
Cargo {clienteData.contacto.CarConCli || 'N/A'}
) : (

No hay información de contacto disponible

)}
{/* Puntos de suministro con pestañas */}
Puntos de Suministro
{clienteData.propuesta_comercial_cups && clienteData.propuesta_comercial_cups.length > 0 ? (
{/* Pestañas */} {/* Contenido de pestañas */}
{/* Tab CUPS Eléctricos */} {activeTab === 'electrico' && clienteData.propuesta_comercial_cups.filter(cups => cups.TipCups === 1).length > 0 && (
{clienteData.propuesta_comercial_cups .filter(cups => cups.TipCups === 1) .map((cups, cupsIndex) => { const puntoSuministro = cups.punto_suministro; const cupEle = (cups as any)?.CupEle ?? (cups as any)?.cups_electrico; if (!cupEle) return null; return ( ); })}
CUPS Dirección Tarifa Consumo Anual Potencias (kW) Comercializadora Producto Anexo Vigencia N° Contrato Comercializadora
{cupEle.CUPsEle || 'N/A'}
{puntoSuministro ? ( <> {puntoSuministro.NomViaPunSum} {puntoSuministro.NumViaPunSum}, {puntoSuministro.localidad ? ` ${puntoSuministro.localidad.DesLoc}` : ''} {puntoSuministro.CPLocSoc ? ` (${puntoSuministro.CPLocSoc})` : ''} ) : 'N/A'} {(cups as any)?.tarifa_electrica?.NomTarEle ?? (cups as any)?.tarifaElectrica?.NomTarEle ?? 'N/A'} {cupEle.ConAnuCup || (cups as any).ConCup || 'N/A'} kWh
{cups.PotEleConP1 && P1: {cups.PotEleConP1} kW} {cups.PotEleConP2 && P2: {cups.PotEleConP2} kW} {cups.PotEleConP3 && P3: {cups.PotEleConP3} kW} {cups.PotEleConP4 && P4: {cups.PotEleConP4} kW} {cups.PotEleConP5 && P5: {cups.PotEleConP5} kW} {cups.PotEleConP6 && P6: {cups.PotEleConP6} kW} {!cups.PotEleConP1 && !cups.PotEleConP2 && !cups.PotEleConP3 && !cups.PotEleConP4 && !cups.PotEleConP5 && !cups.PotEleConP6 && 'N/A'}
{cups.comercializadora?.RazSocCom || 'N/A'} {cups.producto?.DesPro || 'N/A'} {cups.anexo_producto?.DesAnePro || 'N/A'} {formatFecha(cups.FecActCUPs)} - {formatFecha(cups.FecVenCUPs)}
{cups.NrContratoAudax}
)} {/* Tab CUPS Gas */} {activeTab === 'gas' && clienteData.propuesta_comercial_cups.filter(cups => cups.TipCups === 2).length > 0 && (
{clienteData.propuesta_comercial_cups .filter(cups => cups.TipCups === 2) .map((cups, cupsIndex) => { const puntoSuministro = cups.punto_suministro; const cupGas = (cups as any)?.CupGas ?? (cups as any)?.cups_gas; if (!cupGas) return null; return ( ); })}
CUPS Dirección Tarifa Consumo Anual Comercializadora Producto Anexo Vigencia N° Contrato Comercializadora
{cupGas.CupsGas || 'N/A'}
{puntoSuministro ? ( <> {puntoSuministro.NomViaPunSum} {puntoSuministro.NumViaPunSum}, {puntoSuministro.localidad ? ` ${puntoSuministro.localidad.DesLoc}` : ''} {puntoSuministro.CPLocSoc ? ` (${puntoSuministro.CPLocSoc})` : ''} ) : 'N/A'} {(cups as any)?.tarifa_gas?.NomTarGas ?? (cups as any)?.tarifa_gas?.DesTarGas ?? (cups as any)?.tarifaGas?.NomTarGas ?? (cups as any)?.tarifaGas?.DesTarGas ?? 'N/A'} {cupGas.ConAnuCup || cups.ConCup || 'N/A'} m³ {cups.comercializadora?.RazSocCom || 'N/A'} {cups.producto?.DesPro || 'N/A'} {cups.anexo_producto?.DesAnePro || 'N/A'} {formatFecha(cups.FecActCUPs)} - {formatFecha(cups.FecVenCUPs)}
{cups.NrContratoAudax}
)} {/* Tab CUPS Gas */} {activeTab === 'documentos' && datos.documentos_propuestas.length > 0 && (
{/* Aqui va la tabla de documentos */}
Documentos del Contrato
)} {/* Mensajes de vacío para cada tab */} {activeTab === 'electrico' && clienteData.propuesta_comercial_cups.filter(cups => cups.TipCups === 1).length === 0 && (
No hay CUPS eléctricos
No se encontraron suministros eléctricos para este cliente
)} {activeTab === 'gas' && clienteData.propuesta_comercial_cups.filter(cups => cups.TipCups === 2).length === 0 && (
No hay CUPS de gas
No se encontraron suministros de gas para este cliente
)} {activeTab === 'documentos' && datos.documentos_propuestas.length === 0 && (
Sin Documentos Tramitados
No existen documentos para este contrato
)}
) : (

No hay puntos de suministro registrados para este cliente

)}
))} ) : (

No hay información de clientes disponible

)}
); }; FormWizard.layout = (page: any) => ; export default FormWizard;