62 lines
1.7 KiB
Svelte
62 lines
1.7 KiB
Svelte
<script>
|
|
import { goto } from '$app/navigation';
|
|
|
|
import {
|
|
Container,
|
|
Icon,
|
|
Spinner,
|
|
Table,
|
|
} from '@sveltestrap/sveltestrap';
|
|
|
|
import { fieldsExercices, getExercices } from '$lib/exercices';
|
|
|
|
let query = "";
|
|
|
|
function show(id) {
|
|
goto("exercices/" + id)
|
|
}
|
|
</script>
|
|
|
|
<Container class="mt-2 mb-5">
|
|
<h2>
|
|
Étapes
|
|
</h2>
|
|
|
|
{#await getExercices()}
|
|
<div class="d-flex justify-content-center">
|
|
<Spinner size="lg" />
|
|
</div>
|
|
{:then exercices}
|
|
<p>
|
|
<input type="search" class="form-control form-control-sm" placeholder="Search" bind:value={query} autofocus>
|
|
</p>
|
|
<Table class="table-hover table-bordered table-striped table-sm">
|
|
<thead class="thead-dark">
|
|
<tr>
|
|
{#each fieldsExercices as field}
|
|
<th>
|
|
{field}
|
|
</th>
|
|
{/each}
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{#each exercices as exercice (exercice.id)}
|
|
{#if exercice.title.indexOf(query) >= 0}
|
|
<tr on:click={() => show(exercice.id)}>
|
|
{#each fieldsExercices as field}
|
|
<td>
|
|
{@html exercice[field]}
|
|
{#if field == "title" && exercice.wip}
|
|
<Icon name="cone-striped" />
|
|
{/if}
|
|
</td>
|
|
{/each}
|
|
</tr>
|
|
{/if}
|
|
{/each}
|
|
</tbody>
|
|
</Table>
|
|
{/await}
|
|
</Container>
|