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

feat : mise en place de composant UI pour les select, checkbox, date, text

Browse Source
This commit is contained in:
Autin
2026-01-29 17:45:52 +01:00
parent 07be7e8d14
commit bb8fbe4907
8 changed files with 456 additions and 282 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
frontend/components/reception/reception-product-received.vue
View File

@@ -5,39 +5,25 @@
v-if="receptionStore.current?.receptionType?.code === RECEPTION_TYPE_CODES.MERCHANDISES"
class="flex flex-col gap-8 items-center w-full">
<h1 class="text-4xl uppercase font-bold">Sélectionner des marchandises réceptionnnées</h1>
<div class="flex flex-col w-[550px]">
<label for="merchandise-type" class="font-bold uppercase text-xl mb-2">Type de marchandises</label>
<select
id="merchandise-type"
v-model="selectedMerchandiseTypeId"
class="border-b border-black justify-self-start text-xl pb-[6px] bg-transparent cursor-pointer"
:class="selectedMerchandiseTypeId ? 'text-black' : 'text-neutral-400'"
>
<option value="" disabled class="text-neutral-400">Sélectionner</option>
<option
v-for="type in merchandiseTypes"
:key="type.id"
:value="String(type.id)"
class="text-black"
>
{{ type.label }}
</option>
</select>
</div>
<UiSelect
id="merchandise-type"
v-model="selectedMerchandiseTypeId"
label="Type de marchandises"
:options="merchandiseTypes.map((type) => ({ value: String(type.id), label: type.label }))"
wrapper-class="w-[550px]"
/>
<div
v-if="selectedMerchandiseTypeId && isAutres"
class="flex flex-col w-full max-w-[550px]"
>
<label for="merchandise-detail" class="font-bold uppercase text-xl mb-2">Préciser</label>
<input
<UiTextInput
id="merchandise-detail"
v-model="merchandiseDetail"
label="Préciser"
placeholder="Précisions complémentaires"
type="text"
maxlength="255"
class="border-b border-black text-xl pb-[6px] bg-transparent"
>
:maxlength="255"
/>
</div>
<div
@@ -48,16 +34,12 @@
v-for="building in buildings"
:key="building.id"
>
<label
class="flex items-center gap-2 text-xl"
>
<input
v-model="selectedBuildingIds"
type="checkbox"
:value="String(building.id)"
>
<span>{{ building.label }}</span>
</label>
<UiCheckbox
v-model="selectedBuildingIds"
:value="String(building.id)"
:label="building.label"
label-class="text-xl"
/>
</div>
</div>
@@ -68,18 +50,18 @@
<div class="grid grid-cols-1 gap-10 md:grid-cols-4">
<div v-for="type in pelletTypes" :key="type.id" class="flex flex-col gap-4">
<p class="font-bold uppercase">{{ type.label }}</p>
<label
<div
v-for="building in buildings"
:key="building.id"
class="flex items-center gap-2 text-lg"
>
<input
<UiCheckbox
v-model="selectedPelletBuildingIds[String(type.id)]"
type="checkbox"
:value="String(building.id)"
>
<span>{{ building.label }}</span>
</label>
:label="building.label"
label-class="text-lg"
/>
</div>
</div>
</div>
</div>