fix(codev): boundaries D3 + matching rebuildLinks + couleurs + bulles toggle + FAB +

pages/codev/carto.vue

@@ -11,11 +11,22 @@
       </p>
     </header>
 
+    <div class="show-labels-bar">
+      <button
+        type="button"
+        :class="{ active: showLabels }"
+        @click="showLabels = !showLabels"
+      >
+        {{ showLabels ? 'Masquer besoins/offres' : 'Montrer besoins/offres' }}
+      </button>
+    </div>
+
     <ClientOnly>
       <CodevGraph
         :fiches="fiches"
         :matches="matches"
         :mode="mode"
+        :show-labels="showLabels"
         @select-fiche="onSelectFiche"
       />
       <template #fallback>
@@ -71,6 +82,11 @@
       </button>
     </div>
 
+    <!-- FAB ajouter une fiche -->
+    <NuxtLink to="/codev/fiche" class="fab-add" title="Ajouter ma fiche" aria-label="Ajouter une fiche">
+      +
+    </NuxtLink>
+
   </div>
 </template>
 
@@ -85,6 +101,7 @@ const fiches = computed(() => data.value?.list ?? [])
 
 const matches = ref<CodevMatch[]>([])
 const mode = ref<'none' | 'solution' | 'alliance' | 'surprise'>('none')
+const showLabels = ref(false)
 
 const MODE_LABELS: Record<string, string> = {
   solution: 'Solution',
@@ -256,6 +273,59 @@ function onSelectFiche(id: number) {
   }
 }
 
+/* ── Toggle besoins/offres ── */
+
+.show-labels-bar {
+  display: flex;
+  justify-content: center;
+  margin-bottom: 8px;
+}
+
+.show-labels-bar button {
+  border: 1px solid #d0d4dc;
+  border-radius: 8px;
+  padding: 8px 16px;
+  background: white;
+  font-size: 13px;
+  cursor: pointer;
+  color: #374151;
+  transition: background 0.15s, color 0.15s, border-color 0.15s;
+}
+
+.show-labels-bar button.active {
+  background: #1B4436;
+  color: white;
+  border-color: transparent;
+}
+
+/* ── FAB ajouter ── */
+
+.fab-add {
+  position: fixed;
+  bottom: 80px;
+  right: 16px;
+  width: 48px;
+  height: 48px;
+  border-radius: 50%;
+  background: #1B4436;
+  color: white;
+  font-size: 28px;
+  font-weight: 300;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  text-decoration: none;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.18);
+  z-index: 100;
+  transition: transform 0.15s, opacity 0.15s;
+  line-height: 1;
+}
+
+.fab-add:hover {
+  transform: scale(1.08);
+  opacity: 0.92;
+}
+
 /* ── Mobile ── */
 
 @media (max-width: 600px) {

pages/codev/fiche.vue

@@ -4,7 +4,7 @@
 
       <!-- En-tête -->
       <div class="fiche-header">
-        <h1>Ma fiche</h1>
+        <h1>{{ isEdit ? 'Modifier ma fiche' : 'Ma fiche' }}</h1>
         <p class="fiche-lead">3 lignes pour te présenter. Le reste se passe entre nous.</p>
       </div>
 
@@ -105,7 +105,7 @@
 
         <!-- Bouton -->
         <button type="submit" class="submit-btn" :disabled="loading">
-          {{ loading ? 'Envoi en cours...' : 'Ajouter ma fiche' }}
+          {{ isEdit ? (loading ? 'Modification...' : 'Enregistrer les modifications') : (loading ? 'Envoi en cours...' : 'Ajouter ma fiche') }}
         </button>
 
       </form>
@@ -115,12 +115,29 @@
 </template>
 
 <script setup lang="ts">
+const route = useRoute()
+const editId = computed(() => route.query.id ? Number(route.query.id) : null)
+const isEdit = computed(() => editId.value !== null)
+
 const form = ref({ nom: '', besoin: '', offre: '', hashtagsRaw: '' })
 const error = ref('')
 const loading = ref(false)
 const activeTip = ref<'besoin' | 'offre' | null>(null)
 
-useHead({ title: 'Ma fiche — Co-développement' })
+useHead({ title: computed(() => isEdit.value ? 'Modifier ma fiche — Co-développement' : 'Ma fiche — Co-développement') })
+
+onMounted(async () => {
+  if (!isEdit.value) return
+  try {
+    const fiche = await $fetch<any>(`/api/codev/fiches/${editId.value}`)
+    form.value.nom = fiche.nom
+    form.value.besoin = fiche.besoin
+    form.value.offre = fiche.offre
+    form.value.hashtagsRaw = fiche.hashtags.join(', ')
+  } catch {
+    error.value = 'Impossible de charger la fiche, elle a peut-etre ete supprimee.'
+  }
+})
 
 function toggleTip(field: 'besoin' | 'offre') {
   activeTip.value = activeTip.value === field ? null : field
@@ -136,15 +153,18 @@ async function submit() {
       .filter(Boolean)
       .slice(0, 3)
 
-    await $fetch('/api/codev/fiches', {
-      method: 'POST',
-      body: {
-        nom: form.value.nom,
-        besoin: form.value.besoin,
-        offre: form.value.offre,
-        hashtags,
-      },
-    })
+    const payload = {
+      nom: form.value.nom,
+      besoin: form.value.besoin,
+      offre: form.value.offre,
+      hashtags,
+    }
+
+    if (isEdit.value) {
+      await $fetch(`/api/codev/fiches/${editId.value}`, { method: 'PATCH', body: payload })
+    } else {
+      await $fetch('/api/codev/fiches', { method: 'POST', body: payload })
+    }
     await navigateTo('/codev/carto')
   } catch (e: any) {
     error.value = e?.data?.message || e?.statusMessage || 'Erreur, reessaie'