Files
AlquilaFacil/Front/src/Componentes/ModalLogs.svelte
2025-07-23 01:09:25 -03:00

78 lines
3.0 KiB
Svelte

<script lang="ts">
import { onMount } from "svelte";
import { urlG } from "../stores/urlStore";
import type { LogDetalleDto, LogDto } from "../types";
let {onClose, log}: {onClose: ()=>boolean, log:LogDto} = $props();
let token:string = sessionStorage.getItem("token")||"";
let detalles: LogDetalleDto[] = $state([]);
async function obtenerDetalles() {
try{
const r = await fetch($urlG+"/api/Logs/detalle?fecha="+log.fecha+"&idusuario="+log.dniusuario, {
method:"GET",
headers: {
"Auth": token,
}
});
let data = await r.json();
if (r.ok) {
detalles = data;
return;
}
}catch{}
}
onMount(()=>{
obtenerDetalles();
});
</script>
<div class="modal fade show" tabindex="-1" role="dialog" style="display: block; background-color: rgba(0, 0, 0, 0.5);">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="exampleModalLabel">Detalles Log</h1>
<button class="btn-close" onclick={onClose} aria-label="Close"></button>
</div>
<div class="modal-body">
<table class="table table-striped" style="table-layout: fixed; width: 100%;">
<thead>
<tr>
<th style="word-wrap: break-word;">Fecha</th>
<th style="word-wrap: break-word;">Tabla</th>
<th style="word-wrap: break-word;">Columna</th>
<th style="word-wrap: break-word;">Valor Viejo</th>
<th style="word-wrap: break-word;">Valor Nuevo</th>
</tr>
</thead>
<tbody>
{#each detalles as d}
<tr>
<td style="word-wrap: break-word;">{d.fecha}</td>
<td style="word-wrap: break-word;">{d.nombreTabla}</td>
<td style="word-wrap: break-word;">{d.columna}</td>
<td style="word-wrap: break-word;">
{#if d.columna == "Contraseña"}
*
{:else}
{d.valorAnterior}
{/if}
</td>
<td style="word-wrap: break-word;">
{#if d.columna == "Contraseña"}
*
{:else}
{d.valorNuevo}
{/if}
</td>
</tr>
{/each}
</tbody>
</table>
</div>
</div>
</div>
</div>