Time Off Widget
===============
Il widget ``CardContent`` è progettato per mostrare contenuti in una card personalizzabile. 
Accetta come parametro un oggetto `CardViewModel <../viewmodel/card-viewmodel.html>`__ che consente di configurare diversi aspetti del layout, 
del contenuto e del comportamento della card.

Costruttore
-----------
Il costruttore di ``CardContent`` è definito come segue:

.. code-block:: dart

    CardContent({
        required CardViewModel cardViewModel,
    });

Parametri:

- **cardViewModel**: un'istanza di `CardViewModel <../viewmodel/card-viewmodel.html>`__ che specifica le configurazioni della card, tra cui il contenuto principale, l'intestazione, la sezione inferiore e l'overlay.

Questa tipologia è simile alla `Card Extended <../card-extended/card-extended.html>`__, la differenza è nell'utilizzo in maniera diversa delle varie configurazioni disponibili.

Varianti di utilizzo
--------------------

**Variante 1**

Questa variante serve per mostrare una card relativa ad una richiesta ferie.

.. image:: img/time-off1.png
   :width: 400px
   :align: center

.. code-block:: dart

    CardContent(
            cardViewModel: CardViewModel(
              config: CardConfig(layoutBuilder: EvaCardExtendedLayoutBuilder(leftContentPadding: 0), onTap: (CardViewModel item) {}),
              contentConfig: CardContentConfig(
                  customWidget: Column(
                children: [
                  buildHeaderWithAvatarAndText(
                    colorScheme: colorScheme,
                    title: IconTextViewModel(text: "Rosario Brischetto"),
                    description: IconTextViewModel(text: "Mobile Developer"),
                  ),
                  Container(
                    margin: const EdgeInsets.only(top: 10, right: 20),
                    child: Row(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      mainAxisAlignment: MainAxisAlignment.start,
                      children: [
                        buildLabel(colorScheme: colorScheme),
                        buildPairIconTextRowList(colorScheme: colorScheme, pairIconTextList: [
                          PairIconTextViewModel(iconTextTitle: IconTextViewModel(text: "Tipo"), iconTextDescription: IconTextViewModel(text: "Ferie")),
                          PairIconTextViewModel(iconTextTitle: IconTextViewModel(text: "Durata"), iconTextDescription: IconTextViewModel(text: "2 giorni")),
                          PairIconTextViewModel(
                              iconTextTitle: IconTextViewModel(text: "Inizio"), iconTextDescription: IconTextViewModel(text: "12/09/2023\n09:00")),
                          PairIconTextViewModel(
                              iconTextTitle: IconTextViewModel(text: "Fine"), iconTextDescription: IconTextViewModel(text: "22/09/2023\n18:00"))
                        ]),
                      ],
                    ),
                  ),
                ],
              )),
              bottomConfig: CardBottomConfig(
                  buttons: CardBottomButtons(buttons: [
                ButtonViewModel(label: 'Rifiuta', type: ButtonType.outlined, action: () {}),
                ButtonViewModel(label: 'Approva', type: ButtonType.standard, action: () {}),
                ButtonViewModel(label: 'Messaggio', type: ButtonType.outlined, action: () {})
              ])),
            ),
          )

**Variante 2**

Questa variante serve per mostrare una card che mostra una ferie.

.. image:: img/time-off2.png
   :width: 400px
   :align: center

.. code-block:: dart

    CardContent(
          cardViewModel: CardViewModel(
              config: CardConfig(layoutBuilder: EvaCardExtendedLayoutBuilder(leftContentPadding: 0, rightContentPadding: 0), onTap: (CardViewModel item) {}),
              contentConfig: CardContentConfig(
                customWidget: Padding(
                  padding: const EdgeInsets.only(left: 10, right: 15, bottom: 3),
                  child: Row(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: [
                      buildOverlayItem(
                          colorScheme,
                          OverlayItemConfig(
                            isChecked: true,
                            orientation: EvaCardOverlayItemContentDoubleOrientation.horizontal,
                            overlayItemSize: OverlayItemSize.normal,
                            startDate: DateTime(2024, 2, 3),
                            endDate: DateTime(2024, 2, 5),
                          ))!,
                      buildPairIconTextRowList(
                        colorScheme: colorScheme,
                        pairIconTextList: [
                          PairIconTextViewModel(
                              iconTextTitle: IconTextViewModel(text: "Tipo", textTextStyle: demoColorScheme?.timeOffListCardDataTitleStyle),
                              iconTextDescription: IconTextViewModel(text: "Ferie", textTextStyle: demoColorScheme?.timeOffListCardDataContentStyle)),
                          PairIconTextViewModel(
                              iconTextTitle: IconTextViewModel(text: "Inizio", textTextStyle: demoColorScheme?.timeOffListCardDataTitleStyle),
                              iconTextDescription: IconTextViewModel(text: "12/09/2023\n09:00", textTextStyle: demoColorScheme?.timeOffListCardDataContentStyle)),
                          PairIconTextViewModel(
                              iconTextTitle: IconTextViewModel(text: "Fine", textTextStyle: demoColorScheme?.timeOffListCardDataTitleStyle),
                              iconTextDescription: IconTextViewModel(text: "22/09/2023\n18:00", textTextStyle: demoColorScheme?.timeOffListCardDataContentStyle))
                        ],
                      ),
                    ],
                  ),
                ),
              )),
        )

**Variante 3**

Questa variante serve per mostrare solo il widget con singola data.

.. image:: img/time-off3.png
   :width: 140px
   :align: center

.. code-block:: dart

    CardContent(
          cardViewModel: CardViewModel(
              config: CardConfig(layoutBuilder: EvaCardExtendedLayoutBuilder(leftContentPadding: 0, rightContentPadding: 0), onTap: (CardViewModel item) {}),
              contentConfig: CardContentConfig(
                customWidget: Padding(
                  padding: const EdgeInsets.only(left: 10, right: 10, bottom: 3),
                  child: buildOverlayItem(
                      colorScheme,
                      OverlayItemConfig(
                        isChecked: true,
                        orientation: EvaCardOverlayItemContentDoubleOrientation.horizontal,
                        overlayItemSize: OverlayItemSize.normal,
                        startDate: DateTime(2024, 2, 5),
                        endDate: DateTime(2024, 2, 5),
                      ))!,
                ),
              )),
        )

**Variante 4**

Questa variante serve per mostrare solo il widget con due date.

.. image:: img/time-off4.png
   :width: 200px
   :align: center

.. code-block:: dart

    CardContent(
          cardViewModel: CardViewModel(
              config: CardConfig(layoutBuilder: EvaCardExtendedLayoutBuilder(leftContentPadding: 0, rightContentPadding: 0), onTap: (CardViewModel item) {}),
              contentConfig: CardContentConfig(
                customWidget: Padding(
                  padding: const EdgeInsets.only(left: 10, right: 10, bottom: 3),
                  child: buildOverlayItem(
                      colorScheme,
                      OverlayItemConfig(
                        isChecked: true,
                        orientation: EvaCardOverlayItemContentDoubleOrientation.horizontal,
                        overlayItemSize: OverlayItemSize.normal,
                        startDate: DateTime(2024, 2, 3),
                        endDate: DateTime(2024, 2, 5),
                      ))!,
                ),
              )),
        )