Composables

UseAttivitaForm

title: useAttivitaForm description: Composable per la gestione dello stato e validazione del form attività.

Panoramica

useAttivitaForm gestisce stato, validazione e submit del form di pianificazione. Dalla v0.1.4 AttivitaForm non lo usa più direttamente (è passato a DynamicFormDialog schema-driven, vedi AttivitaForm). Resta esportato per costruire form custom in scenari dove vuoi:

Riutilizzare la logica di pre-fill da tipo (prefillFromTipo) e di edit (prefillForEdit)
Sfruttare la validazione Italian-first già pre-cablata (required, max:125, mindate:0d, orari riunione condizionali)
Avere accesso diretto allo stato (formState/errors) senza schema vue-form

Per il caso standard "dialog di creazione/modifica attività" usa AttivitaForm (vedi AttivitaForm).

Inizializzazione

import { useAttivitaForm } from '@pzeta/vue-attivita'

const form = useAttivitaForm({
  entitasorgente: 'anagrafica',
  identitasorgente: 42,
})

Stato reattivo

Proprietà	Tipo	Descrizione
`formState`	`Ref<AttivitaFormState>`	Stato campi del form
`errors`	`Ref<Partial<Record<keyof AttivitaFormState, string>>>`	Errori di validazione
`isSubmitting`	`Ref<boolean>`	Submit in corso
`idattivita`	`Ref<number \| null>`	`null` = nuova, numero = modifica
`tipoSelezionato`	`ComputedRef<TipoAttivita \| null>`	Tipo attualmente selezionato
`isRiunione`	`ComputedRef<boolean>`	`true` se azione = `'riunione'`
`isDocumento`	`ComputedRef<boolean>`	`true` se azione = `'upload_documento'`
`isFirma`	`ComputedRef<boolean>`	`true` se azione = `'richiesta_firma'`
`tipi`	`Ref<TipoAttivita[]>`	Cache tipi attività (forwardata da `useTipiAttivita`)

Espone anche getTipiAttivi(): TipoAttivita[] per filtro locale attivo === true.

Metodi

Inizializzazione

// Carica i tipi attività disponibili
await form.init()

Pre-compilazione

// Precompila da tipo attività (usa valori predefiniti del tipo)
form.prefillFromTipo(tipo)

// Precompila la data di scadenza
form.prefillDate('2025-12-31')

// Carica un'attività esistente per la modifica
form.prefillForEdit(attivitaView)

Validazione e submit

// Valida il form
const isValid = form.validate()          // validazione standard
const isValid = form.validate(true)      // validazione "segna come fatto" (no datascadenza)

// Submit
const result = await form.submit()          // crea o aggiorna
const result = await form.submitComeFatto() // crea già completata

// Reset
form.reset()

AttivitaFormState

interface AttivitaFormState {
  idtipoattivita: number | null
  riepilogo: string              // max 125 caratteri
  nota: string
  datascadenza: string | null    // YYYY-MM-DD
  orarioinizio: string | null    // ISO timestamp
  orariofine: string | null
  tuttoilgiorno: boolean
  priorita: 1 | 2 | 3 | 4
  assegnatari: number[]          // array di idutente
  ricorrenza: RicorrenzaForm | null
  partecipanti: PartecipanteForm[]
}

Esempio form custom

<script setup lang="ts">
import { useAttivitaForm } from '@pzeta/vue-attivita'

const form = useAttivitaForm({ entitasorgente: 'lead', identitasorgente: props.idLead })
onMounted(form.init)

async function onSubmit() {
  const result = await form.submit()
  emit('saved', result.idattivita)
}
</script>

<template>
  <select v-model="form.formState.value.idtipoattivita">
    <option v-for="t in form.getTipiAttivi()" :value="t.idtipoattivita">{{ t.nome }}</option>
  </select>
  <input v-model="form.formState.value.riepilogo" maxlength="125" />
  <span v-if="form.errors.value.riepilogo" class="text-red-500">{{ form.errors.value.riepilogo }}</span>
  <button @click="onSubmit">Salva</button>
</template>

UseAttivita

Panoramica