.. _widgetpedia/genro/components/fullcalendar:

fullCalendar
============




Il fullCalendar è un component di Genropy che permette di visualizzare una serie di appuntamenti all'interno di un **calendario**. Il calendario può essere in modalità **griglia** mensile, **tabella** settimanale, **lista** settimanale o giornaliera.


Gli appuntamenti devono essere organizzati sotto forma di `Bag <https://docs.genropy.org/bag_book/index.html>`_ di valori con delle chiavi predefinite:

- ``event_id``, ovvero una chiave univoca per identificare l'evento (facoltativa)
- ``title`` e ``description``, campi testuali che forniscono un titolo e una descrizione per l'evento
- ``start`` e ``end``, ovvero data e ora di inizio e fine dell'evento in **formato ISO**.

Lo store di eventi
------------------
Per popolare lo store è possibile utilizzare una  :ref:`quickGrid<widgetpedia/grids/grid/quickgrid>`  o  :ref:`bagGrid<widgetpedia/grids/grid/baggrid>`  e indicare nel parametro `storepath` il *path* popolato dalla griglia come mostrato nel seguente esempio:

.. raw:: html

 <div class="gnrexamplebox">
            <a class="gnrexamplebox_title" onclick='gnrExampleIframe(this.nextElementSibling,{"height": 200, "width": "100%", "examples_root": "https://dev.genropy.org/webpages/docu_examples", "examples_root_local": "", "example_folder": "widgetpedia/genro/components/fullcalendar", "parsstring": "?_source_viewer=stack&_source_toolbar=f&cm_theme=night", "example_label": "fullCalendar con quickGrid ", "example_name": "calendar_grid"} );'>
                fullCalendar con quickGrid 
            </a>
            <div></div>
        </div> 
        

In alternativa è possibile eseguire una *query* estrapolando i risultati in modalità **Bag** oppure costruire con dei dati di partenza una Bag come si può vedere in questo esempio:

.. raw:: html

 <div class="gnrexamplebox">
            <a class="gnrexamplebox_title" onclick='gnrExampleIframe(this.nextElementSibling,{"height": 200, "width": "100%", "examples_root": "https://dev.genropy.org/webpages/docu_examples", "examples_root_local": "", "example_folder": "widgetpedia/genro/components/fullcalendar", "parsstring": "?_source_viewer=stack&_source_toolbar=f&cm_theme=night", "example_label": "fullCalendar con Bag di eventi ", "example_name": "fullcalendar"} );'>
                fullCalendar con Bag di eventi 
            </a>
            <div></div>
        </div> 
        

.. raw:: html

 <hr>

**Parametri:**

+------------------------+------+--------------------------------------------------+
|     Nome parametro     | Tipo |                   Descrizione                    |
+========================+======+==================================================+
|initialView             |T     |Permette di indicare la vista iniziale tra        |
|                        |      |dayGridMonth, timeGridWeek, listWeek, timeGridDay |
+------------------------+------+--------------------------------------------------+
|headerToolbar           |T     |Permette di fornire un dizionario per costruire   |
|                        |      |l'header del component. Le chiavi saranno 'left', |
|                        |      |'center', 'right', i valori il contenuto da       |
|                        |      |mostrare                                          |
+------------------------+------+--------------------------------------------------+
|box\_                   |T     |I parametri del box del calendario (ad es:        |
|                        |      |box_margin='40px', box_max_width='1100px')        |
+------------------------+------+--------------------------------------------------+
|storepath               |T     |Il path dello store dove si trova la Bag di valori|
|                        |      |dei vari eventi (es: storepath='.events')         |
+------------------------+------+--------------------------------------------------+

.. sectionauthor:: Davide Paci