Campi Filtro

NumberRange

Coppia di input numerici Da/A con due chiavi separate nel model.

Panoramica

Due input numerici affiancati (Da / A) che scrivono su chiavi separate nel model. Occupa 2 colonne grid. Genera gte.from e lte.to combinati in and=(...).

Anteprima live

Tipo

type: 'numberrange'

Configurazione

import type { NumberRangeFieldConfig } from '@pzeta/vue-ricerca'

const field: NumberRangeFieldConfig = {
  key: 'prezzo',              // usata solo per la colonna PostgREST
  type: 'numberrange',
  label: 'Fascia di prezzo',
  keyFrom: 'prezzoMin',
  keyTo: 'prezzoMax',
  placeholderFrom: 'Da...',
  placeholderTo: 'A...',
  mode: 'currency',
  currency: 'EUR',
  locale: 'it-IT',
  minFractionDigits: 2,
}

Stessa regola di daterange: key non viene scritto nel model, viene usato solo per la colonna PostgREST.

Props specifiche

Prop	Tipo	Default	Descrizione
`key`	`string`	—	Chiave di riferimento per la colonna PostgREST
`keyFrom`	`string`	—	Chiave nel model per il valore minimo
`keyTo`	`string`	—	Chiave nel model per il valore massimo
`label`	`string`	—	Label visualizzata sopra i due campi
`placeholderFrom`	`string`	—	Placeholder campo "Da"
`placeholderTo`	`string`	—	Placeholder campo "A"
`mode`	`'decimal' \| 'currency'`	`'decimal'`	Modalità formattazione
`currency`	`string`	—	Codice valuta ISO
`locale`	`string`	`'it-IT'`	Locale per formattazione
`min`	`number`	—	Valore minimo consentito
`minFractionDigits`	`number`	—	Cifre decimali minime

Query PostgREST generata

// Con entrambi i valori
// { and: '(prezzo.gte.100,prezzo.lte.500)' }

// Solo min
// { prezzo: 'gte.100' }

// Solo max
// { prezzo: 'lte.500' }

Number

Input numerico con formattazione locale e supporto valuta.

Select

Dropdown di selezione singola con opzioni statiche o reattive.