feat : add role guest

frontend/components/workflow/workflow-waiting-list.vue

@@ -18,7 +18,8 @@
             <div
                 v-for="item in items"
                 :key="item.id"
-                class="grid gap-4 px-4 py-3 text-sm hover:bg-slate-50 cursor-pointer border-t border-slate-200"
+                class="grid gap-4 px-4 py-3 text-sm border-t border-slate-200"
+                :class="canOpenItems ? 'hover:bg-slate-50 cursor-pointer' : ''"
                 :style="{ gridTemplateColumns: gridCols }"
                 role="button"
                 tabindex="0"
@@ -50,8 +51,10 @@ const props = withDefaults(defineProps<{
     items: any[]
     routePrefix: string
     showActions?: boolean
+    canOpenItems?: boolean
 }>(), {
-    showActions: false
+    showActions: false,
+    canOpenItems: true
 })
 
 const router = useRouter()
@@ -62,6 +65,9 @@ const gridCols = computed(() => {
 })
 
 const goToItem = (id: number) => {
+    if (!props.canOpenItems) {
+        return
+    }
     router.push(`${props.routePrefix}/${id}`)
 }
 

frontend/middleware/auth.global.ts

@@ -2,6 +2,13 @@ import { useAuthStore } from '~/stores/auth'
 
 export default defineNuxtRouteMiddleware(async (to) => {
   const auth = useAuthStore()
+  const guestAllowedPaths = [
+    '/',
+    '/reception/waiting-reception',
+    '/reception/finish-reception',
+    '/shipment/waiting-shipment',
+    '/shipment/finish-shipment'
+  ]
 
   if (to.path === '/login') {
     return
@@ -14,4 +21,8 @@ export default defineNuxtRouteMiddleware(async (to) => {
   if (!auth.isAuthenticated) {
     return navigateTo('/login')
   }
+
+  if (auth.isGuest && !guestAllowedPaths.includes(to.path)) {
+    return navigateTo('/')
+  }
 })

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

@@ -96,8 +96,7 @@ const hydrateFromUser = (user: UserData | null) => {
     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.role = ROLE.find((role) => roles.includes(role.value))?.value ?? 'ROLE_USER'
     form.password = ''
     isHydrating.value = false
 }

frontend/pages/index.vue

@@ -1,10 +1,13 @@
 <script setup lang="ts">
+import { useAuthStore } from '~/stores/auth'
+
+const auth = useAuthStore()
 </script>
 <template>
     <div class="flex flex-wrap justify-center pb-16 gap-12">
-        <card-link label="NOUVELLE RÉCEPTION" link="/reception" iconName="mdi:truck-outline" />
-        <card-link label="NOUVELLE EXPÉDITION" link="/shipment" iconName="mdi:truck-fast-outline" />
-        <card-link label="PLAN DE SITE" link="/infrastructure/building" iconName="material-symbols:warehouse-outline-rounded" />
+        <card-link v-if="auth.canUseWorkflow" label="NOUVELLE RÉCEPTION" link="/reception" iconName="mdi:truck-outline" />
+        <card-link v-if="auth.canUseWorkflow" label="NOUVELLE EXPÉDITION" link="/shipment" iconName="mdi:truck-fast-outline" />
+        <card-link v-if="auth.canUseWorkflow" label="PLAN DE SITE" link="/infrastructure/building" iconName="material-symbols:warehouse-outline-rounded" />
         <card-link link="/reception/waiting-reception" iconName="mdi:truck-remove-outline">
             <template #label>
                 Réceptions<br>EN ATTENTE
@@ -15,10 +18,10 @@
                 EXPÉDITIONS<br>EN ATTENTE
             </template>
         </card-link>
-        <card-link label="CASES" link="/infrastructure/case" iconName="material-symbols:bottom-sheets-outline" />
+        <card-link v-if="auth.canUseWorkflow" label="CASES" link="/infrastructure/case" iconName="material-symbols:bottom-sheets-outline" />
         <card-link label="RÉCEPTIONS FINIES" link="/reception/finish-reception" iconName="mdi:truck-check-outline" />
         <card-link label="EXPÉDITIONS FINIES" link="/shipment/finish-shipment" iconName="mdi:truck-delivery-outline" />
-        <card-link link="/" iconName="mdi:cow">
+        <card-link v-if="auth.canUseWorkflow" link="/" iconName="mdi:cow">
             <template #label>
                 PASSEPORT<br>DU BOVIN
             </template>

frontend/pages/reception/finish-reception.vue

@@ -17,7 +17,8 @@
             <div
                 v-for="reception in receptionList"
                 :key="reception.id"
-                class="grid grid-cols-6 gap-4 px-4 py-3 text-sm hover:bg-slate-50 cursor-pointer border-t border-slate-200"
+                class="grid grid-cols-6 gap-4 px-4 py-3 text-sm border-t border-slate-200"
+                :class="auth.canUseWorkflow ? 'hover:bg-slate-50 cursor-pointer' : ''"
                 role="button"
                 tabindex="0"
                 @click="goToReception(reception.id)"
@@ -36,10 +37,11 @@
 <script setup lang="ts">
 import type {ReceptionData} from "~/services/dto/reception-data";
 import {getReceptionList} from "~/services/reception";
-import type {ShipmentData} from "~/services/dto/shipment-data";
+import { useAuthStore } from '~/stores/auth'
 
 const receptionList = ref<ReceptionData[]>()
 const router = useRouter()
+const auth = useAuthStore()
 
 const formatDate = (date: string | null) => {
     if (!date) return '—'
@@ -66,6 +68,7 @@ const formatWeighing = (reception: ReceptionData) => {
 }
 
 const goToReception = (id: number) => {
+    if (!auth.canUseWorkflow) return
     router.push(`/reception/update/${id}`)
 }
 

frontend/pages/reception/waiting-reception.vue

@@ -4,7 +4,8 @@
         :columns="columns"
         :items="receptionList ?? []"
         route-prefix="/reception"
-        show-actions
+        :show-actions="auth.canUseWorkflow"
+        :can-open-items="auth.canUseWorkflow"
     >
         <template #cell-receptionDate="{ item }">
             {{ formatDate(item.receptionDate) }}
@@ -23,6 +24,9 @@
 <script setup lang="ts">
 import type { ReceptionData } from '~/services/dto/reception-data'
 import { getReceptionList, deleteReception } from '~/services/reception'
+import { useAuthStore } from '~/stores/auth'
+
+const auth = useAuthStore()
 
 const columns = [
     { key: 'receptionDate', label: 'Date et heure' },

frontend/pages/shipment/finish-shipment.vue

@@ -18,7 +18,8 @@
                 v-for="shipment in shipmentList"
                 :key="shipment
                .id"
-                class="grid grid-cols-6 gap-4 px-4 py-3 text-sm hover:bg-slate-50 cursor-pointer border-t border-slate-200"
+                class="grid grid-cols-6 gap-4 px-4 py-3 text-sm border-t border-slate-200"
+                :class="auth.canUseWorkflow ? 'hover:bg-slate-50 cursor-pointer' : ''"
                 role="button"
                 tabindex="0"
                 @click="goShipment(shipment.id)"
@@ -47,9 +48,11 @@
 <script setup lang="ts">
 import type {ShipmentData} from "~/services/dto/shipment-data";
 import {getShipmentList} from "~/services/shipment";
+import { useAuthStore } from '~/stores/auth'
 
 const shipmentList = ref<ShipmentData[]>()
 const router = useRouter()
+const auth = useAuthStore()
 
 const formatWeighing = (shipment: ShipmentData) => {
     const gross = shipment.weights?.find((weight) => weight.type === 'gross')?.weight
@@ -76,6 +79,7 @@ const formatShipmentLines = (shipment: ShipmentData) => {
 }
 
 const goShipment = (id: number) => {
+    if (!auth.canUseWorkflow) return
     router.push(`/shipment/update/${id}`)
 }
 

frontend/pages/shipment/waiting-shipment.vue

@@ -4,7 +4,8 @@
         :columns="columns"
         :items="shipmentList ?? []"
         route-prefix="/shipment"
-        show-actions
+        :show-actions="auth.canUseWorkflow"
+        :can-open-items="auth.canUseWorkflow"
     >
         <template #cell-shipmentDate="{ item }">
             {{ formatDate(item.shipmentDate) }}
@@ -35,6 +36,9 @@
 <script setup lang="ts">
 import type { ShipmentData } from '~/services/dto/shipment-data'
 import { getShipmentList, deleteShipment } from '~/services/shipment'
+import { useAuthStore } from '~/stores/auth'
+
+const auth = useAuthStore()
 
 const columns = [
     { key: 'shipmentDate', label: 'Date et heure' },

frontend/stores/auth.ts

@@ -12,7 +12,12 @@ export const useAuthStore = defineStore('auth', {
     }),
     getters: {
         isAuthenticated: (state) => Boolean(state.user),
-        isAdmin: (state) => Boolean(state.user?.roles?.includes(ROLE[0].value))
+        isAdmin: (state) => Boolean(state.user?.roles?.includes(ROLE[0].value)),
+        isGuest: (state) => Boolean(state.user?.roles?.includes('ROLE_GUEST')),
+        canUseWorkflow: (state) => Boolean(
+            state.user?.roles?.includes(ROLE[0].value) ||
+            state.user?.roles?.includes('ROLE_USER')
+        )
     },
     actions: {
         clearSession() {

frontend/utils/constants.ts

@@ -10,7 +10,8 @@ export const MERCHANDISE_TYPE_CODES = {
 
 export const ROLE = [
     { label: 'Administrateur', value: 'ROLE_ADMIN' },
-    { label: 'Utilisateur', value: 'ROLE_USER' }
+    { label: 'Utilisateur', value: 'ROLE_USER' },
+    { label: 'Visiteur', value: 'ROLE_GUEST' }
 ]
 export const SUPPLIER_CODE = {
     LIOT: 'LIOT'