<script lang="ts">
    import { onMount } from "svelte";
    import NavBarAutocompletable from "../Componentes/NavBarAutocompletable.svelte";
    import type { GaranteDto, MensajeDto } from "../types";
    import ModalEstatico from "../Componentes/ModalEstatico.svelte";
    import { urlG } from "../stores/urlStore";
    import ModalConfirm from "../Componentes/ModalConfirm.svelte";
    import BarraHorizontalConTexto from "../Componentes/BarraHorizontalConTexto.svelte";
    import ModalPrecontrato from "../Componentes/ModalPrecontrato.svelte";
    import ModalAddGarantes from "../Componentes/ModalAddGarantes.svelte";
    import ModalCheckYContrato from "../Componentes/ModalCheckYContrato.svelte";
    import { self } from "svelte/legacy";
    import ModalVeryAceptarContrato from "../Componentes/ModalVeryAceptarContrato.svelte";
    import { getRequest } from "@sveltejs/kit/node";
    import { json } from "@sveltejs/kit";

    const token = sessionStorage.getItem("token");
    let mensajes: MensajeDto[] = $state([]);
    let showspinner:boolean =$state(false);
    let mostrarleidos: boolean = $state(false);
    let modaldata:string =$state("");
    let Selmens: MensajeDto = $state({accion:""});
    
    let show:boolean = $state(false);
    let setCantGarantes = $state(0);

    let garantes:GaranteDto[] = $state([]);

    onMount(async () => {
        SinLeer();
    })
    
    async function SinLeer() {
        mostrarleidos = false;
        showspinner = true;
        try{
            const responce = await fetch($urlG+"/api/notificaciones?leido="+mostrarleidos, {
                method: "GET",
                headers: {
                    "Auth": String(token)
                }
            });
            if (responce.ok) {
                let data = await responce.json();
                mensajes = data;
                showspinner = false;
                return;
            }
            let errordata = await responce.json();
            modaldata = errordata.message;
        } catch{
            modaldata = "no se pudo obtener notificaciones";
        }

    }

    async function Leidos() {
        mostrarleidos = true;
        showspinner = true;
        try {
            const responce = await fetch($urlG+"/api/notificaciones?leido="+true, {
                method: "GET",
                headers: {
                    "Auth": String(token)
                }
            });
            if (responce.ok) {
                let data = await responce.json();
                mensajes = data;
                showspinner = false;
                return;
            }
            let errordata = await responce.json();
            modaldata = errordata.message;
        } catch {
            modaldata = "no se pudo obtener notificaciones";
        }
    }

    async function marcarleido( fecha: Date, email: string, men:MensajeDto ) {
        show = true;

        try {
            const responce = await fetch($urlG+"/api/notificaciones", {
                method: "PUT",
                headers: {
                    "Auth": String(token),
                    "Content-Type": "application/json",
                },
                body: JSON.stringify({fecha, email}),
            });
            if (responce.ok) {
                let data = await responce.json();
                modaldata = data.message;

                if (mostrarleidos) {
                    Leidos();
                } else {
                    SinLeer();
                }
                return;
            }
            let dataerror = await responce.json();
            modaldata = dataerror.message;
        } catch {
            modaldata = "no se pudo marcar como leido";
        }
    }

    function abrirModal(mensaje: MensajeDto) {   
        if (mensaje.accion === "Nuevo Alquiler") {
            Selmens = { ...mensaje }; 
            return;
        } 

        if (mensaje.accion === "Carge Garantes") {
            Selmens = { ...mensaje }; 
            setCantGarantes = Number(Selmens.mensaje.split(" ").reverse()[1]);
            return;
        }

        if (mensaje.accion === "Check y Contrato"){
            Selmens = {...mensaje};
            let idcontrato = Number(Selmens.mensaje.split(" ").reverse()[0]);
            obtenerListaGarantes(idcontrato);
            return;
        }

        if (mensaje.accion === "Aceptar Contrato") {
            Selmens = {...mensaje};
            return;
        }

        if (mensaje.accion === "Notificacion Inquilino") {
            Selmens = {...mensaje};
            return;
        }
    }

    async function obtenerListaGarantes(idcontrato: number) {
        if (Selmens.accion !== "Check y Contrato") return;
        try {
            const responce = await fetch($urlG+"/api/contratos/precontrato/listaGarantes?idcontrato="+idcontrato+"&EmailPropietario="+localStorage.getItem("email"), {
                method: "GET",
                headers: {
                    "Auth": String(token),
                },
            });

            if (responce.ok) {
                let data = await responce.json();
                garantes = data;
                return;
            }
            let data = await responce.json();
            Selmens.accion="";
            modaldata = data.message;
        } catch {
            Selmens.accion="";
            modaldata="No se pudo Obtener la lista de garantes";
        }
    }

    async function handleEnviarmensaje2(data: {opcionVenta:boolean, cantGarantes:number, 
        mesesHastaAumento:number, mesesDuracionContrato:number, montoOpcion:number, iddivisa:number}) {
        if (data.opcionVenta == null || data.cantGarantes <=0 || data.mesesHastaAumento<=0 || data.mesesDuracionContrato <=0) {
            modaldata = "Estan mal cargados los datos del form";
            return;
        }

        try {
            let fecha = Selmens.fecha.toString();
            const datata = {
                tieneopcionventa: data.opcionVenta,
                mesesHastaAumento: data.mesesHastaAumento,
                cantidadGarantes: data.cantGarantes,
                idPropiedad: Selmens.propiedad,
                fechaprimernotificacion: fecha,
                emailInquilino: Selmens.remitente,
                emailPropietario: Selmens.receptor,
                mesesDuracionContrato: data.mesesDuracionContrato,
                montoOpcion: data.montoOpcion,
                iddivisa: data.iddivisa
            };

            let responce = await fetch($urlG+"/api/contratos/precontrato", {
                method: "POST",
                headers: {
                    "Auth": String(token),
                    "Content-Type": "application/json"
                },
                body: JSON.stringify(datata),
            });
            if(responce.ok) {
                let dataaa = await responce.json();
                modaldata = dataaa.message;
                if (mostrarleidos) {
                    Leidos();
                } else {
                    SinLeer();
                }
                return;
            }
            let dataaa = await responce.json();
            modaldata = dataaa.message;
            return;
        } catch (e) {
            modaldata = "fallo al intentar conectar con el servidor: "+e
        }
    
    }

    async function handleEnviarmensaje3(garantes: GaranteDto[]) {
        try {
            let dat = {
                emailInquilino: localStorage.getItem("email") || "",
                idpropiedad: Selmens.propiedad,
                fecha: Selmens.fecha,
                garantes: garantes
            }

            let responce = await fetch($urlG+"/api/contratos/addGarantes", {
                method : "PUT",
                headers: {
                    "Auth": String(token),
                    "Content-Type": "application/json"
                },
                body: JSON.stringify(dat),
            });

            if (responce.ok){
                let data = await responce.json();
                modaldata = data.message;
                if (mostrarleidos) {
                    Leidos();
                } else {
                    SinLeer();
                }
                return;
            }
            let dataaa = await responce.json();
            modaldata = dataaa.message;
        } catch {
            modaldata = "no se pudo comunicar con el Servidor";
        }
    }

    async function handleCancelPrecontrato() {
        if (Selmens.accion !== "Check y Contrato") return;
        try {
            let data = {
                emailPropietario: Selmens.receptor,
                emailInquilino: Selmens.remitente,
                fecha: Selmens.fecha,
                idpropiedad: Selmens.propiedad,
            }
            let responce = await fetch($urlG+"/api/contratos/cancelar", {
                method: "PUT",
                headers: {
                    "Auth": String(token),
                },
                body: JSON.stringify(data),
            })

            if (responce.ok){
                let dataa = await responce.json();
                modaldata = dataa.message;
                if (mostrarleidos) {
                    Leidos();
                } else {
                    SinLeer();
                }
                Selmens.accion = "";
                return;
            }

            let dataa = await responce.json();
            modaldata = dataa.message;
            return
        }catch {
            modaldata = "fallo al intentar conectar con el servidor";
        }
    }

    async function handleEnviarmensaje4(file:File, idcontrato:string) {
        let formdata = new FormData();
        formdata.append("idcontrato", idcontrato);
        formdata.append("contrato", file);
        formdata.append("ubicarnotificacion", Selmens.fecha);
        try{
            const responce = await fetch($urlG+"/api/contratos/subirContrato", {
                method: "POST",
                headers: {
                    "Auth": String(token),
                },
                body: formdata,
            });
            if (responce.ok) {
                let data = await responce.json();
                modaldata = data.message;
                if (mostrarleidos) {
                    Leidos();
                } else {
                    SinLeer();
                }
                return;
            }
            let data = await responce.json();
            modaldata = data.message;
            return;
        }catch{
            modaldata="Fallo al intentar hacer la request";
        }
    }

    async function ObtenerContrato(idcontrato: number) {
        if (Selmens.accion != "Aceptar Contrato") {
            modaldata = "Hay algo mal comunicate con el administrador";
            return;
        }
        try {
            const responce = await fetch($urlG+"/api/contrato/getdocumento?idcontrato="+idcontrato, {
                method: "GET",
                headers: {
                    "Auth": String(token),
                }
            });
            if (!responce.ok) {
                modaldata="Error al obtener el archivo";
                return;
            }

            let blob = await responce.blob();
            const blobUrl = URL.createObjectURL(blob);    
            window.open(blobUrl, '_blank');
            setTimeout(() => URL.revokeObjectURL(blobUrl), 100000);
        } catch {
            modaldata = "Fallo al intentar conectarse al servidor";
        }
    }
    
    async function handleAceptarContrato(idcontrato:number) {
        if (idcontrato<=0){
            modaldata="La idcontrato da 0 o menos comunicate con el administrador";
            return;
        }
        try {
            let rq = {
                idcontrato:idcontrato,
                fecha:Selmens.fecha,
            }
            const responce = await fetch($urlG+"/api/contratos/aceptarContrato", {
                method: "POST",
                headers: {
                    "Auth": String(token),
                    "Content-Type": "application/json",
                },
                body: JSON.stringify(rq),
            });
            if (responce.ok){
                let data = await responce.json();
                modaldata = data.message;
                if (mostrarleidos) {
                    Leidos();
                } else {
                    SinLeer();
                }
                return;
            }

            let data = await responce.json();
            modaldata = data.message;
            return;
        } catch {
            modaldata = "Fallo la request";
            return;
        }
    }

    async function handlerechazarcontrato(idcontrato:number) {
        if (idcontrato<=0){
            modaldata="La idcontrato da 0 o menos comunicate con el administrador";
            return;
        }
        try {
            let rq = {
                idcontrato:idcontrato,
                fecha:Selmens.fecha
            }
            const responce = await fetch($urlG+"/api/contratos/rechazarPreContrato?idcontrato="+idcontrato, {
                method: "PUT",
                headers: {
                    "Auth": String(token),
                    "Content-Type": "application/json",
                },
                body: JSON.stringify(rq),
            });
            if (responce.ok){
                let data = await responce.json();
                modaldata = data.message;
                if (mostrarleidos) {
                    Leidos();
                } else {
                    SinLeer();
                }
                return;
            }

            let data = await responce.json();
            modaldata = data.message;
            return;
        } catch {
            modaldata = "Fallo la request";
            return;
        }
    }
</script>

<NavBarAutocompletable/>

{#if modaldata}
    <ModalEstatico payload={modaldata} close={()=>!!(modaldata = "")} />
{/if}

{#if Selmens.accion == "Nuevo Alquiler" }
    <ModalPrecontrato onClose={() => (Selmens.accion = "")} onSubmit={handleEnviarmensaje2} />
{:else if Selmens.accion == "Carge Garantes"}
    <ModalAddGarantes maxGarantes={setCantGarantes}  onClose={() => (Selmens.accion = "")} onSubmit={handleEnviarmensaje3}/>
{:else if Selmens.accion == "Check y Contrato"}
    <ModalCheckYContrato {garantes} men={Selmens} onCancel={handleCancelPrecontrato} onClose={() => (Selmens.accion = "")} onConfirm={handleEnviarmensaje4}/>       
{:else if Selmens.accion == "Aceptar Contrato"}        
    <ModalVeryAceptarContrato onClose={() => (Selmens.accion = "")} onConfirm={handleAceptarContrato} onCancel={handlerechazarcontrato} getContrato={ObtenerContrato} men={Selmens}/>
{:else if Selmens.accion == "Notificacion Inquilino"}
    <ModalEstatico payload={Selmens.mensaje} close={()=> !!(Selmens.accion = "") }/>
{/if}

<div class="container-fluid">
    <br>
    <BarraHorizontalConTexto text="Notificaciones"/>
    <br>

    <div class="btn-group">
        <button class="btn btn-primary" class:active={mostrarleidos==false} onclick={SinLeer} >Sin Leer</button>
        <button class="btn btn-primary" class:active={mostrarleidos==true} onclick={Leidos} >Leidos</button>
    </div>
    <br>
    <div class="container-fluid" style="margin-top: 1cm;">
        {#if showspinner}
        <div class=" justify-content-center position-absolute top-50 start-50">
            <div class="spinner-border" role="status"></div>
            Cargando...

        </div>
        {:else}
        <table class="table container-fluid table-responsive table-striped table-hover">
            <thead>
                <tr>
                    <th>Remitente</th>
                    <th>Accion</th>
                    <th>Receptor</th>
                    <th>Mensaje</th>
                    <th>Fecha</th>
                    <th>Propiedad</th>
                    {#if mostrarleidos == false}
                    <th></th>
                    {/if}
                </tr>
            </thead>
            
            <tbody>
                {#if mensajes.length <= 0}
                <tr>
                    <td colspan={mostrarleidos == false ? 7 : 6}>
                        <p>No hay Mensajes para leer</p>
                    </td>
                </tr>
                {:else}                
                {#each mensajes as men}
                <tr>
                    <td>{men.remitente}</td>
                    <td>{men.accion}</td>
                    <td>{men.receptor}</td>
                    <td>{men.mensaje}</td>
                    <td>{men.fecha}</td>
                    <td>{men.propiedad}</td>

                    <td>
                    {#if mostrarleidos == false && men.accion != "Rechazo Contrato" && men.accion != "Aceptado Contrato"}
                        <button
                        class="btn btn-outline-primary"
                        onclick={() => abrirModal(men)}>
                        Expandir
                        </button>
                    {/if}
                    {#if (men.accion === "ContratoCancelado" || men.accion === "Rechazo Contrato" ||
                         men.accion === "Aceptado Contrato" || men.accion === "Notificacion Inquilino"
                         ) && mostrarleidos == false}
                        <button
                        class="btn btn-outline-danger btn-sm"
                        onclick={() => marcarleido(men.fecha, localStorage.getItem("email")|| "", men)}>
                        Marcar Leido
                        </button>                 
                    {/if}
                    </td>
                </tr>
            {/each}                
            {/if}
            </tbody>
        </table>
        {/if}
    </div>
</div>