Está
This commit is contained in:
@@ -25,6 +25,8 @@
|
||||
import CompraYVentas from "./paginas/CompraYVenta.svelte";
|
||||
import Ventas from "./paginas/Ventas.svelte";
|
||||
import VerLogs from "./paginas/VerLogs.svelte";
|
||||
import ControlPagos from "./paginas/ControlPagos.svelte";
|
||||
import ContratoAdmin from "./paginas/ContratoAdmin.svelte";
|
||||
</script>
|
||||
|
||||
<Router>
|
||||
@@ -108,6 +110,11 @@
|
||||
<ProteRoute componente={CompraYVentas}/>
|
||||
</Route>
|
||||
|
||||
<!-- Control Pago Contratos Incumplidos -->
|
||||
<Route path="/accion/14">
|
||||
<ProteRoute componente={ControlPagos}/>
|
||||
</Route>
|
||||
|
||||
<!-- Pagina Ventas -->
|
||||
<Route path="/Ventas">
|
||||
<ProteRoute componente={Ventas}/>
|
||||
@@ -141,6 +148,10 @@
|
||||
<Route path="/inquilino/contratos">
|
||||
<ProteRoute componente={ContratoInquilino}/>
|
||||
</Route>
|
||||
|
||||
|
||||
<!--Contratos Inquilino-->
|
||||
<Route path="/admin/contratos">
|
||||
<ProteRoute componente={ContratoAdmin}/>
|
||||
</Route>
|
||||
</Router>
|
||||
|
||||
|
||||
316
Front/src/paginas/ContratoAdmin.svelte
Normal file
316
Front/src/paginas/ContratoAdmin.svelte
Normal file
@@ -0,0 +1,316 @@
|
||||
<script lang="ts">
|
||||
import { onMount } from "svelte";
|
||||
import NavBarAutocompletable from "../Componentes/NavBarAutocompletable.svelte";
|
||||
import {urlG} from "../stores/urlStore";
|
||||
import type { CanonDto, ContratoPropiedadDto, GaranteDto2, PropiedadDto } from "../types";
|
||||
import ModalNotificacion from "../Componentes/ModalNotificacion.svelte";
|
||||
import ModalEstatico from "../Componentes/ModalEstatico.svelte";
|
||||
|
||||
let token:string = sessionStorage.getItem("token")||"";
|
||||
|
||||
let canons:CanonDto[] = $state([]);
|
||||
let contratoid:string = $state("");
|
||||
let modaldata:string = $state("");
|
||||
let garantes: GaranteDto2[] = $state([]);
|
||||
let shownotif:boolean = $state(false);
|
||||
let idcanon:number = $state(0);
|
||||
|
||||
let prop:ContratoPropiedadDto = $state({
|
||||
estado:"",
|
||||
fechainicio:"",
|
||||
id:0,
|
||||
inquilino:"",
|
||||
propietario:"",
|
||||
tipoPropiedad:"",
|
||||
ubicacion:"",
|
||||
habitaciones:0,
|
||||
piso:0,
|
||||
letra:"",
|
||||
mesesAumento:0,
|
||||
mesesDuracion:0,
|
||||
});
|
||||
|
||||
onMount(()=>{
|
||||
getparams();
|
||||
obtenerDatosACargar();
|
||||
|
||||
});
|
||||
|
||||
async function refreshCanon() {
|
||||
try {
|
||||
const ret = await fetch($urlG+"/api/admin/contrato/canons?id="+contratoid, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
"Auth": String(token),
|
||||
}
|
||||
});
|
||||
if (!ret.ok){
|
||||
let data = await ret.json();
|
||||
modaldata = data.message;
|
||||
return;
|
||||
}
|
||||
let data = await ret.json();
|
||||
canons = data;
|
||||
return;
|
||||
} catch {
|
||||
modaldata = "No se pudo obtener la lista de canones actualizada";
|
||||
}
|
||||
}
|
||||
|
||||
async function obtenerDatosACargar() {
|
||||
try {
|
||||
const respPropiedad = fetch($urlG+"/api/contratos/controlPagos/propiedad?id="+contratoid, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
"Auth": String(token),
|
||||
}
|
||||
});
|
||||
const respCanons = fetch($urlG+"/api/admin/contrato/canons?id="+contratoid, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
"Auth": String(token),
|
||||
}
|
||||
});
|
||||
|
||||
const [p, c] = await Promise.all([respPropiedad, respCanons]);
|
||||
|
||||
const datosPropiedad = await p.json();
|
||||
const datosCanons = await c.json();
|
||||
|
||||
if(!(await respCanons).ok){
|
||||
modaldata = datosCanons.message;
|
||||
return;
|
||||
}
|
||||
|
||||
prop = datosPropiedad;
|
||||
canons = datosCanons;
|
||||
|
||||
} catch {
|
||||
modaldata = "Fallo hacer las request";
|
||||
}
|
||||
}
|
||||
|
||||
function getparams(){
|
||||
const qs = window.location.search;
|
||||
const par = new URLSearchParams(qs);
|
||||
contratoid = par.get("id")||"";
|
||||
}
|
||||
|
||||
function abrirModalNotif(id:number) {
|
||||
idcanon = id;
|
||||
shownotif = true;
|
||||
}
|
||||
|
||||
async function verContrato() {
|
||||
if (prop.id <= 0) {
|
||||
modaldata = "no hay contratos con id 0 o menor";
|
||||
return;
|
||||
}
|
||||
try {
|
||||
const resp = await fetch ($urlG+"/api/admin/contrato/verDocumento?idcontrato="+prop.id, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
"Auth": String(token),
|
||||
}
|
||||
});
|
||||
|
||||
if (!resp.ok) {
|
||||
let blob = await resp.json();
|
||||
modaldata=blob.message;
|
||||
return;
|
||||
}
|
||||
|
||||
let blob = await resp.blob();
|
||||
const blobUrl = URL.createObjectURL(blob);
|
||||
window.open(blobUrl, '_blank');
|
||||
setTimeout(() => URL.revokeObjectURL(blobUrl), 100000);
|
||||
} catch {
|
||||
modaldata= "fallo intentar hacer la request";
|
||||
}
|
||||
}
|
||||
|
||||
async function notificar(mes: Date) {
|
||||
|
||||
}
|
||||
|
||||
async function realizarpago(mes: Date) {
|
||||
try {
|
||||
const ret = await fetch($urlG+"/api/admin/contrato/marcarPago", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Auth": String(token),
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({idcontrato:contratoid, fecha:mes}),
|
||||
});
|
||||
let data = await ret.json();
|
||||
modaldata = data.message;
|
||||
if (ret.ok){
|
||||
refreshCanon()
|
||||
return;
|
||||
}
|
||||
} catch {
|
||||
modaldata = "Fallo al intentar hacer la request";
|
||||
}
|
||||
}
|
||||
|
||||
async function EscribirNotificacion(message:string) {
|
||||
if (message =="") {
|
||||
modaldata = "no se puede enviar un mensaje vacio";
|
||||
return;
|
||||
}
|
||||
try {
|
||||
const r = await fetch($urlG+"/api/admin/notificarInquilino", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Auth": String(token),
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
mensaje: message,
|
||||
idcontrato: prop.id,
|
||||
idcanon: idcanon,
|
||||
})
|
||||
});
|
||||
let data = await r.json();
|
||||
modaldata = data.message;
|
||||
} catch {
|
||||
modaldata ="No se pudo enviar el mensaje";
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<NavBarAutocompletable/>
|
||||
|
||||
{#if modaldata}
|
||||
<ModalEstatico payload={modaldata} close={()=>!!(modaldata = "")}/>
|
||||
{/if}
|
||||
|
||||
{#if shownotif}
|
||||
<ModalNotificacion onCancel={()=>shownotif = false} onConfirm={EscribirNotificacion}/>
|
||||
{/if}
|
||||
|
||||
<div class="container-fluid mt-4 d-flex">
|
||||
<div class="col-md-4 me-4">
|
||||
<div class="card">
|
||||
<div class="card-header text-center">Propiedad</div>
|
||||
<div class="card-body">
|
||||
<p><b>Tipo:</b> {prop.tipoPropiedad}</p>
|
||||
<p><b>Ubicación:</b> {prop.ubicacion}</p>
|
||||
<p><b>Propietario:</b> {prop.propietario}</p>
|
||||
<p><b>Inquilino:</b> {prop.inquilino}</p>
|
||||
<p><b>Habitaciones:</b> {prop.habitaciones}</p>
|
||||
<p><b>Piso:</b> {prop.piso}</p>
|
||||
<p><b>Letra:</b> {prop.letra}</p>
|
||||
<p><b>Fecha Inicio:</b> {String(prop.fechainicio).split("T")[0]}</p>
|
||||
<p><b>Estado:</b> {prop.estado}</p>
|
||||
<button class="btn btn-secondary" onclick={verContrato}>
|
||||
Ver Contrato
|
||||
</button>
|
||||
</div>
|
||||
<div class="card-footer text-center">
|
||||
IdContrato: {prop.id}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col d-flex flex-column">
|
||||
<div class="accordion mb-4" id="accordionExample">
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="headingOne">
|
||||
<button
|
||||
class="accordion-button collapsed"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#collapseOne"
|
||||
aria-expanded="false"
|
||||
aria-controls="collapseOne"
|
||||
>
|
||||
Garantes
|
||||
</button>
|
||||
</h2>
|
||||
<div
|
||||
id="collapseOne"
|
||||
class="accordion-collapse collapse"
|
||||
aria-labelledby="headingOne"
|
||||
data-bs-parent="#accordionExample"
|
||||
>
|
||||
<div class="accordion-body">
|
||||
<table class="table table-striped table-hover">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Dni</th>
|
||||
<th>Nombre</th>
|
||||
<th>Apellido</th>
|
||||
<th>Domicilio</th>
|
||||
<th>Dom. Laboral</th>
|
||||
<th>Celular</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{#each garantes as g}
|
||||
<tr>
|
||||
<td>{g.dni}</td>
|
||||
<td>{g.nombre}</td>
|
||||
<td>{g.apellido}</td>
|
||||
<td>{g.domicilio}</td>
|
||||
<td>{g.domiciliolaboral}</td>
|
||||
<td>{g.celular}</td>
|
||||
</tr>
|
||||
{/each}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="headingTwo">
|
||||
<button
|
||||
class="accordion-button"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#collapseTwo"
|
||||
aria-expanded="true"
|
||||
aria-controls="collapseTwo"
|
||||
>
|
||||
Canons
|
||||
</button>
|
||||
</h2>
|
||||
<div
|
||||
id="collapseTwo"
|
||||
class="accordion-collapse collapse show"
|
||||
aria-labelledby="headingTwo"
|
||||
data-bs-parent="#accordionExample"
|
||||
>
|
||||
<div class="accordion-body">
|
||||
<div class="row">
|
||||
{#each canons as canon}
|
||||
<div class="col-6 mb-3">
|
||||
<div class="card">
|
||||
<div class="card-header text-center">
|
||||
{canon.mesNum}/{prop.mesesDuracion}
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<p><strong>Mes:</strong> {String(canon.mes).split("T")[0]}</p>
|
||||
<p><strong>Monto:</strong> {canon.monto}</p>
|
||||
<p><strong>Divisa:</strong> {canon.divisa}</p>
|
||||
<p><strong>Pago:</strong> {canon.pago ? "Sí" : "No"}</p>
|
||||
</div>
|
||||
<div class="card-footer d-flex justify-content-between">
|
||||
<button class="btn btn-primary" disabled={canon.pago} onclick={()=>realizarpago(canon.mes)}>
|
||||
Pagar
|
||||
</button>
|
||||
<button class="btn btn-warning" disabled={canon.pago} onclick={()=>abrirModalNotif(canon.id)}>
|
||||
Informar
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
93
Front/src/paginas/ControlPagos.svelte
Normal file
93
Front/src/paginas/ControlPagos.svelte
Normal file
@@ -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>
|
||||
Reference in New Issue
Block a user