chore: bump version to v0.0.35

| Numéro du ticket | Titre du ticket |
|------------------|-----------------|
|         315         |       Création d'une page d'administration : modification/création d'un utilisateur          |

## Description de la PR

## Modification du .env

## Check list

- [x] Pas de régression
- [ ] TU/TI/TF rédigée
- [x] TU/TI/TF OK
- [x] CHANGELOG modifié

Reviewed-on: #17
Reviewed-by: Autin <tristan@yuno.malio.fr>
Co-authored-by: kevin <kevin@yuno.malio.fr>
Co-committed-by: kevin <kevin@yuno.malio.fr>

.idea/workspace.xml

@@ -4,16 +4,11 @@
     <option name="autoReloadType" value="SELECTIVE" />
   </component>
   <component name="ChangeListManager">
-    <list default="true" id="7c107abe-5995-4428-8429-b146aaca8386" name="Changes" comment="feat : test auto-tag-develop.yml (auto incrément version)">
-      <change afterPath="$PROJECT_DIR$/frontend/composables/useAppVersion.ts" afterDir="false" />
+    <list default="true" id="7c107abe-5995-4428-8429-b146aaca8386" name="Changes" comment="fix : panel scrollable plus interface revue">
       <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/config/packages/security.yaml" beforeDir="false" afterPath="$PROJECT_DIR$/config/packages/security.yaml" afterDir="false" />
       <change beforePath="$PROJECT_DIR$/config/reference.php" beforeDir="false" afterPath="$PROJECT_DIR$/config/reference.php" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/frontend/app.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/app.vue" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/frontend/layouts/default.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/layouts/default.vue" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/frontend/pages/login.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/pages/login.vue" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/Dto/AppVersion.php" beforeDir="false" afterPath="$PROJECT_DIR$/src/ApiResource/AppVersion.php" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/State/AppVersionProvider.php" beforeDir="false" afterPath="$PROJECT_DIR$/src/State/AppVersionProvider.php" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/frontend/pages/admin/carrier/carrier-list.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/pages/admin/carrier/carrier-list.vue" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/frontend/pages/admin/supplier/supplier-list.vue" beforeDir="false" afterPath="$PROJECT_DIR$/frontend/pages/admin/supplier/supplier-list.vue" afterDir="false" />
     </list>
     <option name="SHOW_DIALOG" value="false" />
     <option name="HIGHLIGHT_CONFLICTS" value="true" />
@@ -225,43 +220,43 @@
     <option name="hideEmptyMiddlePackages" value="true" />
     <option name="showLibraryContents" value="true" />
   </component>
-  <component name="PropertiesComponent">{
-  &quot;keyToString&quot;: {
-    &quot;RunOnceActivity.MCP Project settings loaded&quot;: &quot;true&quot;,
-    &quot;RunOnceActivity.ShowReadmeOnStart&quot;: &quot;true&quot;,
-    &quot;RunOnceActivity.TerminalTabsStorage.copyFrom.TerminalArrangementManager.252&quot;: &quot;true&quot;,
-    &quot;RunOnceActivity.git.unshallow&quot;: &quot;true&quot;,
-    &quot;RunOnceActivity.typescript.service.memoryLimit.init&quot;: &quot;true&quot;,
-    &quot;git-widget-placeholder&quot;: &quot;develop&quot;,
-    &quot;last_opened_file_path&quot;: &quot;/home/sroy/Documents/test/Ferme&quot;,
-    &quot;node.js.detected.package.eslint&quot;: &quot;true&quot;,
-    &quot;node.js.detected.package.tslint&quot;: &quot;true&quot;,
-    &quot;node.js.selected.package.eslint&quot;: &quot;(autodetect)&quot;,
-    &quot;node.js.selected.package.tslint&quot;: &quot;(autodetect)&quot;,
-    &quot;nodejs_package_manager_path&quot;: &quot;npm&quot;,
-    &quot;settings.editor.selected.configurable&quot;: &quot;configurable.tailwindcss&quot;,
-    &quot;ts.external.directory.path&quot;: &quot;/opt/phpstorm/plugins/javascript-plugin/jsLanguageServicesImpl/external&quot;,
-    &quot;vue.rearranger.settings.migration&quot;: &quot;true&quot;
+  <component name="PropertiesComponent"><![CDATA[{
+  "keyToString": {
+    "RunOnceActivity.MCP Project settings loaded": "true",
+    "RunOnceActivity.ShowReadmeOnStart": "true",
+    "RunOnceActivity.TerminalTabsStorage.copyFrom.TerminalArrangementManager.252": "true",
+    "RunOnceActivity.git.unshallow": "true",
+    "RunOnceActivity.typescript.service.memoryLimit.init": "true",
+    "git-widget-placeholder": "feat/312-creation-d-une-page-d-administration-listing-des-fournisseurs",
+    "last_opened_file_path": "/home/sroy/Documents/test/Ferme",
+    "node.js.detected.package.eslint": "true",
+    "node.js.detected.package.tslint": "true",
+    "node.js.selected.package.eslint": "(autodetect)",
+    "node.js.selected.package.tslint": "(autodetect)",
+    "nodejs_package_manager_path": "npm",
+    "settings.editor.selected.configurable": "configurable.tailwindcss",
+    "ts.external.directory.path": "/opt/phpstorm/plugins/javascript-plugin/jsLanguageServicesImpl/external",
+    "vue.rearranger.settings.migration": "true"
   },
-  &quot;keyToStringList&quot;: {
-    &quot;DatabaseDriversLRU&quot;: [
-      &quot;postgresql&quot;
+  "keyToStringList": {
+    "DatabaseDriversLRU": [
+      "postgresql"
     ],
-    &quot;com.intellij.ide.scratch.ScratchImplUtil$2/New Scratch File&quot;: [
-      &quot;TEXT&quot;
+    "com.intellij.ide.scratch.ScratchImplUtil$2/New Scratch File": [
+      "TEXT"
     ],
-    &quot;vue.recent.templates&quot;: [
-      &quot;Vue Composition API Component&quot;
+    "vue.recent.templates": [
+      "Vue Composition API Component"
     ]
   }
-}</component>
+}]]></component>
   <component name="RecentsManager">
     <key name="MoveFile.RECENT_KEYS">
+      <recent name="\\wsl.localhost\Ubuntu-24.04\home\matte\Ferme\frontend\pages\admin\supplier" />
       <recent name="\\wsl.localhost\Ubuntu-24.04\home\m-tristan\workspace\Ferme" />
       <recent name="\\wsl.localhost\Ubuntu-24.04\home\tristan\workspace\ferme\templates" />
       <recent name="C:\Users\autin\AppData\Roaming\JetBrains\PhpStorm2025.3\scratches" />
       <recent name="C:\Users\autin\AppData\Roaming\JetBrains\PhpStorm2025.3\scratches\Ferme_MCD\MCD_DOC" />
-      <recent name="\\wsl.localhost\Ubuntu-24.04\home\tristan\workspace\ferme\frontend\pages\reception" />
     </key>
   </component>
   <component name="SharedIndexes">
@@ -302,14 +297,6 @@
       <workItem from="1770195959162" duration="18915000" />
       <workItem from="1770274844804" duration="3940000" />
     </task>
-    <task id="LOCAL-00009" summary="feat : ajout d'une gestion d'erreur au global côté front avec la lib toaster et I18n pour centraliser les messages d'erreur">
-      <option name="closed" value="true" />
-      <created>1768555180530</created>
-      <option name="number" value="00009" />
-      <option name="presentableId" value="LOCAL-00009" />
-      <option name="project" value="LOCAL" />
-      <updated>1768555180530</updated>
-    </task>
     <task id="LOCAL-00010" summary="feat : ajout de l'authentification avec lexik">
       <option name="closed" value="true" />
       <created>1768832208350</created>
@@ -694,7 +681,15 @@
       <option name="project" value="LOCAL" />
       <updated>1770371073055</updated>
     </task>
-    <option name="localTasksCounter" value="58" />
+    <task id="LOCAL-00058" summary="fix : nom page fournisseur">
+      <option name="closed" value="true" />
+      <created>1770632525875</created>
+      <option name="number" value="00058" />
+      <option name="presentableId" value="LOCAL-00058" />
+      <option name="project" value="LOCAL" />
+      <updated>1770632525875</updated>
+    </task>
+    <option name="localTasksCounter" value="59" />
     <servers />
   </component>
   <component name="TypeScriptGeneratedFilesManager">
@@ -744,7 +739,6 @@
     </option>
   </component>
   <component name="VcsManagerConfiguration">
-    <MESSAGE value="fix : gitea workflow" />
     <MESSAGE value="fix : script de déploiement" />
     <MESSAGE value="feat : ajout plus d'information sur la liste des réceptions côté front sur la page d'accueil" />
     <MESSAGE value="fix : redirige sur le login sur une 401 et reset du auth state + doc + timeout du toaster" />
@@ -769,7 +763,8 @@
     <MESSAGE value="feat : update numéro de version" />
     <MESSAGE value="fix : auto-tag-develop.yml" />
     <MESSAGE value="feat : test auto-tag-develop.yml (auto incrément version)" />
-    <option name="LAST_COMMIT_MESSAGE" value="feat : test auto-tag-develop.yml (auto incrément version)" />
+    <MESSAGE value="fix : nom page fournisseur" />
+    <option name="LAST_COMMIT_MESSAGE" value="fix : nom page fournisseur" />
   </component>
   <component name="XSLT-Support.FileAssociations.UIState">
     <expand />

CHANGELOG.md

@@ -29,6 +29,9 @@ Ajouter dans le fichier .env du frontend
 * Finalisation de la partie réception de marchandise
 * [#267] Lister les réceptions en attente
 * [#268] Lister les réceptions terminées
+* [#316] Admin liste des transporteurs
+* [#312] Creation administration listing fournisseurs
+* [#315] Creation page admin utilisateur
 
 ### Changed
 

config/version.yaml

@@ -1,2 +1,2 @@
 parameters:
-    app.version: '0.0.32'
+    app.version: '0.0.35'

frontend/components/user/user-form.vue

@@ -0,0 +1,123 @@
+<template>
+    <form @submit.prevent="validate">
+        <div
+            class="flex items-center justify-between gap-10">
+            <h1 class="text-3xl font-bold uppercase">
+                {{ userId ? "Modifications de l'utilisateur" : "Ajout d'un utilisateur" }}
+            </h1>
+            <button
+                class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
+                type="submit"
+            >
+                {{ userId ? 'Sauvegarder' : 'Ajouter' }}
+            </button>
+        </div>
+
+        <div class="grid gap-y-16 gap-x-40 mb-16">
+            <UiTextInput
+                id="user-name"
+                v-model="form.username"
+                label="Nom de l'utilisateur"
+            />
+
+            <UiSelect
+                id="user-role"
+                v-model="form.role"
+                label="Rôle de l'utilisateur"
+                :options="ROLE"
+            />
+            <UiTextInput
+                id="user-password"
+                v-model="form.password"
+                label="Mot de passe"
+                type="password"
+
+            />
+
+        </div>
+    </form>
+</template>
+
+<script setup lang="ts">
+
+import {computed, reactive, ref, watch} from 'vue'
+import {ROLE} from '~/utils/constants'
+import {createUser, updateUser, getUser} from '~/services/auth'
+import type {UserData, UserFormData} from '~/services/dto/user-data'
+
+const route = useRoute()
+const router = useRouter()
+const userId = computed(() => resolveUserId(route.params.id))
+const isLoading = ref(false)
+const isHydrating = ref(false)
+
+const resolveUserId = (param: unknown) => {
+    const idStr = Array.isArray(param) ? param[0] : param
+    if (!idStr) {
+        return null
+    }
+    const id = Number(idStr)
+    return Number.isFinite(id) ? id : null
+}
+
+
+const form = reactive<UserFormData>({
+    username: '',
+    password: '',
+    role: ''
+})
+
+const hydrateFromUser = (user: UserData | null) => {
+    if (!user) {
+        return
+    }
+    isHydrating.value = true
+    form.username = user.username ?? ''
+    const roles = user.roles ?? []
+    const hasAdmin = roles.includes("ROLE_ADMIN")
+    form.role = hasAdmin ? "ROLE_ADMIN" : "ROLE_USER"
+    form.password = ''
+    isHydrating.value = false
+}
+
+watch(
+    () => userId.value,
+    async (id) => {
+        if (id === null) {
+            return
+        }
+        isLoading.value = true
+        try {
+            const user = await getUser(id)
+            hydrateFromUser(user)
+        } finally {
+            isLoading.value = false
+        }
+    },
+    {immediate: true}
+)
+
+async function validate() {
+
+    const normalizedUsername = form.username.trim()
+    const normalizedRole = form.role.trim()
+    const normalizedPassword = form.password.trim()
+
+    const basePayload = {
+        username: normalizedUsername,
+        roles: normalizedRole ? [normalizedRole] : undefined,
+        password: normalizedPassword || undefined
+    }
+
+    if (userId.value) {
+        await updateUser(userId.value, basePayload)
+        await router.push(`/admin/user/list/`)
+        return
+    }
+
+    const created = await createUser(basePayload)
+    if (created) {
+        await router.push(`/admin/user/list/`)
+    }
+}
+</script>

frontend/i18n/locales/fr.json

@@ -57,7 +57,9 @@
         "auth": {
             "login": "Identifiants invalides.",
             "users": "Impossible de récupérer les utilisateurs.",
-            "logout": "Impossible de se déconnecter."
+            "logout": "Impossible de se déconnecter.",
+            "update": "Impossible de mettre à jour l'utilisateur.",
+            "create": "Impossible de créer l'utilisateur."
         }
     },
     "success": {
@@ -65,6 +67,8 @@
             "update": "Réception mise à jour avec succès."
         },
         "auth": {
+            "update": "Utilisateur mis à jour avec succès.",
+            "create": "Utilisateur créé avec succès.",
             "login": "Connexion réussie.",
             "logout": "Déconnexion réussie."
         }

frontend/layouts/admin.vue

@@ -21,16 +21,19 @@
         </header>
 
         <div class="grid grid-cols-[16rem,1fr] h-[calc(100vh-85px)] min-h-0">
-            <aside class="bg-primary-500 text-white min-h-0 grid grid-rows-[auto,1fr,auto]">
-                <div class="p-4 font-semibold">Tableau de bord</div>
-
-                <div class="overflow-y-auto min-h-0 p-4 space-y-3">
+            <aside class="bg-primary-500 text-white min-h-0 flex flex-col justify-between">
+                <div class="flex flex-col gap-4 p-4 font-bold text-xl">
                     <!-- Liste des liens à ajouter ci-dessous -->
-                    <!--Button pour afficher le component admin-users -->
-                    <NuxtLink
-                        to="/admin/user-list"
-                        class="block px-4 py-2 rounded hover:bg-primary-600 transition"
-                    >
+                    <NuxtLink to="/admin/dashboard">
+                        Tableau de bord
+                    </NuxtLink>
+                    <NuxtLink to="/admin/supplier/supplier-list">
+                        Fournisseur
+                    </NuxtLink>
+                    <NuxtLink to="/admin/carrier/carrier-list">
+                        Transporteur
+                    </NuxtLink>
+                    <NuxtLink to="/admin/user/list">
                         Utilisateurs
                     </NuxtLink>
                 </div>
@@ -44,7 +47,6 @@
                         Déconnexion
                     </button>
                 </div>
-
             </aside>
 
             <main class="min-h-0 overflow-auto px-12 py-12 ">
@@ -58,8 +60,9 @@
 
 
 <script setup lang="ts">
-import auth from "~/layouts/auth.vue";
+import {useAuthStore} from '~/stores/auth'
 
+const auth = useAuthStore()
 const { version } = useAppVersion()
 const handleLogout = async () => {
     try {

frontend/layouts/default.vue

@@ -20,7 +20,10 @@
                             Accueil
                         </a>
                     </NuxtLink>
-                    <NuxtLink to="/admin/dashboard" custom v-slot="{ href, navigate, isActive }">
+                    <NuxtLink
+                        to="/admin/dashboard" custom v-slot="{ href, navigate, isActive }"
+                        v-if="auth.isAdmin"
+                    >
                         <a
                             :href="href"
                             @click="navigate"
@@ -107,27 +110,27 @@
 </template>
 
 <script setup lang="ts">
-import { useAuthStore } from '~/stores/auth'
+import {useAuthStore} from '~/stores/auth'
 
 const route = useRoute()
 const auth = useAuthStore()
 const isMenuOpen = ref(false)
-const { version } = useAppVersion()
+const {version} = useAppVersion()
 
 const closeMenu = () => {
-  isMenuOpen.value = false
+    isMenuOpen.value = false
 }
 
 const toggleMenu = () => {
-  isMenuOpen.value = !isMenuOpen.value
+    isMenuOpen.value = !isMenuOpen.value
 }
 
 const handleLogout = async () => {
-  try {
-    await auth.logout()
-  } finally {
-    closeMenu()
-    await navigateTo('/login')
-  }
+    try {
+        await auth.logout()
+    } finally {
+        closeMenu()
+        await navigateTo('/login')
+    }
 }
 </script>

frontend/pages/admin/carrier/carrier-list.vue

@@ -0,0 +1,51 @@
+<template>
+
+    <div class="flex items-center justify-between ">
+            <h1 class="text-3xl font-bold uppercase">listes des transporteurs</h1>
+            <button
+                @Click="goToCarrier()"
+                class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px] "
+            >Ajouter
+            </button>
+    </div>
+
+        <div class="mt-6 border border-slate-200 mb-16 ">
+            <div class="grid grid-cols-2 gap-4 bg-slate-100 px-4 py-3 text-sm font-semibold uppercase tracking-wide">
+                <div>Label</div>
+                <div>Code</div>
+            </div>
+            <div
+                v-for="carrier in carrierList"
+                :key="carrier.id"
+                class="grid grid-cols-2 gap-4 px-4 py-3 text-sm hover:bg-slate-50 cursor-pointer border-t border-slate-200"
+                role="button"
+                tabindex="0"
+                @click="goToCarrier(carrier.id)"
+                @keydown.enter="goToCarrier(carrier.id)"
+            >
+                <div>{{ carrier.name}}</div>
+                <div>{{ carrier.code }}</div>
+            </div>
+        </div>
+
+</template>
+
+<script setup lang="ts">
+import type {CarrierData} from "~/services/dto/carrier-data";
+import {getCarrierList} from "~/services/carrier";
+
+const carrierList = ref<CarrierData[]>()
+const router = useRouter()
+
+const goToCarrier = (id: number|null = null) => {
+    id !== null ? router.push(`/admin/carrier/${id}`) : router.push(`/admin/carrier`)
+}
+
+definePageMeta({
+    layout: 'admin'
+})
+
+onMounted(async () => {
+    carrierList.value = await getCarrierList(false)
+})
+</script>

frontend/pages/admin/dashboard.vue

@@ -1,13 +1,9 @@
 <template>
-    <admin-users v-if="activeCode === 'users'" />
+    <AdminUserForm/>
 </template>
 
 <script setup lang="ts">
 definePageMeta({
     layout: 'admin'
 })
-const route = useRoute()
-
-const activeCode = computed(() => (route.query.code as string))
-
 </script>

frontend/pages/admin/supplier/supplier-list.vue

@@ -0,0 +1,74 @@
+<template>
+    <div class="flex items-center justify-between">
+        <h1 class="text-3xl font-bold uppercase"> Fournisseurs </h1>
+        <NuxtLink to="/admin/supplier"
+                  class="flex items-center justify-center text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
+        >
+            Ajouter
+        </NuxtLink>
+    </div>
+    <div class="mt-6 border border-slate-200 mb-16">
+        <div class="max-h-96 overflow-y-auto">
+            <div
+                class="sticky top-0 z-10 grid grid-cols-6 gap-4 bg-slate-100 px-4 py-3 text-sm font-semibold uppercase tracking-wide"
+            >
+                <div>Nom</div>
+                <div>Mail</div>
+                <div>Rue</div>
+                <div>Complément</div>
+                <div>Code Postal</div>
+                <div>Ville</div>
+            </div>
+
+            <div v-for="supplier in supplierList" :key="supplier.id">
+                <template v-if="supplier.addresses?.length">
+                    <div
+                        v-for="addr in supplier.addresses"
+                        :key="addr.id"
+                        class="grid grid-cols-6 hover:bg-slate-50 border-t gap-4 px-4 py-2"
+                        @click="goToSupplier(supplier.id)"
+                    >
+                        <div class="truncate">
+                            {{ supplier.name }}
+                        </div>
+                        <div class="truncate">
+                            {{ supplier.email }}
+                        </div>
+                        <div class="truncate">
+                            {{ addr.street }}
+                        </div>
+                        <div class="truncate">
+                            {{ addr.street2 }}
+                        </div>
+                        <div>{{ addr.postalCode }}</div>
+                        <div class="uppercase truncate">
+                            {{ addr.city }}
+                        </div>
+                    </div>
+                </template>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+import type {SupplierData} from "~/services/dto/supplier-data"
+import {getSupplierList} from "~/services/supplier"
+
+definePageMeta({layout: "admin"})
+
+const supplierList = ref<SupplierData[]>([])
+const router = useRouter()
+
+
+const goToSupplier = (id: number) => {
+    router.push(`/admin/supplier/${id}`)
+}
+
+onMounted(async () => {
+    supplierList.value = (await getSupplierList(false)) ?? []
+})
+
+</script>
+
+

frontend/pages/admin/user/[[id]].vue

@@ -0,0 +1,8 @@
+<template>
+    <UserForm/>
+</template>
+<script setup lang="ts">
+definePageMeta({
+    layout: 'admin'
+})
+</script>

frontend/pages/admin/user/list.vue

@@ -1,12 +1,13 @@
 <template>
-    <div class="flex items-center justify-between gap-10">
-        <h1 class="text-3xl font-bold uppercase">Utilisateurs</h1>
-        <button
-            class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
-            @click="null"
+    <div class="flex items-center justify-between">
+        <h1 class="text-3xl font-bold uppercase">Liste des utilisateurs</h1>
+        <NuxtLink
+            class="flex items-center justify-center text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
+            @click="router.push('/admin/user/')"
         >
             Ajouter
-        </button>
+        </NuxtLink>
+
     </div>
 
     <div>
@@ -14,51 +15,43 @@
             <div class="grid grid-cols-3 gap-4 bg-slate-100 px-4 py-3 text-sm font-semibold uppercase tracking-wide">
                 <div>Username</div>
                 <div>Role</div>
-                <div>Action</div>
             </div>
             <div
                 v-for="user in userList"
                 :key="user.id"
-                class="grid grid-cols-3 gap-4 px-4 py-3 text-sm hover:bg-slate-50 cursor-pointer border-t border-slate-200 items-center"
+                class="grid grid-cols-3 gap-4 px-4 py-3 text-sm hover:bg-slate-50 cursor-pointer border-t items-center"
                 role="button"
                 tabindex="0"
+                @click="goToUser(user.id)"
             >
                 <div>
-                    {{ user.username}}
+                    {{ user.username }}
                 </div>
                 <div>
                     {{ user.roles?.join(', ') || ' ---' }}
                 </div>
-                <div>
-                    <div class="p-4">
-                        <button
-                            class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
-                            @click="null"
-                        >
-                            Modifier
-                        </button>
-                    </div>
-                </div>
             </div>
         </div>
     </div>
 </template>
 
 
-
-
 <script setup lang="ts">
 definePageMeta({
     layout: 'admin'
 })
 
 import type {UserData} from "~/services/dto/user-data";
-import {getUsers} from "~/services/auth";
+import {getAdminUsers, getUsers} from "~/services/auth";
 
 const userList = ref<UserData[]>([])
+const router = useRouter()
 
+const goToUser = (id: number) => {
+    router.push(`/admin/user/${id}`)
+}
 
 onMounted(async () => {
-    userList.value = await getUsers()
+    userList.value = await getAdminUsers()
 })
 </script>

frontend/services/auth.ts

@@ -1,5 +1,6 @@
 import { useApi } from '~/composables/useApi'
 import type { UserData } from '~/services/dto/user-data'
+import type {UserPayload} from "~/services/dto/user-data";
 
 export async function getUsers() {
   const api = useApi()
@@ -12,7 +13,40 @@ export async function getUsers() {
 
   return data['hydra:member'] ?? []
 }
+export async function getAdminUsers() {
+  const api = useApi()
+  const data = await api.get<UserData[] | { 'hydra:member': UserData[] }>('admin/users', {}, {
+    toastErrorKey: 'errors.auth.users'
+  })
+  if (Array.isArray(data)) {
+    return data
+  }
 
+  return data['hydra:member'] ?? []
+}
+
+export async function getUser(id: number) {
+  const api = useApi()
+  return api.get<UserData>(`users/${id}`, {}, {
+    toastErrorKey: 'errors.auth.user'
+  })
+}
+
+export async function createUser(payload: UserPayload = {}) {
+    const api = useApi()
+    return api.post<UserData>('users', payload, {
+        toastErrorKey: 'errors.auth.create',
+        toastSuccessKey : 'success.auth.create'
+    })
+}
+
+export async function updateUser(id : number, playload: UserPayload = {}){
+    const api = useApi()
+    return api.patch<UserData>(`users/${id}`, playload, {
+        toastErrorKey: 'errors.auth.update',
+        toastSuccessKey: 'success.auth.update'
+    })
+}
 export async function getCurrentUser() {
   const api = useApi()
   return api.get<UserData>('me', {}, {

frontend/services/dto/user-data.ts

@@ -1,5 +1,17 @@
 export interface UserData {
   id: number
   username: string
+  roles: string[]
+}
+
+export type UserPayload = {
+  username?: string
+  password?: string
   roles?: string[]
 }
+
+export type UserFormData = {
+    username: string
+    password: string
+    role: string
+}

frontend/stores/auth.ts

@@ -1,63 +1,80 @@
-import { defineStore } from 'pinia'
-import type { UserData } from '~/services/dto/user-data'
-import { getCurrentUser, login, logout } from '~/services/auth'
+import {defineStore} from 'pinia'
+import type {UserData} from '~/services/dto/user-data'
+import {getCurrentUser, createUser, login, logout} from '~/services/auth'
+import type {UserPayload} from "~/services/dto/user-data";
+import {ROLE} from '~/utils/constants'
 
 export const useAuthStore = defineStore('auth', {
-  state: () => ({
-    user: null as UserData | null,
-    isLoading: false,
-    checked: false
-  }),
-  getters: {
-    isAuthenticated: (state) => Boolean(state.user)
-  },
-  actions: {
-    clearSession() {
-      this.user = null
-      this.checked = true
-      this.isLoading = false
+    state: () => ({
+        user: null as UserData | null,
+        isLoading: false,
+        checked: false
+    }),
+    getters: {
+        isAuthenticated: (state) => Boolean(state.user),
+        isAdmin: (state) => Boolean(state.user?.roles?.includes(ROLE[0].value))
     },
-    async ensureSession() {
-      if (this.checked) {
-        return this.user
-      }
+    actions: {
+        clearSession() {
+            this.user = null
+            this.checked = true
+            this.isLoading = false
+        },
+        async ensureSession() {
+            if (this.checked) {
+                return this.user
+            }
 
-      this.checked = true
+            this.checked = true
 
-      try {
-        const me = await getCurrentUser()
-        this.user = me
-        return me
-      } catch {
-        this.user = null
-        return null
-      }
-    },
-    async login(username: string, password: string) {
-      this.isLoading = true
+            try {
+                const me = await getCurrentUser()
+                this.user = me
+                return me
+            } catch {
+                this.user = null
+                return null
+            }
+        },
+        async login(username: string, password: string) {
+            this.isLoading = true
 
-      try {
-        await login(username, password)
-        const me = await getCurrentUser()
-        this.user = me
-        this.checked = true
-        return me
-      } finally {
-        this.isLoading = false
-      }
-    },
-    async logout() {
-      this.isLoading = true
+            try {
+                await login(username, password)
+                const me = await getCurrentUser()
+                this.user = me
+                this.checked = true
+                return me
+            } finally {
+                this.isLoading = false
+            }
+        },
+        async createUser(payload: UserPayload = {}) {
+            this.isLoading = true
+            const result = await createUser(payload).finally(() => {
+                this.isLoading = false
+            })
+            return result
+        },
+        async updateUser(id: number, payload: UserPayload) {
+            this.isLoading = true
+            const result = await createUser(payload).finally(() => {
+                this.isLoading = false
+            })
+            return result
+        },
+        async logout() {
+            this.isLoading = true
 
-      try {
-        await logout()
-      } catch {
-        // Ignore logout errors so we can still clear local auth state.
-      } finally {
-        this.user = null
-        this.checked = true
-        this.isLoading = false
-      }
+            try {
+                await logout()
+            } catch {
+                // Ignore logout errors so we can still clear local auth state.
+            } finally {
+                this.user = null
+                this.checked = true
+                this.isLoading = false
+            }
+        },
     }
-  }
 })

frontend/utils/constants.ts

@@ -8,6 +8,10 @@ export const MERCHANDISE_TYPE_CODES = {
     AUTRES: 'AUTRES'
 } as const
 
+export const ROLE = [
+    { label: 'Administrateur', value: 'ROLE_ADMIN' },
+    { label: 'Utilisateur', value: 'ROLE_USER' }
+]
 export const SUPLLIER_CODE = {
     LIOT: 'LIOT'
 }

src/Entity/User.php

@@ -7,7 +7,10 @@ namespace App\Entity;
 use ApiPlatform\Metadata\ApiResource;
 use ApiPlatform\Metadata\Get;
 use ApiPlatform\Metadata\GetCollection;
+use ApiPlatform\Metadata\Patch;
+use ApiPlatform\Metadata\Post;
 use App\State\MeProvider;
+use App\State\UserPasswordProcessor;
 use Doctrine\ORM\Mapping as ORM;
 use Symfony\Component\Security\Core\User\PasswordAuthenticatedUserInterface;
 use Symfony\Component\Security\Core\User\UserInterface;
@@ -28,10 +31,27 @@ use Symfony\Component\Serializer\Attribute\Groups;
             normalizationContext: ['groups' => ['user:read']],
             security: "is_granted('ROLE_USER')"
         ),
-        new GetCollection(
+        new Post(
             normalizationContext: ['groups' => ['user:read']],
+            denormalizationContext: ['groups' => ['user:write']],
+            security: "is_granted('ROLE_ADMIN')",
+            processor: UserPasswordProcessor::class
+        ),
+        new Patch(
+            normalizationContext: ['groups' => ['user:read']],
+            denormalizationContext: ['groups' => ['user:write']],
+            security: "is_granted('ROLE_ADMIN')",
+            processor: UserPasswordProcessor::class
+        ),
+        new GetCollection(
+            normalizationContext: ['groups' => ['user-login:read']],
             security: "is_granted('PUBLIC_ACCESS')"
         ),
+        new GetCollection(
+            uriTemplate: '/admin/users',
+            normalizationContext: ['groups' => ['user:read']],
+            security: "is_granted('ROLE_ADMIN')"
+        ),
     ],
     normalizationContext: ['groups' => ['user:read']],
     paginationEnabled: false
@@ -41,18 +61,19 @@ class User implements UserInterface, PasswordAuthenticatedUserInterface
     #[ORM\Id]
     #[ORM\GeneratedValue]
     #[ORM\Column(type: 'integer')]
-    #[Groups(['user:read', 'reception:read'])]
+    #[Groups(['user:read', 'user-login:read', 'reception:read'])]
     private ?int $id = null;
 
     #[ORM\Column(length: 180, unique: true)]
-    #[Groups(['user:read', 'reception:read'])]
+    #[Groups(['user:read', 'user:write', 'user-login:read', 'reception:read'])]
     private string $username = '';
 
     #[ORM\Column(type: 'json')]
-    #[Groups(['user:read'])]
+    #[Groups(['user:write', 'user:read'])]
     private array $roles = [];
 
     #[ORM\Column]
+    #[Groups(['user:write'])]
     private string $password = '';
 
     public function getId(): ?int

src/State/UserPasswordProcessor.php

@@ -0,0 +1,40 @@
+<?php
+
+declare(strict_types=1);
+
+namespace App\State;
+
+use ApiPlatform\Metadata\Operation;
+use ApiPlatform\State\ProcessorInterface;
+use App\Entity\User;
+use Symfony\Component\DependencyInjection\Attribute\Autowire;
+use Symfony\Component\PasswordHasher\Hasher\UserPasswordHasherInterface;
+
+final class UserPasswordProcessor implements ProcessorInterface
+{
+    public function __construct(
+        private readonly UserPasswordHasherInterface $hasher,
+        #[Autowire(service: 'api_platform.doctrine.orm.state.persist_processor')]
+        private readonly ProcessorInterface $persistProcessor
+    ) {}
+
+    public function process(mixed $data, Operation $operation, array $uriVariables = [], array $context = []): mixed
+    {
+        if ($data instanceof User) {
+            $plain = $data->getPassword();
+            if ('' !== $plain) {
+                $data->setPassword($this->hasher->hashPassword(
+                    $data,
+                    $plain
+                ));
+            }
+        }
+
+        return $this->persistProcessor->process(
+            $data,
+            $operation,
+            $uriVariables,
+            $context
+        );
+    }
+}