feat : add admin page for task configuration

Add admin page with tabs for managing task statuses, efforts, priorities and types, with CRUD drawers and color picker. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-09 23:39:15 +01:00
parent ac11690ad4
commit c7b1e62037
11 changed files with 853 additions and 2 deletions
--- a/frontend/components/TaskPriorityDrawer.vue
+++ b/frontend/components/TaskPriorityDrawer.vue
@@ -0,0 +1,97 @@
+<template>
+    <AppDrawer v-model="isOpen" :title="isEditing ? 'Modifier une priorité' : 'Ajouter une priorité'">
+        <form @submit.prevent="handleSubmit" class="flex flex-col gap-2">
+            <MalioInputText
+                v-model="form.label"
+                label="Libellé"
+                input-class="w-full"
+                :error="touched.label && !form.label.trim() ? 'Le libellé est requis' : ''"
+                @blur="touched.label = true"
+            />
+            <div class="mt-4">
+                <ColorPicker v-model="form.color" />
+            </div>
+
+            <div class="mt-6 flex justify-end">
+                <button
+                    type="submit"
+                    class="rounded-md bg-primary-500 px-6 py-2 text-sm font-semibold text-white hover:bg-secondary-500 disabled:cursor-not-allowed disabled:opacity-50"
+                    :disabled="isSubmitting"
+                >
+                    Enregistrer
+                </button>
+            </div>
+        </form>
+    </AppDrawer>
+</template>
+
+<script setup lang="ts">
+import type { TaskPriority, TaskPriorityWrite } from '~/services/dto/task-priority'
+import { useTaskPriorityService } from '~/services/task-priorities'
+
+const props = defineProps<{
+    modelValue: boolean
+    item: TaskPriority | null
+}>()
+
+const emit = defineEmits<{
+    (e: 'update:modelValue', value: boolean): void
+    (e: 'saved'): void
+}>()
+
+const isOpen = computed({
+    get: () => props.modelValue,
+    set: (v) => emit('update:modelValue', v),
+})
+
+const isEditing = computed(() => !!props.item)
+const isSubmitting = ref(false)
+
+const form = reactive({
+    label: '',
+    color: '#222783',
+})
+
+const touched = reactive({
+    label: false,
+})
+
+watch(() => props.modelValue, (open) => {
+    if (open) {
+        if (props.item) {
+            form.label = props.item.label ?? ''
+            form.color = props.item.color ?? '#222783'
+        } else {
+            form.label = ''
+            form.color = '#222783'
+        }
+        touched.label = false
+    }
+})
+
+const { create, update } = useTaskPriorityService()
+
+async function handleSubmit() {
+    touched.label = true
+    if (!form.label.trim()) return
+
+    isSubmitting.value = true
+    try {
+        const payload: TaskPriorityWrite = {
+            label: form.label.trim(),
+            color: form.color,
+        }
+
+        if (isEditing.value && props.item) {
+            await update(props.item.id, payload)
+        } else {
+            await create(payload)
+        }
+
+        emit('saved')
+        isOpen.value = false
+    } finally {
+        isSubmitting.value = false
+    }
+}
+</script>