[#317] Création d'une page d'administration : modification/création d'un transporteur #18
2
.idea/workspace.xml
generated
2
.idea/workspace.xml
generated
@@ -778,4 +778,4 @@
|
|||||||
<option value=".github/prompts" />
|
<option value=".github/prompts" />
|
||||||
</promptFileLocations>
|
</promptFileLocations>
|
||||||
</component>
|
</component>
|
||||||
</project>
|
</project>
|
||||||
|
|||||||
@@ -32,6 +32,7 @@ Ajouter dans le fichier .env du frontend
|
|||||||
* [#316] Admin liste des transporteurs
|
* [#316] Admin liste des transporteurs
|
||||||
* [#312] Creation administration listing fournisseurs
|
* [#312] Creation administration listing fournisseurs
|
||||||
* [#315] Creation page admin utilisateur
|
* [#315] Creation page admin utilisateur
|
||||||
|
* [#317] Admin modification creation transporteur
|
||||||
|
|
||||||
### Changed
|
### Changed
|
||||||
|
|
||||||
|
|||||||
@@ -46,7 +46,11 @@
|
|||||||
"list": "Impossible de récupérer la liste des races de bovins."
|
"list": "Impossible de récupérer la liste des races de bovins."
|
||||||
},
|
},
|
||||||
"carrier": {
|
"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": {
|
"driver": {
|
||||||
"list": "Impossible de récupérer la liste des chauffeurs."
|
"list": "Impossible de récupérer la liste des chauffeurs."
|
||||||
@@ -71,6 +75,10 @@
|
|||||||
"create": "Utilisateur créé avec succès.",
|
"create": "Utilisateur créé avec succès.",
|
||||||
"login": "Connexion réussie.",
|
"login": "Connexion réussie.",
|
||||||
"logout": "Déconnexion réussie."
|
"logout": "Déconnexion réussie."
|
||||||
|
},
|
||||||
|
"carrier": {
|
||||||
|
"update": "Transporteur mis à jour",
|
||||||
|
"create": "Transporteur créé"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
101
frontend/pages/admin/carrier/[[id]].vue
Normal file
101
frontend/pages/admin/carrier/[[id]].vue
Normal file
@@ -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>
|
||||||
@@ -2,11 +2,11 @@
|
|||||||
|
|
||||||
<div class="flex items-center justify-between ">
|
<div class="flex items-center justify-between ">
|
||||||
<h1 class="text-3xl font-bold uppercase">listes des transporteurs</h1>
|
<h1 class="text-3xl font-bold uppercase">listes des transporteurs</h1>
|
||||||
<button
|
<NuxtLink
|
||||||
@Click="goToCarrier()"
|
to="/admin/carrier"
|
||||||
class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px] "
|
class="flex items-center justify-center text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
|
||||||
>Ajouter
|
>Ajouter
|
||||||
</button>
|
</NuxtLink>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="mt-6 border border-slate-200 mb-16 ">
|
<div class="mt-6 border border-slate-200 mb-16 ">
|
||||||
@@ -37,8 +37,8 @@ import {getCarrierList} from "~/services/carrier";
|
|||||||
const carrierList = ref<CarrierData[]>()
|
const carrierList = ref<CarrierData[]>()
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
|
|
||||||
const goToCarrier = (id: number|null = null) => {
|
const goToCarrier = (id: number) => {
|
||||||
id !== null ? router.push(`/admin/carrier/${id}`) : router.push(`/admin/carrier`)
|
router.push(`/admin/carrier/${id}`)
|
||||||
}
|
}
|
||||||
|
|
||||||
definePageMeta({
|
definePageMeta({
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import { useApi } from '~/composables/useApi'
|
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 =
|
export type CarrierListResponse =
|
||||||
| CarrierData[]
|
| CarrierData[]
|
||||||
@@ -21,3 +21,26 @@ export async function getCarrierList(): Promise<CarrierData[]> {
|
|||||||
|
|
||||||
return []
|
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'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|||||||
@@ -3,3 +3,13 @@ export interface CarrierData {
|
|||||||
name: string
|
name: string
|
||||||
code: string
|
code: string
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface CarrierFormData {
|
||||||
|
name: string
|
||||||
|
code: string
|
||||||
|
}
|
||||||
|
|
||||||
|
export type CarrierPayload = {
|
||||||
|
name?: string | null
|
||||||
|
code?: string
|
||||||
|
}
|
||||||
|
|||||||
@@ -7,6 +7,8 @@ namespace App\Entity;
|
|||||||
use ApiPlatform\Metadata\ApiResource;
|
use ApiPlatform\Metadata\ApiResource;
|
||||||
use ApiPlatform\Metadata\Get;
|
use ApiPlatform\Metadata\Get;
|
||||||
use ApiPlatform\Metadata\GetCollection;
|
use ApiPlatform\Metadata\GetCollection;
|
||||||
|
use ApiPlatform\Metadata\Patch;
|
||||||
|
use ApiPlatform\Metadata\Post;
|
||||||
use Doctrine\ORM\Mapping as ORM;
|
use Doctrine\ORM\Mapping as ORM;
|
||||||
use Symfony\Component\Serializer\Attribute\Groups;
|
use Symfony\Component\Serializer\Attribute\Groups;
|
||||||
|
|
||||||
@@ -21,6 +23,15 @@ use Symfony\Component\Serializer\Attribute\Groups;
|
|||||||
new GetCollection(
|
new GetCollection(
|
||||||
normalizationContext: ['groups' => ['carrier:read']],
|
normalizationContext: ['groups' => ['carrier:read']],
|
||||||
),
|
),
|
||||||
|
new Post(
|
||||||
|
normalizationContext: ['groups' => ['carrier:read']],
|
||||||
|
denormalizationContext: ['groups' => ['carrier:write']],
|
||||||
|
),
|
||||||
|
new Patch(
|
||||||
|
requirements: ['id' => '\d+'],
|
||||||
|
normalizationContext: ['groups' => ['carrier:read']],
|
||||||
|
denormalizationContext: ['groups' => ['carrier:write']],
|
||||||
|
),
|
||||||
],
|
],
|
||||||
security: "is_granted('ROLE_USER')",
|
security: "is_granted('ROLE_USER')",
|
||||||
)]
|
)]
|
||||||
@@ -33,11 +44,11 @@ class Carrier
|
|||||||
private ?int $id = null;
|
private ?int $id = null;
|
||||||
|
|
||||||
#[ORM\Column(length: 180)]
|
#[ORM\Column(length: 180)]
|
||||||
#[Groups(['carrier:read', 'driver:read', 'vehicle:read', 'reception:read'])]
|
#[Groups(['carrier:read', 'carrier:write', 'driver:read', 'vehicle:read', 'reception:read'])]
|
||||||
private string $name = '';
|
private string $name = '';
|
||||||
|
|
||||||
#[ORM\Column(length: 30, nullable: true)]
|
#[ORM\Column(length: 30, nullable: true)]
|
||||||
#[Groups(['carrier:read', 'driver:read', 'vehicle:read', 'reception:read'])]
|
#[Groups(['carrier:read', 'carrier:write', 'driver:read', 'vehicle:read', 'reception:read'])]
|
||||||
private ?string $code = null;
|
private ?string $code = null;
|
||||||
|
|
||||||
public function getId(): ?int
|
public function getId(): ?int
|
||||||
|
|||||||
Reference in New Issue
Block a user