MALIO-DEV/Ferme
4
0
Fork 0
Code Issues Pull Requests 3 Actions Packages Projects Releases 82 Wiki Activity

feat : admin fournisseurs creation et modif (WIP)

Browse Source
This commit is contained in:
Mattéo Dunoyer
2026-02-11 08:18:55 +01:00
parent 83b339746e
commit 1e794bba00
7 changed files with 389 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

238
frontend/components/address/add-address.vue Normal file
View File

@@ -0,0 +1,238 @@
<template>
<form @submit.prevent="validate">
<div class="flex items-center justify-between gap-10">
<div>
<h1 class="text-3xl font-bold uppercase">
{{ addressId ? "Modification d'une adresse" : "Ajout d'une adresse" }}
</h1>
<p v-if="entityName" class="text-sm text-slate-500 mt-1">
{{ entityLabel }} : {{ entityName }}
</p>
</div>
<button
class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
type="submit"
:disabled="isLoading || entityId === null"
>
{{ addressId ? "Sauvegarder" : "Ajouter" }}
</button>
</div>
<div class="grid grid-cols-2 gap-y-16 gap-x-12 mb-16 mt-10">
<UiTextInput id="address-label" v-model="form.label" label="Libellé" />
<UiTextInput id="address-street" v-model="form.street" label="Rue" />
<UiTextInput id="address-street2" v-model="form.street2" label="Complément" />
<UiTextInput id="address-postalCode" v-model="form.postalCode" label="Code postal" />
<UiTextInput id="address-city" v-model="form.city" label="Ville" />
<UiTextInput id="address-country" v-model="form.countryCode" label="Pays" />
</div>
<p v-if="errorMsg" class="text-red-600 mt-4">{{ errorMsg }}</p>
</form>
</template>
<script setup lang="ts">
import { computed, reactive, ref, watch } from "vue"
import { createAddress, getAddress, updateAddress, type AddressPayload } from "~/services/address"
import { getSupplier, updateSupplier } from "~/services/supplier"
import type { SupplierPayload } from "~/services/dto/supplier-data"
const route = useRoute()
const router = useRouter()
const { $i18n } = useNuxtApp()
type AddressOwner = {
id: number
name?: string | null
email?: string | null
phone?: string | null
addresses?: unknown
}
type AddressOwnerAdapter = {
loadEntity: (id: number) => Promise<AddressOwner>
updateEntity: (id: number, payload: unknown) => Promise<unknown>
buildUpdatePayload: (owner: AddressOwner | null, addresses: string[]) => unknown
getEntityName: (owner: AddressOwner | null) => string
normalizeAddresses: (addresses: AddressOwner["addresses"]) => string[]
}
const props = defineProps<{
entityType?: "supplier" | "customer"
entityId?: number | null
returnPath?: string
adapter?: Partial<AddressOwnerAdapter>
}>()
const resolveId = (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 entityType = computed<"supplier" | "customer">(() => {
if (props.entityType) return props.entityType
const queryType = route.query.entityType
if (queryType === "customer" || queryType === "supplier") return queryType
const path = route.path
if (path.includes("/customer/")) return "customer"
return "supplier"
})
const entityId = computed(() => {
if (props.entityId !== undefined) return props.entityId ?? null
const typeKey = `${entityType.value}Id`
return resolveId(route.query[typeKey]) ?? resolveId(route.query.entityId)
})
const addressId = computed(() => resolveId(route.query.addressId))
const entity = ref<AddressOwner | null>(null)
const entityName = computed(() => activeAdapter.value.getEntityName(entity.value))
const entityLabel = computed(() => (entityType.value === "customer" ? "Client" : "Fournisseur"))
const isLoading = ref(false)
const errorMsg = ref<string | null>(null)
const form = reactive<AddressPayload>({
label: "",
street: "",
street2: null,
postalCode: "",
city: "",
countryCode: "",
})
const defaultSupplierAdapter: AddressOwnerAdapter = {
loadEntity: getSupplier,
updateEntity: updateSupplier,
buildUpdatePayload: (owner, addresses) => ({
name: owner?.name ?? "",
email: owner?.email ?? null,
phone: owner?.phone ?? null,
addresses,
} satisfies SupplierPayload),
getEntityName: (owner) => owner?.name ?? "",
normalizeAddresses: (value) => {
if (!Array.isArray(value) || value.length === 0) return []
if (typeof value[0] === "string") {
return value.filter((item): item is string => typeof item === "string")
}
return value
.map((address) =>
address && typeof address === "object" && "id" in address && address.id
? `/api/addresses/${address.id}`
: null
)
.filter((item): item is string => Boolean(item))
},
}
const activeAdapter = computed<AddressOwnerAdapter>(() => ({
...defaultSupplierAdapter,
...props.adapter,
}))
watch(
() => [entityId.value, addressId.value] as const,
async ([entityIdValue, addressIdValue]) => {
if (entityIdValue === null) {
entity.value = null
return
}
isLoading.value = true
try {
entity.value = await activeAdapter.value.loadEntity(entityIdValue)
if (addressIdValue !== null) {
const address = await getAddress(addressIdValue)
form.label = address.label ?? ""
form.street = address.street ?? ""
form.street2 = address.street2 ?? null
form.postalCode = address.postalCode ?? ""
form.city = address.city ?? ""
form.countryCode = address.countryCode ?? ""
} else {
form.label = ""
form.street = ""
form.street2 = null
form.postalCode = ""
form.city = ""
form.countryCode = ""
}
} finally {
isLoading.value = false
}
},
{ immediate: true }
)
async function validate() {
if (isLoading.value) return
if (entityId.value === null) {
errorMsg.value = String($i18n.t("errors.address.entityNotFound"))
return
}
errorMsg.value = null
isLoading.value = true
try {
if (!entity.value) {
entity.value = await activeAdapter.value.loadEntity(entityId.value)
}
const payload: AddressPayload = {
label: form.label.trim() || entityName.value || "Adresse",
street: form.street.trim(),
street2: form.street2?.trim() || null,
postalCode: form.postalCode.trim(),
city: form.city.trim(),
countryCode: form.countryCode.trim().toUpperCase(),
}
if (!payload.street) {
errorMsg.value = String($i18n.t("errors.address.streetRequired"))
return
}
if (!payload.postalCode) {
errorMsg.value = String($i18n.t("errors.address.postalCodeRequired"))
return
}
if (!payload.city) {
errorMsg.value = String($i18n.t("errors.address.cityRequired"))
return
}
if (payload.countryCode.length !== 2) {
errorMsg.value = String($i18n.t("errors.address.countryCodeInvalid"))
return
}
let updatedAddressId = addressId.value
if (addressId.value !== null) {
const updated = await updateAddress(addressId.value, payload)
updatedAddressId = updated.id
} else {
const created = await createAddress(payload)
updatedAddressId = created.id
}
if (updatedAddressId !== null) {
const existingAddresses = activeAdapter.value.normalizeAddresses(entity.value?.addresses ?? [])
const updatedAddresses = existingAddresses.includes(`/api/addresses/${updatedAddressId}`)
? existingAddresses
: [...existingAddresses, `/api/addresses/${updatedAddressId}`]
const updatePayload = activeAdapter.value.buildUpdatePayload(entity.value, updatedAddresses)
await activeAdapter.value.updateEntity(entityId.value, updatePayload)
}
const returnPath =
props.returnPath ?? `/admin/${entityType.value}/${entityId.value}`
await router.push(returnPath)
} catch (e) {
const errorKey = addressId.value !== null ? "errors.address.update" : "errors.address.create"
errorMsg.value = String($i18n.t(errorKey))
throw e
} finally {
isLoading.value = false
}
}
</script>