server/frontend/ui/src/routes/tags/[tag].svelte

70 lines
1.4 KiB
Svelte

<script context="module">
export async function load({ page, fetch, session, context }) {
return {
props: {
tag: page.params.tag,
}
};
}
</script>
<script>
import {
Alert,
Card,
CardBody,
CardTitle,
Col,
Container,
Icon,
Row,
} from 'sveltestrap';
import { goto } from '$app/navigation';
import { themes } from '../../stores/themes.js';
import CardTheme from '../../components/CardTheme.svelte';
export let tag = "";
let exercices = [];
$: {
let tmp_exercices = [];
for (let th in $themes) {
for (let ex in $themes[th].exercices) {
if ($themes[th].exercices[ex].tags.indexOf(tag) >= 0) {
tmp_exercices.push({theme: $themes[th], exercice: $themes[th].exercices[ex], index: th + "," + ex});
}
}
}
exercices = tmp_exercices;
}
</script>
<Container class="mt-3">
<h1 class="text-dark">
Challenges <em>{tag}</em>
</h1>
{#if exercices.length}
<Row cols="3">
{#each exercices as {theme, exercice, index} (index)}
<Col class="mb-3">
<CardTheme
theme={theme}
exercice={exercice}
on:click={goto(`/${theme.urlid}/${exercice.urlid}`)}
/>
</Col>
{/each}
</Row>
{:else}
<p class="lead">
Il n'y a aucun défi sur ce thème.
</p>
{/if}
</Container>