545 lines
16 KiB
Vue
545 lines
16 KiB
Vue
<template>
|
|
<form @submit.prevent="validate">
|
|
<div class="grid grid-cols-2 items-start gap-y-8 gap-x-40 mb-16">
|
|
<h1 class="font-bold text-5xl uppercase col-start-1 row-start-1">Éxpedition</h1>
|
|
<UiSelect
|
|
id="shipment-user"
|
|
label="Nom de l'utisateur"
|
|
:options="users.map((user) => ({
|
|
value: String(user.id),
|
|
label: user.username
|
|
}))"
|
|
:loading="isLoadingUsers"
|
|
wrapper-class="col-start-1 row-start-2"
|
|
/>
|
|
|
|
<UiDateInput
|
|
id="shipment-date"
|
|
v-model="form.shipmentDate"
|
|
label="Date du jour"
|
|
wrapper-class="col-start-1 row-start-3"
|
|
/>
|
|
|
|
<div class="col-start-1 row-start-4">
|
|
<label class="font-bold uppercase text-xl mb-2 block">
|
|
Type d'expédition
|
|
</label>
|
|
<div class="grid grid-cols-2 gap-x-8">
|
|
<div
|
|
v-for="type in bovineShipment"
|
|
:key="type.id"
|
|
class="mt-8 flex flex-row gap-6"
|
|
>
|
|
<UiNumberInput
|
|
:label="type.label"
|
|
v-model="bovineQuantities[String(type.id)]"
|
|
:placeholder="0"
|
|
:min="0"
|
|
:max="10"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<UiSelect
|
|
id="reception-driver"
|
|
v-model="form.customerId"
|
|
label="Client"
|
|
:options="customers.map((customer) => ({
|
|
value: String(customer.id),
|
|
label: customer.label
|
|
}))"
|
|
:loading="isLoadingCustomers"
|
|
wrapper-class="col-start-1 row-start-5"
|
|
/>
|
|
|
|
<UiSelect
|
|
id="reception-driver"
|
|
v-model="form.addressId"
|
|
:options="customerAddresses.map((address) => ({
|
|
value: String(address.id),
|
|
label: address.fullAddress
|
|
}))"
|
|
:disabled="isLoadingCustomers || customerAddresses.length === 0"
|
|
label="Adresse"
|
|
wrapper-class="col-start-2 row-start-1"
|
|
/>
|
|
|
|
<UiSelect
|
|
id="reception-driver"
|
|
v-model="form.truckId"
|
|
label="Camion"
|
|
:options="trucks.map((truck) => ({
|
|
value: String(truck.id),
|
|
label: truck.name
|
|
}))"
|
|
:loading="isLoadingTrucks"
|
|
wrapper-class="col-start-2 row-start-2"
|
|
/>
|
|
|
|
<UiSelect
|
|
id="reception-driver"
|
|
v-model="form.carrierId"
|
|
label="Transporteur"
|
|
:options="carriers.map((carrier) => ({
|
|
value: String(carrier.id),
|
|
label: carrier.name
|
|
}))"
|
|
wrapper-class="col-start-2 row-start-3"
|
|
/>
|
|
|
|
<UiSelect
|
|
id="reception-driver"
|
|
v-model="form.driverId"
|
|
label="Nom du chauffeur si LIOT"
|
|
:options="filteredDrivers.map((driver) => ({
|
|
value: String(driver.id),
|
|
label: driver.name
|
|
}))"
|
|
:loading="isLoadingDrivers"
|
|
wrapper-class="col-start-2 row-start-4"
|
|
/>
|
|
|
|
<div v-if="!isLiotCarrier" class="col-start-2 row-start-5">
|
|
<UiLicensePlateInput
|
|
v-model="form.licencePlate"
|
|
v-model:allowAny="allowAnyLicensePlate"
|
|
/>
|
|
</div>
|
|
<!-- Immatriculation (LIOT) -->
|
|
<UiSelect
|
|
v-if="isLiotCarrier"
|
|
id="reception-vehicle"
|
|
v-model="form.vehicleId"
|
|
label="Immatriculation"
|
|
:options="filteredVehicles.map((vehicle) => ({
|
|
value: String(vehicle.id),
|
|
label: vehicle.plate
|
|
}))"
|
|
:loading="isLoadingVehicles"
|
|
:disabled="isLoadingVehicles || filteredVehicles.length === 0"
|
|
wrapper-class="col-start-2 row-start-5"
|
|
/>
|
|
</div>
|
|
<div class="flex justify-center">
|
|
<button
|
|
type="submit"
|
|
class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px] justify-self-end"
|
|
>Valider
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</template>
|
|
<script setup lang="ts">
|
|
|
|
import type {UserData} from '~/services/dto/user-data'
|
|
import type {CustomerData} from '~/services/dto/customer-data'
|
|
import type {TruckData} from '~/services/dto/truck-data'
|
|
import type {CarrierData} from '~/services/dto/carrier-data'
|
|
import type {DriverData} from '~/services/dto/driver-data'
|
|
import type {VehicleData} from '~/services/dto/vehicle-data'
|
|
import {getUsers} from '~/services/auth'
|
|
import {getCustomerList} from '~/services/customer'
|
|
import {getTruckList} from '~/services/truck'
|
|
import {getCarrierList} from '~/services/carrier'
|
|
import {getVehicleList} from '~/services/vehicle'
|
|
import {getDriverList} from '~/services/driver'
|
|
import type {ShipmentFormData} from '~/services/dto/shipment-data'
|
|
import {SUPLLIER_CODE} from "~/utils/constants"
|
|
import {useAuthStore} from '~/stores/auth'
|
|
import {useShipmentStore} from '~/stores/shipment'
|
|
import {ref} from "vue";
|
|
import type {ShipmentTypeData} from "~/services/dto/shipment-type-data";
|
|
import {getShipmentTypeList} from "~/services/shipment-type";
|
|
import {
|
|
createShipmentBovine,
|
|
deleteShipmentBovine,
|
|
getBovinShipmentList,
|
|
updateShipmentBovine
|
|
} from "~/services/bovin-shipment";
|
|
|
|
const users = ref<UserData[]>([])
|
|
const customers = ref<CustomerData[]>([])
|
|
const trucks = ref<TruckData[]>([])
|
|
const carriers = ref<CarrierData[]>([])
|
|
const drivers = ref<DriverData[]>([])
|
|
const vehicles = ref<VehicleData[]>([])
|
|
|
|
const isLoadingUsers = ref(false)
|
|
const isLoadingCustomers = ref(false)
|
|
const isLoadingTrucks = ref(false)
|
|
const isLoadingCarriers = ref(false)
|
|
const isHydrating = ref(false)
|
|
const isLoadingVehicles = ref(false)
|
|
const allowAnyLicensePlate = ref(false)
|
|
const isLoadingDrivers = ref(false)
|
|
const authStore = useAuthStore()
|
|
const shipmentStore = useShipmentStore()
|
|
const router = useRouter()
|
|
const bovineQuantities = ref<Record<string, number | null>>({})
|
|
const bovineShipment = ref<ShipmentTypeData[]>([])
|
|
// Transporteur sélectionné dans le formulaire
|
|
const selectedCarrier = computed(() =>
|
|
carriers.value.find((carrier) => String(carrier.id) === form.carrierId) ?? null
|
|
)
|
|
const isLiotCarrier = computed(() => selectedCarrier.value?.code === SUPLLIER_CODE.LIOT)
|
|
|
|
|
|
const form = reactive<ShipmentFormData>({
|
|
userId: '',
|
|
shipmentDate: new Date().toISOString().slice(0, 10),
|
|
customerId: '',
|
|
addressId: '',
|
|
truckId: '',
|
|
carrierId: '',
|
|
driverId: '',
|
|
vehicleId: '',
|
|
licencePlate: '',
|
|
})
|
|
|
|
const customerAddresses = computed(() => {
|
|
const customerId = Number(form.customerId)
|
|
if (!Number.isFinite(customerId)) {
|
|
return []
|
|
}
|
|
return customers.value.find((customer) => customer.id === customerId)?.addresses ?? []
|
|
})
|
|
|
|
const filteredDrivers = computed<DriverData[]>(() => {
|
|
if (!form.carrierId) {
|
|
return []
|
|
}
|
|
return drivers.value.filter((driver) => String(driver.carrier?.id) === form.carrierId)
|
|
})
|
|
|
|
const filteredVehicles = computed<VehicleData[]>(() => {
|
|
if (!form.carrierId) {
|
|
return []
|
|
}
|
|
return vehicles.value.filter(
|
|
(vehicle) =>
|
|
String(vehicle.carrier?.id) === form.carrierId &&
|
|
(!form.truckId || String(vehicle.truck?.id) === form.truckId)
|
|
)
|
|
})
|
|
|
|
|
|
const loadUsers = async () => {
|
|
isLoadingUsers.value = true
|
|
try {
|
|
users.value = await getUsers()
|
|
} finally {
|
|
isLoadingUsers.value = false
|
|
}
|
|
}
|
|
|
|
const loadShipmentType = async () => {
|
|
isLoadingUsers.value = true
|
|
try {
|
|
bovineShipment.value = await getShipmentTypeList()
|
|
} finally {
|
|
isLoadingUsers.value = false
|
|
}
|
|
}
|
|
|
|
const loadCustomers = async () => {
|
|
isLoadingCustomers.value = true
|
|
try {
|
|
customers.value = await getCustomerList()
|
|
} finally {
|
|
isLoadingCustomers.value = false
|
|
}
|
|
|
|
}
|
|
|
|
const loadTrucks = async () => {
|
|
isLoadingTrucks.value = true
|
|
try {
|
|
trucks.value = await getTruckList()
|
|
} finally {
|
|
isLoadingTrucks.value = false
|
|
}
|
|
}
|
|
|
|
const loadCarriers = async () => {
|
|
isLoadingCarriers.value = true
|
|
try {
|
|
carriers.value = await getCarrierList()
|
|
} finally {
|
|
isLoadingCarriers.value = false
|
|
}
|
|
}
|
|
|
|
const loadVehicles = async () => {
|
|
isLoadingVehicles.value = true
|
|
try {
|
|
vehicles.value = await getVehicleList()
|
|
} finally {
|
|
isLoadingVehicles.value = false
|
|
}
|
|
}
|
|
|
|
const loadDrivers = async () => {
|
|
isLoadingDrivers.value = true
|
|
try {
|
|
drivers.value = await getDriverList()
|
|
} finally {
|
|
isLoadingDrivers.value = false
|
|
}
|
|
}
|
|
|
|
|
|
// On met le user connecté par défaut dans le select
|
|
const setDefaultUser = () => {
|
|
if (form.userId) {
|
|
return
|
|
}
|
|
if (authStore.user?.id) {
|
|
form.userId = String(authStore.user.id)
|
|
}
|
|
}
|
|
|
|
onMounted(async () => {
|
|
await loadShipmentType()
|
|
await loadUsers()
|
|
await loadCustomers()
|
|
await loadTrucks()
|
|
await loadCarriers()
|
|
await loadVehicles()
|
|
await loadDrivers()
|
|
await authStore.ensureSession()
|
|
setDefaultUser()
|
|
})
|
|
|
|
watch(
|
|
() => shipmentStore.current,
|
|
(shipment) => {
|
|
if (!shipment || !shipment.bovinShipments) {
|
|
bovineQuantities.value = {}
|
|
return
|
|
}
|
|
const next: Record<string, number | null> = {}
|
|
for (const entry of shipment.bovinShipments) {
|
|
const typeId = entry.shipmentType?.id
|
|
if (!typeId) {
|
|
continue
|
|
}
|
|
next[String(typeId)] = entry.nbBovinSend ?? null
|
|
}
|
|
bovineQuantities.value = next
|
|
},
|
|
{immediate: true}
|
|
)
|
|
|
|
// Ajuste driver/vehicle quand le transporteur change (logique LIOT)
|
|
watch(
|
|
() => [form.customerId, customers.value],
|
|
() => {
|
|
if (!form.customerId) {
|
|
form.addressId = ''
|
|
return
|
|
}
|
|
if (!form.addressId && customerAddresses.value.length === 1) {
|
|
form.addressId = String(customerAddresses.value[0].id)
|
|
return
|
|
}
|
|
if (!form.addressId) {
|
|
return
|
|
}
|
|
const matches = customerAddresses.value.some(
|
|
(address) => String(address.id) === form.addressId
|
|
)
|
|
if (!matches) {
|
|
form.addressId = ''
|
|
}
|
|
},
|
|
{immediate: true}
|
|
)
|
|
|
|
// Valide/auto-sélectionne le véhicule selon camion + transporteur (LIOT)
|
|
watch(
|
|
() => form.carrierId,
|
|
() => {
|
|
if (isHydrating.value) {
|
|
return
|
|
}
|
|
if (!form.carrierId) {
|
|
form.driverId = ''
|
|
form.vehicleId = ''
|
|
return
|
|
}
|
|
if (!isLiotCarrier.value) {
|
|
form.driverId = ''
|
|
form.vehicleId = ''
|
|
return
|
|
}
|
|
if (filteredDrivers.value.length === 1) {
|
|
form.driverId = String(filteredDrivers.value[0].id)
|
|
}
|
|
if (filteredVehicles.value.length === 1) {
|
|
form.vehicleId = String(filteredVehicles.value[0].id)
|
|
}
|
|
},
|
|
{immediate: true}
|
|
)
|
|
|
|
// Récupère la plaque depuis le véhicule choisi (LIOT)
|
|
watch(
|
|
() => [form.truckId, form.carrierId, vehicles.value],
|
|
() => {
|
|
if (!isLiotCarrier.value) {
|
|
return
|
|
}
|
|
if (filteredVehicles.value.length === 1) {
|
|
form.vehicleId = String(filteredVehicles.value[0].id)
|
|
return
|
|
}
|
|
if (!form.vehicleId) {
|
|
return
|
|
}
|
|
const matches = filteredVehicles.value.some(
|
|
(vehicle) => String(vehicle.id) === form.vehicleId
|
|
)
|
|
if (!matches) {
|
|
form.vehicleId = ''
|
|
}
|
|
},
|
|
{immediate: true}
|
|
)
|
|
|
|
// Auto-renseigne le véhicule si la plaque correspond (LIOT)
|
|
watch(
|
|
() => [form.vehicleId, form.carrierId, vehicles.value],
|
|
() => {
|
|
if (!isLiotCarrier.value) {
|
|
return
|
|
}
|
|
if (isHydrating.value) {
|
|
return
|
|
}
|
|
const selected = filteredVehicles.value.find(
|
|
(vehicle) => String(vehicle.id) === form.vehicleId
|
|
)
|
|
if (selected) {
|
|
form.licencePlate = selected.plate
|
|
allowAnyLicensePlate.value = false
|
|
}
|
|
}
|
|
)
|
|
|
|
watch(
|
|
() => [form.licencePlate, form.carrierId, vehicles.value],
|
|
() => {
|
|
if (!isLiotCarrier.value || form.vehicleId) {
|
|
return
|
|
}
|
|
const match = filteredVehicles.value.find(
|
|
(vehicle) => vehicle.plate === form.licencePlate
|
|
)
|
|
if (match) {
|
|
form.vehicleId = String(match.id)
|
|
}
|
|
}
|
|
)
|
|
|
|
const buildDesiredBovinShipments = () => {
|
|
return bovineShipment.value
|
|
.map((type) => {
|
|
const raw = bovineQuantities.value[String(type.id)]
|
|
const quantity = raw === null || raw === undefined ? 0 : Number(raw)
|
|
return {
|
|
type,
|
|
quantity: Number.isFinite(quantity) ? Math.max(0, Math.trunc(quantity)) : 0
|
|
}
|
|
})
|
|
.filter((entry) => entry.quantity > 0)
|
|
}
|
|
|
|
const syncBovinShipments = async (shipmentId: number) => {
|
|
const shipmentIri = `/api/shipments/${shipmentId}`
|
|
const existing = await getBovinShipmentList(shipmentIri)
|
|
const desired = buildDesiredBovinShipments()
|
|
const desiredByTypeId = new Map<number, number>()
|
|
for (const entry of desired) {
|
|
desiredByTypeId.set(entry.type.id, entry.quantity)
|
|
}
|
|
|
|
for (const entry of existing) {
|
|
const rawType = entry.shipmentType
|
|
let typeId: number | null = null
|
|
if (rawType && typeof rawType === 'object' && 'id' in rawType) {
|
|
typeId = Number((rawType as { id: number }).id)
|
|
} else if (typeof rawType === 'string') {
|
|
const match = rawType.match(/\/shipment_types\/(\\d+)$/)
|
|
typeId = match ? Number(match[1]) : null
|
|
}
|
|
if (!typeId) {
|
|
continue
|
|
}
|
|
const desiredQuantity = desiredByTypeId.get(typeId)
|
|
if (!desiredQuantity) {
|
|
await deleteShipmentBovine(entry.id)
|
|
continue
|
|
}
|
|
if (entry.nbBovinSend !== desiredQuantity) {
|
|
await updateShipmentBovine(entry.id, {nbBovinSend: desiredQuantity})
|
|
}
|
|
desiredByTypeId.delete(typeId)
|
|
}
|
|
|
|
for (const [typeId, quantity] of desiredByTypeId.entries()) {
|
|
await createShipmentBovine({
|
|
shipment: shipmentIri,
|
|
shipmentType: `/api/shipment_types/${typeId}`,
|
|
nbBovinSend: quantity
|
|
})
|
|
}
|
|
}
|
|
|
|
// Valide le formulaire et crée/met à jour l'expédition
|
|
const validate = async () => {
|
|
const normalizedLicensePlate = form.licencePlate.trim()
|
|
const normalizedShipmentDate = form.shipmentDate.trim()
|
|
const normalizedCustomerId = form.customerId.trim()
|
|
const normalizedTruckId = form.truckId.trim()
|
|
const normalizedCarrierId = form.carrierId.trim()
|
|
|
|
const customerIri = normalizedCustomerId
|
|
? `/api/customers/${normalizedCustomerId}`
|
|
: null
|
|
const truckIri = normalizedTruckId
|
|
? `/api/trucks/${normalizedTruckId}`
|
|
: null
|
|
const carrierIri = normalizedCarrierId
|
|
? `/api/carriers/${normalizedCarrierId}`
|
|
: null
|
|
|
|
const payload = {
|
|
licencePlate: normalizedLicensePlate,
|
|
shipmentDate: normalizedShipmentDate,
|
|
customer: customerIri,
|
|
truck: truckIri,
|
|
carrier: carrierIri
|
|
}
|
|
if (!shipmentStore.current) {
|
|
const created = await shipmentStore.createShipment({
|
|
currentStep: 1,
|
|
...payload
|
|
})
|
|
if (created) {
|
|
await syncBovinShipments(created.id)
|
|
await router.push(`/shipment/${created.id}`)
|
|
}
|
|
return
|
|
}
|
|
|
|
const nextStep = shipmentStore.current.currentStep + 1
|
|
await shipmentStore.updateShipment(shipmentStore.current.id, {
|
|
currentStep: nextStep,
|
|
...payload
|
|
})
|
|
await syncBovinShipments(shipmentStore.current.id)
|
|
}
|
|
</script>
|