Dialog default (sub-export)
SchedaFormDialog
Dialog per la creazione e modifica di schede con campi dinamici e priorità.
Panoramica
SchedaFormDialog è il dialog per creare e modificare schede. Supporta campi standard (titolo, descrizione, scadenza, priorità) e campi dinamici configurati via BoardCampoRow. Viene usato automaticamente da KanbanFasiBoard tramite lo slot #dialog-form.
Props
| Prop | Tipo | Default | Descrizione |
|---|---|---|---|
visible | boolean | — | Visibilità del dialog |
boardId | number | — | ID board (usato per campi contestuali) |
idfase | number | — | Fase di destinazione per nuove schede |
campi | BoardCampoRow[] | [] | Campi dinamici da mostrare nel form |
priorita | BoardPriorita[] | [] | Opzioni priorità per il dropdown |
item | Record<string, unknown> | undefined | Scheda da modificare (undefined = nuova) |
getToken | () => string | null | () => null | Provider JWT/Bearer per fetch remote dei campi dinamici con opzioni_url |
Emits
| Evento | Payload | Descrizione |
|---|---|---|
update:visible | boolean | Richiesta chiusura dialog |
saved | Record<string, unknown> | Dati salvati (da passare a fasiService.creaScheda o aggiornaScheda) |
Campi standard
Il dialog include sempre:
- Titolo (obbligatorio)
- Descrizione (textarea)
- Priorità (dropdown, opzioni da prop
priorita) - Data scadenza (date picker)
Campi dinamici
I campi in campi con attivo: true vengono renderizzati dopo i campi standard in ordine per ordine. I valori vengono salvati in dati_extra come oggetto JSON flat.
Anteprima live
Utilizzo standalone
<script setup lang="ts">
import { SchedaFormDialog } from '@pzeta/vue-kanban'
import { useFasiService } from '@pzeta/vue-kanban'
const fasiService = useFasiService('crm')
const dialogVisible = ref(false)
const faseCorrente = ref<number>(0)
async function onSaved(formData: Record<string, unknown>) {
await fasiService.creaScheda(formData)
dialogVisible.value = false
}
</script>
<template>
<Button label="Nuova scheda" @click="dialogVisible = true" />
<SchedaFormDialog
:visible="dialogVisible"
:board-id="42"
:idfase="faseCorrente"
:campi="fasiService.campi.value"
:priorita="fasiService.priorita.value"
@update:visible="dialogVisible = false"
@saved="onSaved"
/>
</template>
Nota
KanbanFasiBoard gestisce autonomamente SchedaFormDialog internamente. Usare standalone solo per flussi custom che non usano KanbanFasiBoard.