import React from "react"; import { Card, Col, Container, Row, Button, Badge } from "react-bootstrap"; import { Head, router } from "@inertiajs/react"; import { Edit, FileText } from "lucide-react"; import BreadCrumb from "../../../../Components/Common/BreadCrumb"; import Layout from "../../../../Layouts"; import { useLoading } from '../../../../LoadingContext'; import { formatCalendarDateEs } from '../../../../utils/serverCalendarDate'; interface Comercializadora { CodCom: number; RazSocCom: string; NumCifCom: string; } interface Producto { CodPro: number; DesPro: string; CodCom: number; SerGas: number; SerEle: number; EstPro: number; FecIniPro: string; CodigoServicio: string; ObsPro: string; comercializadora?: Comercializadora; created_at: string; updated_at: string; } const ConsultaProducto = ({ producto }: { producto: Producto }) => { const { showLoading, hideLoading } = useLoading(); console.log('Producto recibido en ConsultaProducto:', producto); const handleEdit = () => { showLoading(); router.visit(route('productos.editar', producto.CodPro), { onFinish: () => hideLoading() }); }; const handleBack = () => { showLoading(); router.visit(route('productos.index'), { onFinish: () => hideLoading() }); }; const formatDate = (dateString: string) => { if (!dateString) return 'No especificada'; const s = formatCalendarDateEs(dateString); return s === '-' ? 'No especificada' : s; }; const formatDateTime = (dateString: string) => { if (!dateString) return 'No especificada'; return new Date(dateString).toLocaleString('es-ES', { year: 'numeric', month: 'long', day: 'numeric', hour: '2-digit', minute: '2-digit' }); }; return (

Producto: {producto.DesPro} {producto.EstPro === 1 ? "Activo" : "Suspendido"}

{/* Información General */}

Información General

ID del Producto:

{producto.CodPro}

Descripción:

{producto.DesPro}

Código de Servicio:

{producto.CodigoServicio || 'No especificado'}

Estado:

{producto.EstPro === 1 ? "Activo" : "Suspendido"}

Fecha de Inicio:

{formatDate(producto.FecIniPro)}

{/* Comercializadora */}

Comercializadora

Razón Social:

{producto.comercializadora?.RazSocCom || 'No asignada'}

NIF/CIF:

{producto.comercializadora?.NumCifCom || 'No disponible'}

{/* Servicios */}

Servicios Ofrecidos

Servicio de Gas:

{producto.SerGas ? "Sí" : "No"}

Servicio Eléctrico:

{producto.SerEle ? "Sí" : "No"}

{/* Observaciones */} {producto.ObsPro && ( <>

Observaciones

{producto.ObsPro}

)} {/* Información del Sistema */}

Información del Sistema

Fecha de Creación:

{formatDateTime(producto.created_at)}

Última Actualización:

{formatDateTime(producto.updated_at)}

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