cinqcinqdev-seo 0.1.9 → 0.1.11

package/dist/runtime/pages/admin/strategies/[id].vue

@@ -0,0 +1,237 @@
+<script setup>
+import { ref, onMounted, useHead, useRoute, navigateTo } from "#imports";
+import { useAdminStrategies, useAdminContent, useAdminPersonas } from "#imports";
+const route = useRoute();
+const id = route.params.id;
+useHead({ title: "Strategie - Admin" });
+const { fetchStrategyById, updateStrategy, fetchStrategyContents, fetchStrategyPersonas } = useAdminStrategies();
+const { fetchContent, createContent } = useAdminContent();
+const { fetchPersonas } = useAdminPersonas();
+const strategy = ref(null);
+const contents = ref([]);
+const linkedPersonas = ref([]);
+const allContents = ref([]);
+const allPersonas = ref([]);
+const loading = ref(true);
+const editMode = ref(false);
+const saving = ref(false);
+const formData = ref({});
+const activeTab = ref("overview");
+onMounted(async () => {
+  loading.value = true;
+  try {
+    const [s, c, p, ac, ap] = await Promise.all([
+      fetchStrategyById(id),
+      fetchStrategyContents(id),
+      fetchStrategyPersonas(id),
+      fetchContent(),
+      fetchPersonas()
+    ]);
+    strategy.value = s;
+    contents.value = c || [];
+    linkedPersonas.value = p || [];
+    allContents.value = ac || [];
+    allPersonas.value = ap || [];
+    formData.value = { ...s };
+  } catch {
+  } finally {
+    loading.value = false;
+  }
+});
+const saveChanges = async () => {
+  saving.value = true;
+  try {
+    const updated = await updateStrategy(id, formData.value);
+    strategy.value = updated;
+    editMode.value = false;
+  } catch {
+  } finally {
+    saving.value = false;
+  }
+};
+const statusClass = (s) => ({
+  draft: "bg-slate-100 text-slate-600",
+  active: "bg-emerald-100 text-emerald-700",
+  paused: "bg-amber-100 text-amber-700",
+  completed: "bg-blue-100 text-blue-700"
+})[s] || "bg-slate-100 text-slate-600";
+const priorityClass = (p) => ({
+  Critique: "bg-red-100 text-red-700",
+  Haute: "bg-orange-100 text-orange-700",
+  Moyenne: "bg-blue-100 text-blue-700",
+  Basse: "bg-slate-100 text-slate-600"
+})[p] || "bg-slate-100 text-slate-600";
+const formatDate = (d) => d ? new Date(d).toLocaleDateString("fr-FR") : "-";
+const formatBudget = (n) => n ? new Intl.NumberFormat("fr-FR", { style: "currency", currency: "EUR" }).format(n) : "-";
+const contentStatusClass = {
+  draft: "bg-slate-100 text-slate-500",
+  approved: "bg-blue-100 text-blue-600",
+  published: "bg-emerald-100 text-emerald-600",
+  archived: "bg-amber-100 text-amber-600"
+};
+</script>
+
+<template>
+  <AdminDashboardLayout>
+    <div class="max-w-6xl mx-auto px-6 md:px-10 py-10">
+      <NuxtLink to="/admin/strategies" class="inline-flex items-center gap-2 text-blue-600 hover:text-blue-700 mb-8 font-medium">
+        <Icon name="mdi:arrow-left" />
+        Retour aux strategies
+      </NuxtLink>
+
+      <div v-if="loading" class="flex items-center justify-center py-20">
+        <Icon name="mdi:loading" class="text-5xl text-blue-600 animate-spin" />
+      </div>
+
+      <div v-else-if="strategy">
+        <!-- Header -->
+        <div class="bg-white rounded-3xl p-8 border border-slate-200 shadow-sm mb-6">
+          <div class="flex items-start justify-between">
+            <div class="flex-1">
+              <div class="flex items-center gap-3 mb-2">
+                <h1 class="text-3xl font-bold text-slate-900">{{ strategy.name }}</h1>
+                <span :class="['px-3 py-1 rounded-full text-xs font-semibold', statusClass(strategy.status)]">{{ strategy.status }}</span>
+                <span v-if="strategy.priority" :class="['px-3 py-1 rounded-full text-xs font-semibold', priorityClass(strategy.priority)]">{{ strategy.priority }}</span>
+              </div>
+              <p class="text-slate-600 mb-4">{{ strategy.description }}</p>
+              <div class="flex flex-wrap items-center gap-6 text-sm text-slate-500">
+                <span v-if="strategy.start_date">{{ formatDate(strategy.start_date) }} — {{ formatDate(strategy.end_date) }}</span>
+                <span v-if="strategy.budget" class="font-semibold text-emerald-600">{{ formatBudget(strategy.budget) }}</span>
+              </div>
+              <div v-if="strategy.completion_percentage !== void 0" class="mt-4 max-w-sm">
+                <div class="flex justify-between mb-1 text-xs">
+                  <span class="text-slate-500">Progression</span>
+                  <span class="font-semibold text-blue-600">{{ strategy.completion_percentage }}%</span>
+                </div>
+                <div class="w-full h-2 bg-slate-100 rounded-full overflow-hidden">
+                  <div :style="{ width: `${strategy.completion_percentage || 0}%` }" class="h-full bg-gradient-to-r from-blue-500 to-pink-500 transition-all"></div>
+                </div>
+              </div>
+            </div>
+            <button @click="editMode = !editMode" class="p-2.5 bg-slate-100 text-slate-600 rounded-xl hover:bg-slate-200 transition-all">
+              <Icon name="mdi:pencil" />
+            </button>
+          </div>
+        </div>
+
+        <!-- Edit Form -->
+        <div v-if="editMode" class="bg-white rounded-3xl p-8 border border-slate-200 shadow-sm mb-6">
+          <div class="grid grid-cols-2 gap-6 mb-6">
+            <div>
+              <label class="block text-xs font-black uppercase text-slate-500 mb-2">Nom</label>
+              <input v-model="formData.name" class="w-full px-4 py-3 border-2 border-slate-200 rounded-xl" />
+            </div>
+            <div>
+              <label class="block text-xs font-black uppercase text-slate-500 mb-2">Statut</label>
+              <select v-model="formData.status" class="w-full px-4 py-3 border-2 border-slate-200 rounded-xl">
+                <option v-for="s in ['draft', 'active', 'paused', 'completed', 'cancelled']" :key="s" :value="s">{{ s }}</option>
+              </select>
+            </div>
+            <div class="col-span-2">
+              <label class="block text-xs font-black uppercase text-slate-500 mb-2">Description</label>
+              <textarea v-model="formData.description" rows="3" class="w-full px-4 py-3 border-2 border-slate-200 rounded-xl resize-none"></textarea>
+            </div>
+            <div>
+              <label class="block text-xs font-black uppercase text-slate-500 mb-2">Progression (%)</label>
+              <input v-model.number="formData.completion_percentage" type="number" min="0" max="100" class="w-full px-4 py-3 border-2 border-slate-200 rounded-xl" />
+            </div>
+            <div>
+              <label class="block text-xs font-black uppercase text-slate-500 mb-2">Budget</label>
+              <input v-model.number="formData.budget" type="number" step="0.01" class="w-full px-4 py-3 border-2 border-slate-200 rounded-xl" />
+            </div>
+          </div>
+          <div class="flex gap-3">
+            <button @click="saveChanges" :disabled="saving" class="px-8 py-3 bg-blue-600 text-white font-bold rounded-xl hover:bg-blue-700 disabled:opacity-50">{{ saving ? "Enregistrement..." : "Enregistrer" }}</button>
+            <button @click="editMode = false" class="px-8 py-3 bg-slate-100 text-slate-700 font-bold rounded-xl hover:bg-slate-200">Annuler</button>
+          </div>
+        </div>
+
+        <!-- Tabs -->
+        <div class="flex gap-2 bg-white p-2 rounded-2xl border border-slate-200 shadow-sm mb-6 inline-flex">
+          <button v-for="tab in [{ v: 'overview', l: 'Apercu' }, { v: 'contents', l: 'Contenus' }, { v: 'personas', l: 'Personas' }]" :key="tab.v"
+                  @click="activeTab = tab.v"
+                  :class="[activeTab === tab.v ? 'bg-blue-600 text-white shadow-lg' : 'text-slate-600 hover:bg-slate-50']"
+                  class="px-5 py-2.5 rounded-xl font-semibold text-sm transition-all">{{ tab.l }}</button>
+        </div>
+
+        <!-- Overview Tab -->
+        <div v-if="activeTab === 'overview'" class="grid grid-cols-2 gap-6">
+          <div class="bg-white rounded-2xl p-6 border border-slate-200 shadow-sm">
+            <h3 class="font-black text-slate-900 mb-4 flex items-center gap-2"><Icon name="mdi:target" class="text-blue-600" /> Objectif</h3>
+            <p class="text-slate-600 leading-relaxed">{{ strategy.objective || "Non defini." }}</p>
+          </div>
+          <div class="bg-white rounded-2xl p-6 border border-slate-200 shadow-sm">
+            <h3 class="font-black text-slate-900 mb-4">Statistiques</h3>
+            <div class="space-y-3">
+              <div class="flex justify-between items-center">
+                <span class="text-sm text-slate-500">Contenus</span>
+                <span class="font-bold text-slate-900">{{ contents.length }}</span>
+              </div>
+              <div class="flex justify-between items-center">
+                <span class="text-sm text-slate-500">Personas</span>
+                <span class="font-bold text-slate-900">{{ linkedPersonas.length }}</span>
+              </div>
+              <div class="flex justify-between items-center">
+                <span class="text-sm text-slate-500">Publies</span>
+                <span class="font-bold text-emerald-600">{{ contents.filter((c) => c.content?.status === "published").length }}</span>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <!-- Contents Tab -->
+        <div v-if="activeTab === 'contents'" class="space-y-4">
+          <div class="bg-white rounded-2xl border border-slate-200 shadow-sm overflow-hidden">
+            <div class="p-6 border-b border-slate-100">
+              <h3 class="font-black text-slate-900">Contenus de la Strategie</h3>
+            </div>
+            <div v-if="contents.length === 0" class="text-center py-12 text-slate-300">
+              <Icon name="mdi:file-document-outline" class="text-5xl mb-2" />
+              <p class="text-sm">Aucun contenu lie a cette strategie</p>
+            </div>
+            <div v-else class="divide-y divide-slate-100">
+              <div v-for="item in contents" :key="item.id" class="p-4 hover:bg-slate-50 transition-colors">
+                <div class="flex items-center gap-4">
+                  <div class="flex-1">
+                    <p class="font-bold text-slate-900">{{ item.content?.title || "Sans titre" }}</p>
+                    <p class="text-xs text-slate-500">{{ item.content?.platform }} • Position: {{ item.position }}</p>
+                  </div>
+                  <span :class="['px-2 py-1 rounded-lg text-[10px] font-black uppercase', contentStatusClass[item.content?.status] || contentStatusClass.draft]">{{ item.content?.status }}</span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <!-- Personas Tab -->
+        <div v-if="activeTab === 'personas'" class="space-y-4">
+          <div class="bg-white rounded-2xl border border-slate-200 shadow-sm overflow-hidden">
+            <div class="p-6 border-b border-slate-100">
+              <h3 class="font-black text-slate-900">Personas Cibles</h3>
+            </div>
+            <div v-if="linkedPersonas.length === 0" class="text-center py-12 text-slate-300">
+              <Icon name="mdi:account-group" class="text-5xl mb-2" />
+              <p class="text-sm">Aucun persona lie a cette strategie</p>
+            </div>
+            <div v-else class="divide-y divide-slate-100">
+              <div v-for="item in linkedPersonas" :key="item.id" class="p-4 hover:bg-slate-50 transition-colors flex items-center gap-4">
+                <div class="w-12 h-12 bg-gradient-to-br from-purple-400 to-pink-400 rounded-xl flex items-center justify-center text-white font-black">
+                  {{ item.persona?.name ? item.persona.name.charAt(0) : "?" }}
+                </div>
+                <div>
+                  <p class="font-bold text-slate-900">{{ item.persona?.name }}</p>
+                  <p class="text-xs text-slate-500">{{ item.persona?.job_title }}</p>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <div v-else class="text-center py-20">
+        <Icon name="mdi:strategy" class="text-6xl text-slate-200 mb-4" />
+        <p class="text-slate-400">Strategie introuvable.</p>
+      </div>
+    </div>
+  </AdminDashboardLayout>
+</template>

package/dist/runtime/pages/admin/strategies/[id].vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: any;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/pages/admin/strategies/index.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: any;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/pages/admin/strategies/index.vue

@@ -0,0 +1,232 @@
+<script setup>
+import { ref, computed, onMounted, useHead, navigateTo } from "#imports";
+import { useAdminStrategies } from "#imports";
+useHead({ title: "Strategies - Admin" });
+const { fetchStrategies, createStrategy, updateStrategy, deleteStrategy, fetchStrategyContents, fetchStrategyPersonas } = useAdminStrategies();
+const strategies = ref([]);
+const strategyContents = ref({});
+const strategyPersonas = ref({});
+const loading = ref(true);
+const showModal = ref(false);
+const saving = ref(false);
+const editingStrategy = ref(null);
+const defaultForm = () => ({
+  name: "",
+  description: "",
+  objective: "",
+  start_date: "",
+  end_date: "",
+  budget: 0,
+  status: "draft",
+  priority: "Moyenne",
+  completion_percentage: 0
+});
+const formData = ref(defaultForm());
+onMounted(async () => {
+  loading.value = true;
+  try {
+    strategies.value = await fetchStrategies() || [];
+    for (const s of strategies.value) {
+      const [c, p] = await Promise.all([fetchStrategyContents(s.id), fetchStrategyPersonas(s.id)]);
+      strategyContents.value[s.id] = c;
+      strategyPersonas.value[s.id] = p;
+    }
+  } catch {
+  } finally {
+    loading.value = false;
+  }
+});
+const stats = computed(() => [
+  { label: "Total", value: strategies.value.length, icon: "mdi:strategy", bg: "bg-blue-50", color: "text-blue-600" },
+  { label: "Actives", value: strategies.value.filter((s) => s.status === "active").length, icon: "mdi:rocket-launch", bg: "bg-emerald-50", color: "text-emerald-600" },
+  { label: "Completees", value: strategies.value.filter((s) => s.status === "completed").length, icon: "mdi:check-circle", bg: "bg-blue-50", color: "text-blue-600" },
+  { label: "En pause", value: strategies.value.filter((s) => s.status === "paused").length, icon: "mdi:pause-circle", bg: "bg-amber-50", color: "text-amber-600" }
+]);
+const statusClass = (s) => ({
+  draft: "bg-slate-100 text-slate-600",
+  active: "bg-emerald-100 text-emerald-700",
+  paused: "bg-amber-100 text-amber-700",
+  completed: "bg-blue-100 text-blue-700",
+  cancelled: "bg-red-100 text-red-700"
+})[s] || "bg-slate-100 text-slate-600";
+const formatDate = (d) => d ? new Date(d).toLocaleDateString("fr-FR") : "-";
+const formatBudget = (n) => n ? new Intl.NumberFormat("fr-FR", { style: "currency", currency: "EUR" }).format(n) : "-";
+const openCreate = () => {
+  editingStrategy.value = null;
+  formData.value = defaultForm();
+  showModal.value = true;
+};
+const openEdit = (s) => {
+  editingStrategy.value = s;
+  formData.value = { ...s };
+  showModal.value = true;
+};
+const closeModal = () => {
+  showModal.value = false;
+  editingStrategy.value = null;
+};
+const saveStrategy = async () => {
+  if (!formData.value.name) return;
+  saving.value = true;
+  try {
+    if (editingStrategy.value) await updateStrategy(editingStrategy.value.id, formData.value);
+    else await createStrategy(formData.value);
+    strategies.value = await fetchStrategies();
+    closeModal();
+  } catch {
+    alert("Erreur lors de la sauvegarde");
+  } finally {
+    saving.value = false;
+  }
+};
+const handleDelete = async () => {
+  if (!confirm("Supprimer cette strategie ?")) return;
+  try {
+    await deleteStrategy(editingStrategy.value.id);
+    strategies.value = await fetchStrategies();
+    closeModal();
+  } catch {
+  }
+};
+</script>
+
+<template>
+  <AdminDashboardLayout>
+    <div class="max-w-7xl mx-auto px-6 md:px-10 py-10">
+      <div class="flex flex-col md:flex-row md:items-center justify-between gap-6 mb-10">
+        <div>
+          <h1 class="text-4xl font-bold text-slate-900">Strategies <span class="text-blue-600">Marketing</span></h1>
+          <p class="text-slate-500 mt-1">Gerez vos campagnes avec contenus et personas</p>
+        </div>
+        <button @click="openCreate" class="bg-blue-600 text-white px-8 py-4 rounded-2xl font-bold text-sm hover:bg-blue-700 transition-all shadow-xl shadow-blue-200 flex items-center gap-2">
+          <Icon name="mdi:plus-circle" class="text-xl" /> Nouvelle Strategie
+        </button>
+      </div>
+
+      <div class="grid grid-cols-2 lg:grid-cols-4 gap-4 mb-10">
+        <div v-for="stat in stats" :key="stat.label" class="bg-white p-6 rounded-[2rem] border border-slate-100 shadow-sm">
+          <div :class="[stat.bg, 'w-10 h-10 rounded-xl flex items-center justify-center mb-4']">
+            <Icon :name="stat.icon" :class="[stat.color, 'text-xl']" />
+          </div>
+          <p class="text-xs font-semibold text-slate-400 uppercase">{{ stat.label }}</p>
+          <p class="text-2xl font-bold text-slate-900">{{ stat.value }}</p>
+        </div>
+      </div>
+
+      <div class="space-y-6">
+        <div v-for="strategy in strategies" :key="strategy.id" class="bg-white rounded-[2rem] border border-slate-200 shadow-sm overflow-hidden hover:shadow-xl transition-all">
+          <div class="p-6 border-b border-slate-100">
+            <div class="flex items-start justify-between mb-4">
+              <div class="flex-1">
+                <div class="flex items-center gap-3 mb-2">
+                  <h3 class="text-xl font-bold text-slate-900">{{ strategy.name }}</h3>
+                  <span :class="['px-3 py-1 rounded-full text-xs font-semibold', statusClass(strategy.status)]">{{ strategy.status }}</span>
+                </div>
+                <p class="text-sm text-slate-600">{{ strategy.description }}</p>
+              </div>
+              <div class="flex gap-2 ml-4">
+                <button @click="navigateTo(`/admin/strategies/${strategy.id}`)" class="px-5 py-2.5 bg-blue-600 text-white rounded-xl text-sm font-semibold hover:bg-blue-700 transition-all">Gerer</button>
+                <button @click="openEdit(strategy)" class="p-2.5 bg-slate-100 text-slate-600 rounded-xl hover:bg-slate-200 transition-all"><Icon name="mdi:pencil" /></button>
+              </div>
+            </div>
+            <div class="mb-4">
+              <div class="flex justify-between mb-1.5 text-xs">
+                <span class="font-medium text-slate-500">Progression</span>
+                <span class="font-semibold text-blue-600">{{ strategy.completion_percentage || 0 }}%</span>
+              </div>
+              <div class="w-full h-2 bg-slate-100 rounded-full overflow-hidden">
+                <div :style="{ width: `${strategy.completion_percentage || 0}%` }" class="h-full bg-gradient-to-r from-blue-500 to-pink-500 transition-all duration-500"></div>
+              </div>
+            </div>
+            <div class="flex items-center gap-4 text-xs text-slate-500">
+              <span v-if="strategy.start_date">{{ formatDate(strategy.start_date) }}</span>
+              <span v-if="strategy.budget">{{ formatBudget(strategy.budget) }}</span>
+            </div>
+          </div>
+          <div class="grid grid-cols-2 gap-px bg-slate-100">
+            <div class="bg-white p-4 text-center">
+              <p class="text-lg font-bold text-blue-600">{{ strategyContents[strategy.id]?.length || 0 }}</p>
+              <p class="text-xs font-medium text-slate-400">Contenus</p>
+            </div>
+            <div class="bg-white p-4 text-center">
+              <p class="text-lg font-bold text-blue-600">{{ strategyPersonas[strategy.id]?.length || 0 }}</p>
+              <p class="text-xs font-medium text-slate-400">Personas</p>
+            </div>
+          </div>
+        </div>
+
+        <div v-if="!loading && strategies.length === 0" class="text-center py-20 bg-white rounded-3xl border border-slate-200">
+          <Icon name="mdi:strategy" class="text-6xl text-slate-200 mb-4" />
+          <p class="text-slate-400 font-medium mb-4">Aucune strategie. Creez-en une pour commencer!</p>
+          <button @click="openCreate" class="px-6 py-3 bg-blue-600 text-white rounded-xl font-bold">Creer ma premiere strategie</button>
+        </div>
+      </div>
+    </div>
+
+    <Teleport to="body">
+      <div v-if="showModal" class="fixed inset-0 bg-slate-900/40 backdrop-blur-md z-50 flex items-center justify-center p-6" @click.self="closeModal">
+        <div class="bg-white rounded-[3rem] max-w-3xl w-full max-h-[90vh] overflow-hidden shadow-2xl">
+          <div class="bg-blue-600 p-8 text-white flex justify-between items-center">
+            <h2 class="text-2xl font-bold">{{ editingStrategy ? "Modifier Strategie" : "Nouvelle Strategie" }}</h2>
+            <button @click="closeModal" class="w-12 h-12 bg-white/10 hover:bg-white/20 rounded-2xl flex items-center justify-center">
+              <Icon name="mdi:close" class="text-2xl" />
+            </button>
+          </div>
+          <div class="p-10 overflow-y-auto max-h-[calc(90vh-200px)] space-y-6">
+            <div>
+              <label class="block text-xs font-black uppercase text-slate-400 mb-2">Nom *</label>
+              <input v-model="formData.name" class="w-full px-6 py-4 bg-slate-50 border-none rounded-2xl font-medium" placeholder="Ex: Campagne Instagram Q1 2024" />
+            </div>
+            <div>
+              <label class="block text-xs font-black uppercase text-slate-400 mb-2">Description</label>
+              <textarea v-model="formData.description" rows="3" class="w-full px-6 py-4 bg-slate-50 border-none rounded-2xl font-medium" placeholder="Decrivez votre strategie..."></textarea>
+            </div>
+            <div>
+              <label class="block text-xs font-black uppercase text-slate-400 mb-2">Objectif</label>
+              <textarea v-model="formData.objective" rows="2" class="w-full px-6 py-4 bg-slate-50 border-none rounded-2xl font-medium" placeholder="Quel est l'objectif principal?"></textarea>
+            </div>
+            <div class="grid grid-cols-2 gap-4">
+              <div>
+                <label class="block text-xs font-black uppercase text-slate-400 mb-2">Date debut</label>
+                <input v-model="formData.start_date" type="date" class="w-full px-6 py-4 bg-slate-50 border-none rounded-2xl font-bold" />
+              </div>
+              <div>
+                <label class="block text-xs font-black uppercase text-slate-400 mb-2">Date fin</label>
+                <input v-model="formData.end_date" type="date" class="w-full px-6 py-4 bg-slate-50 border-none rounded-2xl font-bold" />
+              </div>
+            </div>
+            <div>
+              <label class="block text-xs font-black uppercase text-slate-400 mb-2">Budget (EUR)</label>
+              <input v-model.number="formData.budget" type="number" step="0.01" class="w-full px-6 py-4 bg-emerald-50 border-none rounded-2xl font-bold text-emerald-900" />
+            </div>
+            <div>
+              <label class="block text-xs font-black uppercase text-slate-400 mb-2">Statut</label>
+              <div class="grid grid-cols-4 gap-2">
+                <button v-for="s in ['draft', 'active', 'paused', 'completed']" :key="s" type="button" @click="formData.status = s"
+                        :class="[formData.status === s ? 'bg-blue-600 text-white' : 'bg-slate-100 text-slate-500']"
+                        class="py-3 rounded-xl text-xs font-black uppercase transition-all">{{ s }}</button>
+              </div>
+            </div>
+            <div>
+              <label class="block text-xs font-black uppercase text-slate-400 mb-2">Priorite</label>
+              <div class="grid grid-cols-4 gap-2">
+                <button v-for="p in ['Basse', 'Moyenne', 'Haute', 'Critique']" :key="p" type="button" @click="formData.priority = p"
+                        :class="[formData.priority === p ? 'bg-slate-900 text-white' : 'bg-slate-100 text-slate-500']"
+                        class="py-3 rounded-xl text-xs font-black uppercase">{{ p }}</button>
+              </div>
+            </div>
+          </div>
+          <div class="p-8 bg-slate-50 border-t flex justify-between">
+            <button v-if="editingStrategy" @click="handleDelete" class="px-6 py-3 bg-red-100 text-red-600 rounded-2xl font-semibold text-sm">Supprimer</button>
+            <div class="flex gap-4 ml-auto">
+              <button @click="closeModal" class="px-8 py-4 rounded-2xl font-medium text-sm text-slate-500 hover:bg-slate-200">Annuler</button>
+              <button @click="saveStrategy" :disabled="saving" class="bg-blue-600 text-white px-10 py-4 rounded-2xl font-semibold text-sm shadow-xl disabled:opacity-50">
+                {{ saving ? "Enregistrement..." : "Enregistrer" }}
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </Teleport>
+  </AdminDashboardLayout>
+</template>

package/dist/runtime/pages/admin/strategies/index.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: any;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/pages/admin/todos.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: any;
+declare const _default: typeof __VLS_export;
+export default _default;