Pandore/FanKarr
1
0 Fork 0
Code Activity

feat(ui): refonte de l'interface

Browse Source
This commit is contained in:
ElPouki committed 2026-09-15 15:30:20 +02:00
1 parent 3ede3e808c
commit 09eb1fa3aa
79 files changed
+5323 -3514
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/components/setup/SetupMediaServerStep.vue
+17 -16
View File
@@ -2,67 +2,68 @@
<div class="flex flex-col gap-4">
<!-- Jellyfin -->
<section class="settings-card flex flex-col gap-4">
<section class="card flex flex-col gap-4">
<div class="flex items-start gap-3">
<span class="w-9 h-9 rounded-lg bg-accent-muted text-accent flex items-center justify-center shrink-0">
<span class="w-9 h-9 rounded-full bg-accent-muted text-accent flex items-center justify-center shrink-0">
<Server :size="17" />
</span>
<div class="flex-1 min-w-0">
<p class="text-sm text-primary font-medium flex items-center gap-2">
Jellyfin
<span v-if="jellyfin?.test?.ok" class="text-[11px] text-green-400 font-normal">connecté</span>
<span v-if="jellyfin?.test?.ok" class="pill pill-ok h-5 px-2 text-[10.5px]">Connecté</span>
</p>
<p class="text-xs text-muted mt-0.5 leading-relaxed">
<p class="text-meta text-muted mt-0.5 leading-relaxed">
Permet à vos utilisateurs Jellyfin de se connecter à FanKarr et de faire des demandes depuis le plugin FanKarr Search.
</p>
</div>
<button @click="jellyfinOpen = !jellyfinOpen" :aria-expanded="jellyfinOpen" class="btn-secondary shrink-0 text-xs">
<button @click="jellyfinOpen = !jellyfinOpen" :aria-expanded="jellyfinOpen" class="btn-secondary btn-sm shrink-0">
{{ jellyfinOpen ? 'Replier' : 'Configurer' }}
</button>
</div>
<template v-if="jellyfinOpen">
<div class="h-px bg-hover" />
<JellyfinConnectionForm @change="jellyfin = $event" />
<div v-if="jellyfin?.test?.ok" class="flex flex-col gap-2">
<div class="flex items-center gap-3 flex-wrap">
<button @click="syncUsers" :disabled="syncing" class="btn-secondary text-xs">
<button @click="syncUsers" :disabled="syncing" class="btn-secondary btn-sm">
{{ syncing ? 'Synchronisation…' : 'Synchroniser les utilisateurs' }}
</button>
<span v-if="syncResult" class="text-xs text-green-400">
<span v-if="syncResult" class="text-meta text-ok">
{{ syncResult.created }} créé{{ syncResult.created > 1 ? 's' : '' }} · {{ syncResult.skipped }} ignoré{{ syncResult.skipped > 1 ? 's' : '' }}
</span>
<span v-if="syncError" class="text-xs text-red-400">{{ syncError }}</span>
<span v-if="syncError" class="text-meta text-err">{{ syncError }}</span>
</div>
<p class="text-xs text-muted">Crée un compte FanKarr pour chaque utilisateur Jellyfin. La synchronisation se relance ensuite toutes les heures.</p>
<p class="text-meta text-muted">Crée un compte FanKarr pour chaque utilisateur Jellyfin. La synchronisation se relance ensuite toutes les heures.</p>
</div>
</template>
</section>
<!-- Plex -->
<section class="settings-card flex flex-col gap-4">
<section class="card flex flex-col gap-4">
<div class="flex items-start gap-3">
<span class="w-9 h-9 rounded-lg bg-accent-muted text-accent flex items-center justify-center shrink-0">
<span class="w-9 h-9 rounded-full bg-accent-muted text-accent flex items-center justify-center shrink-0">
<Tv :size="17" />
</span>
<div class="flex-1 min-w-0">
<p class="text-sm text-primary font-medium flex items-center gap-2">
Plex
<span v-if="context.plexOpened" class="text-[11px] text-muted font-normal">assistant ouvert</span>
<span v-if="context.plexOpened" class="text-meta text-muted font-normal">assistant ouvert</span>
</p>
<p class="text-xs text-muted mt-0.5 leading-relaxed">
<p class="text-meta text-muted mt-0.5 leading-relaxed">
Crée une bibliothèque Plex sur votre médiathèque, reliée à l'agent de métadonnées Fankai.
Requiert Plex Media Server 1.43 ou plus récent pour la configuration automatique.
</p>
</div>
<button @click="openPlex" :disabled="!settings.mediaPath" class="btn-secondary shrink-0 text-xs">
<button @click="openPlex" :disabled="!settings.mediaPath" class="btn-secondary btn-sm shrink-0">
Lancer l'assistant Plex
</button>
</div>
<p v-if="!settings.mediaPath" class="text-xs text-yellow-500">Renseignez d'abord la médiathèque à l'étape Dossiers.</p>
<p v-if="!settings.mediaPath" class="text-meta text-accent">Renseignez d'abord la médiathèque à l'étape Dossiers.</p>
</section>
<p class="text-xs text-muted">Pas de serveur multimédia pour l'instant ? Passez cette étape, tout se configure aussi plus tard.</p>
<p class="text-meta text-muted">Pas de serveur multimédia pour l'instant ? Passez cette étape, tout se configure aussi plus tard.</p>
</div>