import React, { useState } from 'react'; import { Head, usePage } from '@inertiajs/react'; import { Button, Card, Col, Container, Form, Row, Spinner } from 'react-bootstrap'; import Swal from 'sweetalert2'; import Layout from '../../../Layouts'; import BreadCrumb from '../../../Components/Common/BreadCrumb'; import { Can } from '../../../Components/Auth/Can'; import { formatCalendarDateEs } from '../../../utils/serverCalendarDate'; import { useActivaciones } from './hooks/useActivaciones'; import ListadoContratosModal from './components/ListadoContratosModal'; import FormularioContrato from './components/FormularioContrato'; import ContratoRapidoModal from './components/ContratoRapidoModal'; import { ActivacionesPageProps, ContratoActivacion, FormularioActivacion, TIPO_ELECTRICO, comercializadoraNombre, } from './types'; const ActivacionesIndex = () => { const { comercializadoras = [], productos = [], anexos = [], tiposPrecio = [], tarifasElectricas = [], tarifasGas = [], } = usePage().props; const { busqueda, buscando, guardando, sincronizando, buscar, actualizar, actualizarFechas, contratoRapido } = useActivaciones(); const [cups, setCups] = useState(''); const [mostrarListado, setMostrarListado] = useState(false); const [mostrarContratoRapido, setMostrarContratoRapido] = useState(false); const [seleccionadoId, setSeleccionadoId] = useState(null); const seleccionado = busqueda?.contratos.find((c) => c.CodProComCup === seleccionadoId) ?? null; const comercializadoraDe = (codCom: number | null) => comercializadoras.find((c) => String(c.CodCom) === String(codCom ?? '')) ?? null; const consultar = async (event: React.FormEvent) => { event.preventDefault(); setSeleccionadoId(null); const resultado = await buscar(cups); if (resultado) { setMostrarListado(true); } }; const seleccionar = (contrato: ContratoActivacion) => { setSeleccionadoId(contrato.CodProComCup); setMostrarListado(false); }; const sincronizarFechas = async (contrato: ContratoActivacion) => { const comercializadora = comercializadoraDe(contrato.CodCom); if (!comercializadora) { await Swal.fire({ icon: 'warning', title: 'Comercializadora', text: 'Este contrato no tiene comercializadora. No se puede consultar el servicio de fechas.', }); return; } if (!comercializadora.fechas_provider) { await Swal.fire({ icon: 'warning', title: 'Sin servicio de fechas', text: `${comercializadoraNombre(comercializadora)} no tiene consulta de fechas. Ahora mismo solo ADX y AUDAX.`, }); return; } const confirmacion = await Swal.fire({ icon: 'question', title: 'Actualizar fechas', text: `Se consultará ${comercializadoraNombre(comercializadora)} y se sustituirán la fecha de activación y vencimiento del contrato ${contrato.CodConCom ?? contrato.CodProComCup}.`, showCancelButton: true, confirmButtonText: 'Actualizar', cancelButtonText: 'Cancelar', }); if (!confirmacion.isConfirmed) { return; } const resultado = await actualizarFechas(contrato); if (resultado) { await Swal.fire({ icon: 'success', title: 'Fechas actualizadas', html: `Activación: ${formatCalendarDateEs(resultado.contrato.FecActCUPs)}
Vencimiento: ${formatCalendarDateEs(resultado.contrato.FecVenCUPs)}`, }); } }; const guardar = (form: FormularioActivacion, periodos: number) => { if (seleccionado) { void actualizar(seleccionado, form, periodos); } }; return (

Activaciones por CUPS

CUPS setCups(e.target.value.toUpperCase())} /> {busqueda && (

{busqueda.cups.CUPs} {busqueda.cups.TipCups === TIPO_ELECTRICO ? 'Eléctrico' : 'Gas'}
{busqueda.cups.RazSocCli ?? 'Sin titular'} {busqueda.cups.NumCifCli ? ` · ${busqueda.cups.NumCifCli}` : ''} {busqueda.cups.direccion ? ` · ${busqueda.cups.direccion}` : ''}

)}

{busqueda && seleccionado && ( setSeleccionadoId(null)} /> )}

setMostrarListado(false)} onSeleccionar={seleccionar} onActualizarFechas={sincronizarFechas} /> {busqueda && ( setMostrarContratoRapido(false)} onGenerar={contratoRapido} /> )} ); }; ActivacionesIndex.layout = (page: React.ReactNode) => ; export default ActivacionesIndex;