improvement: liste des créatures dans la sidebar
This commit is contained in:
parent
66c2dca2d6
commit
6eaea78f67
2 changed files with 17 additions and 19 deletions
|
@ -1,34 +1,24 @@
|
|||
<script setup lang="ts">
|
||||
import { useConfigStore } from "@/stores/config";
|
||||
import { computed } from "vue";
|
||||
import { LISTE_CREATURES } from "@/utils/constantes";
|
||||
import { toURI } from "@/utils/urls";
|
||||
|
||||
const store = useConfigStore();
|
||||
|
||||
const sidebar = computed(() => {
|
||||
return store.getSidebar() ?? [{ title: "", id: 0, links: [] }];
|
||||
});
|
||||
|
||||
const linkBase = computed(() => {
|
||||
if (store.isJdrLoaded()) {
|
||||
return `jdr/${store.currentJdr}`;
|
||||
} else {
|
||||
return `jdr`;
|
||||
}
|
||||
const creatures = computed(() => {
|
||||
return LISTE_CREATURES;
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<aside id="sidebar" class="bg-dark fg-light menu">
|
||||
<h1 class="title-5 fg-light">Navigation</h1>
|
||||
<ul v-for="item in sidebar" :key="item.id">
|
||||
<div class="menu-divider" v-if="item.title">{{ item.title }}</div>
|
||||
<li v-for="(link, index) in item.links" :key="index">
|
||||
<ul>
|
||||
<div class="menu-divider">Créatures</div>
|
||||
<li v-for="(creature, index) in creatures" :key="index">
|
||||
<router-link
|
||||
:to="`/${linkBase}/${link.path}`"
|
||||
:to="`/creatures/${toURI(creature)}`"
|
||||
class="menu-item"
|
||||
:replace="true"
|
||||
v-if="!link.isHidden"
|
||||
>{{ link.title }}</router-link
|
||||
>{{ creature }}</router-link
|
||||
>
|
||||
</li>
|
||||
</ul>
|
||||
|
|
8
src/utils/constantes.ts
Normal file
8
src/utils/constantes.ts
Normal file
|
@ -0,0 +1,8 @@
|
|||
export const LISTE_CREATURES = [
|
||||
"Animaux",
|
||||
"Animaux sauvages",
|
||||
"Animaux magiques",
|
||||
"Démons",
|
||||
"Petit peuples",
|
||||
"Morts-Vivants",
|
||||
];
|
Loading…
Reference in a new issue