forked from TDTP/admin_transporte_frontend
118 lines
4.2 KiB
Svelte
118 lines
4.2 KiB
Svelte
<script>
|
|
import Paginate from "$/components/Paginate.svelte";
|
|
import { getGtfsArchivo,getGtfsArchivoId } from "$/services/gtfs_archivo";
|
|
import PageTitle from "$/components/PageTitle.svelte";
|
|
import { useLocation } from "svelte-navigator";
|
|
import { getPermisosPath } from "$/services/usuarios";
|
|
|
|
const limit = 15;
|
|
let page = 1;
|
|
let offset = 0;
|
|
let count = 0;
|
|
let ordering = 'id_archivo'
|
|
let redes = []
|
|
let red = null
|
|
let lista_gtfs = []
|
|
let gtfs = null
|
|
let location = useLocation()
|
|
let loading = false;
|
|
|
|
getPermisosPath($location.pathname)
|
|
|
|
.catch(error => console.log({ error }))
|
|
|
|
$: onPage(page)
|
|
|
|
async function onPage(p) {
|
|
try {
|
|
loading = true
|
|
offset = (p - 1) * limit;
|
|
const data = await getGtfsArchivo({ offset, limit, ordering })
|
|
lista_gtfs = data.results;
|
|
count = data.count;
|
|
} catch (error) {
|
|
globalThis.toast.error(error)
|
|
} finally {
|
|
loading = false;
|
|
}
|
|
}
|
|
|
|
|
|
function onOrderBy(field) {
|
|
ordering = ordering === field ? '-' + field : field;
|
|
onPage(page)
|
|
}
|
|
</script>
|
|
|
|
<PageTitle {loading}>Listado Archivos GTFS</PageTitle>
|
|
|
|
<div class="card">
|
|
|
|
<div class="card-body">
|
|
<div class="table-responsive">
|
|
<table class="table table-sm table-bordered">
|
|
<thead>
|
|
<tr class="table-light">
|
|
<th style="width: 5%">Nro</th>
|
|
<th style="width: 5%">
|
|
<a href={"#"} on:click|preventDefault={() => onOrderBy('id_gtfs')}>ID</a>
|
|
{#if ordering === 'id_gtfs'}<i class="bi bi-caret-up-fill"></i>{/if}
|
|
{#if ordering === '-id_gtfs'}<i class="bi bi-caret-down-fill"></i>{/if}
|
|
</th>
|
|
<th>
|
|
<a href={"#"} on:click|preventDefault={() => onOrderBy('nombre_red')}>Archivo</a>
|
|
{#if ordering === 'archivo'}<i class="bi bi-caret-up-fill"></i>{/if}
|
|
{#if ordering === '-archivo'}<i class="bi bi-caret-down-fill"></i>{/if}
|
|
</th>
|
|
|
|
<th>
|
|
<a href={"#"} on:click|preventDefault={() => onOrderBy('created')}>Creado el</a>
|
|
{#if ordering === 'created'}<i class="bi bi-caret-up-fill"></i>{/if}
|
|
{#if ordering === '-created'}<i class="bi bi-caret-down-fill"></i>{/if}
|
|
</th>
|
|
|
|
<th>
|
|
<a href={"#"} on:click|preventDefault={() => onOrderBy('status')}>Estado</a>
|
|
{#if ordering === 'status'}<i class="bi bi-caret-up-fill"></i>{/if}
|
|
{#if ordering === '-status'}<i class="bi bi-caret-down-fill"></i>{/if}
|
|
</th>
|
|
|
|
<th>
|
|
<a href={"#"} on:click|preventDefault={() => onOrderBy('vigente')}>Vigente</a>
|
|
{#if ordering === 'vigente'}<i class="bi bi-caret-up-fill"></i>{/if}
|
|
{#if ordering === '-vigente'}<i class="bi bi-caret-down-fill"></i>{/if}
|
|
</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{#each lista_gtfs as app, index}
|
|
<tr>
|
|
<td class="table-light">{offset + index + 1}</td>
|
|
<td>{app.id_red}</td>
|
|
<td><a href={app.archivo}>{app.archivo}</a></td>
|
|
<td>{app.created}</td>
|
|
<td>{app.status}</td>
|
|
<td>{app.vigente ? '✅':'🚫'}</td>
|
|
</tr>
|
|
{/each}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<div class="card-footer d-flex">
|
|
|
|
<Paginate
|
|
forcePage={page}
|
|
{limit}
|
|
{count}
|
|
on:page={ev => page = ev.detail}
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<style>
|
|
.table-responsive {
|
|
max-height: calc(100vh - 300px);
|
|
}
|
|
</style> |