feat(aep): carte AEP — push Gitea 2026-04-28

components/EchelleFilter.vue

@@ -0,0 +1,63 @@
+<template>
+  <div class="space-y-1.5">
+    <p class="text-xs font-bold uppercase tracking-widest" style="color: var(--nav-text-muted);">Échelle</p>
+    <!-- Inline sur 1 ligne — même pattern que FonctionFilter -->
+    <div class="flex flex-wrap gap-x-4 gap-y-1.5">
+      <label
+        v-for="option in ECHELLES"
+        :key="option"
+        class="flex items-center gap-1.5 cursor-pointer select-none transition-opacity"
+      >
+        <!-- Case carrée -->
+        <span
+          class="flex items-center justify-center shrink-0 transition-all"
+          style="width: 18px; height: 18px; border: 1.5px solid; border-radius: 3px;"
+          :style="isSelected(option)
+            ? 'background: var(--nav-primary); border-color: var(--nav-primary); color: #ffffff;'
+            : 'background: var(--nav-bg-alt); border-color: rgba(26,34,56,0.25); color: transparent;'"
+        >
+          <svg v-if="isSelected(option)" width="11" height="11" viewBox="0 0 12 12" fill="none">
+            <polyline points="2,6 5,9 10,3" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
+          </svg>
+        </span>
+        <!-- Label -->
+        <span
+          class="text-sm leading-tight"
+          :style="isSelected(option) ? 'color: var(--nav-text); font-weight: 600;' : 'color: var(--nav-text);'"
+        >{{ option }}</span>
+        <!-- Input réel (masqué) -->
+        <input
+          type="checkbox"
+          class="sr-only"
+          :checked="isSelected(option)"
+          @change="toggle(option)"
+        />
+      </label>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+const ECHELLES = ['National', 'Régional', 'Local'] as const
+
+const props = defineProps<{
+  modelValue: string[]
+  counts: Record<string, number>
+}>()
+
+const emit = defineEmits<{
+  'update:modelValue': [value: string[]]
+}>()
+
+function isSelected(option: string): boolean {
+  return props.modelValue.includes(option)
+}
+
+function toggle(option: string) {
+  if (isSelected(option)) {
+    emit('update:modelValue', props.modelValue.filter(v => v !== option))
+  } else {
+    emit('update:modelValue', [...props.modelValue, option])
+  }
+}
+</script>