Merge branch 'develop' into fix/-style-global

# Conflicts:
#	.idea/workspace.xml
#	frontend/layouts/default.vue

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

@@ -46,7 +46,11 @@
             "list": "Impossible de récupérer la liste des races de bovins."
         },
         "carrier": {
-            "list": "Impossible de récupérer la liste des transporteurs."
+            "list": "Impossible de récupérer la liste des transporteurs.",
+            "fetch": "Impossible de récupérer les données du transporteur",
+            "update": "Impossible de mettre à jour le transporteur",
+            "create": "Impossible de créer le transporteur"
+
         },
         "driver": {
             "list": "Impossible de récupérer la liste des chauffeurs."
@@ -57,7 +61,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,8 +71,14 @@
             "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."
+        },
+        "carrier": {
+            "update": "Transporteur mis à jour",
+            "create": "Transporteur créé"
         }
     }
 }

frontend/layouts/admin.vue

@@ -21,15 +21,25 @@
         </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 -->
-
+                    <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>
 
                 <div class="p-4">
+                        <p class="font-bold text-white text-left">v{{ version }}</p>
                     <button
                         @click="handleLogout"
                         class="w-full bg-red-600 hover:bg-red-700 py-2 rounded font-bold"
@@ -50,7 +60,10 @@
 
 
 <script setup lang="ts">
+import {useAuthStore} from '~/stores/auth'
 
+const auth = useAuthStore()
+const { version } = useAppVersion()
 const handleLogout = async () => {
     try {
         await auth.logout()

frontend/layouts/default.vue

@@ -108,27 +108,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/[[id]].vue

@@ -0,0 +1,101 @@
+
+<template>
+    <form @submit.prevent="validate">
+    <div class="flex items-center justify-between ">
+        <h1 class="text-3xl font-bold uppercase">
+            {{ route.params.id ? 'Modifier transporteur' : 'Ajout transporteur' }}
+        </h1>
+
+        <button
+            type="submit"
+            class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px] justify-self-end"
+        >Enregistrer
+        </button>
+    </div>
+
+    <div class="grid grid-cols-2 items-start gap-y-8 gap-x-40 mb-16">
+
+        <UiTextInput
+            label = "nom du fournisseur"
+            id="carrier-name"
+            v-model="form.name"
+        />
+
+        <UiTextInput
+                label = "code fournisseur"
+                id="code-id"
+                v-model="form.code"
+        />
+    </div>
+    </form>
+
+</template>
+
+<script setup lang="ts">
+import {createCarrier, getCarrier, updateCarrier} from "~/services/carrier";
+import type {CarrierData, CarrierFormData} from "~/services/dto/carrier-data";
+const router = useRouter()
+const route = useRoute()
+const idCarrier = Number(route.params.id)
+const isLoading = ref(false)
+const isHydrating = ref(false)
+
+const form = reactive<CarrierFormData>({
+    code:'',
+    name:''
+})
+
+definePageMeta({
+    layout: 'admin'
+})
+
+const hydrateFromUser = (carrier: CarrierData | null) => {
+    if (!carrier) {
+        return
+    }
+    isHydrating.value = true
+    form.name = carrier.name ?? ''
+    form.code = carrier.code ?? ''
+    isHydrating.value = false
+}
+
+watch(
+    () => idCarrier,
+    async (id) => {
+        if (id === null) {
+            return
+        }
+        isLoading.value = true
+        try {
+            const user = await getCarrier(id)
+            hydrateFromUser(user)
+        } finally {
+            isLoading.value = false
+        }
+    },
+    {immediate: true}
+)
+async function validate() {
+
+    const normalizedCarrierCode = form.code.trim()
+    const normalizedCarrierName = form.name.trim()
+
+    const basePayload = {
+        name: normalizedCarrierName,
+        code: normalizedCarrierCode
+
+    }
+
+    if(idCarrier){
+        await updateCarrier(idCarrier, basePayload)
+        navigate()
+        return
+    }
+    await createCarrier(basePayload)
+    navigate()
+}
+
+function navigate(){
+    router.push("/admin/carrier/carrier-list")
+}
+</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>
+            <NuxtLink
+                to="/admin/carrier"
+                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="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) => {
+    router.push(`/admin/carrier/${id}`)
+}
+
+definePageMeta({
+    layout: 'admin'
+})
+
+onMounted(async () => {
+    carrierList.value = await getCarrierList(false)
+})
+</script>

frontend/pages/admin/dashboard.vue

@@ -1,13 +1,9 @@
+<template>
+    <AdminUserForm/>
+</template>
+
 <script setup lang="ts">
 definePageMeta({
     layout: 'admin'
 })
 </script>
-
-<template>
-<h1>test</h1>
-</template>
-
-<style scoped>
-
-</style>

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

@@ -0,0 +1,57 @@
+<template>
+    <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
+        </NuxtLink>
+
+    </div>
+
+    <div>
+        <div class="mt-6 border border-slate-200 mb-16 ">
+            <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>
+            <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 items-center"
+                role="button"
+                tabindex="0"
+                @click="goToUser(user.id)"
+            >
+                <div>
+                    {{ user.username }}
+                </div>
+                <div>
+                    {{ user.roles?.join(', ') || ' ---' }}
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+
+<script setup lang="ts">
+definePageMeta({
+    layout: 'admin'
+})
+
+import type {UserData} from "~/services/dto/user-data";
+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 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/carrier.ts

@@ -1,5 +1,5 @@
 import { useApi } from '~/composables/useApi'
-import type { CarrierData } from '~/services/dto/carrier-data'
+import type {CarrierData, CarrierPayload} from "~/services/dto/carrier-data";
 
 export type CarrierListResponse =
     | CarrierData[]
@@ -21,3 +21,26 @@ export async function getCarrierList(): Promise<CarrierData[]> {
 
     return []
 }
+
+export async function getCarrier(id: number) {
+    const api = useApi()
+    return api.get<CarrierData>(`carriers/${id}`, {}, {
+        toastErrorKey: 'errors.carrier.fetch'
+    })
+}
+
+export async function updateCarrier(id: number, payload: CarrierPayload) {
+    const api = useApi()
+    return api.patch<CarrierData>(`carriers/${id}`, payload, {
+        toastErrorKey: 'errors.carrier.update',
+        toastSuccessKey: 'success.carrier.update'
+    })
+}
+
+export async function createCarrier(payload: CarrierPayload = {}) {
+    const api = useApi()
+    return api.post<CarrierData>('carriers', payload, {
+        toastErrorKey: 'errors.carrier.create',
+        toastSuccessKey: 'success.carrier.update'
+    })
+}

frontend/services/dto/carrier-data.ts

@@ -3,3 +3,13 @@ export interface CarrierData {
     name: string
     code: string
 }
+
+export interface CarrierFormData {
+    name: string
+    code: string
+}
+
+export type CarrierPayload = {
+    name?: string | null
+    code?: string
+}

frontend/services/dto/user-data.ts

@@ -1,4 +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'
 }