Está

2025-01-30 23:27:47 -03:00
parent b98cf77807
commit 68745cab5e
9 changed files with 660 additions and 6 deletions
@@ -0,0 +1,93 @@
+<script lang="ts">
+    import { onMount } from "svelte";
+    import BarraHorizontalConTexto from "../Componentes/BarraHorizontalConTexto.svelte";
+    import NavBarAutocompletable from "../Componentes/NavBarAutocompletable.svelte";
+    import type { ContratoDto } from "../types";
+    import ModalEstatico from "../Componentes/ModalEstatico.svelte";
+    import {urlG} from "../stores/urlStore";
+    import { navigate } from "svelte-routing";
+    
+    let token: string = sessionStorage.getItem("token")|| "";
+    let alquileres:ContratoDto[]| null = $state(null);
+    let modaldata:string = $state("");
+
+    onMount(()=>{
+        obtenerContratosAdmin();
+    });
+    async function obtenerContratosAdmin() {
+        try{
+            const responce = await fetch($urlG+"/api/contratos/controlPagos", {
+                method: "GET",
+                headers: {
+                    "Auth": String(token),
+                },
+            });
+            if (responce.ok){
+                let data = await responce.json();
+                alquileres = data;
+                return;
+            }
+
+            let data = await responce.json();
+            modaldata = data.message;
+
+        }catch{
+            modaldata = "fallo al intentar hacer la request";
+        }
+    }
+</script>
+
+<NavBarAutocompletable/>
+
+{#if modaldata }
+    <ModalEstatico payload={modaldata} close={()=>!!(modaldata="")}/>
+{/if}
+
+<div class="container-fluid mt-2">
+    <BarraHorizontalConTexto text="Control de Pagos" />
+    <div class="text-center">
+        Lista de contratos que tienen canones atrasados
+    </div>
+    <hr>
+    <div class="row g-3">
+        {#if alquileres == null}
+        <div class="d-flex justify-content-center">
+            <div class="spinner-border" role="status">
+              <span class="visually-hidden">Loading...</span>
+            </div>
+          </div>
+        {:else}
+        {#if alquileres.length == 0}
+        <h1 class=" d-flex justify-content-center">
+            No hay Alquileres que deban meses
+        </h1>
+        {/if}
+        {#each alquileres as alquiler}
+        <div class="col-md-6">
+            <div class="card shadow-sm">
+                <div class="card-header bg-primary text-white">
+                    <h5 class="mb-0 text-center">{alquiler.tipoPropiedad}</h5>
+                </div>
+                <div class="card-body">
+                    <h6 class="card-subtitle mb-2 text-muted">{alquiler.ubicacion}</h6>
+                    <p class="card-text">
+                        <strong>Fecha de inicio:</strong> {new Date(alquiler.fechainicio).toLocaleDateString()}<br />
+                        <strong>Inquilino:</strong> {alquiler.inquilino}<br />
+                        <strong>Propietario:</strong> {alquiler.propietario}<br>
+                        <strong>Id Propiedad: </strong>{alquiler.id}
+                    </p>
+                    <div class="d-flex justify-content-center">
+                        <button class="btn btn-primary" onclick={()=>navigate("/admin/contratos?id="+alquiler.id)}>
+                            Ver
+                        </button>
+                    </div>
+                </div>
+                <div class="card-footer text-center">
+                    <strong>Estado:</strong> {alquiler.estado}
+                </div>
+            </div>
+        </div>
+        {/each}
+        {/if}
+    </div>
+</div>