lo que hice hoy
This commit is contained in:
@@ -3,14 +3,30 @@
|
||||
import NavBarAutocompletable from "../Componentes/NavBarAutocompletable.svelte";
|
||||
import ModalEstatico from "../Componentes/ModalEstatico.svelte";
|
||||
import {urlG} from "../stores/urlStore";
|
||||
import type { GaranteDto } from "../types";
|
||||
import type { CanonDto, ContratoDto, ContratoPropiedadDto, GaranteDto2 } from "../types";
|
||||
|
||||
|
||||
let token:string = sessionStorage.getItem("token")||"";
|
||||
|
||||
let canons = $state([]);
|
||||
let garantes: GaranteDto[] = $state([]);
|
||||
let prop = $state();
|
||||
let interes:number = $state(0);
|
||||
|
||||
let canons:CanonDto[] = $state([]);
|
||||
let garantes: GaranteDto2[] = $state([]);
|
||||
let prop:ContratoPropiedadDto = $state({
|
||||
estado:"",
|
||||
fechainicio:"",
|
||||
id:0,
|
||||
inquilino:"",
|
||||
propietario:"",
|
||||
tipoPropiedad:"",
|
||||
ubicacion:"",
|
||||
habitaciones:0,
|
||||
piso:0,
|
||||
letra:"",
|
||||
mesesAumento:0,
|
||||
mesesDuracion:0,
|
||||
});
|
||||
|
||||
let modaldata:string = $state("");
|
||||
let contratoid:string = $state("");
|
||||
|
||||
@@ -21,7 +37,7 @@
|
||||
|
||||
async function obtenerDatosACargar() {
|
||||
try {
|
||||
const respPropiedad = fetch($urlG+"", {
|
||||
const respPropiedad = fetch($urlG+"/api/contrato/propietario?id="+contratoid, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
"Auth": String(token),
|
||||
@@ -33,7 +49,7 @@
|
||||
"Auth": String(token),
|
||||
}
|
||||
});
|
||||
const respCanons = fetch($urlG+"", {
|
||||
const respCanons = fetch($urlG+"/api/contratos/canon?id="+contratoid, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
"Auth": String(token),
|
||||
@@ -44,9 +60,11 @@
|
||||
const datosPropiedad = await p.json();
|
||||
const datosGarantes = await g.json();
|
||||
const datosCanons = await c.json();
|
||||
|
||||
prop = datosPropiedad;
|
||||
garantes = datosGarantes;
|
||||
canons = datosCanons;
|
||||
} catch {
|
||||
|
||||
modaldata = "Fallo hacer las request";
|
||||
}
|
||||
}
|
||||
|
||||
@@ -55,6 +73,11 @@
|
||||
const par = new URLSearchParams(qs);
|
||||
contratoid = par.get("id")||"";
|
||||
}
|
||||
|
||||
|
||||
function submitnuevosCanones() {
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<NavBarAutocompletable/>
|
||||
@@ -62,98 +85,158 @@
|
||||
{#if modaldata}
|
||||
<ModalEstatico payload={modaldata} close={()=>!!(modaldata = "")}/>
|
||||
{/if}
|
||||
|
||||
<div class="container-fluid mt-4">
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<div class="card">
|
||||
<div class="card-header text-center">Propiedad</div>
|
||||
<div class="card-body">
|
||||
<p><strong>Tipo:</strong> <span>---</span></p>
|
||||
<p><strong>Ubicación:</strong> <span>---</span></p>
|
||||
<p><strong>Propietario:</strong> <span>---</span></p>
|
||||
<p><strong>Habitaciones:</strong> <span>---</span></p>
|
||||
<p><strong>Piso:</strong> <span>---</span></p>
|
||||
<p><strong>Letra:</strong> <span>---</span></p>
|
||||
<p><strong>Estado:</strong> <span>---</span></p>
|
||||
<p><strong>Fecha Inicio:</strong> <span>---</span></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container-fluid mt-4 d-flex">
|
||||
<!-- Columna de la Propiedad -->
|
||||
<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>
|
||||
</div>
|
||||
<div class="card-footer text-center">
|
||||
IdPropiedad: {prop.id}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="col-md">
|
||||
<div class="accordion" id="accordionExample">
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="headingOne">
|
||||
<button
|
||||
class="accordion-button"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#collapseOne"
|
||||
aria-expanded="true"
|
||||
aria-controls="collapseOne"
|
||||
>
|
||||
Garantes
|
||||
</button>
|
||||
</h2>
|
||||
<div
|
||||
<!-- Contenedor principal del acordeón y el formulario -->
|
||||
<div class="col d-flex flex-column">
|
||||
<!-- Acordeón -->
|
||||
<div class="accordion mb-4" id="accordionExample">
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="headingOne">
|
||||
<button
|
||||
class="accordion-button"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#collapseOne"
|
||||
aria-expanded="true"
|
||||
aria-controls="collapseOne"
|
||||
>
|
||||
Garantes
|
||||
</button>
|
||||
</h2>
|
||||
<div
|
||||
id="collapseOne"
|
||||
class="accordion-collapse collapse show"
|
||||
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 collapsed"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#collapseTwo"
|
||||
aria-expanded="false"
|
||||
aria-controls="collapseTwo"
|
||||
>
|
||||
<div class="accordion-body">
|
||||
Canons
|
||||
</button>
|
||||
</h2>
|
||||
<div
|
||||
id="collapseTwo"
|
||||
class="accordion-collapse collapse"
|
||||
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-warning btn-xs" disabled={canon.pago}>
|
||||
Marcar Pago
|
||||
</button>
|
||||
<button class="btn btn-info btn-xs" disabled={!canon.pago}>
|
||||
Generar Tiket
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/each}
|
||||
<div class="card">
|
||||
<div class="card-header text-center">
|
||||
Definir el interés para los siguientes Canones
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<p class="text-muted">[Información sobre garantes]</p>
|
||||
<form>
|
||||
<div class="input-group">
|
||||
<input
|
||||
class="form-control"
|
||||
type="number"
|
||||
id="interes"
|
||||
bind:value={interes}
|
||||
min="0"
|
||||
/>
|
||||
<span class="input-group-text" id="basic-addon2">%</span>
|
||||
</div>
|
||||
<br />
|
||||
<button
|
||||
class="btn btn-primary"
|
||||
type="submit"
|
||||
onclick={() => submitnuevosCanones()}
|
||||
>
|
||||
Enviar
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="headingTwo">
|
||||
<button
|
||||
class="accordion-button collapsed"
|
||||
type="button"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target="#collapseTwo"
|
||||
aria-expanded="false"
|
||||
aria-controls="collapseTwo"
|
||||
>
|
||||
Canons
|
||||
</button>
|
||||
</h2>
|
||||
<div
|
||||
id="collapseTwo"
|
||||
class="accordion-collapse collapse"
|
||||
aria-labelledby="headingTwo"
|
||||
data-bs-parent="#accordionExample"
|
||||
>
|
||||
<div class="accordion-body">
|
||||
<div class="card">
|
||||
<div class="card-body">
|
||||
<div class="row">
|
||||
{#each canons as canon}
|
||||
<div class="col-6 mb-3">
|
||||
<div class="border p-2">
|
||||
<p><strong>Mes:</strong> {canon.mes}</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>
|
||||
{/each}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Formulario -->
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -69,7 +69,7 @@
|
||||
<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>Propietario:</strong> {alquiler.propietario}<br>
|
||||
<strong>Id Propiedad: </strong>{alquiler.id}
|
||||
</p>
|
||||
<div class="d-flex justify-content-center">
|
||||
|
||||
@@ -69,7 +69,7 @@
|
||||
<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>Propietario:</strong> {alquiler.propietario}<br>
|
||||
<strong>Id Propiedad: </strong>{alquiler.id}
|
||||
</p>
|
||||
<div class="d-flex justify-content-center">
|
||||
|
||||
33
Front/src/types.d.ts
vendored
33
Front/src/types.d.ts
vendored
@@ -76,6 +76,15 @@ export type GaranteDto = {
|
||||
Celular: string;
|
||||
Domiciliolaboral: string;
|
||||
};
|
||||
//inedito
|
||||
export type GaranteDto2 = {
|
||||
dni: number;
|
||||
nombre: string;
|
||||
apellido: string;
|
||||
domicilio: string;
|
||||
celular: string;
|
||||
domiciliolaboral: string;
|
||||
};
|
||||
|
||||
export type ContratoDto ={
|
||||
id: number,
|
||||
@@ -85,4 +94,28 @@ export type ContratoDto ={
|
||||
inquilino:string,
|
||||
propietario:string,
|
||||
estado:string,
|
||||
}
|
||||
|
||||
export type CanonDto = {
|
||||
id:number,
|
||||
mesNum:number,
|
||||
mes:Date,
|
||||
monto:number,
|
||||
divisa:string,
|
||||
pago:boolean
|
||||
}
|
||||
|
||||
export type ContratoPropiedadDto ={
|
||||
id: number,
|
||||
ubicacion:string,
|
||||
tipoPropiedad:string,
|
||||
fechainicio:string,
|
||||
inquilino:string,
|
||||
propietario:string,
|
||||
estado:string,
|
||||
habitaciones:number,
|
||||
piso:number,
|
||||
letra:string,
|
||||
mesesAumento:number,
|
||||
mesesDuracion:number
|
||||
}
|
||||
Reference in New Issue
Block a user