feat(machines) : multi-select site checkboxes, alphabetical sort, OR search param
- Replace site dropdown with inline checkboxes for multi-site filtering - Sort machines alphabetically (localeCompare fr) - Switch catalog search from ?name= to ?q= for OR search on name/reference Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -135,7 +135,7 @@ export function useComposants() {
|
||||
params.set('page', String(page))
|
||||
|
||||
if (search && search.trim()) {
|
||||
params.set('name', search.trim())
|
||||
params.set('q', search.trim())
|
||||
}
|
||||
|
||||
if (typeName && typeName.trim()) {
|
||||
|
||||
@@ -147,7 +147,7 @@ export function usePieces() {
|
||||
params.set('page', String(page))
|
||||
|
||||
if (search && search.trim()) {
|
||||
params.set('name', search.trim())
|
||||
params.set('q', search.trim())
|
||||
}
|
||||
|
||||
if (typeName && typeName.trim()) {
|
||||
|
||||
@@ -145,7 +145,7 @@ export function useProducts() {
|
||||
params.set('page', String(page))
|
||||
|
||||
if (search && search.trim()) {
|
||||
params.set('name', search.trim())
|
||||
params.set('q', search.trim())
|
||||
}
|
||||
|
||||
if (typeName && typeName.trim()) {
|
||||
|
||||
@@ -16,16 +16,23 @@
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
||||
<div class="form-control">
|
||||
<label class="label">
|
||||
<span class="label-text">Site</span>
|
||||
<span class="label-text">Sites</span>
|
||||
</label>
|
||||
<select v-model="selectedSite" class="select select-bordered">
|
||||
<option value="">
|
||||
Tous les sites
|
||||
</option>
|
||||
<option v-for="site in sites" :key="site.id" :value="site.id">
|
||||
{{ site.name }}
|
||||
</option>
|
||||
</select>
|
||||
<div class="flex flex-wrap gap-3">
|
||||
<label
|
||||
v-for="site in sites"
|
||||
:key="site.id"
|
||||
class="flex items-center gap-2 cursor-pointer"
|
||||
>
|
||||
<input
|
||||
type="checkbox"
|
||||
class="checkbox checkbox-sm"
|
||||
:checked="selectedSites.has(site.id)"
|
||||
@change="selectedSites.has(site.id) ? selectedSites.delete(site.id) : selectedSites.add(site.id)"
|
||||
>
|
||||
<span class="text-sm">{{ site.name }}</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-control">
|
||||
<label class="label">
|
||||
@@ -113,7 +120,7 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, onMounted } from 'vue'
|
||||
import { ref, reactive, computed, onMounted } from 'vue'
|
||||
import { useMachines } from '~/composables/useMachines'
|
||||
import { useSites } from '~/composables/useSites'
|
||||
import { useToast } from '~/composables/useToast'
|
||||
@@ -128,7 +135,7 @@ const { machines, loading, loadMachines, deleteMachine } = useMachines()
|
||||
const { sites, loadSites } = useSites()
|
||||
const toast = useToast()
|
||||
|
||||
const selectedSite = ref('')
|
||||
const selectedSites = reactive(new Set())
|
||||
const searchQuery = ref('')
|
||||
|
||||
// Enrichir les machines avec les objets site complets
|
||||
@@ -145,8 +152,8 @@ const enrichedMachines = computed(() => {
|
||||
const filteredMachines = computed(() => {
|
||||
let filtered = enrichedMachines.value
|
||||
|
||||
if (selectedSite.value) {
|
||||
filtered = filtered.filter(machine => machine.siteId === selectedSite.value)
|
||||
if (selectedSites.size > 0) {
|
||||
filtered = filtered.filter(machine => selectedSites.has(machine.siteId))
|
||||
}
|
||||
|
||||
if (searchQuery.value.trim()) {
|
||||
@@ -157,6 +164,10 @@ const filteredMachines = computed(() => {
|
||||
)
|
||||
}
|
||||
|
||||
filtered = [...filtered].sort((a, b) =>
|
||||
(a.name || '').localeCompare(b.name || '', 'fr')
|
||||
)
|
||||
|
||||
return filtered
|
||||
})
|
||||
|
||||
|
||||
Reference in New Issue
Block a user