@eqproject/eqp-attachments 3.0.2 → 3.0.4

package/fesm2022/eqproject-eqp-attachments.mjs

@@ -2,6 +2,7 @@ import * as i0 from '@angular/core';
 import { Injectable, EventEmitter, ViewChild, Output, Input, Component, NgModule } from '@angular/core';
 import * as i2 from '@angular/forms';
 import { Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { TooltipPositionType, TypeColumn } from '@eqproject/eqp-common';
 import imageCompression from 'browser-image-compression';
 import * as i14 from 'ngx-image-cropper';
 import { base64ToFile, ImageCropperComponent, ImageCropperModule } from 'ngx-image-cropper';
@@ -55,1172 +56,6 @@ import { MatSortModule } from '@angular/material/sort';
 import { MatPaginatorModule } from '@angular/material/paginator';
 import { MatNativeDateModule } from '@angular/material/core';
 
-var FieldSizeClass;
-(function (FieldSizeClass) {
-    FieldSizeClass[FieldSizeClass["SMALL"] = 1] = "SMALL";
-    FieldSizeClass[FieldSizeClass["MEDIUM"] = 2] = "MEDIUM";
-    FieldSizeClass[FieldSizeClass["LARGE"] = 3] = "LARGE";
-    FieldSizeClass[FieldSizeClass["CUSTOM"] = 4] = "CUSTOM";
-})(FieldSizeClass || (FieldSizeClass = {}));
-
-/**
- * Classe utilizzata per la configurazione di filtri custom
- */
-class FilterConfig {
-    constructor(filterID, filterClass, label, propertyName, propertyValue, inputType, wherePartType, cvlConfig, preventRemoval) {
-        this.FilterID = filterID;
-        if (filterClass)
-            this.FilterClass = filterClass;
-        this.Label = label;
-        this.PropertyName = propertyName;
-        this.PropertyObject = propertyValue;
-        this.InputType = inputType;
-        this.WherePartType = wherePartType;
-        this.PreventRemoval = preventRemoval;
-        this.EnumData = cvlConfig?.EnumData;
-        this.ArrayData = cvlConfig?.ArrayData;
-        this.ArrayKeyProperty = cvlConfig?.ArrayKeyProperty;
-        this.ArrayValueProperty = cvlConfig?.ArrayValueProperty;
-        this.IsEnumSearchable = cvlConfig?.IsSearchable;
-        this.ShowEnumCancelButton = cvlConfig?.ShowCancelButton;
-        this.EnumSearchText = cvlConfig?.SearchText;
-        this.IsEnumMultiSelect = cvlConfig?.IsMultiSelect;
-        this.BindLookupFullObject = cvlConfig?.BindFullObject;
-    }
-    /**
-     * Identificativo univoco del filtro
-     */
-    FilterID;
-    /**
-     * Permette di definire la classe css da applicare
-     * al filtro
-     */
-    FilterClass = FilterSizeClass.SMALL;
-    /**
-     *
-     */
-    CustomFilterClasses;
-    /**
-     * Etichetta da mostrare per il filtro
-     */
-    Label;
-    /**
-     * Valore della proprietà dell'oggetto su cui andrà applicato il filtro
-     */
-    PropertyName;
-    /**
-     * Valore da usare per il filtro.
-     */
-    PropertyObject;
-    /**
-     * Definisce il tipo di filtro da applicare (valori ammessi in base all'enumeratore InputType)
-     */
-    InputType;
-    /**
-     * Definisce il tipo di operatore logico da utilizzare per la where part
-     */
-    WherePartType;
-    /**
-     * Se il filtro è di tipo CVL o CVLEnum allora in questa proprietà ci va definita la configurazione della cvl.
-     * La cvl verrà renderizzata con una eqp-select
-     */
-    CvlConfig;
-    /**
-     * Permette di definire il template esterno da renderizzare come filtro.
-     */
-    Externaltemplate;
-    /**
-     * Permette di disabilitare la cancellazione del filtro all'utente.
-     * Di default assume il valore FALSE (se true allora nel riepilogo dei filtri applicati non sarà mostrato il pulsante X)
-     */
-    PreventRemoval = false;
-    /**
-     * Permette di definire una funzione custom esterna da richiamare per il filtro corrente quando vengono premuti i pulsanti APPLICA FILTRI
-     * o RESET
-     */
-    CustomWherePartFunction;
-    /**
-     * Permette di definire la funzione custom per restituire il valore del filtro applicato, da mostrare nell'header della card
-     *
-     */
-    CustomAppliedFilterInfoFunction;
-    /**
-     * Per i filtri di tipo ContainsElement e NotContainsElement che si basano sull'applicazione di una where part con l'operatore
-     * Linq ANY allora questa proprietà permette di definire il nome della proprietà degli oggetti figli su cui applicare la where part.
-     * In questo caso dentro PropertyName ci andrà il nome della proprietà contenente la lista di child.
-     *
-     * (Es: PropertyName = 'Users' e ChildElementPropertyName = 'Role' per filtrare i record che contengono una lista di utenti con uno specifico)
-     */
-    ChildElementPropertyName;
-    static CreateStandardFilterConfig(filterID, label, propertyName, type, wherePartType, filterClass, filterCvlConfig, externaltemplate, customWherePartFunction, childElementPropertyName, filterValue, preventRemoval) {
-        let filter = new FilterConfig(filterID, filterClass, label, propertyName, null, type, wherePartType, filterCvlConfig, preventRemoval);
-        if (externaltemplate)
-            filter.Externaltemplate = externaltemplate;
-        if (customWherePartFunction)
-            filter.CustomWherePartFunction = customWherePartFunction;
-        if (childElementPropertyName)
-            filter.ChildElementPropertyName = childElementPropertyName;
-        if (filterValue)
-            filter.PropertyObject = filterValue;
-        return filter;
-    }
-    /**
-     * Se la CVL si basa su un enumeratore allora in questa proprietà va definito il type dell'enumeratore da usare.
-     * In questo modo la sorgente dati della CVL sarà l'insieme dei valori definiti per l'enumeratore
-     */
-    EnumData;
-    /**
-     * Se la CVL si basa su un array allora in questa proprietà va definito l'array da mostrare come sorgente dati della CVL
-     */
-    ArrayData;
-    /**
-     * Nel caso di ArrayData definito permette di indicare la proprietà degli oggetti dell'array da bindare al filtro
-     */
-    ArrayKeyProperty;
-    /**
-     * Nel caso di ArrayData definito permette di indicare la proprietà degli oggetti da visualizzare nel filtro
-     */
-    ArrayValueProperty;
-    /**
-     * Se TRUE allora mostra il campo di ricerca all'interno della CVL (default: TRUE)
-     */
-    IsEnumSearchable = false;
-    /**
-     * Se TRUE allora mostra il pulsante per pulire la selezione della CVL (default: TRUE)
-     */
-    ShowEnumCancelButton = true;
-    /**
-     * Permette di definire l'etichetta per il campo di ricerca della CVL (default: 'Cerca')
-     */
-    EnumSearchText = "Cerca";
-    /**
-     * Permette di definire la multi selezione dei valori della CVL (default: false)
-     */
-    IsEnumMultiSelect = false;
-    /**
-     * Se TRUE allora mostra il campo di ricerca all'interno della lookup (default: TRUE)
-     */
-    IsLookupSearchable = false;
-    /**
-     * Se TRUE allora mostra il pulsante per pulire la selezione della lookup (default: TRUE)
-     */
-    ShowLookupCancelButton = true;
-    /**
-     * Permette di definire l'etichetta per il campo di ricerca della Lookup (default: 'Cerca')
-     */
-    LookupSearchText = "Cerca";
-    /**
-     * Permette di definire la multi selezione dei valori della lookup (default: false)
-     */
-    IsLookupMultiple = false;
-    /**
-     * Permette di definire se nella lookup il binding deve considerare tutto l'oggetto
-     * (default: true)
-     */
-    BindLookupFullObject = true;
-    /**
-     * Permette di definire l'entità della lookup
-     */
-    LookupEntityType = null;
-    /**
-     * Permette di definire l'url per effettuare la chiamata che popola la lookup
-     */
-    LookupFullUrlHttpCall = null;
-    /**
-     * Permette di definire (in maniera opzionale) gli eventuali predicati standard da applicare nel recuperare gli item per la lookup
-     */
-    DataFilter = null;
-    /**
-     * Permette di definire un oggetto contenente la funzione di validazione e la label del suggerimento per validare il campo del filtro
-     */
-    ValidationProperties;
-}
-/**
- * Classe che permette di configurare una eqp-select (CVL) per uno specifico filtro
- */
-class FilterCvlConfig {
-    /**
-     * Se la CVL si basa su un enumeratore allora in questa proprietà va definito il type dell'enumeratore da usare.
-     * In questo modo la sorgente dati della CVL sarà l'insieme dei valori definiti per l'enumeratore
-     */
-    EnumData;
-    /**
-     * Se la CVL si basa su un array allora in questa proprietà va definito l'array da mostrare come sorgente dati della CVL
-     */
-    ArrayData;
-    /**
-     * Nel caso di ArrayData definito permette di indicare la proprietà degli oggetti dell'array da bindare al filtro
-     */
-    ArrayKeyProperty;
-    /**
-     * Nel caso di ArrayData definito permette di indicare la proprietà degli oggetti da visualizzare nel filtro
-     */
-    ArrayValueProperty;
-    /**
-     * Se TRUE allora mostra il campo di ricerca all'interno della CVL (default: TRUE)
-     */
-    IsSearchable = false;
-    /**
-     * Se TRUE allora mostra il pulsante per pulire la selezione della CVL (default: TRUE)
-     */
-    ShowCancelButton = true;
-    /**
-     * Permette di definire l'etichetta per il campo di ricerca (default: 'Cerca')
-     */
-    SearchText = "Cerca";
-    /**
-     * Permette di definire la multi selezione dei valori della CVL (default: false)
-     */
-    IsMultiSelect = false;
-    /**
-     * Permette di definire se nella CVL il binding deve considera tutto l'oggetto o solo la proprietà
-     * definita dentro ArrayKeyProperty
-     * (default: true)
-     */
-    BindFullObject = true;
-    /**
-     * Dati gli opportuni parametri restituisce un oggetto FilterCvlConfig pronto all'uso.
-     * @param enumData Type dell'enumeratore da usare nella cvl (opzionale)
-     * @param arrayData Array da usare nella cvl (opzionale)
-     * @param arrayKeyProperty Nome della proprietà da usare come binding (opzionale)
-     * @param arrayValueProperty Nome della proprietà da mostrare nella CVL (opzionale)
-     * @param isMultiSelect Attiva o disattiva la multiselezione (opzionale)
-     * @param isSearchable Attiva o disattiva la ricerca nella CVL (opzionale)
-     * @param showCancelButton Attiva o disattiva il pulsante per pulire la selezione nella CVL (opzionale)
-     * @param searchText Definisce l'etichetta del campo di ricerca (opzionale)
-     * @returns Valida i parametri e restituisce un oggetto di tipo FilterCvlConfig
-     */
-    static CreateFilterCVLConfig(enumData, arrayData, arrayKeyProperty, arrayValueProperty, isMultiSelect, isSearchable, showCancelButton, searchText, bindFullObject) {
-        let cvlConfig = new FilterCvlConfig();
-        if ((enumData == null || enumData == undefined) && (arrayData == null || arrayData == undefined)) {
-            throw new Error("It's mandatory to define one of the enumData or enumArray properties");
-        }
-        cvlConfig.ArrayData = arrayData;
-        cvlConfig.EnumData = enumData;
-        cvlConfig.ArrayKeyProperty = arrayKeyProperty;
-        cvlConfig.ArrayValueProperty = arrayValueProperty;
-        if (isMultiSelect != null)
-            cvlConfig.IsMultiSelect = isMultiSelect;
-        if (isSearchable != null)
-            cvlConfig.IsSearchable = isSearchable;
-        if (showCancelButton != null)
-            cvlConfig.ShowCancelButton = showCancelButton;
-        if (searchText)
-            cvlConfig.SearchText = searchText;
-        if (bindFullObject != null)
-            cvlConfig.BindFullObject = bindFullObject;
-        return cvlConfig;
-    }
-}
-/**
- * Classe utilizzata per memorizzare le informazioni sui filtri salvati nel local storage.
- * Utilizzata solo se per la direttiva eqp-filters è stato richiesto il salvataggio dei filtri
- */
-class SavedFilterItem {
-    FilterName;
-    PreventRemoval;
-}
-var InputType;
-(function (InputType) {
-    InputType[InputType["Text"] = 1] = "Text";
-    InputType[InputType["Number"] = 2] = "Number";
-    InputType[InputType["Date"] = 3] = "Date";
-    InputType[InputType["Datetime"] = 4] = "Datetime";
-    InputType[InputType["CvlEnum"] = 5] = "CvlEnum";
-    InputType[InputType["Cvl"] = 6] = "Cvl";
-    InputType[InputType["Boolean"] = 7] = "Boolean";
-    InputType[InputType["BooleanCvl"] = 8] = "BooleanCvl";
-    InputType[InputType["CustomTemplate"] = 9] = "CustomTemplate";
-    InputType[InputType["DateRange"] = 10] = "DateRange";
-    InputType[InputType["Lookup"] = 11] = "Lookup";
-})(InputType || (InputType = {}));
-var WherePartType;
-(function (WherePartType) {
-    WherePartType[WherePartType["Equal"] = 1] = "Equal";
-    WherePartType[WherePartType["NotEqual"] = 2] = "NotEqual";
-    WherePartType[WherePartType["StringContains"] = 3] = "StringContains";
-    WherePartType[WherePartType["StringNotContains"] = 4] = "StringNotContains";
-    WherePartType[WherePartType["GreaterThan"] = 5] = "GreaterThan";
-    WherePartType[WherePartType["GreaterThanOrEqual"] = 6] = "GreaterThanOrEqual";
-    WherePartType[WherePartType["LessThan"] = 7] = "LessThan";
-    WherePartType[WherePartType["LessThanOrEqual"] = 8] = "LessThanOrEqual";
-    WherePartType[WherePartType["ContainsElement"] = 9] = "ContainsElement";
-    WherePartType[WherePartType["NotContainsElement"] = 10] = "NotContainsElement";
-})(WherePartType || (WherePartType = {}));
-var FilterSizeClass;
-(function (FilterSizeClass) {
-    FilterSizeClass[FilterSizeClass["SMALL"] = 1] = "SMALL";
-    FilterSizeClass[FilterSizeClass["MEDIUM"] = 2] = "MEDIUM";
-    FilterSizeClass[FilterSizeClass["LARGE"] = 3] = "LARGE";
-    FilterSizeClass[FilterSizeClass["CUSTOM"] = 4] = "CUSTOM";
-})(FilterSizeClass || (FilterSizeClass = {}));
-/**
- * Enumeratore usato come input del componente eqp-filter.
- * Permette di indicare la complessità dell'oggetto da restituire quando viene premuto
- * il pulsante Applica FIltri.
- * La documentazione delle due tipologie è stata riportata nel metodo createFilterValue del componente
- * eqp-filters.component.ts
- */
-var FilterResultType;
-(function (FilterResultType) {
-    FilterResultType[FilterResultType["BASIC"] = 1] = "BASIC";
-    FilterResultType[FilterResultType["ADVANCED"] = 2] = "ADVANCED";
-})(FilterResultType || (FilterResultType = {}));
-/**
- * Utilizzato per battezzare il comportamento e l'aspetto grafico della direttiva eqp-filters.
- * WITH_CARD: viene renderizzata una card espandibile e i filtri sono visualizzati nel mat-card-content. Quando si applicano i filtri nel card-header vengono riepilogati i filtri applicati
- * WITH_BUTTON: viene renderizzato un pulsante (con lo stesso stile del card-header precedente). Alla pressione del pulsante si apre una modale contenente tutti i filtri. Quando si applicano o resettano i filtri la modale si chiude e nel pulsante vengono riepilogati i filtri applicati
- */
-var FilterMode;
-(function (FilterMode) {
-    FilterMode[FilterMode["WITH_CARD"] = 1] = "WITH_CARD";
-    FilterMode[FilterMode["WITH_BUTTON"] = 2] = "WITH_BUTTON";
-})(FilterMode || (FilterMode = {}));
-class ValidationObject {
-    Valid;
-    HintLabel;
-}
-
-class BaseFieldModel {
-    key;
-    display;
-    value;
-    format;
-    numberPipe;
-    currencyPipeCode;
-    enumModel;
-    styles;
-    disabled;
-    multilanguagePrefixKey;
-    tooltip;
-    baseType;
-}
-var BaseType;
-(function (BaseType) {
-    BaseType[BaseType["Text"] = 1] = "Text";
-    BaseType[BaseType["Number"] = 2] = "Number";
-    BaseType[BaseType["Date"] = 3] = "Date";
-    BaseType[BaseType["Enum"] = 4] = "Enum";
-    BaseType[BaseType["Boolean"] = 5] = "Boolean";
-})(BaseType || (BaseType = {}));
-var NumberColumnPipe;
-(function (NumberColumnPipe) {
-    NumberColumnPipe[NumberColumnPipe["DECIMAL"] = 1] = "DECIMAL";
-    NumberColumnPipe[NumberColumnPipe["PERCENT"] = 2] = "PERCENT";
-    NumberColumnPipe[NumberColumnPipe["CURRENCY"] = 3] = "CURRENCY";
-})(NumberColumnPipe || (NumberColumnPipe = {}));
-class BooleanValues {
-    true;
-    false;
-}
-class Style {
-    flex;
-    minWidth;
-    maxWidth;
-    color;
-    cellAlignment = CellAlignmentEnum.LEFT;
-}
-var CellAlignmentEnum;
-(function (CellAlignmentEnum) {
-    CellAlignmentEnum[CellAlignmentEnum["LEFT"] = 1] = "LEFT";
-    CellAlignmentEnum[CellAlignmentEnum["RIGHT"] = 2] = "RIGHT";
-    CellAlignmentEnum[CellAlignmentEnum["CENTER"] = 3] = "CENTER";
-})(CellAlignmentEnum || (CellAlignmentEnum = {}));
-class EqpMatTooltip {
-    tooltipText;
-    tooltipPosition;
-}
-var TooltipPositionType;
-(function (TooltipPositionType) {
-    TooltipPositionType["Below"] = "below";
-    TooltipPositionType["Above"] = "above";
-    TooltipPositionType["Left"] = "left";
-    TooltipPositionType["Right"] = "right";
-})(TooltipPositionType || (TooltipPositionType = {}));
-
-class FilterField extends BaseFieldModel {
-    constructor(filterID, fieldClass, label, propertyName, propertyValue, inputType, wherePartType, cvlConfig, preventRemoval) {
-        super();
-        this.filterID = filterID;
-        if (fieldClass)
-            this.fieldSizeClass = fieldClass;
-        this.display = label;
-        this.key = propertyName;
-        this.value = propertyValue;
-        this.inputType = inputType;
-        this.wherePartType = wherePartType;
-        this.preventRemoval = preventRemoval;
-        this.arrayData = cvlConfig?.ArrayData;
-        this.arrayKeyProperty = cvlConfig?.ArrayKeyProperty;
-        this.arrayValueProperty = cvlConfig?.ArrayValueProperty;
-        this.isEnumSearchable = cvlConfig?.IsSearchable;
-        this.showEnumCancelButton = cvlConfig?.ShowCancelButton;
-        this.enumSearchText = cvlConfig?.SearchText;
-        this.isEnumMultiSelect = cvlConfig?.IsMultiSelect;
-        this.bindLookupFullObject = cvlConfig?.BindFullObject;
-        this.placeholder = label;
-    }
-    /**
-     * Identificativo univoco del filtro
-     */
-    filterID;
-    /**
-     * Permette di definire la classe css da applicare
-     * al filtro
-     */
-    fieldSizeClass = FieldSizeClass.SMALL;
-    /**
-     *
-     */
-    customFieldSizeClasses;
-    /**
-     * Definisce il tipo di filtro da applicare (valori ammessi in base all'enumeratore InputType)
-     */
-    inputType;
-    /**
-     * Definisce il tipo di operatore logico da utilizzare per la where part
-     */
-    wherePartType;
-    /**
-     * Se il filtro è di tipo CVL o CVLEnum allora in questa proprietà ci va definita la configurazione della cvl.
-     * La cvl verrà renderizzata con una eqp-select
-     */
-    cvlConfig;
-    /**
-     * Permette di disabilitare la cancellazione del filtro all'utente.
-     * Di default assume il valore FALSE (se true allora nel riepilogo dei filtri applicati non sarà mostrato il pulsante X)
-     */
-    preventRemoval = false;
-    /**
-     * Definisce il placeholder che verrà utilizzato nel campo del singolo filtro
-     */
-    placeholder;
-    /**
-     * Permette di definire il template esterno da renderizzare come filtro.
-     */
-    externalTemplate;
-    /**
-     * Permette di definire una funzione custom esterna da richiamare per il filtro corrente quando vengono premuti i pulsanti APPLICA FILTRI
-     * o RESET
-     */
-    customWherePartFunction;
-    /**
-     * Permette di definire la funzione custom per restituire il valore del filtro applicato, da mostrare nell'header della card
-     *
-     */
-    customAppliedFilterInfoFunction;
-    /**
-     * Per i filtri di tipo ContainsElement e NotContainsElement che si basano sull'applicazione di una where part con l'operatore
-     * Linq ANY allora questa proprietà permette di definire il nome della proprietà degli oggetti figli su cui applicare la where part.
-     * In questo caso dentro PropertyName ci andrà il nome della proprietà contenente la lista di child.
-     *
-     * (Es: PropertyName = 'Users' e ChildElementPropertyName = 'Role' per filtrare i record che contengono una lista di utenti con uno specifico)
-     */
-    childElementPropertyName;
-    static createStandardFilterConfig(filterID, label, propertyName, type, wherePartType, filterClass, filterCvlConfig, externaltemplate, customWherePartFunction, childElementPropertyName, filterValue, preventRemoval) {
-        let filter = new FilterField(filterID, filterClass, label, propertyName, null, type, wherePartType, filterCvlConfig, preventRemoval);
-        if (externaltemplate)
-            filter.externalTemplate = externaltemplate;
-        if (customWherePartFunction)
-            filter.customWherePartFunction = customWherePartFunction;
-        if (childElementPropertyName)
-            filter.childElementPropertyName = childElementPropertyName;
-        if (filterValue)
-            filter.value = filterValue;
-        return filter;
-    }
-    /**
-     * Se la CVL si basa su un enumeratore allora in questa proprietà va definito il type dell'enumeratore da usare.
-     * In questo modo la sorgente dati della CVL sarà l'insieme dei valori definiti per l'enumeratore
-     */
-    // public enumData?: any;
-    /**
-     * Se la CVL si basa su un array allora in questa proprietà va definito l'array da mostrare come sorgente dati della CVL
-     */
-    arrayData;
-    /**
-     * Nel caso di ArrayData definito permette di indicare la proprietà degli oggetti dell'array da bindare al filtro
-     */
-    arrayKeyProperty;
-    /**
-     * Nel caso di ArrayData definito permette di indicare la proprietà degli oggetti da visualizzare nel filtro
-     */
-    arrayValueProperty;
-    /**
-     * Se TRUE allora mostra il campo di ricerca all'interno della CVL (default: TRUE)
-     */
-    isEnumSearchable = false;
-    /**
-     * Se TRUE allora mostra il pulsante per pulire la selezione della CVL (default: TRUE)
-     */
-    showEnumCancelButton = true;
-    /**
-     * Permette di definire l'etichetta per il campo di ricerca della CVL (default: 'Cerca')
-     */
-    enumSearchText = "Cerca";
-    /**
-     * Permette di definire la multi selezione dei valori della CVL (default: false)
-     */
-    isEnumMultiSelect = false;
-    /**
-     * Se TRUE allora mostra il campo di ricerca all'interno della lookup (default: TRUE)
-     */
-    isLookupSearchable = false;
-    /**
-     * Se TRUE allora mostra il pulsante per pulire la selezione della lookup (default: TRUE)
-     */
-    showLookupCancelButton = true;
-    /**
-     * Permette di definire l'etichetta per il campo di ricerca della Lookup (default: 'Cerca')
-     */
-    lookupSearchText = "Cerca";
-    /**
-     * Permette di definire la multi selezione dei valori della lookup (default: false)
-     */
-    isLookupMultiple = false;
-    /**
-     * Permette di definire se nella lookup il binding deve considerare tutto l'oggetto
-     * (default: true)
-     */
-    bindLookupFullObject = true;
-    /**
-     * Permette di definire l'entità della lookup
-     */
-    lookupEntityType = null;
-    /**
-     * Permette di definire l'url per effettuare la chiamata che popola la lookup
-     */
-    lookupFullUrlHttpCall = null;
-    /**
-     * Permette di definire (in maniera opzionale) gli eventuali predicati standard da applicare nel recuperare gli item per la lookup
-     */
-    dataFilter = null;
-    /**
-     * Permette di definire un oggetto contenente la funzione di validazione e la label del suggerimento per validare il campo del filtro
-     */
-    validationProperties;
-    static createFilterFields(baseFields) {
-        if (Array.isArray(baseFields)) {
-            const filterFields = [];
-            baseFields.forEach(field => {
-                filterFields.push(this.createFilterField(field));
-            });
-            return filterFields;
-        }
-        else {
-            return this.createFilterField(baseFields);
-        }
-    }
-    static createFilterField(baseField) {
-        const filterField = new FilterField();
-        filterField.filterID = baseField.key + "_ID";
-        filterField.key = baseField.key;
-        filterField.display = baseField.display;
-        filterField.value = baseField.value;
-        filterField.enumModel = baseField.enumModel;
-        filterField.inputType = BaseTypeConverterFilter.convertToInputType(baseField.baseType);
-        filterField.wherePartType = WherePartType.Equal;
-        filterField.baseType = null;
-        return filterField;
-    }
-    static createFilterConfigs(filterFields) {
-        if (Array.isArray(filterFields)) {
-            const filterConfigs = [];
-            filterFields.forEach(field => {
-                filterConfigs.push(this.createFilterConfig(field));
-            });
-            return filterConfigs;
-        }
-        else {
-            return this.createFilterConfig(filterFields);
-        }
-    }
-    static createFilterConfig(filterField) {
-        const filterConfig = new FilterConfig();
-        filterConfig.FilterID = filterField.filterID ?? (filterField.key + "_ID");
-        filterConfig.PropertyName = filterField.key;
-        filterConfig.Label = filterField.display;
-        filterConfig.PropertyObject = filterField.value;
-        filterConfig.EnumData = filterField.enumModel;
-        filterConfig.Externaltemplate = filterField.externalTemplate;
-        filterConfig.ArrayData = filterField.arrayData;
-        filterConfig.ArrayKeyProperty = filterField.arrayKeyProperty;
-        filterConfig.ArrayValueProperty = filterField.arrayValueProperty;
-        filterConfig.BindLookupFullObject = filterField.bindLookupFullObject;
-        filterConfig.ChildElementPropertyName = filterField.childElementPropertyName;
-        filterConfig.CustomAppliedFilterInfoFunction = filterField.customAppliedFilterInfoFunction;
-        filterConfig.CustomFilterClasses = filterField.customFieldSizeClasses;
-        filterConfig.CustomWherePartFunction = filterField.customWherePartFunction;
-        filterConfig.CvlConfig = filterField.cvlConfig;
-        filterConfig.EnumSearchText = filterField.enumSearchText;
-        filterConfig.FilterClass = filterField.fieldSizeClass;
-        filterConfig.IsEnumMultiSelect = filterField.isEnumMultiSelect;
-        filterConfig.IsEnumSearchable = filterField.isEnumSearchable;
-        filterConfig.IsLookupMultiple = filterField.isLookupMultiple;
-        filterConfig.LookupEntityType = filterField.lookupEntityType;
-        filterConfig.LookupFullUrlHttpCall = filterField.lookupEntityType;
-        filterConfig.LookupSearchText = filterField.lookupSearchText;
-        filterConfig.DataFilter = filterField.dataFilter;
-        filterConfig.PreventRemoval = filterField.preventRemoval;
-        filterConfig.ShowEnumCancelButton = filterField.showEnumCancelButton;
-        filterConfig.ShowLookupCancelButton = filterField.showLookupCancelButton;
-        filterConfig.ValidationProperties = filterField.validationProperties;
-        filterConfig.InputType = filterField.inputType ?? InputType.Text;
-        filterConfig.WherePartType = filterField.wherePartType ?? WherePartType.Equal;
-        return filterConfig;
-    }
-}
-class BaseTypeConverterFilter {
-    static convertToInputType(baseType) {
-        switch (baseType) {
-            case BaseType.Text:
-                return InputType.Text;
-            case BaseType.Number:
-                return InputType.Number;
-            case BaseType.Date:
-                return InputType.Date;
-            case BaseType.Enum:
-                return InputType.CvlEnum;
-            case BaseType.Boolean:
-                return InputType.Boolean;
-            default:
-                return undefined;
-        }
-    }
-}
-
-// import { ExportType } from 'mat-table-exporter';
-class ConfigColumn {
-    key;
-    display;
-    value;
-    type;
-    format;
-    numberPipe;
-    currencyPipeCode;
-    actions;
-    booleanValues;
-    enumModel;
-    buttonMenuIcon;
-    icons;
-    styles;
-    containerStyle;
-    isSearchable = true;
-    disabled;
-    multilanguagePrefixKey;
-    tooltip;
-    hyperlink;
-    image;
-    additionalValue;
-    externalTemplate;
-    externalTemplateSearchFunction;
-    isSortable = true;
-    isFilterable = true;
-    isHidden = false;
-    isSticky = false;
-    isStickyEnd = false;
-}
-var TypeColumn;
-(function (TypeColumn) {
-    TypeColumn[TypeColumn["Date"] = 1] = "Date";
-    TypeColumn[TypeColumn["Boolean"] = 2] = "Boolean";
-    TypeColumn[TypeColumn["SimpleAction"] = 3] = "SimpleAction";
-    TypeColumn[TypeColumn["MenuAction"] = 4] = "MenuAction";
-    TypeColumn[TypeColumn["Enum"] = 5] = "Enum";
-    TypeColumn[TypeColumn["Icon"] = 6] = "Icon";
-    TypeColumn[TypeColumn["Checkbox"] = 7] = "Checkbox";
-    TypeColumn[TypeColumn["Hyperlink"] = 8] = "Hyperlink";
-    TypeColumn[TypeColumn["Image"] = 9] = "Image";
-    TypeColumn[TypeColumn["Color"] = 10] = "Color";
-    TypeColumn[TypeColumn["ExternalTemplate"] = 11] = "ExternalTemplate";
-})(TypeColumn || (TypeColumn = {}));
-class ConfigAction {
-    name;
-    icon;
-    disabled;
-    fn;
-    hidden;
-    fontawesome;
-    tooltip;
-    color;
-}
-class Icon {
-    className;
-    tooltip;
-}
-class Hyperlink {
-    hyperlinkText;
-    hyperlinkUrl;
-    isTargetBlank;
-}
-let Image$1 = class Image {
-    imagePreview;
-    imageFull;
-};
-class ExportEqpTable {
-    // exportFileType?: ExportType | Array<ExportType> | CustomExportType | Array<CustomExportType>;
-    exportFileType;
-    exportFileName;
-    hiddenColumns;
-    buttonText;
-    buttonTextTranslateKey;
-    buttonIcon;
-    tooltipText;
-    tooltipTextTranslateKey;
-    tooltipPosition;
-    showButtonBorder;
-    customExportFunction;
-}
-class CustomButton {
-    buttonText;
-    buttonTextTranslateKey;
-    icon;
-    color;
-    fontawesome;
-    tooltipText;
-    tooltipTextTranslateKey;
-    tooltipPosition;
-    customButtonFunction;
-    order;
-    containerStyle;
-}
-class HeaderFilter {
-    column;
-    key;
-    styles;
-    isSearchable = true;
-    type;
-}
-var CustomExportType;
-(function (CustomExportType) {
-    CustomExportType["XLS"] = "xls";
-    CustomExportType["CustomXLS"] = "xls";
-    CustomExportType["XLSX"] = "xlsx";
-    CustomExportType["CustomXLSX"] = "xlsx";
-    CustomExportType["CSV"] = "csv";
-    CustomExportType["CustomCSV"] = "csv";
-    CustomExportType["TXT"] = "txt";
-    CustomExportType["CustomTXT"] = "txt";
-    CustomExportType["JSON"] = "json";
-    CustomExportType["CustomJSON"] = "json";
-})(CustomExportType || (CustomExportType = {}));
-
-class TableColumnField extends BaseFieldModel {
-    type;
-    actions;
-    booleanValues;
-    buttonMenuIcon;
-    icons;
-    containerStyle;
-    isSearchable = true;
-    hyperlink;
-    image;
-    additionalValue;
-    externalTemplateSearchFunction;
-    isSortable = true;
-    isFilterable = true;
-    isHidden = false;
-    isSticky = false;
-    isStickyEnd = false;
-    externalTemplate;
-    static createTableColumnFields(baseFields) {
-        if (Array.isArray(baseFields)) {
-            const tableColumnFields = [];
-            baseFields.forEach(field => {
-                tableColumnFields.push(this.createTableColumnField(field));
-            });
-            return tableColumnFields;
-        }
-        else {
-            return this.createTableColumnField(baseFields);
-        }
-    }
-    static createTableColumnField(baseField) {
-        const tableColumnField = new TableColumnField();
-        tableColumnField.key = baseField.key;
-        tableColumnField.display = baseField.display;
-        tableColumnField.value = baseField.value;
-        tableColumnField.enumModel = baseField.enumModel;
-        tableColumnField.booleanValues = { true: '<i class="fa fa-check"></i>', false: '<i class="fa fa-close"></i>' }; //DEFAULT
-        tableColumnField.styles = baseField.styles != null ? baseField.styles : { minWidth: "250px" }; //DEFAULT
-        tableColumnField.type = BaseTypeConverterTable.convertToTypeColumn(baseField.baseType);
-        tableColumnField.baseType = null;
-        return tableColumnField;
-    }
-    static createConfigColumns(tableColumnFields) {
-        if (Array.isArray(tableColumnFields)) {
-            const configColumns = [];
-            tableColumnFields.forEach(field => {
-                configColumns.push(this.createConfigColumn(field));
-            });
-            return configColumns;
-        }
-        else {
-            return this.createConfigColumn(tableColumnFields);
-        }
-    }
-    static createConfigColumn(tableColumnField) {
-        const configColumn = new ConfigColumn();
-        configColumn.key = tableColumnField.key;
-        configColumn.display = tableColumnField.display;
-        configColumn.value = tableColumnField.value;
-        configColumn.enumModel = tableColumnField.enumModel;
-        configColumn.booleanValues = tableColumnField.booleanValues;
-        configColumn.externalTemplate = tableColumnField.externalTemplate;
-        configColumn.type = tableColumnField.type;
-        configColumn.isSortable = tableColumnField.isSortable ?? true;
-        configColumn.isFilterable = tableColumnField.isFilterable ?? true;
-        configColumn.isHidden = tableColumnField.isHidden ?? false;
-        configColumn.isSticky = tableColumnField.isSticky ?? false;
-        configColumn.isStickyEnd = tableColumnField.isStickyEnd ?? false;
-        configColumn.isSearchable = tableColumnField.isSearchable ?? true;
-        configColumn.format = tableColumnField.format;
-        configColumn.numberPipe = tableColumnField.numberPipe;
-        configColumn.currencyPipeCode = tableColumnField.currencyPipeCode;
-        configColumn.actions = tableColumnField.actions;
-        configColumn.buttonMenuIcon = tableColumnField.buttonMenuIcon;
-        configColumn.icons = tableColumnField.icons;
-        configColumn.styles = tableColumnField.styles;
-        configColumn.containerStyle = tableColumnField.type;
-        configColumn.disabled = tableColumnField.disabled;
-        configColumn.multilanguagePrefixKey = tableColumnField.multilanguagePrefixKey;
-        configColumn.tooltip = tableColumnField.tooltip;
-        configColumn.hyperlink = tableColumnField.hyperlink;
-        configColumn.image = tableColumnField.image;
-        configColumn.additionalValue = tableColumnField.additionalValue;
-        return configColumn;
-    }
-}
-class BaseTypeConverterTable {
-    static convertToTypeColumn(baseType) {
-        switch (baseType) {
-            case BaseType.Text:
-                return undefined;
-            case BaseType.Number:
-                return undefined;
-            case BaseType.Date:
-                return TypeColumn.Date;
-            case BaseType.Enum:
-                return TypeColumn.Enum;
-            case BaseType.Boolean:
-                return TypeColumn.Boolean;
-            default:
-                return undefined;
-        }
-    }
-}
-
-class FormField extends BaseFieldModel {
-    required = false;
-    showInForm = true;
-    booleanLabelPosition = BoolLabelPosition.After;
-    formFieldType;
-    lookupObject;
-    selectObject;
-    validationProperties;
-    placeholder;
-    externalTemplate;
-    fieldSizeClass = FieldSizeClass.SMALL;
-    customFieldSizeClasses;
-    dependentFieldKey;
-    orderPosition;
-    dependentValidation;
-    static createFormFields(baseFields) {
-        if (Array.isArray(baseFields)) {
-            const formFields = [];
-            baseFields.forEach(field => {
-                formFields.push(this.createFormField(field));
-            });
-            return formFields;
-        }
-        else {
-            return this.createFormField(baseFields);
-        }
-    }
-    static createFormField(baseField) {
-        const formField = new FormField();
-        formField.key = baseField.key;
-        formField.display = baseField.display;
-        formField.value = baseField.value;
-        formField.enumModel = baseField.enumModel;
-        formField.formFieldType = BaseTypeConverter.convertToFormFieldType(baseField.baseType);
-        formField.baseType = null;
-        return formField;
-    }
-}
-var FormFieldType;
-(function (FormFieldType) {
-    FormFieldType[FormFieldType["Text"] = 1] = "Text";
-    FormFieldType[FormFieldType["Number"] = 2] = "Number";
-    FormFieldType[FormFieldType["Date"] = 3] = "Date";
-    FormFieldType[FormFieldType["Enum"] = 4] = "Enum";
-    FormFieldType[FormFieldType["Boolean"] = 5] = "Boolean";
-    FormFieldType[FormFieldType["ExternalTemplate"] = 6] = "ExternalTemplate";
-    FormFieldType[FormFieldType["Cvl"] = 7] = "Cvl";
-    FormFieldType[FormFieldType["Lookup"] = 8] = "Lookup";
-    FormFieldType[FormFieldType["DateTime"] = 9] = "DateTime";
-    FormFieldType[FormFieldType["DateRange"] = 10] = "DateRange";
-})(FormFieldType || (FormFieldType = {}));
-var BoolLabelPosition;
-(function (BoolLabelPosition) {
-    BoolLabelPosition["Before"] = "before";
-    BoolLabelPosition["After"] = "after";
-})(BoolLabelPosition || (BoolLabelPosition = {}));
-class LookupObject {
-    fullUrlHttpCall;
-    lookupEntityType;
-    showLookupCancelButton = true;
-    isLookupSearchable = false;
-    isLookupMultiple = false;
-    placeholder;
-    bindLabel = "Label";
-    bindKey = "ID";
-    items;
-    notFoundText = "Nessun risultato trovato";
-    genericAddComponent;
-    isMultiple = false;
-    isSearchable = true;
-    isClearable = true;
-    isVirtualScroll = false;
-    isReadonly = false;
-    isRequired = false;
-    isDisabled = false;
-    entityType;
-    formGroupInput;
-    formControlNameInput;
-    ngModelInput;
-    isSearchWhileComposing = false;
-    bindCompleteObject = true;
-    appendToInput;
-    disableReloadOnLookupAddingCompleteParent = false;
-    showOptionTooltip = false;
-    sortList = false;
-    dataFilter;
-    customConfig;
-    complexDataFilter;
-    initialItems;
-    ngModelOptions = null;
-    isEditable = false;
-    isMultiline = false;
-    dropdownPosition = "auto";
-    selectOnTab = false;
-    addButtonText = "Crea nuovo";
-    editButtonText = "Modifica";
-    selectAll = false;
-    selectAllText = "Seleziona tutto";
-    groupBy = "";
-    groupValue = () => true;
-    groupByProperty;
-    selectableGroup = false;
-    selectableGroupAsModel = false;
-    clearAllText = "Elimina";
-    customOption;
-    customLabel;
-    manipulateDataFn;
-    compareFunction = (iteratedObject, bindedObject) => {
-        if (iteratedObject == null || bindedObject == null)
-            return true;
-        const iteratedKeyProperty = iteratedObject.Key != null ? "Key" : this.bindKey;
-        const bindedKeyProperty = bindedObject?.Key != null ? "Key" : this.bindKey;
-        return iteratedObject[iteratedKeyProperty] === bindedObject ||
-            iteratedObject[iteratedKeyProperty] === bindedObject[bindedKeyProperty];
-    };
-}
-class SelectObject {
-    isEnumMultiSelect;
-    showEnumCancelButton;
-    isEnumSearchable;
-    enumSearchText;
-    arrayData;
-    arrayKeyProperty;
-    arrayValueProperty;
-    enumData;
-    enumDataToExclude;
-    ngModelOptions;
-    ngModelInput;
-    isRequired;
-    isMultiLanguage;
-    multilanguagePrefixKey;
-    isAlphabeticalOrderable;
-    suffixIcon;
-    prefixIcon;
-    isReadonly;
-    isSearchWhileComposing;
-    appendToInput;
-    dropdownPosition;
-    selectOnTab;
-    selectAll;
-    selectAllText;
-    selectableGroupAsModel;
-    clearAllText;
-    customOption;
-    customLabel;
-    class;
-}
-class BaseTypeConverter {
-    static convertToFormFieldType(baseType) {
-        switch (baseType) {
-            case BaseType.Text:
-                return FormFieldType.Text;
-            case BaseType.Number:
-                return FormFieldType.Number;
-            case BaseType.Date:
-                return FormFieldType.Date;
-            case BaseType.Enum:
-                return FormFieldType.Enum;
-            case BaseType.Boolean:
-                return FormFieldType.Boolean;
-            default:
-                return undefined;
-        }
-    }
-}
-
-class EqpCommonService {
-    constructor() { }
-    /**
-   *
-   * @param baseFields Array di BaseFieldModel
-   * @param ctor Tipo da restituire
-   * @param keys Keys dell'array che verranno restituite, se null tutte
-   * @returns Array<T> del tipo passato nella firma
-   * https://www.typescriptlang.org/docs/handbook/2/generics.html
-   */
-    static convertAs(baseFields, ctor, keys, additionalProps) {
-        let convertedData;
-        if (ctor.name == "FilterField") {
-            convertedData = keys ? FilterField.createFilterFields(baseFields.filter(x => keys.includes(x.key))) : FilterField.createFilterFields(baseFields);
-        }
-        else if (ctor.name == "TableColumnField") {
-            convertedData = keys ? TableColumnField.createTableColumnFields(baseFields.filter(x => keys.includes(x.key))) : TableColumnField.createTableColumnFields(baseFields);
-        }
-        else if (ctor.name == "FormField") {
-            convertedData = keys ? FormField.createFormFields(baseFields.filter(x => keys.includes(x.key))) : FormField.createFormFields(baseFields);
-        }
-        this.mergeAdditionalProps(convertedData, additionalProps, 'key');
-        return convertedData;
-    }
-    static isBaseField(fields) {
-        if (!fields || fields.length === 0)
-            return false;
-        // Se tutti gli elementi hanno un baseType diverso da null, allora consideralo un array di BaseField
-        return fields.every(field => field && field.baseType != null);
-    }
-    getFieldSizeClass(field) {
-        if (field == null || field == undefined)
-            return "col-4";
-        if (field.fieldSizeClass == FieldSizeClass.SMALL)
-            return "col-xs-12 col-sm-12 col-md-4 col-lg-4 col-xl-4";
-        else if (field.fieldSizeClass == FieldSizeClass.MEDIUM)
-            return "col-xs-12 col-sm-12 col-md-8 col-lg-8 col-xl-8";
-        else if (field.fieldSizeClass == FieldSizeClass.LARGE)
-            return "col-xs-12 col-sm-12 col-md-12 col-lg-12 col-xl-12";
-        else if (field.fieldSizeClass == FieldSizeClass.CUSTOM && field.customFieldSizeClasses)
-            return field.customFieldSizeClasses;
-        else
-            return "col-xs-12 col-sm-12 col-md-4 col-lg-4 col-xl-4";
-    }
-    static mergeAdditionalProps(convertedData, additionalProps, comparisonKey) {
-        if (!additionalProps) {
-            return;
-        }
-        additionalProps.forEach(prop => {
-            const existingIndex = convertedData.findIndex(x => x[comparisonKey] === prop[comparisonKey]);
-            if (existingIndex !== -1) {
-                // Key già presente, merge
-                const defaults = convertedData[existingIndex];
-                const mergedObject = { ...defaults, ...prop };
-                convertedData[existingIndex] = mergedObject;
-            }
-            else {
-                // Key non presente, aggiungi
-                convertedData.push(prop);
-            }
-        });
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EqpCommonService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EqpCommonService, providedIn: 'root' });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EqpCommonService, decorators: [{
-            type: Injectable,
-            args: [{
-                    providedIn: 'root'
-                }]
-        }], ctorParameters: () => [] });
-
-/**
- * Classe utilizzata per la definizione di filtri avanzati.
- * Si basa sul concetto del LinqPredicate documentato nella guida EqProject.
- *
- * Ciascun oggetto LinqPredicateDTO può contenenere la definizione di N filtri diversi (di tipo LinqFilterDTO) che potranno essere messi tutti in OR tra loro.
- * In presenza di più oggetti di tipo LinqPredicateDTO tutti i LinqPredicateDTO saranni invece messi in AND tra loro.
- * In questo modo sarà possibile realizzare condizioni complesse
- */
-class LinqPredicateDTO {
-    /**
-     * Elenco di filtri di uno stesso predicato.
-     * Tutti i filtri contenuti in questa proprietà saranno considerati parte di tante OR
-     */
-    PropertyFilters;
-}
-/**
- * Permette di definire ogni singola condizione di una where part.
- */
-class LinqFilterDTO {
-    /**
-     * Nome della proprietà su cui applicare il filtro
-     */
-    PropertyName;
-    /**
-     * Valore della proprietà su cui applicare il filtro
-     */
-    PropertyValue;
-    /**
-     * Tipo di relazione. Identifica cioè l'operatore di confronto della where part
-     */
-    RelationType;
-    /**
-     * Se RelationType = ContainsElement o NotContainsElement allora in questa proprietà ci verrà definito
-     * il nome della proprietà degli oggetti della lista su cui applicare l'operatore Any
-     */
-    ListElementPropertyName;
-    static createFilter(propertyName, propertyValue, relationType, listElementPropertyName = null) {
-        let filter = new LinqFilterDTO();
-        filter.ListElementPropertyName = listElementPropertyName;
-        filter.PropertyName = propertyName;
-        filter.RelationType = relationType;
-        filter.PropertyValue = propertyValue;
-        return filter;
-    }
-}
-class LookupCustomConfig {
-    LabelProperties;
-    IncludeFullObject;
-}
-class ComplexLinqPredicateDTO {
-    Predicates;
-    /**
-     * Ricostruisce l'array di predicati complessi a partire dalla matrice di LinqPredicateDTO passata nel parametro.
-     * Ogni riga della matrice diventerà un elemento della lista restituita.
-     * Ogni elemento delle lista conterrà i dati della riga della matrice.
-     * @param complexPredicates Restituisce un array di oggetti di tipo ComplexLinqPredicateDTO
-     */
-    static CreateComplexPredicate(complexPredicates) {
-        let results = new Array();
-        complexPredicates.forEach(cp => {
-            let complexPredicate = new ComplexLinqPredicateDTO();
-            complexPredicate.Predicates = cp;
-            results.push(complexPredicate);
-        });
-        return results;
-    }
-}
-class LookupDTO {
-    ID;
-    Label;
-    FullObject;
-}
-
 class AttachmentHelperService {
     static imageMimeTypes = ["image/bmp", "image/gif", "image/jpeg", "image/tiff", "image/png"];
     static fileExtensionIcon = {
@@ -2293,11 +1128,11 @@ class EqpAttachmentsComponent {
         this.createAttachmentForm();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EqpAttachmentsComponent, deps: [{ token: i1.MatDialog }, { token: i2.FormBuilder }, { token: i3.DomSanitizer }, { token: i4.HttpClient }, { token: i0.ChangeDetectorRef }, { token: EqpAttachmentService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: EqpAttachmentsComponent, selector: "eqp-attachments", inputs: { disableAction: "disableAction", showHeader: "showHeader", headerTitle: "headerTitle", attachmentsList: "attachmentsList", showMatCard: "showMatCard", multipleAttachment: "multipleAttachment", loadMultipleFiles: "loadMultipleFiles", attachmentsColumns: "attachmentsColumns", emptyTableMessage: "emptyTableMessage", allowOnlyImages: "allowOnlyImages", acceptedFileTypes: "acceptedFileTypes", isDisabled: "isDisabled", showInlinePreview: "showInlinePreview", getAttachmentEndpoint: "getAttachmentEndpoint", productionBaseUrl: "productionBaseUrl", compressionOptions: "compressionOptions", allowedTypes: "allowedTypes", isEqpTableMultiLanguage: "isEqpTableMultiLanguage", tablePaginatorVisible: "tablePaginatorVisible", isTableSearcheable: "isTableSearcheable", tablePaginatorSize: "tablePaginatorSize", separatedUploadButtons: "separatedUploadButtons", showPreview: "showPreview", singleAttachmentDragAndDrop: "singleAttachmentDragAndDrop", cropOptions: "cropOptions", cropDialogClass: "cropDialogClass", downloadTooltipPosition: "downloadTooltipPosition", openLinkLabel: "openLinkLabel", addButtonLabel: "addButtonLabel", downloadLabel: "downloadLabel", deleteLabel: "deleteLabel", fileNameLabel: "fileNameLabel", previewLabel: "previewLabel", uploadFileLabel: "uploadFileLabel", confirmLabel: "confirmLabel", abortLabel: "abortLabel", saveLabel: "saveLabel", exitLabel: "exitLabel", uploadWithDropboxLabel: "uploadWithDropboxLabel", cropLabel: "cropLabel", eqpTableSearchText: "eqpTableSearchText", deleteDialogTitle: "deleteDialogTitle", deleteDialogMessage: "deleteDialogMessage", noImageSelectedErrorMessage: "noImageSelectedErrorMessage", wrongTypeSelectedErrorMessage: "wrongTypeSelectedErrorMessage", videoPreviewErrorMessage: "videoPreviewErrorMessage", audioPreviewErrorMessage: ["videoPreviewErrorMessage", "audioPreviewErrorMessage"], flipHorinzontalLabel: "flipHorinzontalLabel", flipVerticalLabel: "flipVerticalLabel", rotateRightLabel: "rotateRightLabel", rotateLeftLabel: "rotateLeftLabel" }, outputs: { localEditedAttachments: "localEditedAttachments", abortAddAttachment: "abortAddAttachment", downloadAttachment: "downloadAttachment", onDeleteAttachment: "onDeleteAttachment" }, viewQueries: [{ propertyName: "dialogAddAttachment", first: true, predicate: ["dialogAddAttachment"], descendants: true, static: true }, { propertyName: "dialogAddMultipleAttachment", first: true, predicate: ["dialogAddMultipleAttachment"], descendants: true, static: true }, { propertyName: "dialogCropImage", first: true, predicate: ["dialogCropImage"], descendants: true, static: true }, { propertyName: "imageCropper", first: true, predicate: ImageCropperComponent, descendants: true }, { propertyName: "imageInput", first: true, predicate: ["imageInput"], descendants: true }, { propertyName: "attachmentTable", first: true, predicate: ["attachmentTable"], descendants: true }, { propertyName: "inlinePreviewTemplate", first: true, predicate: ["inlinePreviewTemplate"], descendants: true, static: true }, { propertyName: "dialogPreview", first: true, predicate: ["dialogPreview"], descendants: true, static: true }], ngImport: i0, template: "<!-- Se richiesta la gestione singola mostra il pulsante di caricamento di un singolo file -->\r\n<div *ngIf=\"multipleAttachment != true\">\r\n  <div *ngIf=\"!singleAttachmentDragAndDrop\">\r\n    <!-- Template del button per l'aggiunta di un allegato -->\r\n    <div *ngIf=\"!addingLinkMode\" class=\"text-center\">\r\n      <ng-container *ngTemplateOutlet=\"addAttachmentButton\"></ng-container>\r\n    </div>\r\n    <!-- Template della form per l'aggiunta di un link -->\r\n    <div *ngIf=\"addingLinkMode\" class=\"text-center\">\r\n      <ng-container *ngTemplateOutlet=\"addingLinkTemplate\"></ng-container>\r\n    </div>\r\n  </div>\r\n  <div *ngIf=\"singleAttachmentDragAndDrop\">\r\n    <input\r\n      #fileInput\r\n      style=\"display: none\"\r\n      id=\"file_attachment\"\r\n      name=\"file_attachment\"\r\n      type=\"file\"\r\n      (change)=\"onFileAdded($event)\"\r\n      [accept]=\"acceptedFileTypes\"\r\n      [multiple]=\"loadMultipleFiles\" />\r\n    <ngx-file-drop\r\n      (onFileDrop)=\"fileDropped($event)\"\r\n      (click)=\"onSelectFile($event, fileInput)\"\r\n      *ngIf=\"\r\n        allowedTypes &&\r\n        allowedTypes.includes(1) &&\r\n        (!attachmentsList || attachmentsList.length == 0 || (attachmentsList.length > 0 && !attachmentsList[0]))\r\n      \">\r\n      <ng-template ngx-file-drop-content-tmp *ngIf=\"!addingLinkMode\">\r\n        <i class=\"fa-solid fa-cloud-upload-alt fa-3x mt-3\"></i>\r\n        Trascina i file qui\r\n        <div class=\"btn-group mt-1\" role=\"group\">\r\n          <button type=\"button\" class=\"btn btn-light border-end\" (click)=\"fileInput.click()\">Scegli un file</button>\r\n          <div class=\"btn-group\" role=\"group\">\r\n            <button\r\n              type=\"button\"\r\n              class=\"btn btn-light border-start dropdown-toggle\"\r\n              [matMenuTriggerFor]=\"attachmentTypeMenu\"></button>\r\n            <mat-menu #attachmentTypeMenu=\"matMenu\">\r\n              <button\r\n                *ngIf=\"allowedTypes.includes(1)\"\r\n                mat-menu-item\r\n                (click)=\"fileInput.click()\"\r\n                class=\"eqp-attachments-file-btn\">\r\n                <i class=\"fas fa-file\"></i>\r\n                <span style=\"margin-left: 10px\">File</span>\r\n              </button>\r\n              <button\r\n                *ngIf=\"allowedTypes.includes(2)\"\r\n                mat-menu-item\r\n                (click)=\"switchToAddingLinkMode()\"\r\n                class=\"eqp-attachments-link-btn\">\r\n                <i class=\"fas fa-link\"></i>\r\n                <span style=\"margin-left: 10px\">Link</span>\r\n              </button>\r\n              <button\r\n                *ngIf=\"allowedTypes.includes(3)\"\r\n                mat-menu-item\r\n                (click)=\"chooseDropboxFile()\"\r\n                class=\"eqp-attachments-link-btn\">\r\n                <i class=\"fa-brands fa-dropbox\"></i>\r\n                <span style=\"margin-left: 10px\">Dropbox</span>\r\n              </button>\r\n            </mat-menu>\r\n          </div>\r\n        </div>\r\n      </ng-template>\r\n      <ng-template ngx-file-drop-content-tmp *ngIf=\"addingLinkMode\">\r\n        <ng-container *ngTemplateOutlet=\"addingLinkTemplate\"></ng-container>\r\n      </ng-template>\r\n    </ngx-file-drop>\r\n  </div>\r\n  <div class=\"text-center\">\r\n    <button\r\n      class=\"mb-2 me-2 eqp-attachments-download-btn\"\r\n      (click)=\"viewAttachment(attachmentsList[0])\"\r\n      type=\"button\"\r\n      mat-raised-button\r\n      *ngIf=\"attachmentsList && attachmentsList.length > 0 && attachmentsList[0]\"\r\n      color=\"primary\">\r\n      <mat-icon *ngIf=\"attachmentsList[0].AttachmentType == AttachmentType.FILE\">download</mat-icon>\r\n      <mat-icon *ngIf=\"attachmentsList[0].AttachmentType != AttachmentType.FILE\">open_in_new</mat-icon>\r\n      {{ attachmentsList[0].AttachmentType == AttachmentType.FILE ? downloadLabel : openLinkLabel }}\r\n    </button>\r\n    <button\r\n      class=\"mb-2 me-2 eqp-attachments-preview-btn\"\r\n      (click)=\"openPreviewDialog(attachmentsList[0])\"\r\n      type=\"button\"\r\n      mat-raised-button\r\n      color=\"primary\"\r\n      *ngIf=\"\r\n        showPreview &&\r\n        attachmentsList &&\r\n        attachmentsList.length > 0 &&\r\n        attachmentsList[0] &&\r\n        (!attachmentsList[0].FileContentType ||\r\n          (!attachmentsList[0].FileContentType.startsWith('video') &&\r\n            !attachmentsList[0].FileContentType.startsWith('audio'))) &&\r\n        attachmentsList[0].IsImage == true\r\n      \">\r\n      <mat-icon>visibility</mat-icon> {{ previewLabel }}\r\n    </button>\r\n    <button\r\n      class=\"mb-2 eqp-attachments-delete-btn\"\r\n      (click)=\"deleteAttachment(attachmentsList[0])\"\r\n      type=\"button\"\r\n      mat-raised-button\r\n      *ngIf=\"attachmentsList && attachmentsList.length > 0 && attachmentsList[0]\"\r\n      [disabled]=\"isDisabled\">\r\n      <mat-icon>delete</mat-icon> {{ deleteLabel }}\r\n    </button>\r\n  </div>\r\n  <div\r\n    class=\"row\"\r\n    style=\"margin-top: 10px\"\r\n    *ngIf=\"\r\n      attachmentsList.length > 0 &&\r\n      attachmentsList[0] &&\r\n      attachmentsList[0].FileDataBase64 &&\r\n      attachmentsList[0].IsImage == true\r\n    \">\r\n    <div class=\"col-sm-12 d-flex justify-content-center\">\r\n      <div class=\"single-attachment-inline-preview-container\">\r\n        <img src=\"data:image/png;base64,{{ attachmentsList[0].FileDataBase64 }}\" />\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"row\" *ngIf=\"attachmentsList.length > 0 && attachmentsList[0] && attachmentsList[0].IsImage != true\">\r\n    <div class=\"col-sm-12\">\r\n      <mat-form-field>\r\n        <mat-label>{{ fileNameLabel }}</mat-label>\r\n        <input readonly matInput [(ngModel)]=\"attachmentsList[0].FileName\" />\r\n      </mat-form-field>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<div *ngIf=\"multipleAttachment == true\">\r\n  <input\r\n    #fileInput\r\n    style=\"display: none\"\r\n    id=\"file_attachment\"\r\n    name=\"file_attachment\"\r\n    type=\"file\"\r\n    (change)=\"onFileAdded($event)\"\r\n    [accept]=\"acceptedFileTypes\"\r\n    [multiple]=\"loadMultipleFiles\" />\r\n  <ngx-file-drop (onFileDrop)=\"fileDropped($event)\" (click)=\"onSelectFile($event, fileInput)\">\r\n    <ng-template ngx-file-drop-content-tmp *ngIf=\"!addingLinkMode\">\r\n      <i class=\"fa-solid fa-cloud-upload-alt fa-3x mt-3\"></i>\r\n      Trascina i file qui\r\n      <div class=\"btn-group mt-1\" role=\"group\">\r\n        <button type=\"button\" class=\"btn btn-light border-end\" (click)=\"fileInput.click()\">Scegli un file</button>\r\n        <div class=\"btn-group\" role=\"group\">\r\n          <button\r\n            type=\"button\"\r\n            class=\"btn btn-light border-start dropdown-toggle\"\r\n            [matMenuTriggerFor]=\"attachmentTypeMenu\"></button>\r\n          <mat-menu #attachmentTypeMenu=\"matMenu\">\r\n            <button\r\n              *ngIf=\"allowedTypes.includes(1)\"\r\n              mat-menu-item\r\n              (click)=\"fileInput.click()\"\r\n              class=\"eqp-attachments-file-btn\">\r\n              <i class=\"fas fa-file\"></i>\r\n              <span style=\"margin-left: 10px\">File</span>\r\n            </button>\r\n            <button\r\n              *ngIf=\"allowedTypes.includes(2)\"\r\n              mat-menu-item\r\n              (click)=\"switchToAddingLinkMode()\"\r\n              class=\"eqp-attachments-link-btn\">\r\n              <i class=\"fas fa-link\"></i>\r\n              <span style=\"margin-left: 10px\">Link</span>\r\n            </button>\r\n            <button\r\n              *ngIf=\"allowedTypes.includes(3)\"\r\n              mat-menu-item\r\n              (click)=\"chooseDropboxFile()\"\r\n              class=\"eqp-attachments-link-btn\">\r\n              <i class=\"fa-brands fa-dropbox\"></i>\r\n              <span style=\"margin-left: 10px\">Dropbox</span>\r\n            </button>\r\n          </mat-menu>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n    <ng-template ngx-file-drop-content-tmp *ngIf=\"addingLinkMode\">\r\n      <ng-container *ngTemplateOutlet=\"addingLinkTemplate\"></ng-container>\r\n    </ng-template>\r\n  </ngx-file-drop>\r\n  <div class=\"mt-2\">\r\n    <eqp-table\r\n      #attachmentTable\r\n      [createMatCard]=\"false\"\r\n      #table\r\n      [columns]=\"attachmentsColumns\"\r\n      [isMultiLanguage]=\"isEqpTableMultiLanguage\"\r\n      [data]=\"attachmentsList\"\r\n      [paginatorVisible]=\"tablePaginatorVisible\"\r\n      [matPaginatorSize]=\"tablePaginatorSize\"\r\n      [emptyTableMessage]=\"emptyTableMessage\"\r\n      [searchText]=\"eqpTableSearchText\"\r\n      [isTableSearcheable]=\"isTableSearcheable\">\r\n    </eqp-table>\r\n  </div>\r\n</div>\r\n\r\n<ng-template #dialogCropImage>\r\n  <!-- Richiama il template per le funzionalit\u00E0 del CROPPIE -->\r\n  <div style=\"overflow-x: hidden\" [ngClass]=\"cropDialogClass\">\r\n    <ng-container\r\n      [ngTemplateOutlet]=\"croppieTemplate\"\r\n      [ngTemplateOutletContext]=\"{ form: newAttachmentForm }\"\r\n      *ngIf=\"showCropImage == true\"></ng-container>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #inlinePreviewTemplate let-row=\"row\">\r\n  <div\r\n    class=\"inline-preview-container\"\r\n    *ngIf=\"row.AttachmentType != AttachmentType.LINK && row.IsImage\"\r\n    (click)=\"openPreviewDialog(row)\">\r\n    <img src=\"data:image/png;base64,{{ row.FileThumbnailBase64 ? row.FileThumbnailBase64 : row.FileDataBase64 }}\" />\r\n  </div>\r\n  <div\r\n    class=\"inline-preview-container\"\r\n    *ngIf=\"row.AttachmentType != AttachmentType.LINK && !row.IsImage\"\r\n    (click)=\"openPreviewDialog(row)\">\r\n    <i [ngClass]=\"getAttachmentIcon(row)\"></i>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #dialogPreview>\r\n  <mat-card class=\"example-card\" *ngIf=\"selectedAttachment\">\r\n    <mat-card-content>\r\n      <div class=\"row\">\r\n        <div class=\"header-title-standard\">\r\n          {{ previewLabel }} {{ selectedAttachment?.AttachmentType == attachmentType.FILE ? \"File\" : \"Link\" }}\r\n          <button\r\n            type=\"button\"\r\n            class=\"btn-close closeButton\"\r\n            mat-dialog-close\r\n            (click)=\"selectedAttachment = null\"></button>\r\n        </div>\r\n      </div>\r\n      <div class=\"row mt-2\">\r\n        <!-- ANTEPRIMA IMMAGINE -->\r\n        <div class=\"col-12 text-center preview-container\" *ngIf=\"selectedAttachment.IsImage\">\r\n          <img\r\n            class=\"image-preview\"\r\n            src=\"data:image/png;base64,{{\r\n              selectedAttachment.FileDataBase64\r\n                ? selectedAttachment.FileDataBase64\r\n                : selectedAttachment.FileThumbnailBase64\r\n            }}\" />\r\n        </div>\r\n\r\n        <!-- ANTEPRIMA LINK -->\r\n        <div class=\"col-12 preview-container\" *ngIf=\"!selectedAttachment.IsImage\">\r\n          <iframe\r\n            class=\"link-preview\"\r\n            [src]=\"selectedAttachment.TrustedUrl\"\r\n            [title]=\"selectedAttachment.FileName\"></iframe>\r\n        </div>\r\n      </div>\r\n      <div class=\"row mt-3\">\r\n        <div class=\"col-sm-12 text-center\">\r\n          <button\r\n            mat-mini-fab\r\n            color=\"primary\"\r\n            matTooltip=\"Download\"\r\n            (click)=\"viewAttachment(selectedAttachment)\"\r\n            *ngIf=\"selectedAttachment.AttachmentType != AttachmentType.LINK\">\r\n            <mat-icon>download</mat-icon>\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </mat-card-content>\r\n  </mat-card>\r\n</ng-template>\r\n\r\n<!-- TEMPLATE PER IL PULSANTE DI AGGIUNTA NUOVO ALLEGATO -->\r\n<ng-template #addAttachmentButton>\r\n  <!--\r\n        Pulsanti per l'aggiunta di un file o un link. Ne viene visualizzato uno se:\r\n        - gli allowedTypes sono stati specificati, nell'array ne \u00E8 presente uno solo, quello inserito \u00E8 AttachmentType.FILE (o AttachmentType.LINK)\r\n        e sono nella gestione di pi\u00F9 allegati (multipleAttachment == true)\r\n        OPPURE\r\n        - gli allowedTypes sono stati specificati, nell'array ne \u00E8 presente uno solo, quello inserito \u00E8 AttachmentType.FILE (o AttachmentType.LINK)\r\n        e sono nella gestione di un singolo allegato (multipleAttachment == true) e non ne \u00E8 ancora stato selezionato uno (ovvero attachmentsList non esiste o non ha elementi)\r\n    -->\r\n  <input\r\n    #fileInput\r\n    style=\"display: none\"\r\n    id=\"file_attachment\"\r\n    name=\"file_attachment\"\r\n    type=\"file\"\r\n    (change)=\"onFileAdded($event)\"\r\n    [accept]=\"acceptedFileTypes\"\r\n    [multiple]=\"loadMultipleFiles\" />\r\n  <button\r\n    class=\"btn btn-primary mb-4 me-5 eqp-attachments-add-btn\"\r\n    mat-raised-button\r\n    color=\"primary\"\r\n    type=\"button\"\r\n    *ngIf=\"\r\n      allowedTypes &&\r\n      allowedTypes.length == 1 &&\r\n      (multipleAttachment == true ||\r\n        !attachmentsList ||\r\n        attachmentsList.length == 0 ||\r\n        (attachmentsList.length > 0 && !attachmentsList[0]))\r\n    \"\r\n    (click)=\"addFile(allowedTypes[0], fileInput)\"\r\n    [disabled]=\"isDisabled\">\r\n    <!-- Per l'aggiunta dei file mostro un'icona diversa dall'aggiunta dei link -->\r\n    <mat-icon *ngIf=\"allowedTypes[0] == 1\">cloud_upload</mat-icon>\r\n    <i class=\"fas fa-link\" *ngIf=\"allowedTypes[0] == 2\"></i>\r\n    <i class=\"fa-brands fa-dropbox\" *ngIf=\"allowedTypes[0] == 3\"></i>\r\n    <span style=\"margin-left: 10px\">\r\n      {{\r\n        allowedTypes[0] == 1\r\n          ? addButtonLabel + \" file\"\r\n          : allowedTypes[0] == 2\r\n          ? addButtonLabel + \" link\"\r\n          : uploadWithDropboxLabel\r\n      }}</span\r\n    >\r\n  </button>\r\n\r\n  <!-- Pulsante per aprire il menu per la scelta del tipo di Attachment da creare -->\r\n  <button\r\n    class=\"btn btn-primary mb-4 me-5 eqp-attachments-add-btn\"\r\n    mat-raised-button\r\n    color=\"primary\"\r\n    type=\"button\"\r\n    [matMenuTriggerFor]=\"attachmentTypeMenu\"\r\n    [disabled]=\"isDisabled\"\r\n    *ngIf=\"\r\n      !separatedUploadButtons &&\r\n      allowedTypes &&\r\n      allowedTypes.length > 1 &&\r\n      (multipleAttachment == true ||\r\n        !attachmentsList ||\r\n        attachmentsList.length == 0 ||\r\n        (attachmentsList.length > 0 && !attachmentsList[0]))\r\n    \">\r\n    <mat-icon *ngIf=\"multipleAttachment != true\">cloud_upload</mat-icon>\r\n    <mat-icon *ngIf=\"multipleAttachment == true\">add</mat-icon>\r\n    <span style=\"margin-left: 0px\"> {{ addButtonLabel }} </span>\r\n  </button>\r\n  <mat-menu #attachmentTypeMenu=\"matMenu\">\r\n    <input\r\n      #imageInput\r\n      style=\"display: none\"\r\n      id=\"file_attachment\"\r\n      name=\"file_attachment\"\r\n      type=\"file\"\r\n      (change)=\"onFileAdded($event)\"\r\n      [accept]=\"acceptedFileTypes\"\r\n      [multiple]=\"loadMultipleFiles\" />\r\n    <button\r\n      *ngIf=\"allowedTypes.includes(1)\"\r\n      mat-menu-item\r\n      (click)=\"imageInput.click()\"\r\n      class=\"eqp-attachments-file-btn\">\r\n      <i class=\"fas fa-file\"></i>\r\n      <span style=\"margin-left: 10px\">File</span>\r\n    </button>\r\n    <button\r\n      *ngIf=\"allowedTypes.includes(2)\"\r\n      mat-menu-item\r\n      (click)=\"switchToAddingLinkMode()\"\r\n      class=\"eqp-attachments-link-btn\">\r\n      <i class=\"fas fa-link\"></i>\r\n      <span style=\"margin-left: 10px\">Link</span>\r\n    </button>\r\n    <button\r\n      *ngIf=\"allowedTypes.includes(3)\"\r\n      mat-menu-item\r\n      (click)=\"chooseDropboxFile()\"\r\n      class=\"eqp-attachments-link-btn\">\r\n      <i class=\"fa-brands fa-dropbox\"></i>\r\n      <span style=\"margin-left: 10px\">Dropbox</span>\r\n    </button>\r\n  </mat-menu>\r\n\r\n  <div\r\n    *ngIf=\"\r\n      separatedUploadButtons &&\r\n      allowedTypes &&\r\n      allowedTypes.length > 1 &&\r\n      (multipleAttachment == true ||\r\n        !attachmentsList ||\r\n        attachmentsList.length == 0 ||\r\n        (attachmentsList.length > 0 && !attachmentsList[0]))\r\n    \">\r\n    <div class=\"btn-group\">\r\n      <button\r\n        *ngIf=\"allowedTypes.includes(1)\"\r\n        (click)=\"imageInput.click()\"\r\n        class=\"btn btn-secondary eqp-attachments-add-btn\"\r\n        mat-raised-button\r\n        color=\"secondary\"\r\n        type=\"button\">\r\n        <i class=\"fa-solid fa-cloud-upload\"></i>\r\n        <span style=\"margin-left: 10px\">File</span>\r\n      </button>\r\n      <input\r\n        #imageInput\r\n        style=\"display: none\"\r\n        id=\"file_attachment\"\r\n        name=\"file_attachment\"\r\n        type=\"file\"\r\n        (change)=\"onFileAdded($event)\"\r\n        [accept]=\"acceptedFileTypes\"\r\n        [multiple]=\"loadMultipleFiles\" />\r\n      <button\r\n        *ngIf=\"allowedTypes.includes(2)\"\r\n        (click)=\"switchToAddingLinkMode()\"\r\n        class=\"btn btn-secondary eqp-attachments-add-btn\"\r\n        mat-raised-button\r\n        color=\"secondary\"\r\n        type=\"button\">\r\n        <i class=\"fas fa-link\"></i>\r\n        <span style=\"margin-left: 10px\">Link</span>\r\n      </button>\r\n      <button\r\n        *ngIf=\"allowedTypes.includes(3)\"\r\n        (click)=\"chooseDropboxFile()\"\r\n        class=\"btn btn-secondary eqp-attachments-add-btn\"\r\n        mat-raised-button\r\n        color=\"secondary\"\r\n        type=\"button\">\r\n        <i class=\"fa-brands fa-dropbox\"></i>\r\n        <span style=\"margin-left: 10px\">Dropbox</span>\r\n      </button>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #croppieTemplate>\r\n  <div class=\"row m-3\">\r\n    <h4>{{ cropLabel }}</h4>\r\n  </div>\r\n  <div class=\"row m-2 crop-large\">\r\n    <div class=\"col-md-12 d-flex align-items-center justify-content-center\">\r\n      <button\r\n        [matTooltip]=\"rotateLeftLabel\"\r\n        *ngIf=\"cropOptions.includes(1)\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"rotateLeft()\">\r\n        <mat-icon style=\"vertical-align: middle\">rotate_left</mat-icon>\r\n      </button>\r\n      <button\r\n        [matTooltip]=\"rotateRightLabel\"\r\n        *ngIf=\"cropOptions.includes(1)\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"rotateRight()\">\r\n        <mat-icon style=\"vertical-align: middle\">rotate_right</mat-icon>\r\n      </button>\r\n      <button\r\n        [matTooltip]=\"flipHorinzontalLabel\"\r\n        *ngIf=\"cropOptions.includes(2)\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"flipHorizontal()\">\r\n        <mat-icon style=\"vertical-align: middle\">flip_horizontal</mat-icon>\r\n      </button>\r\n      <button\r\n        [matTooltip]=\"flipVerticalLabel\"\r\n        *ngIf=\"cropOptions.includes(2)\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"flipVertical()\">\r\n        <div style=\"transform: rotate(90deg)\"><mat-icon style=\"vertical-align: middle\">flip_vertical</mat-icon></div>\r\n      </button>\r\n      <button\r\n        [matTooltip]=\"'Reset'\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"restoreOriginalDimensions()\">\r\n        <mat-icon style=\"vertical-align: middle\">replay</mat-icon>\r\n      </button>\r\n    </div>\r\n  </div>\r\n  <div class=\"row m-2 crop-small\">\r\n    <div class=\"col-md-12 d-flex align-items-center justify-content-center\">\r\n      <mat-icon *ngIf=\"cropOptions.includes(1)\" style=\"font-size: 27px; vertical-align: middle\" (click)=\"rotateLeft()\"\r\n        >rotate_left</mat-icon\r\n      >\r\n      <mat-icon\r\n        class=\"ms-3\"\r\n        *ngIf=\"cropOptions.includes(1)\"\r\n        style=\"font-size: 27px; vertical-align: middle\"\r\n        (click)=\"rotateRight()\"\r\n        >rotate_right</mat-icon\r\n      >\r\n      <mat-icon\r\n        class=\"ms-3\"\r\n        *ngIf=\"cropOptions.includes(2)\"\r\n        style=\"font-size: 27px; vertical-align: middle\"\r\n        (click)=\"flipHorizontal()\"\r\n        >flip_horizontal</mat-icon\r\n      >\r\n      <div class=\"ms-3\" style=\"transform: rotate(90deg)\">\r\n        <mat-icon\r\n          *ngIf=\"cropOptions.includes(2)\"\r\n          style=\"font-size: 27px; vertical-align: middle\"\r\n          (click)=\"flipVertical()\"\r\n          >flip_vertical</mat-icon\r\n        >\r\n      </div>\r\n      <mat-icon class=\"ms-3\" (click)=\"restoreOriginalDimensions()\" style=\"font-size: 27px; vertical-align: middle\"\r\n        >replay</mat-icon\r\n      >\r\n    </div>\r\n  </div>\r\n  <div class=\"row justify-content-center\">\r\n    <div class=\"col-12 d-flex align-items-center justify-content-center\">\r\n      <div class=\"crop-container\">\r\n        <image-cropper\r\n          [imageFile]=\"selectedFile\"\r\n          [maintainAspectRatio]=\"false\"\r\n          [autoCrop]=\"false\"\r\n          [containWithinAspectRatio]=\"false\"\r\n          [aspectRatio]=\"4 / 3\"\r\n          [cropperMinWidth]=\"128\"\r\n          [onlyScaleDown]=\"true\"\r\n          [roundCropper]=\"false\"\r\n          [canvasRotation]=\"0\"\r\n          [transform]=\"transform\"\r\n          [alignImage]=\"'left'\"\r\n          format=\"png\"\r\n          (imageCropped)=\"imageCropped($event)\"\r\n          [resizeToWidth]=\"customWidth\"\r\n          [resizeToHeight]=\"customHeight\"\r\n          [canvasRotation]=\"canvasRotation\">\r\n        </image-cropper>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"row justify-content-center mt-2 mb-2 crop-large\">\r\n    <div class=\"col-12 d-flex align-items-center justify-content-center\">\r\n      <button\r\n        class=\"btn btn-primary mat-raised-button eqp-attachments-confirm-btn me-2\"\r\n        type=\"button\"\r\n        (click)=\"confirmAddAttachment()\">\r\n        {{ confirmLabel }}\r\n      </button>\r\n      <button class=\"btn mat-raised-button eqp-attachments-abort-btn\" type=\"button\" (click)=\"abortFile()\">\r\n        {{ abortLabel }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n  <div class=\"row justify-content-center mt-2 mb-2 crop-small\">\r\n    <div class=\"col-6 d-flex align-items-center justify-content-center\" style=\"font-size: 20px\">\r\n      <i class=\"fa fa-times\" (click)=\"abortFile()\"></i>\r\n    </div>\r\n    <div class=\"col-6 d-flex align-items-center justify-content-center\" style=\"font-size: 20px\">\r\n      <i class=\"fa fa-check\" (click)=\"confirmAddAttachment()\"></i>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n\r\n<!-- TEMPLATE PER FORM DI AGGIUNTA DI UN LINK -->\r\n<ng-template #addingLinkTemplate>\r\n  <span class=\"mb-1\" style=\"font-size: 20px\"><i class=\"fa fa-link\"></i>Inserisci l'URL</span>\r\n  <form [formGroup]=\"newAttachmentForm\" *ngIf=\"newAttachmentForm\">\r\n    <div class=\"row mb-2\" style=\"height: 80px\">\r\n      <div class=\"col-6 d-grid gap-2 mx-auto\">\r\n        <div class=\"input-group mb-1\">\r\n          <input\r\n            type=\"text\"\r\n            class=\"form-control\"\r\n            placeholder=\"{{ fileNameLabel }}\"\r\n            formControlName=\"name\"\r\n            [(ngModel)]=\"newAttachment.FileName\" />\r\n        </div>\r\n      </div>\r\n      <div class=\"col-12 d-grid gap-2\">\r\n        <div class=\"input-group\">\r\n          <input\r\n            required\r\n            type=\"text\"\r\n            class=\"form-control\"\r\n            placeholder=\"Link\"\r\n            formControlName=\"path\"\r\n            [(ngModel)]=\"newAttachment.FilePath\" />\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div class=\"row\">\r\n      <div class=\"col-6 d-grid gap-2\">\r\n        <button\r\n          class=\"btn btn-secondary mat-raised-button\"\r\n          (click)=\"selectedAttachment = null; addingLinkMode = false\"\r\n          type=\"button\">\r\n          {{ exitLabel }}\r\n        </button>\r\n      </div>\r\n      <div class=\"col-6 d-grid gap-2\">\r\n        <button\r\n          class=\"btn btn-primary mat-raised-button\"\r\n          type=\"submit\"\r\n          (click)=\"confirmAddAttachment(); selectedAttachment = null; addingLinkMode = false\">\r\n          {{ saveLabel }}\r\n        </button>\r\n      </div>\r\n    </div>\r\n  </form>\r\n</ng-template>\r\n", styles: ["ngx-file-drop ::ng-deep .ngx-file-drop__drop-zone{min-height:30vh;border-radius:5px!important;background-color:#e4e6ea!important;cursor:pointer;font-size:17px!important;border:dotted!important;padding-top:7vh}ngx-file-drop ::ng-deep .ngx-file-drop__drop-zone .ngx-file-drop__content{display:flex;flex-direction:column;align-items:center;justify-content:center;color:#73777a!important;margin:auto}.custom-height .mat-form-field-wrapper{height:20px}.eqp-attachments-header-title{font-weight:700;font-size:19px;line-height:24px;margin-bottom:auto}.single-attachment-inline-preview-container{max-height:400px;max-width:400px;display:flex;align-items:center}.single-attachment-inline-preview-container img{max-width:100%;max-height:120px}.inline-preview-container{max-height:100px;max-width:100px;display:flex;align-items:center;justify-content:center;width:100%;cursor:pointer}.inline-preview-container img{max-width:100%;max-height:100px}.inline-preview-container i{font-size:25px;margin:auto}.preview-container{max-height:60vh;max-width:100%}.preview-container .image-preview{max-width:100%;max-height:100%}.preview-container .link-preview{width:70vw;height:55vh}.closeButton{float:right}@media (max-width: 768px){.crop-large{display:none}}@media (min-width: 768px){.crop-small{display:none}}@media (max-width: 768px){.crop-container{max-width:55%}}@media (min-width: 768px){.crop-container{max-width:35%}}\n"], dependencies: [{ kind: "component", type: i6.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i6.MatMiniFabButton, selector: "button[mat-mini-fab]", exportAs: ["matButton"] }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "component", type: i9.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i9.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i9.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i10.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i10.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i11.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i12.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i13.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i13.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i14.ImageCropperComponent, selector: "image-cropper", inputs: ["imageChangedEvent", "imageURL", "imageBase64", "imageFile", "imageAltText", "cropperFrameAriaLabel", "output", "format", "transform", "maintainAspectRatio", "aspectRatio", "resetCropOnAspectRatioChange", "resizeToWidth", "resizeToHeight", "cropperMinWidth", "cropperMinHeight", "cropperMaxHeight", "cropperMaxWidth", "cropperStaticWidth", "cropperStaticHeight", "canvasRotation", "initialStepSize", "roundCropper", "onlyScaleDown", "imageQuality", "autoCrop", "backgroundColor", "containWithinAspectRatio", "hideResizeSquares", "allowMoveImage", "cropper", "alignImage", "disabled", "hidden"], outputs: ["imageCropped", "startCropImage", "imageLoaded", "cropperReady", "loadImageFailed", "transformChange"] }, { kind: "component", type: i15.EqpTableComponent, selector: "eqp-table" }, { kind: "component", type: i16.NgxFileDropComponent, selector: "ngx-file-drop", inputs: ["accept", "directory", "multiple", "dropZoneLabel", "dropZoneClassName", "useDragEnter", "contentClassName", "showBrowseBtn", "browseBtnClassName", "browseBtnLabel", "disabled"], outputs: ["onFileDrop", "onFileOver", "onFileLeave"] }, { kind: "directive", type: i16.NgxFileDropContentTemplateDirective, selector: "[ngx-file-drop-content-tmp]" }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: EqpAttachmentsComponent, selector: "eqp-attachments", inputs: { disableAction: "disableAction", showHeader: "showHeader", headerTitle: "headerTitle", attachmentsList: "attachmentsList", showMatCard: "showMatCard", multipleAttachment: "multipleAttachment", loadMultipleFiles: "loadMultipleFiles", attachmentsColumns: "attachmentsColumns", emptyTableMessage: "emptyTableMessage", allowOnlyImages: "allowOnlyImages", acceptedFileTypes: "acceptedFileTypes", isDisabled: "isDisabled", showInlinePreview: "showInlinePreview", getAttachmentEndpoint: "getAttachmentEndpoint", productionBaseUrl: "productionBaseUrl", compressionOptions: "compressionOptions", allowedTypes: "allowedTypes", isEqpTableMultiLanguage: "isEqpTableMultiLanguage", tablePaginatorVisible: "tablePaginatorVisible", isTableSearcheable: "isTableSearcheable", tablePaginatorSize: "tablePaginatorSize", separatedUploadButtons: "separatedUploadButtons", showPreview: "showPreview", singleAttachmentDragAndDrop: "singleAttachmentDragAndDrop", cropOptions: "cropOptions", cropDialogClass: "cropDialogClass", downloadTooltipPosition: "downloadTooltipPosition", openLinkLabel: "openLinkLabel", addButtonLabel: "addButtonLabel", downloadLabel: "downloadLabel", deleteLabel: "deleteLabel", fileNameLabel: "fileNameLabel", previewLabel: "previewLabel", uploadFileLabel: "uploadFileLabel", confirmLabel: "confirmLabel", abortLabel: "abortLabel", saveLabel: "saveLabel", exitLabel: "exitLabel", uploadWithDropboxLabel: "uploadWithDropboxLabel", cropLabel: "cropLabel", eqpTableSearchText: "eqpTableSearchText", deleteDialogTitle: "deleteDialogTitle", deleteDialogMessage: "deleteDialogMessage", noImageSelectedErrorMessage: "noImageSelectedErrorMessage", wrongTypeSelectedErrorMessage: "wrongTypeSelectedErrorMessage", videoPreviewErrorMessage: "videoPreviewErrorMessage", audioPreviewErrorMessage: ["videoPreviewErrorMessage", "audioPreviewErrorMessage"], flipHorinzontalLabel: "flipHorinzontalLabel", flipVerticalLabel: "flipVerticalLabel", rotateRightLabel: "rotateRightLabel", rotateLeftLabel: "rotateLeftLabel" }, outputs: { localEditedAttachments: "localEditedAttachments", abortAddAttachment: "abortAddAttachment", downloadAttachment: "downloadAttachment", onDeleteAttachment: "onDeleteAttachment" }, viewQueries: [{ propertyName: "dialogAddAttachment", first: true, predicate: ["dialogAddAttachment"], descendants: true, static: true }, { propertyName: "dialogAddMultipleAttachment", first: true, predicate: ["dialogAddMultipleAttachment"], descendants: true, static: true }, { propertyName: "dialogCropImage", first: true, predicate: ["dialogCropImage"], descendants: true, static: true }, { propertyName: "imageCropper", first: true, predicate: ImageCropperComponent, descendants: true }, { propertyName: "imageInput", first: true, predicate: ["imageInput"], descendants: true }, { propertyName: "attachmentTable", first: true, predicate: ["attachmentTable"], descendants: true }, { propertyName: "inlinePreviewTemplate", first: true, predicate: ["inlinePreviewTemplate"], descendants: true, static: true }, { propertyName: "dialogPreview", first: true, predicate: ["dialogPreview"], descendants: true, static: true }], ngImport: i0, template: "<!-- Se richiesta la gestione singola mostra il pulsante di caricamento di un singolo file -->\r\n<div *ngIf=\"multipleAttachment != true\">\r\n  <div *ngIf=\"!singleAttachmentDragAndDrop\">\r\n    <!-- Template del button per l'aggiunta di un allegato -->\r\n    <div *ngIf=\"!addingLinkMode\" class=\"text-center\">\r\n      <ng-container *ngTemplateOutlet=\"addAttachmentButton\"></ng-container>\r\n    </div>\r\n    <!-- Template della form per l'aggiunta di un link -->\r\n    <div *ngIf=\"addingLinkMode\" class=\"text-center\">\r\n      <ng-container *ngTemplateOutlet=\"addingLinkTemplate\"></ng-container>\r\n    </div>\r\n  </div>\r\n  <div *ngIf=\"singleAttachmentDragAndDrop\">\r\n    <input\r\n      #fileInput\r\n      style=\"display: none\"\r\n      id=\"file_attachment\"\r\n      name=\"file_attachment\"\r\n      type=\"file\"\r\n      (change)=\"onFileAdded($event)\"\r\n      [accept]=\"acceptedFileTypes\"\r\n      [multiple]=\"loadMultipleFiles\" />\r\n    <ngx-file-drop\r\n      (onFileDrop)=\"fileDropped($event)\"\r\n      (click)=\"onSelectFile($event, fileInput)\"\r\n      *ngIf=\"\r\n        allowedTypes &&\r\n        allowedTypes.includes(1) &&\r\n        (!attachmentsList || attachmentsList.length == 0 || (attachmentsList.length > 0 && !attachmentsList[0]))\r\n      \">\r\n      <ng-template ngx-file-drop-content-tmp *ngIf=\"!addingLinkMode\">\r\n        <i class=\"fa-solid fa-cloud-upload-alt fa-3x mt-3\"></i>\r\n        Trascina i file qui\r\n        <div class=\"btn-group mt-1\" role=\"group\">\r\n          <button type=\"button\" class=\"btn btn-light border-end\" (click)=\"fileInput.click()\">Scegli un file</button>\r\n          <div class=\"btn-group\" role=\"group\">\r\n            <button\r\n              type=\"button\"\r\n              class=\"btn btn-light border-start dropdown-toggle\"\r\n              [matMenuTriggerFor]=\"attachmentTypeMenu\"></button>\r\n            <mat-menu #attachmentTypeMenu=\"matMenu\">\r\n              <button\r\n                *ngIf=\"allowedTypes.includes(1)\"\r\n                mat-menu-item\r\n                (click)=\"fileInput.click()\"\r\n                class=\"eqp-attachments-file-btn\">\r\n                <i class=\"fas fa-file\"></i>\r\n                <span style=\"margin-left: 10px\">File</span>\r\n              </button>\r\n              <button\r\n                *ngIf=\"allowedTypes.includes(2)\"\r\n                mat-menu-item\r\n                (click)=\"switchToAddingLinkMode()\"\r\n                class=\"eqp-attachments-link-btn\">\r\n                <i class=\"fas fa-link\"></i>\r\n                <span style=\"margin-left: 10px\">Link</span>\r\n              </button>\r\n              <button\r\n                *ngIf=\"allowedTypes.includes(3)\"\r\n                mat-menu-item\r\n                (click)=\"chooseDropboxFile()\"\r\n                class=\"eqp-attachments-link-btn\">\r\n                <i class=\"fa-brands fa-dropbox\"></i>\r\n                <span style=\"margin-left: 10px\">Dropbox</span>\r\n              </button>\r\n            </mat-menu>\r\n          </div>\r\n        </div>\r\n      </ng-template>\r\n      <ng-template ngx-file-drop-content-tmp *ngIf=\"addingLinkMode\">\r\n        <ng-container *ngTemplateOutlet=\"addingLinkTemplate\"></ng-container>\r\n      </ng-template>\r\n    </ngx-file-drop>\r\n  </div>\r\n  <div class=\"text-center\">\r\n    <button\r\n      class=\"mb-2 me-2 eqp-attachments-download-btn\"\r\n      (click)=\"viewAttachment(attachmentsList[0])\"\r\n      type=\"button\"\r\n      mat-raised-button\r\n      *ngIf=\"attachmentsList && attachmentsList.length > 0 && attachmentsList[0]\"\r\n      color=\"primary\">\r\n      <mat-icon *ngIf=\"attachmentsList[0].AttachmentType == AttachmentType.FILE\">download</mat-icon>\r\n      <mat-icon *ngIf=\"attachmentsList[0].AttachmentType != AttachmentType.FILE\">open_in_new</mat-icon>\r\n      {{ attachmentsList[0].AttachmentType == AttachmentType.FILE ? downloadLabel : openLinkLabel }}\r\n    </button>\r\n    <button\r\n      class=\"mb-2 me-2 eqp-attachments-preview-btn\"\r\n      (click)=\"openPreviewDialog(attachmentsList[0])\"\r\n      type=\"button\"\r\n      mat-raised-button\r\n      color=\"primary\"\r\n      *ngIf=\"\r\n        showPreview &&\r\n        attachmentsList &&\r\n        attachmentsList.length > 0 &&\r\n        attachmentsList[0] &&\r\n        (!attachmentsList[0].FileContentType ||\r\n          (!attachmentsList[0].FileContentType.startsWith('video') &&\r\n            !attachmentsList[0].FileContentType.startsWith('audio'))) &&\r\n        attachmentsList[0].IsImage == true\r\n      \">\r\n      <mat-icon>visibility</mat-icon> {{ previewLabel }}\r\n    </button>\r\n    <button\r\n      class=\"mb-2 eqp-attachments-delete-btn\"\r\n      (click)=\"deleteAttachment(attachmentsList[0])\"\r\n      type=\"button\"\r\n      mat-raised-button\r\n      *ngIf=\"attachmentsList && attachmentsList.length > 0 && attachmentsList[0]\"\r\n      [disabled]=\"isDisabled\">\r\n      <mat-icon>delete</mat-icon> {{ deleteLabel }}\r\n    </button>\r\n  </div>\r\n  <div\r\n    class=\"row\"\r\n    style=\"margin-top: 10px\"\r\n    *ngIf=\"\r\n      attachmentsList.length > 0 &&\r\n      attachmentsList[0] &&\r\n      attachmentsList[0].FileDataBase64 &&\r\n      attachmentsList[0].IsImage == true\r\n    \">\r\n    <div class=\"col-sm-12 d-flex justify-content-center\">\r\n      <div class=\"single-attachment-inline-preview-container\">\r\n        <img src=\"data:image/png;base64,{{ attachmentsList[0].FileDataBase64 }}\" />\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"row\" *ngIf=\"attachmentsList.length > 0 && attachmentsList[0] && attachmentsList[0].IsImage != true\">\r\n    <div class=\"col-sm-12\">\r\n      <mat-form-field>\r\n        <mat-label>{{ fileNameLabel }}</mat-label>\r\n        <input readonly matInput [(ngModel)]=\"attachmentsList[0].FileName\" />\r\n      </mat-form-field>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<div *ngIf=\"multipleAttachment == true\">\r\n  <input\r\n    #fileInput\r\n    style=\"display: none\"\r\n    id=\"file_attachment\"\r\n    name=\"file_attachment\"\r\n    type=\"file\"\r\n    (change)=\"onFileAdded($event)\"\r\n    [accept]=\"acceptedFileTypes\"\r\n    [multiple]=\"loadMultipleFiles\" />\r\n  <ngx-file-drop (onFileDrop)=\"fileDropped($event)\" (click)=\"onSelectFile($event, fileInput)\">\r\n    <ng-template ngx-file-drop-content-tmp *ngIf=\"!addingLinkMode\">\r\n      <i class=\"fa-solid fa-cloud-upload-alt fa-3x mt-3\"></i>\r\n      Trascina i file qui\r\n      <div class=\"btn-group mt-1\" role=\"group\">\r\n        <button type=\"button\" class=\"btn btn-light border-end\" (click)=\"fileInput.click()\">Scegli un file</button>\r\n        <div class=\"btn-group\" role=\"group\">\r\n          <button\r\n            type=\"button\"\r\n            class=\"btn btn-light border-start dropdown-toggle\"\r\n            [matMenuTriggerFor]=\"attachmentTypeMenu\"></button>\r\n          <mat-menu #attachmentTypeMenu=\"matMenu\">\r\n            <button\r\n              *ngIf=\"allowedTypes.includes(1)\"\r\n              mat-menu-item\r\n              (click)=\"fileInput.click()\"\r\n              class=\"eqp-attachments-file-btn\">\r\n              <i class=\"fas fa-file\"></i>\r\n              <span style=\"margin-left: 10px\">File</span>\r\n            </button>\r\n            <button\r\n              *ngIf=\"allowedTypes.includes(2)\"\r\n              mat-menu-item\r\n              (click)=\"switchToAddingLinkMode()\"\r\n              class=\"eqp-attachments-link-btn\">\r\n              <i class=\"fas fa-link\"></i>\r\n              <span style=\"margin-left: 10px\">Link</span>\r\n            </button>\r\n            <button\r\n              *ngIf=\"allowedTypes.includes(3)\"\r\n              mat-menu-item\r\n              (click)=\"chooseDropboxFile()\"\r\n              class=\"eqp-attachments-link-btn\">\r\n              <i class=\"fa-brands fa-dropbox\"></i>\r\n              <span style=\"margin-left: 10px\">Dropbox</span>\r\n            </button>\r\n          </mat-menu>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n    <ng-template ngx-file-drop-content-tmp *ngIf=\"addingLinkMode\">\r\n      <ng-container *ngTemplateOutlet=\"addingLinkTemplate\"></ng-container>\r\n    </ng-template>\r\n  </ngx-file-drop>\r\n  <div class=\"mt-2\">\r\n    <eqp-table\r\n      #attachmentTable\r\n      [createMatCard]=\"false\"\r\n      #table\r\n      [columns]=\"attachmentsColumns\"\r\n      [isMultiLanguage]=\"isEqpTableMultiLanguage\"\r\n      [data]=\"attachmentsList\"\r\n      [paginatorVisible]=\"tablePaginatorVisible\"\r\n      [matPaginatorSize]=\"tablePaginatorSize\"\r\n      [emptyTableMessage]=\"emptyTableMessage\"\r\n      [searchText]=\"eqpTableSearchText\"\r\n      [isTableSearcheable]=\"isTableSearcheable\">\r\n    </eqp-table>\r\n  </div>\r\n</div>\r\n\r\n<ng-template #dialogCropImage>\r\n  <!-- Richiama il template per le funzionalit\u00E0 del CROPPIE -->\r\n  <div style=\"overflow-x: hidden\" [ngClass]=\"cropDialogClass\">\r\n    <ng-container\r\n      [ngTemplateOutlet]=\"croppieTemplate\"\r\n      [ngTemplateOutletContext]=\"{ form: newAttachmentForm }\"\r\n      *ngIf=\"showCropImage == true\"></ng-container>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #inlinePreviewTemplate let-row=\"row\">\r\n  <div\r\n    class=\"inline-preview-container\"\r\n    *ngIf=\"row.AttachmentType != AttachmentType.LINK && row.IsImage\"\r\n    (click)=\"openPreviewDialog(row)\">\r\n    <img src=\"data:image/png;base64,{{ row.FileThumbnailBase64 ? row.FileThumbnailBase64 : row.FileDataBase64 }}\" />\r\n  </div>\r\n  <div\r\n    class=\"inline-preview-container\"\r\n    *ngIf=\"row.AttachmentType != AttachmentType.LINK && !row.IsImage\"\r\n    (click)=\"openPreviewDialog(row)\">\r\n    <i [ngClass]=\"getAttachmentIcon(row)\"></i>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #dialogPreview>\r\n  <mat-card class=\"example-card\" *ngIf=\"selectedAttachment\">\r\n    <mat-card-content>\r\n      <div class=\"row\">\r\n        <div class=\"header-title-standard\">\r\n          {{ previewLabel }} {{ selectedAttachment?.AttachmentType == attachmentType.FILE ? \"File\" : \"Link\" }}\r\n          <button\r\n            type=\"button\"\r\n            class=\"btn-close closeButton\"\r\n            mat-dialog-close\r\n            (click)=\"selectedAttachment = null\"></button>\r\n        </div>\r\n      </div>\r\n      <div class=\"row mt-2\">\r\n        <!-- ANTEPRIMA IMMAGINE -->\r\n        <div class=\"col-12 text-center preview-container\" *ngIf=\"selectedAttachment.IsImage\">\r\n          <img\r\n            class=\"image-preview\"\r\n            src=\"data:image/png;base64,{{\r\n              selectedAttachment.FileDataBase64\r\n                ? selectedAttachment.FileDataBase64\r\n                : selectedAttachment.FileThumbnailBase64\r\n            }}\" />\r\n        </div>\r\n\r\n        <!-- ANTEPRIMA LINK -->\r\n        <div class=\"col-12 preview-container\" *ngIf=\"!selectedAttachment.IsImage\">\r\n          <iframe\r\n            class=\"link-preview\"\r\n            [src]=\"selectedAttachment.TrustedUrl\"\r\n            [title]=\"selectedAttachment.FileName\"></iframe>\r\n        </div>\r\n      </div>\r\n      <div class=\"row mt-3\">\r\n        <div class=\"col-sm-12 text-center\">\r\n          <button\r\n            mat-mini-fab\r\n            color=\"primary\"\r\n            matTooltip=\"Download\"\r\n            (click)=\"viewAttachment(selectedAttachment)\"\r\n            *ngIf=\"selectedAttachment.AttachmentType != AttachmentType.LINK\">\r\n            <mat-icon>download</mat-icon>\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </mat-card-content>\r\n  </mat-card>\r\n</ng-template>\r\n\r\n<!-- TEMPLATE PER IL PULSANTE DI AGGIUNTA NUOVO ALLEGATO -->\r\n<ng-template #addAttachmentButton>\r\n  <!--\r\n        Pulsanti per l'aggiunta di un file o un link. Ne viene visualizzato uno se:\r\n        - gli allowedTypes sono stati specificati, nell'array ne \u00E8 presente uno solo, quello inserito \u00E8 AttachmentType.FILE (o AttachmentType.LINK)\r\n        e sono nella gestione di pi\u00F9 allegati (multipleAttachment == true)\r\n        OPPURE\r\n        - gli allowedTypes sono stati specificati, nell'array ne \u00E8 presente uno solo, quello inserito \u00E8 AttachmentType.FILE (o AttachmentType.LINK)\r\n        e sono nella gestione di un singolo allegato (multipleAttachment == true) e non ne \u00E8 ancora stato selezionato uno (ovvero attachmentsList non esiste o non ha elementi)\r\n    -->\r\n  <input\r\n    #fileInput\r\n    style=\"display: none\"\r\n    id=\"file_attachment\"\r\n    name=\"file_attachment\"\r\n    type=\"file\"\r\n    (change)=\"onFileAdded($event)\"\r\n    [accept]=\"acceptedFileTypes\"\r\n    [multiple]=\"loadMultipleFiles\" />\r\n  <button\r\n    class=\"btn btn-primary mb-4 me-5 eqp-attachments-add-btn\"\r\n    mat-raised-button\r\n    color=\"primary\"\r\n    type=\"button\"\r\n    *ngIf=\"\r\n      allowedTypes &&\r\n      allowedTypes.length == 1 &&\r\n      (multipleAttachment == true ||\r\n        !attachmentsList ||\r\n        attachmentsList.length == 0 ||\r\n        (attachmentsList.length > 0 && !attachmentsList[0]))\r\n    \"\r\n    (click)=\"addFile(allowedTypes[0], fileInput)\"\r\n    [disabled]=\"isDisabled\">\r\n    <!-- Per l'aggiunta dei file mostro un'icona diversa dall'aggiunta dei link -->\r\n    <mat-icon *ngIf=\"allowedTypes[0] == 1\">cloud_upload</mat-icon>\r\n    <i class=\"fas fa-link\" *ngIf=\"allowedTypes[0] == 2\"></i>\r\n    <i class=\"fa-brands fa-dropbox\" *ngIf=\"allowedTypes[0] == 3\"></i>\r\n    <span style=\"margin-left: 10px\">\r\n      {{\r\n        allowedTypes[0] == 1\r\n          ? addButtonLabel + \" file\"\r\n          : allowedTypes[0] == 2\r\n          ? addButtonLabel + \" link\"\r\n          : uploadWithDropboxLabel\r\n      }}</span\r\n    >\r\n  </button>\r\n\r\n  <!-- Pulsante per aprire il menu per la scelta del tipo di Attachment da creare -->\r\n  <button\r\n    class=\"btn btn-primary mb-4 me-5 eqp-attachments-add-btn\"\r\n    mat-raised-button\r\n    color=\"primary\"\r\n    type=\"button\"\r\n    [matMenuTriggerFor]=\"attachmentTypeMenu\"\r\n    [disabled]=\"isDisabled\"\r\n    *ngIf=\"\r\n      !separatedUploadButtons &&\r\n      allowedTypes &&\r\n      allowedTypes.length > 1 &&\r\n      (multipleAttachment == true ||\r\n        !attachmentsList ||\r\n        attachmentsList.length == 0 ||\r\n        (attachmentsList.length > 0 && !attachmentsList[0]))\r\n    \">\r\n    <mat-icon *ngIf=\"multipleAttachment != true\">cloud_upload</mat-icon>\r\n    <mat-icon *ngIf=\"multipleAttachment == true\">add</mat-icon>\r\n    <span style=\"margin-left: 0px\"> {{ addButtonLabel }} </span>\r\n  </button>\r\n  <mat-menu #attachmentTypeMenu=\"matMenu\">\r\n    <input\r\n      #imageInput\r\n      style=\"display: none\"\r\n      id=\"file_attachment\"\r\n      name=\"file_attachment\"\r\n      type=\"file\"\r\n      (change)=\"onFileAdded($event)\"\r\n      [accept]=\"acceptedFileTypes\"\r\n      [multiple]=\"loadMultipleFiles\" />\r\n    <button\r\n      *ngIf=\"allowedTypes.includes(1)\"\r\n      mat-menu-item\r\n      (click)=\"imageInput.click()\"\r\n      class=\"eqp-attachments-file-btn\">\r\n      <i class=\"fas fa-file\"></i>\r\n      <span style=\"margin-left: 10px\">File</span>\r\n    </button>\r\n    <button\r\n      *ngIf=\"allowedTypes.includes(2)\"\r\n      mat-menu-item\r\n      (click)=\"switchToAddingLinkMode()\"\r\n      class=\"eqp-attachments-link-btn\">\r\n      <i class=\"fas fa-link\"></i>\r\n      <span style=\"margin-left: 10px\">Link</span>\r\n    </button>\r\n    <button\r\n      *ngIf=\"allowedTypes.includes(3)\"\r\n      mat-menu-item\r\n      (click)=\"chooseDropboxFile()\"\r\n      class=\"eqp-attachments-link-btn\">\r\n      <i class=\"fa-brands fa-dropbox\"></i>\r\n      <span style=\"margin-left: 10px\">Dropbox</span>\r\n    </button>\r\n  </mat-menu>\r\n\r\n  <div\r\n    *ngIf=\"\r\n      separatedUploadButtons &&\r\n      allowedTypes &&\r\n      allowedTypes.length > 1 &&\r\n      (multipleAttachment == true ||\r\n        !attachmentsList ||\r\n        attachmentsList.length == 0 ||\r\n        (attachmentsList.length > 0 && !attachmentsList[0]))\r\n    \">\r\n    <div class=\"btn-group\">\r\n      <button\r\n        *ngIf=\"allowedTypes.includes(1)\"\r\n        (click)=\"imageInput.click()\"\r\n        class=\"btn btn-secondary eqp-attachments-add-btn\"\r\n        mat-raised-button\r\n        color=\"secondary\"\r\n        type=\"button\">\r\n        <i class=\"fa-solid fa-cloud-upload\"></i>\r\n        <span style=\"margin-left: 10px\">File</span>\r\n      </button>\r\n      <input\r\n        #imageInput\r\n        style=\"display: none\"\r\n        id=\"file_attachment\"\r\n        name=\"file_attachment\"\r\n        type=\"file\"\r\n        (change)=\"onFileAdded($event)\"\r\n        [accept]=\"acceptedFileTypes\"\r\n        [multiple]=\"loadMultipleFiles\" />\r\n      <button\r\n        *ngIf=\"allowedTypes.includes(2)\"\r\n        (click)=\"switchToAddingLinkMode()\"\r\n        class=\"btn btn-secondary eqp-attachments-add-btn\"\r\n        mat-raised-button\r\n        color=\"secondary\"\r\n        type=\"button\">\r\n        <i class=\"fas fa-link\"></i>\r\n        <span style=\"margin-left: 10px\">Link</span>\r\n      </button>\r\n      <button\r\n        *ngIf=\"allowedTypes.includes(3)\"\r\n        (click)=\"chooseDropboxFile()\"\r\n        class=\"btn btn-secondary eqp-attachments-add-btn\"\r\n        mat-raised-button\r\n        color=\"secondary\"\r\n        type=\"button\">\r\n        <i class=\"fa-brands fa-dropbox\"></i>\r\n        <span style=\"margin-left: 10px\">Dropbox</span>\r\n      </button>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #croppieTemplate>\r\n  <div class=\"row m-3\">\r\n    <h4>{{ cropLabel }}</h4>\r\n  </div>\r\n  <div class=\"row m-2 crop-large\">\r\n    <div class=\"col-md-12 d-flex align-items-center justify-content-center\">\r\n      <button\r\n        [matTooltip]=\"rotateLeftLabel\"\r\n        *ngIf=\"cropOptions.includes(1)\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"rotateLeft()\">\r\n        <mat-icon style=\"vertical-align: middle\">rotate_left</mat-icon>\r\n      </button>\r\n      <button\r\n        [matTooltip]=\"rotateRightLabel\"\r\n        *ngIf=\"cropOptions.includes(1)\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"rotateRight()\">\r\n        <mat-icon style=\"vertical-align: middle\">rotate_right</mat-icon>\r\n      </button>\r\n      <button\r\n        [matTooltip]=\"flipHorinzontalLabel\"\r\n        *ngIf=\"cropOptions.includes(2)\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"flipHorizontal()\">\r\n        <mat-icon style=\"vertical-align: middle\">flip_horizontal</mat-icon>\r\n      </button>\r\n      <button\r\n        [matTooltip]=\"flipVerticalLabel\"\r\n        *ngIf=\"cropOptions.includes(2)\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"flipVertical()\">\r\n        <div style=\"transform: rotate(90deg)\"><mat-icon style=\"vertical-align: middle\">flip_vertical</mat-icon></div>\r\n      </button>\r\n      <button\r\n        [matTooltip]=\"'Reset'\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"restoreOriginalDimensions()\">\r\n        <mat-icon style=\"vertical-align: middle\">replay</mat-icon>\r\n      </button>\r\n    </div>\r\n  </div>\r\n  <div class=\"row m-2 crop-small\">\r\n    <div class=\"col-md-12 d-flex align-items-center justify-content-center\">\r\n      <mat-icon *ngIf=\"cropOptions.includes(1)\" style=\"font-size: 27px; vertical-align: middle\" (click)=\"rotateLeft()\"\r\n        >rotate_left</mat-icon\r\n      >\r\n      <mat-icon\r\n        class=\"ms-3\"\r\n        *ngIf=\"cropOptions.includes(1)\"\r\n        style=\"font-size: 27px; vertical-align: middle\"\r\n        (click)=\"rotateRight()\"\r\n        >rotate_right</mat-icon\r\n      >\r\n      <mat-icon\r\n        class=\"ms-3\"\r\n        *ngIf=\"cropOptions.includes(2)\"\r\n        style=\"font-size: 27px; vertical-align: middle\"\r\n        (click)=\"flipHorizontal()\"\r\n        >flip_horizontal</mat-icon\r\n      >\r\n      <div class=\"ms-3\" style=\"transform: rotate(90deg)\">\r\n        <mat-icon\r\n          *ngIf=\"cropOptions.includes(2)\"\r\n          style=\"font-size: 27px; vertical-align: middle\"\r\n          (click)=\"flipVertical()\"\r\n          >flip_vertical</mat-icon\r\n        >\r\n      </div>\r\n      <mat-icon class=\"ms-3\" (click)=\"restoreOriginalDimensions()\" style=\"font-size: 27px; vertical-align: middle\"\r\n        >replay</mat-icon\r\n      >\r\n    </div>\r\n  </div>\r\n  <div class=\"row justify-content-center\">\r\n    <div class=\"col-12 d-flex align-items-center justify-content-center\">\r\n      <div class=\"crop-container\">\r\n        <image-cropper\r\n          [imageFile]=\"selectedFile\"\r\n          [maintainAspectRatio]=\"false\"\r\n          [autoCrop]=\"false\"\r\n          [containWithinAspectRatio]=\"false\"\r\n          [aspectRatio]=\"4 / 3\"\r\n          [cropperMinWidth]=\"128\"\r\n          [onlyScaleDown]=\"true\"\r\n          [roundCropper]=\"false\"\r\n          [canvasRotation]=\"0\"\r\n          [transform]=\"transform\"\r\n          [alignImage]=\"'left'\"\r\n          format=\"png\"\r\n          (imageCropped)=\"imageCropped($event)\"\r\n          [resizeToWidth]=\"customWidth\"\r\n          [resizeToHeight]=\"customHeight\"\r\n          [canvasRotation]=\"canvasRotation\"\r\n          [output]=\"'base64'\">\r\n        </image-cropper>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"row justify-content-center mt-2 mb-2 crop-large\">\r\n    <div class=\"col-12 d-flex align-items-center justify-content-center\">\r\n      <button\r\n        class=\"btn btn-primary mat-raised-button eqp-attachments-confirm-btn me-2\"\r\n        type=\"button\"\r\n        (click)=\"confirmAddAttachment()\">\r\n        {{ confirmLabel }}\r\n      </button>\r\n      <button class=\"btn mat-raised-button eqp-attachments-abort-btn\" type=\"button\" (click)=\"abortFile()\">\r\n        {{ abortLabel }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n  <div class=\"row justify-content-center mt-2 mb-2 crop-small\">\r\n    <div class=\"col-6 d-flex align-items-center justify-content-center\" style=\"font-size: 20px\">\r\n      <i class=\"fa fa-times\" (click)=\"abortFile()\"></i>\r\n    </div>\r\n    <div class=\"col-6 d-flex align-items-center justify-content-center\" style=\"font-size: 20px\">\r\n      <i class=\"fa fa-check\" (click)=\"confirmAddAttachment()\"></i>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n\r\n<!-- TEMPLATE PER FORM DI AGGIUNTA DI UN LINK -->\r\n<ng-template #addingLinkTemplate>\r\n  <span class=\"mb-1\" style=\"font-size: 20px\"><i class=\"fa fa-link\"></i>Inserisci l'URL</span>\r\n  <form [formGroup]=\"newAttachmentForm\" *ngIf=\"newAttachmentForm\">\r\n    <div class=\"row mb-2\" style=\"height: 80px\">\r\n      <div class=\"col-6 d-grid gap-2 mx-auto\">\r\n        <div class=\"input-group mb-1\">\r\n          <input\r\n            type=\"text\"\r\n            class=\"form-control\"\r\n            placeholder=\"{{ fileNameLabel }}\"\r\n            formControlName=\"name\"\r\n            [(ngModel)]=\"newAttachment.FileName\" />\r\n        </div>\r\n      </div>\r\n      <div class=\"col-12 d-grid gap-2\">\r\n        <div class=\"input-group\">\r\n          <input\r\n            required\r\n            type=\"text\"\r\n            class=\"form-control\"\r\n            placeholder=\"Link\"\r\n            formControlName=\"path\"\r\n            [(ngModel)]=\"newAttachment.FilePath\" />\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div class=\"row\">\r\n      <div class=\"col-6 d-grid gap-2\">\r\n        <button\r\n          class=\"btn btn-secondary mat-raised-button\"\r\n          (click)=\"selectedAttachment = null; addingLinkMode = false\"\r\n          type=\"button\">\r\n          {{ exitLabel }}\r\n        </button>\r\n      </div>\r\n      <div class=\"col-6 d-grid gap-2\">\r\n        <button\r\n          class=\"btn btn-primary mat-raised-button\"\r\n          type=\"submit\"\r\n          (click)=\"confirmAddAttachment(); selectedAttachment = null; addingLinkMode = false\">\r\n          {{ saveLabel }}\r\n        </button>\r\n      </div>\r\n    </div>\r\n  </form>\r\n</ng-template>\r\n", styles: ["ngx-file-drop ::ng-deep .ngx-file-drop__drop-zone{min-height:30vh;border-radius:5px!important;background-color:#e4e6ea!important;cursor:pointer;font-size:17px!important;border:dotted!important;padding-top:7vh}ngx-file-drop ::ng-deep .ngx-file-drop__drop-zone .ngx-file-drop__content{display:flex;flex-direction:column;align-items:center;justify-content:center;color:#73777a!important;margin:auto}.custom-height .mat-form-field-wrapper{height:20px}.eqp-attachments-header-title{font-weight:700;font-size:19px;line-height:24px;margin-bottom:auto}.single-attachment-inline-preview-container{max-height:400px;max-width:400px;display:flex;align-items:center}.single-attachment-inline-preview-container img{max-width:100%;max-height:120px}.inline-preview-container{max-height:100px;max-width:100px;display:flex;align-items:center;justify-content:center;width:100%;cursor:pointer}.inline-preview-container img{max-width:100%;max-height:100px}.inline-preview-container i{font-size:25px;margin:auto}.preview-container{max-height:60vh;max-width:100%}.preview-container .image-preview{max-width:100%;max-height:100%}.preview-container .link-preview{width:70vw;height:55vh}.closeButton{float:right}@media (max-width: 768px){.crop-large{display:none}}@media (min-width: 768px){.crop-small{display:none}}@media (max-width: 768px){.crop-container{max-width:55%}}@media (min-width: 768px){.crop-container{max-width:35%}}\n"], dependencies: [{ kind: "component", type: i6.MatButton, selector: "    button[mat-button], button[mat-raised-button], button[mat-flat-button],    button[mat-stroked-button]  ", exportAs: ["matButton"] }, { kind: "component", type: i6.MatMiniFabButton, selector: "button[mat-mini-fab]", exportAs: ["matButton"] }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: i8.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i8.MatLabel, selector: "mat-label" }, { kind: "component", type: i9.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i9.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i9.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i10.MatCard, selector: "mat-card", inputs: ["appearance"], exportAs: ["matCard"] }, { kind: "directive", type: i10.MatCardContent, selector: "mat-card-content" }, { kind: "component", type: i11.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i12.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i13.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i13.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i13.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "component", type: i14.ImageCropperComponent, selector: "image-cropper", inputs: ["imageChangedEvent", "imageURL", "imageBase64", "imageFile", "imageAltText", "cropperFrameAriaLabel", "output", "format", "transform", "maintainAspectRatio", "aspectRatio", "resetCropOnAspectRatioChange", "resizeToWidth", "resizeToHeight", "cropperMinWidth", "cropperMinHeight", "cropperMaxHeight", "cropperMaxWidth", "cropperStaticWidth", "cropperStaticHeight", "canvasRotation", "initialStepSize", "roundCropper", "onlyScaleDown", "imageQuality", "autoCrop", "backgroundColor", "containWithinAspectRatio", "hideResizeSquares", "allowMoveImage", "cropper", "alignImage", "disabled", "hidden"], outputs: ["imageCropped", "startCropImage", "imageLoaded", "cropperReady", "loadImageFailed", "transformChange"] }, { kind: "component", type: i15.EqpTableComponent, selector: "eqp-table" }, { kind: "component", type: i16.NgxFileDropComponent, selector: "ngx-file-drop", inputs: ["accept", "directory", "multiple", "dropZoneLabel", "dropZoneClassName", "useDragEnter", "contentClassName", "showBrowseBtn", "browseBtnClassName", "browseBtnLabel", "disabled"], outputs: ["onFileDrop", "onFileOver", "onFileLeave"] }, { kind: "directive", type: i16.NgxFileDropContentTemplateDirective, selector: "[ngx-file-drop-content-tmp]" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: EqpAttachmentsComponent, decorators: [{
             type: Component,
-            args: [{ selector: "eqp-attachments", template: "<!-- Se richiesta la gestione singola mostra il pulsante di caricamento di un singolo file -->\r\n<div *ngIf=\"multipleAttachment != true\">\r\n  <div *ngIf=\"!singleAttachmentDragAndDrop\">\r\n    <!-- Template del button per l'aggiunta di un allegato -->\r\n    <div *ngIf=\"!addingLinkMode\" class=\"text-center\">\r\n      <ng-container *ngTemplateOutlet=\"addAttachmentButton\"></ng-container>\r\n    </div>\r\n    <!-- Template della form per l'aggiunta di un link -->\r\n    <div *ngIf=\"addingLinkMode\" class=\"text-center\">\r\n      <ng-container *ngTemplateOutlet=\"addingLinkTemplate\"></ng-container>\r\n    </div>\r\n  </div>\r\n  <div *ngIf=\"singleAttachmentDragAndDrop\">\r\n    <input\r\n      #fileInput\r\n      style=\"display: none\"\r\n      id=\"file_attachment\"\r\n      name=\"file_attachment\"\r\n      type=\"file\"\r\n      (change)=\"onFileAdded($event)\"\r\n      [accept]=\"acceptedFileTypes\"\r\n      [multiple]=\"loadMultipleFiles\" />\r\n    <ngx-file-drop\r\n      (onFileDrop)=\"fileDropped($event)\"\r\n      (click)=\"onSelectFile($event, fileInput)\"\r\n      *ngIf=\"\r\n        allowedTypes &&\r\n        allowedTypes.includes(1) &&\r\n        (!attachmentsList || attachmentsList.length == 0 || (attachmentsList.length > 0 && !attachmentsList[0]))\r\n      \">\r\n      <ng-template ngx-file-drop-content-tmp *ngIf=\"!addingLinkMode\">\r\n        <i class=\"fa-solid fa-cloud-upload-alt fa-3x mt-3\"></i>\r\n        Trascina i file qui\r\n        <div class=\"btn-group mt-1\" role=\"group\">\r\n          <button type=\"button\" class=\"btn btn-light border-end\" (click)=\"fileInput.click()\">Scegli un file</button>\r\n          <div class=\"btn-group\" role=\"group\">\r\n            <button\r\n              type=\"button\"\r\n              class=\"btn btn-light border-start dropdown-toggle\"\r\n              [matMenuTriggerFor]=\"attachmentTypeMenu\"></button>\r\n            <mat-menu #attachmentTypeMenu=\"matMenu\">\r\n              <button\r\n                *ngIf=\"allowedTypes.includes(1)\"\r\n                mat-menu-item\r\n                (click)=\"fileInput.click()\"\r\n                class=\"eqp-attachments-file-btn\">\r\n                <i class=\"fas fa-file\"></i>\r\n                <span style=\"margin-left: 10px\">File</span>\r\n              </button>\r\n              <button\r\n                *ngIf=\"allowedTypes.includes(2)\"\r\n                mat-menu-item\r\n                (click)=\"switchToAddingLinkMode()\"\r\n                class=\"eqp-attachments-link-btn\">\r\n                <i class=\"fas fa-link\"></i>\r\n                <span style=\"margin-left: 10px\">Link</span>\r\n              </button>\r\n              <button\r\n                *ngIf=\"allowedTypes.includes(3)\"\r\n                mat-menu-item\r\n                (click)=\"chooseDropboxFile()\"\r\n                class=\"eqp-attachments-link-btn\">\r\n                <i class=\"fa-brands fa-dropbox\"></i>\r\n                <span style=\"margin-left: 10px\">Dropbox</span>\r\n              </button>\r\n            </mat-menu>\r\n          </div>\r\n        </div>\r\n      </ng-template>\r\n      <ng-template ngx-file-drop-content-tmp *ngIf=\"addingLinkMode\">\r\n        <ng-container *ngTemplateOutlet=\"addingLinkTemplate\"></ng-container>\r\n      </ng-template>\r\n    </ngx-file-drop>\r\n  </div>\r\n  <div class=\"text-center\">\r\n    <button\r\n      class=\"mb-2 me-2 eqp-attachments-download-btn\"\r\n      (click)=\"viewAttachment(attachmentsList[0])\"\r\n      type=\"button\"\r\n      mat-raised-button\r\n      *ngIf=\"attachmentsList && attachmentsList.length > 0 && attachmentsList[0]\"\r\n      color=\"primary\">\r\n      <mat-icon *ngIf=\"attachmentsList[0].AttachmentType == AttachmentType.FILE\">download</mat-icon>\r\n      <mat-icon *ngIf=\"attachmentsList[0].AttachmentType != AttachmentType.FILE\">open_in_new</mat-icon>\r\n      {{ attachmentsList[0].AttachmentType == AttachmentType.FILE ? downloadLabel : openLinkLabel }}\r\n    </button>\r\n    <button\r\n      class=\"mb-2 me-2 eqp-attachments-preview-btn\"\r\n      (click)=\"openPreviewDialog(attachmentsList[0])\"\r\n      type=\"button\"\r\n      mat-raised-button\r\n      color=\"primary\"\r\n      *ngIf=\"\r\n        showPreview &&\r\n        attachmentsList &&\r\n        attachmentsList.length > 0 &&\r\n        attachmentsList[0] &&\r\n        (!attachmentsList[0].FileContentType ||\r\n          (!attachmentsList[0].FileContentType.startsWith('video') &&\r\n            !attachmentsList[0].FileContentType.startsWith('audio'))) &&\r\n        attachmentsList[0].IsImage == true\r\n      \">\r\n      <mat-icon>visibility</mat-icon> {{ previewLabel }}\r\n    </button>\r\n    <button\r\n      class=\"mb-2 eqp-attachments-delete-btn\"\r\n      (click)=\"deleteAttachment(attachmentsList[0])\"\r\n      type=\"button\"\r\n      mat-raised-button\r\n      *ngIf=\"attachmentsList && attachmentsList.length > 0 && attachmentsList[0]\"\r\n      [disabled]=\"isDisabled\">\r\n      <mat-icon>delete</mat-icon> {{ deleteLabel }}\r\n    </button>\r\n  </div>\r\n  <div\r\n    class=\"row\"\r\n    style=\"margin-top: 10px\"\r\n    *ngIf=\"\r\n      attachmentsList.length > 0 &&\r\n      attachmentsList[0] &&\r\n      attachmentsList[0].FileDataBase64 &&\r\n      attachmentsList[0].IsImage == true\r\n    \">\r\n    <div class=\"col-sm-12 d-flex justify-content-center\">\r\n      <div class=\"single-attachment-inline-preview-container\">\r\n        <img src=\"data:image/png;base64,{{ attachmentsList[0].FileDataBase64 }}\" />\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"row\" *ngIf=\"attachmentsList.length > 0 && attachmentsList[0] && attachmentsList[0].IsImage != true\">\r\n    <div class=\"col-sm-12\">\r\n      <mat-form-field>\r\n        <mat-label>{{ fileNameLabel }}</mat-label>\r\n        <input readonly matInput [(ngModel)]=\"attachmentsList[0].FileName\" />\r\n      </mat-form-field>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<div *ngIf=\"multipleAttachment == true\">\r\n  <input\r\n    #fileInput\r\n    style=\"display: none\"\r\n    id=\"file_attachment\"\r\n    name=\"file_attachment\"\r\n    type=\"file\"\r\n    (change)=\"onFileAdded($event)\"\r\n    [accept]=\"acceptedFileTypes\"\r\n    [multiple]=\"loadMultipleFiles\" />\r\n  <ngx-file-drop (onFileDrop)=\"fileDropped($event)\" (click)=\"onSelectFile($event, fileInput)\">\r\n    <ng-template ngx-file-drop-content-tmp *ngIf=\"!addingLinkMode\">\r\n      <i class=\"fa-solid fa-cloud-upload-alt fa-3x mt-3\"></i>\r\n      Trascina i file qui\r\n      <div class=\"btn-group mt-1\" role=\"group\">\r\n        <button type=\"button\" class=\"btn btn-light border-end\" (click)=\"fileInput.click()\">Scegli un file</button>\r\n        <div class=\"btn-group\" role=\"group\">\r\n          <button\r\n            type=\"button\"\r\n            class=\"btn btn-light border-start dropdown-toggle\"\r\n            [matMenuTriggerFor]=\"attachmentTypeMenu\"></button>\r\n          <mat-menu #attachmentTypeMenu=\"matMenu\">\r\n            <button\r\n              *ngIf=\"allowedTypes.includes(1)\"\r\n              mat-menu-item\r\n              (click)=\"fileInput.click()\"\r\n              class=\"eqp-attachments-file-btn\">\r\n              <i class=\"fas fa-file\"></i>\r\n              <span style=\"margin-left: 10px\">File</span>\r\n            </button>\r\n            <button\r\n              *ngIf=\"allowedTypes.includes(2)\"\r\n              mat-menu-item\r\n              (click)=\"switchToAddingLinkMode()\"\r\n              class=\"eqp-attachments-link-btn\">\r\n              <i class=\"fas fa-link\"></i>\r\n              <span style=\"margin-left: 10px\">Link</span>\r\n            </button>\r\n            <button\r\n              *ngIf=\"allowedTypes.includes(3)\"\r\n              mat-menu-item\r\n              (click)=\"chooseDropboxFile()\"\r\n              class=\"eqp-attachments-link-btn\">\r\n              <i class=\"fa-brands fa-dropbox\"></i>\r\n              <span style=\"margin-left: 10px\">Dropbox</span>\r\n            </button>\r\n          </mat-menu>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n    <ng-template ngx-file-drop-content-tmp *ngIf=\"addingLinkMode\">\r\n      <ng-container *ngTemplateOutlet=\"addingLinkTemplate\"></ng-container>\r\n    </ng-template>\r\n  </ngx-file-drop>\r\n  <div class=\"mt-2\">\r\n    <eqp-table\r\n      #attachmentTable\r\n      [createMatCard]=\"false\"\r\n      #table\r\n      [columns]=\"attachmentsColumns\"\r\n      [isMultiLanguage]=\"isEqpTableMultiLanguage\"\r\n      [data]=\"attachmentsList\"\r\n      [paginatorVisible]=\"tablePaginatorVisible\"\r\n      [matPaginatorSize]=\"tablePaginatorSize\"\r\n      [emptyTableMessage]=\"emptyTableMessage\"\r\n      [searchText]=\"eqpTableSearchText\"\r\n      [isTableSearcheable]=\"isTableSearcheable\">\r\n    </eqp-table>\r\n  </div>\r\n</div>\r\n\r\n<ng-template #dialogCropImage>\r\n  <!-- Richiama il template per le funzionalit\u00E0 del CROPPIE -->\r\n  <div style=\"overflow-x: hidden\" [ngClass]=\"cropDialogClass\">\r\n    <ng-container\r\n      [ngTemplateOutlet]=\"croppieTemplate\"\r\n      [ngTemplateOutletContext]=\"{ form: newAttachmentForm }\"\r\n      *ngIf=\"showCropImage == true\"></ng-container>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #inlinePreviewTemplate let-row=\"row\">\r\n  <div\r\n    class=\"inline-preview-container\"\r\n    *ngIf=\"row.AttachmentType != AttachmentType.LINK && row.IsImage\"\r\n    (click)=\"openPreviewDialog(row)\">\r\n    <img src=\"data:image/png;base64,{{ row.FileThumbnailBase64 ? row.FileThumbnailBase64 : row.FileDataBase64 }}\" />\r\n  </div>\r\n  <div\r\n    class=\"inline-preview-container\"\r\n    *ngIf=\"row.AttachmentType != AttachmentType.LINK && !row.IsImage\"\r\n    (click)=\"openPreviewDialog(row)\">\r\n    <i [ngClass]=\"getAttachmentIcon(row)\"></i>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #dialogPreview>\r\n  <mat-card class=\"example-card\" *ngIf=\"selectedAttachment\">\r\n    <mat-card-content>\r\n      <div class=\"row\">\r\n        <div class=\"header-title-standard\">\r\n          {{ previewLabel }} {{ selectedAttachment?.AttachmentType == attachmentType.FILE ? \"File\" : \"Link\" }}\r\n          <button\r\n            type=\"button\"\r\n            class=\"btn-close closeButton\"\r\n            mat-dialog-close\r\n            (click)=\"selectedAttachment = null\"></button>\r\n        </div>\r\n      </div>\r\n      <div class=\"row mt-2\">\r\n        <!-- ANTEPRIMA IMMAGINE -->\r\n        <div class=\"col-12 text-center preview-container\" *ngIf=\"selectedAttachment.IsImage\">\r\n          <img\r\n            class=\"image-preview\"\r\n            src=\"data:image/png;base64,{{\r\n              selectedAttachment.FileDataBase64\r\n                ? selectedAttachment.FileDataBase64\r\n                : selectedAttachment.FileThumbnailBase64\r\n            }}\" />\r\n        </div>\r\n\r\n        <!-- ANTEPRIMA LINK -->\r\n        <div class=\"col-12 preview-container\" *ngIf=\"!selectedAttachment.IsImage\">\r\n          <iframe\r\n            class=\"link-preview\"\r\n            [src]=\"selectedAttachment.TrustedUrl\"\r\n            [title]=\"selectedAttachment.FileName\"></iframe>\r\n        </div>\r\n      </div>\r\n      <div class=\"row mt-3\">\r\n        <div class=\"col-sm-12 text-center\">\r\n          <button\r\n            mat-mini-fab\r\n            color=\"primary\"\r\n            matTooltip=\"Download\"\r\n            (click)=\"viewAttachment(selectedAttachment)\"\r\n            *ngIf=\"selectedAttachment.AttachmentType != AttachmentType.LINK\">\r\n            <mat-icon>download</mat-icon>\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </mat-card-content>\r\n  </mat-card>\r\n</ng-template>\r\n\r\n<!-- TEMPLATE PER IL PULSANTE DI AGGIUNTA NUOVO ALLEGATO -->\r\n<ng-template #addAttachmentButton>\r\n  <!--\r\n        Pulsanti per l'aggiunta di un file o un link. Ne viene visualizzato uno se:\r\n        - gli allowedTypes sono stati specificati, nell'array ne \u00E8 presente uno solo, quello inserito \u00E8 AttachmentType.FILE (o AttachmentType.LINK)\r\n        e sono nella gestione di pi\u00F9 allegati (multipleAttachment == true)\r\n        OPPURE\r\n        - gli allowedTypes sono stati specificati, nell'array ne \u00E8 presente uno solo, quello inserito \u00E8 AttachmentType.FILE (o AttachmentType.LINK)\r\n        e sono nella gestione di un singolo allegato (multipleAttachment == true) e non ne \u00E8 ancora stato selezionato uno (ovvero attachmentsList non esiste o non ha elementi)\r\n    -->\r\n  <input\r\n    #fileInput\r\n    style=\"display: none\"\r\n    id=\"file_attachment\"\r\n    name=\"file_attachment\"\r\n    type=\"file\"\r\n    (change)=\"onFileAdded($event)\"\r\n    [accept]=\"acceptedFileTypes\"\r\n    [multiple]=\"loadMultipleFiles\" />\r\n  <button\r\n    class=\"btn btn-primary mb-4 me-5 eqp-attachments-add-btn\"\r\n    mat-raised-button\r\n    color=\"primary\"\r\n    type=\"button\"\r\n    *ngIf=\"\r\n      allowedTypes &&\r\n      allowedTypes.length == 1 &&\r\n      (multipleAttachment == true ||\r\n        !attachmentsList ||\r\n        attachmentsList.length == 0 ||\r\n        (attachmentsList.length > 0 && !attachmentsList[0]))\r\n    \"\r\n    (click)=\"addFile(allowedTypes[0], fileInput)\"\r\n    [disabled]=\"isDisabled\">\r\n    <!-- Per l'aggiunta dei file mostro un'icona diversa dall'aggiunta dei link -->\r\n    <mat-icon *ngIf=\"allowedTypes[0] == 1\">cloud_upload</mat-icon>\r\n    <i class=\"fas fa-link\" *ngIf=\"allowedTypes[0] == 2\"></i>\r\n    <i class=\"fa-brands fa-dropbox\" *ngIf=\"allowedTypes[0] == 3\"></i>\r\n    <span style=\"margin-left: 10px\">\r\n      {{\r\n        allowedTypes[0] == 1\r\n          ? addButtonLabel + \" file\"\r\n          : allowedTypes[0] == 2\r\n          ? addButtonLabel + \" link\"\r\n          : uploadWithDropboxLabel\r\n      }}</span\r\n    >\r\n  </button>\r\n\r\n  <!-- Pulsante per aprire il menu per la scelta del tipo di Attachment da creare -->\r\n  <button\r\n    class=\"btn btn-primary mb-4 me-5 eqp-attachments-add-btn\"\r\n    mat-raised-button\r\n    color=\"primary\"\r\n    type=\"button\"\r\n    [matMenuTriggerFor]=\"attachmentTypeMenu\"\r\n    [disabled]=\"isDisabled\"\r\n    *ngIf=\"\r\n      !separatedUploadButtons &&\r\n      allowedTypes &&\r\n      allowedTypes.length > 1 &&\r\n      (multipleAttachment == true ||\r\n        !attachmentsList ||\r\n        attachmentsList.length == 0 ||\r\n        (attachmentsList.length > 0 && !attachmentsList[0]))\r\n    \">\r\n    <mat-icon *ngIf=\"multipleAttachment != true\">cloud_upload</mat-icon>\r\n    <mat-icon *ngIf=\"multipleAttachment == true\">add</mat-icon>\r\n    <span style=\"margin-left: 0px\"> {{ addButtonLabel }} </span>\r\n  </button>\r\n  <mat-menu #attachmentTypeMenu=\"matMenu\">\r\n    <input\r\n      #imageInput\r\n      style=\"display: none\"\r\n      id=\"file_attachment\"\r\n      name=\"file_attachment\"\r\n      type=\"file\"\r\n      (change)=\"onFileAdded($event)\"\r\n      [accept]=\"acceptedFileTypes\"\r\n      [multiple]=\"loadMultipleFiles\" />\r\n    <button\r\n      *ngIf=\"allowedTypes.includes(1)\"\r\n      mat-menu-item\r\n      (click)=\"imageInput.click()\"\r\n      class=\"eqp-attachments-file-btn\">\r\n      <i class=\"fas fa-file\"></i>\r\n      <span style=\"margin-left: 10px\">File</span>\r\n    </button>\r\n    <button\r\n      *ngIf=\"allowedTypes.includes(2)\"\r\n      mat-menu-item\r\n      (click)=\"switchToAddingLinkMode()\"\r\n      class=\"eqp-attachments-link-btn\">\r\n      <i class=\"fas fa-link\"></i>\r\n      <span style=\"margin-left: 10px\">Link</span>\r\n    </button>\r\n    <button\r\n      *ngIf=\"allowedTypes.includes(3)\"\r\n      mat-menu-item\r\n      (click)=\"chooseDropboxFile()\"\r\n      class=\"eqp-attachments-link-btn\">\r\n      <i class=\"fa-brands fa-dropbox\"></i>\r\n      <span style=\"margin-left: 10px\">Dropbox</span>\r\n    </button>\r\n  </mat-menu>\r\n\r\n  <div\r\n    *ngIf=\"\r\n      separatedUploadButtons &&\r\n      allowedTypes &&\r\n      allowedTypes.length > 1 &&\r\n      (multipleAttachment == true ||\r\n        !attachmentsList ||\r\n        attachmentsList.length == 0 ||\r\n        (attachmentsList.length > 0 && !attachmentsList[0]))\r\n    \">\r\n    <div class=\"btn-group\">\r\n      <button\r\n        *ngIf=\"allowedTypes.includes(1)\"\r\n        (click)=\"imageInput.click()\"\r\n        class=\"btn btn-secondary eqp-attachments-add-btn\"\r\n        mat-raised-button\r\n        color=\"secondary\"\r\n        type=\"button\">\r\n        <i class=\"fa-solid fa-cloud-upload\"></i>\r\n        <span style=\"margin-left: 10px\">File</span>\r\n      </button>\r\n      <input\r\n        #imageInput\r\n        style=\"display: none\"\r\n        id=\"file_attachment\"\r\n        name=\"file_attachment\"\r\n        type=\"file\"\r\n        (change)=\"onFileAdded($event)\"\r\n        [accept]=\"acceptedFileTypes\"\r\n        [multiple]=\"loadMultipleFiles\" />\r\n      <button\r\n        *ngIf=\"allowedTypes.includes(2)\"\r\n        (click)=\"switchToAddingLinkMode()\"\r\n        class=\"btn btn-secondary eqp-attachments-add-btn\"\r\n        mat-raised-button\r\n        color=\"secondary\"\r\n        type=\"button\">\r\n        <i class=\"fas fa-link\"></i>\r\n        <span style=\"margin-left: 10px\">Link</span>\r\n      </button>\r\n      <button\r\n        *ngIf=\"allowedTypes.includes(3)\"\r\n        (click)=\"chooseDropboxFile()\"\r\n        class=\"btn btn-secondary eqp-attachments-add-btn\"\r\n        mat-raised-button\r\n        color=\"secondary\"\r\n        type=\"button\">\r\n        <i class=\"fa-brands fa-dropbox\"></i>\r\n        <span style=\"margin-left: 10px\">Dropbox</span>\r\n      </button>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #croppieTemplate>\r\n  <div class=\"row m-3\">\r\n    <h4>{{ cropLabel }}</h4>\r\n  </div>\r\n  <div class=\"row m-2 crop-large\">\r\n    <div class=\"col-md-12 d-flex align-items-center justify-content-center\">\r\n      <button\r\n        [matTooltip]=\"rotateLeftLabel\"\r\n        *ngIf=\"cropOptions.includes(1)\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"rotateLeft()\">\r\n        <mat-icon style=\"vertical-align: middle\">rotate_left</mat-icon>\r\n      </button>\r\n      <button\r\n        [matTooltip]=\"rotateRightLabel\"\r\n        *ngIf=\"cropOptions.includes(1)\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"rotateRight()\">\r\n        <mat-icon style=\"vertical-align: middle\">rotate_right</mat-icon>\r\n      </button>\r\n      <button\r\n        [matTooltip]=\"flipHorinzontalLabel\"\r\n        *ngIf=\"cropOptions.includes(2)\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"flipHorizontal()\">\r\n        <mat-icon style=\"vertical-align: middle\">flip_horizontal</mat-icon>\r\n      </button>\r\n      <button\r\n        [matTooltip]=\"flipVerticalLabel\"\r\n        *ngIf=\"cropOptions.includes(2)\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"flipVertical()\">\r\n        <div style=\"transform: rotate(90deg)\"><mat-icon style=\"vertical-align: middle\">flip_vertical</mat-icon></div>\r\n      </button>\r\n      <button\r\n        [matTooltip]=\"'Reset'\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"restoreOriginalDimensions()\">\r\n        <mat-icon style=\"vertical-align: middle\">replay</mat-icon>\r\n      </button>\r\n    </div>\r\n  </div>\r\n  <div class=\"row m-2 crop-small\">\r\n    <div class=\"col-md-12 d-flex align-items-center justify-content-center\">\r\n      <mat-icon *ngIf=\"cropOptions.includes(1)\" style=\"font-size: 27px; vertical-align: middle\" (click)=\"rotateLeft()\"\r\n        >rotate_left</mat-icon\r\n      >\r\n      <mat-icon\r\n        class=\"ms-3\"\r\n        *ngIf=\"cropOptions.includes(1)\"\r\n        style=\"font-size: 27px; vertical-align: middle\"\r\n        (click)=\"rotateRight()\"\r\n        >rotate_right</mat-icon\r\n      >\r\n      <mat-icon\r\n        class=\"ms-3\"\r\n        *ngIf=\"cropOptions.includes(2)\"\r\n        style=\"font-size: 27px; vertical-align: middle\"\r\n        (click)=\"flipHorizontal()\"\r\n        >flip_horizontal</mat-icon\r\n      >\r\n      <div class=\"ms-3\" style=\"transform: rotate(90deg)\">\r\n        <mat-icon\r\n          *ngIf=\"cropOptions.includes(2)\"\r\n          style=\"font-size: 27px; vertical-align: middle\"\r\n          (click)=\"flipVertical()\"\r\n          >flip_vertical</mat-icon\r\n        >\r\n      </div>\r\n      <mat-icon class=\"ms-3\" (click)=\"restoreOriginalDimensions()\" style=\"font-size: 27px; vertical-align: middle\"\r\n        >replay</mat-icon\r\n      >\r\n    </div>\r\n  </div>\r\n  <div class=\"row justify-content-center\">\r\n    <div class=\"col-12 d-flex align-items-center justify-content-center\">\r\n      <div class=\"crop-container\">\r\n        <image-cropper\r\n          [imageFile]=\"selectedFile\"\r\n          [maintainAspectRatio]=\"false\"\r\n          [autoCrop]=\"false\"\r\n          [containWithinAspectRatio]=\"false\"\r\n          [aspectRatio]=\"4 / 3\"\r\n          [cropperMinWidth]=\"128\"\r\n          [onlyScaleDown]=\"true\"\r\n          [roundCropper]=\"false\"\r\n          [canvasRotation]=\"0\"\r\n          [transform]=\"transform\"\r\n          [alignImage]=\"'left'\"\r\n          format=\"png\"\r\n          (imageCropped)=\"imageCropped($event)\"\r\n          [resizeToWidth]=\"customWidth\"\r\n          [resizeToHeight]=\"customHeight\"\r\n          [canvasRotation]=\"canvasRotation\">\r\n        </image-cropper>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"row justify-content-center mt-2 mb-2 crop-large\">\r\n    <div class=\"col-12 d-flex align-items-center justify-content-center\">\r\n      <button\r\n        class=\"btn btn-primary mat-raised-button eqp-attachments-confirm-btn me-2\"\r\n        type=\"button\"\r\n        (click)=\"confirmAddAttachment()\">\r\n        {{ confirmLabel }}\r\n      </button>\r\n      <button class=\"btn mat-raised-button eqp-attachments-abort-btn\" type=\"button\" (click)=\"abortFile()\">\r\n        {{ abortLabel }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n  <div class=\"row justify-content-center mt-2 mb-2 crop-small\">\r\n    <div class=\"col-6 d-flex align-items-center justify-content-center\" style=\"font-size: 20px\">\r\n      <i class=\"fa fa-times\" (click)=\"abortFile()\"></i>\r\n    </div>\r\n    <div class=\"col-6 d-flex align-items-center justify-content-center\" style=\"font-size: 20px\">\r\n      <i class=\"fa fa-check\" (click)=\"confirmAddAttachment()\"></i>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n\r\n<!-- TEMPLATE PER FORM DI AGGIUNTA DI UN LINK -->\r\n<ng-template #addingLinkTemplate>\r\n  <span class=\"mb-1\" style=\"font-size: 20px\"><i class=\"fa fa-link\"></i>Inserisci l'URL</span>\r\n  <form [formGroup]=\"newAttachmentForm\" *ngIf=\"newAttachmentForm\">\r\n    <div class=\"row mb-2\" style=\"height: 80px\">\r\n      <div class=\"col-6 d-grid gap-2 mx-auto\">\r\n        <div class=\"input-group mb-1\">\r\n          <input\r\n            type=\"text\"\r\n            class=\"form-control\"\r\n            placeholder=\"{{ fileNameLabel }}\"\r\n            formControlName=\"name\"\r\n            [(ngModel)]=\"newAttachment.FileName\" />\r\n        </div>\r\n      </div>\r\n      <div class=\"col-12 d-grid gap-2\">\r\n        <div class=\"input-group\">\r\n          <input\r\n            required\r\n            type=\"text\"\r\n            class=\"form-control\"\r\n            placeholder=\"Link\"\r\n            formControlName=\"path\"\r\n            [(ngModel)]=\"newAttachment.FilePath\" />\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div class=\"row\">\r\n      <div class=\"col-6 d-grid gap-2\">\r\n        <button\r\n          class=\"btn btn-secondary mat-raised-button\"\r\n          (click)=\"selectedAttachment = null; addingLinkMode = false\"\r\n          type=\"button\">\r\n          {{ exitLabel }}\r\n        </button>\r\n      </div>\r\n      <div class=\"col-6 d-grid gap-2\">\r\n        <button\r\n          class=\"btn btn-primary mat-raised-button\"\r\n          type=\"submit\"\r\n          (click)=\"confirmAddAttachment(); selectedAttachment = null; addingLinkMode = false\">\r\n          {{ saveLabel }}\r\n        </button>\r\n      </div>\r\n    </div>\r\n  </form>\r\n</ng-template>\r\n", styles: ["ngx-file-drop ::ng-deep .ngx-file-drop__drop-zone{min-height:30vh;border-radius:5px!important;background-color:#e4e6ea!important;cursor:pointer;font-size:17px!important;border:dotted!important;padding-top:7vh}ngx-file-drop ::ng-deep .ngx-file-drop__drop-zone .ngx-file-drop__content{display:flex;flex-direction:column;align-items:center;justify-content:center;color:#73777a!important;margin:auto}.custom-height .mat-form-field-wrapper{height:20px}.eqp-attachments-header-title{font-weight:700;font-size:19px;line-height:24px;margin-bottom:auto}.single-attachment-inline-preview-container{max-height:400px;max-width:400px;display:flex;align-items:center}.single-attachment-inline-preview-container img{max-width:100%;max-height:120px}.inline-preview-container{max-height:100px;max-width:100px;display:flex;align-items:center;justify-content:center;width:100%;cursor:pointer}.inline-preview-container img{max-width:100%;max-height:100px}.inline-preview-container i{font-size:25px;margin:auto}.preview-container{max-height:60vh;max-width:100%}.preview-container .image-preview{max-width:100%;max-height:100%}.preview-container .link-preview{width:70vw;height:55vh}.closeButton{float:right}@media (max-width: 768px){.crop-large{display:none}}@media (min-width: 768px){.crop-small{display:none}}@media (max-width: 768px){.crop-container{max-width:55%}}@media (min-width: 768px){.crop-container{max-width:35%}}\n"] }]
+            args: [{ selector: "eqp-attachments", template: "<!-- Se richiesta la gestione singola mostra il pulsante di caricamento di un singolo file -->\r\n<div *ngIf=\"multipleAttachment != true\">\r\n  <div *ngIf=\"!singleAttachmentDragAndDrop\">\r\n    <!-- Template del button per l'aggiunta di un allegato -->\r\n    <div *ngIf=\"!addingLinkMode\" class=\"text-center\">\r\n      <ng-container *ngTemplateOutlet=\"addAttachmentButton\"></ng-container>\r\n    </div>\r\n    <!-- Template della form per l'aggiunta di un link -->\r\n    <div *ngIf=\"addingLinkMode\" class=\"text-center\">\r\n      <ng-container *ngTemplateOutlet=\"addingLinkTemplate\"></ng-container>\r\n    </div>\r\n  </div>\r\n  <div *ngIf=\"singleAttachmentDragAndDrop\">\r\n    <input\r\n      #fileInput\r\n      style=\"display: none\"\r\n      id=\"file_attachment\"\r\n      name=\"file_attachment\"\r\n      type=\"file\"\r\n      (change)=\"onFileAdded($event)\"\r\n      [accept]=\"acceptedFileTypes\"\r\n      [multiple]=\"loadMultipleFiles\" />\r\n    <ngx-file-drop\r\n      (onFileDrop)=\"fileDropped($event)\"\r\n      (click)=\"onSelectFile($event, fileInput)\"\r\n      *ngIf=\"\r\n        allowedTypes &&\r\n        allowedTypes.includes(1) &&\r\n        (!attachmentsList || attachmentsList.length == 0 || (attachmentsList.length > 0 && !attachmentsList[0]))\r\n      \">\r\n      <ng-template ngx-file-drop-content-tmp *ngIf=\"!addingLinkMode\">\r\n        <i class=\"fa-solid fa-cloud-upload-alt fa-3x mt-3\"></i>\r\n        Trascina i file qui\r\n        <div class=\"btn-group mt-1\" role=\"group\">\r\n          <button type=\"button\" class=\"btn btn-light border-end\" (click)=\"fileInput.click()\">Scegli un file</button>\r\n          <div class=\"btn-group\" role=\"group\">\r\n            <button\r\n              type=\"button\"\r\n              class=\"btn btn-light border-start dropdown-toggle\"\r\n              [matMenuTriggerFor]=\"attachmentTypeMenu\"></button>\r\n            <mat-menu #attachmentTypeMenu=\"matMenu\">\r\n              <button\r\n                *ngIf=\"allowedTypes.includes(1)\"\r\n                mat-menu-item\r\n                (click)=\"fileInput.click()\"\r\n                class=\"eqp-attachments-file-btn\">\r\n                <i class=\"fas fa-file\"></i>\r\n                <span style=\"margin-left: 10px\">File</span>\r\n              </button>\r\n              <button\r\n                *ngIf=\"allowedTypes.includes(2)\"\r\n                mat-menu-item\r\n                (click)=\"switchToAddingLinkMode()\"\r\n                class=\"eqp-attachments-link-btn\">\r\n                <i class=\"fas fa-link\"></i>\r\n                <span style=\"margin-left: 10px\">Link</span>\r\n              </button>\r\n              <button\r\n                *ngIf=\"allowedTypes.includes(3)\"\r\n                mat-menu-item\r\n                (click)=\"chooseDropboxFile()\"\r\n                class=\"eqp-attachments-link-btn\">\r\n                <i class=\"fa-brands fa-dropbox\"></i>\r\n                <span style=\"margin-left: 10px\">Dropbox</span>\r\n              </button>\r\n            </mat-menu>\r\n          </div>\r\n        </div>\r\n      </ng-template>\r\n      <ng-template ngx-file-drop-content-tmp *ngIf=\"addingLinkMode\">\r\n        <ng-container *ngTemplateOutlet=\"addingLinkTemplate\"></ng-container>\r\n      </ng-template>\r\n    </ngx-file-drop>\r\n  </div>\r\n  <div class=\"text-center\">\r\n    <button\r\n      class=\"mb-2 me-2 eqp-attachments-download-btn\"\r\n      (click)=\"viewAttachment(attachmentsList[0])\"\r\n      type=\"button\"\r\n      mat-raised-button\r\n      *ngIf=\"attachmentsList && attachmentsList.length > 0 && attachmentsList[0]\"\r\n      color=\"primary\">\r\n      <mat-icon *ngIf=\"attachmentsList[0].AttachmentType == AttachmentType.FILE\">download</mat-icon>\r\n      <mat-icon *ngIf=\"attachmentsList[0].AttachmentType != AttachmentType.FILE\">open_in_new</mat-icon>\r\n      {{ attachmentsList[0].AttachmentType == AttachmentType.FILE ? downloadLabel : openLinkLabel }}\r\n    </button>\r\n    <button\r\n      class=\"mb-2 me-2 eqp-attachments-preview-btn\"\r\n      (click)=\"openPreviewDialog(attachmentsList[0])\"\r\n      type=\"button\"\r\n      mat-raised-button\r\n      color=\"primary\"\r\n      *ngIf=\"\r\n        showPreview &&\r\n        attachmentsList &&\r\n        attachmentsList.length > 0 &&\r\n        attachmentsList[0] &&\r\n        (!attachmentsList[0].FileContentType ||\r\n          (!attachmentsList[0].FileContentType.startsWith('video') &&\r\n            !attachmentsList[0].FileContentType.startsWith('audio'))) &&\r\n        attachmentsList[0].IsImage == true\r\n      \">\r\n      <mat-icon>visibility</mat-icon> {{ previewLabel }}\r\n    </button>\r\n    <button\r\n      class=\"mb-2 eqp-attachments-delete-btn\"\r\n      (click)=\"deleteAttachment(attachmentsList[0])\"\r\n      type=\"button\"\r\n      mat-raised-button\r\n      *ngIf=\"attachmentsList && attachmentsList.length > 0 && attachmentsList[0]\"\r\n      [disabled]=\"isDisabled\">\r\n      <mat-icon>delete</mat-icon> {{ deleteLabel }}\r\n    </button>\r\n  </div>\r\n  <div\r\n    class=\"row\"\r\n    style=\"margin-top: 10px\"\r\n    *ngIf=\"\r\n      attachmentsList.length > 0 &&\r\n      attachmentsList[0] &&\r\n      attachmentsList[0].FileDataBase64 &&\r\n      attachmentsList[0].IsImage == true\r\n    \">\r\n    <div class=\"col-sm-12 d-flex justify-content-center\">\r\n      <div class=\"single-attachment-inline-preview-container\">\r\n        <img src=\"data:image/png;base64,{{ attachmentsList[0].FileDataBase64 }}\" />\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"row\" *ngIf=\"attachmentsList.length > 0 && attachmentsList[0] && attachmentsList[0].IsImage != true\">\r\n    <div class=\"col-sm-12\">\r\n      <mat-form-field>\r\n        <mat-label>{{ fileNameLabel }}</mat-label>\r\n        <input readonly matInput [(ngModel)]=\"attachmentsList[0].FileName\" />\r\n      </mat-form-field>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<div *ngIf=\"multipleAttachment == true\">\r\n  <input\r\n    #fileInput\r\n    style=\"display: none\"\r\n    id=\"file_attachment\"\r\n    name=\"file_attachment\"\r\n    type=\"file\"\r\n    (change)=\"onFileAdded($event)\"\r\n    [accept]=\"acceptedFileTypes\"\r\n    [multiple]=\"loadMultipleFiles\" />\r\n  <ngx-file-drop (onFileDrop)=\"fileDropped($event)\" (click)=\"onSelectFile($event, fileInput)\">\r\n    <ng-template ngx-file-drop-content-tmp *ngIf=\"!addingLinkMode\">\r\n      <i class=\"fa-solid fa-cloud-upload-alt fa-3x mt-3\"></i>\r\n      Trascina i file qui\r\n      <div class=\"btn-group mt-1\" role=\"group\">\r\n        <button type=\"button\" class=\"btn btn-light border-end\" (click)=\"fileInput.click()\">Scegli un file</button>\r\n        <div class=\"btn-group\" role=\"group\">\r\n          <button\r\n            type=\"button\"\r\n            class=\"btn btn-light border-start dropdown-toggle\"\r\n            [matMenuTriggerFor]=\"attachmentTypeMenu\"></button>\r\n          <mat-menu #attachmentTypeMenu=\"matMenu\">\r\n            <button\r\n              *ngIf=\"allowedTypes.includes(1)\"\r\n              mat-menu-item\r\n              (click)=\"fileInput.click()\"\r\n              class=\"eqp-attachments-file-btn\">\r\n              <i class=\"fas fa-file\"></i>\r\n              <span style=\"margin-left: 10px\">File</span>\r\n            </button>\r\n            <button\r\n              *ngIf=\"allowedTypes.includes(2)\"\r\n              mat-menu-item\r\n              (click)=\"switchToAddingLinkMode()\"\r\n              class=\"eqp-attachments-link-btn\">\r\n              <i class=\"fas fa-link\"></i>\r\n              <span style=\"margin-left: 10px\">Link</span>\r\n            </button>\r\n            <button\r\n              *ngIf=\"allowedTypes.includes(3)\"\r\n              mat-menu-item\r\n              (click)=\"chooseDropboxFile()\"\r\n              class=\"eqp-attachments-link-btn\">\r\n              <i class=\"fa-brands fa-dropbox\"></i>\r\n              <span style=\"margin-left: 10px\">Dropbox</span>\r\n            </button>\r\n          </mat-menu>\r\n        </div>\r\n      </div>\r\n    </ng-template>\r\n    <ng-template ngx-file-drop-content-tmp *ngIf=\"addingLinkMode\">\r\n      <ng-container *ngTemplateOutlet=\"addingLinkTemplate\"></ng-container>\r\n    </ng-template>\r\n  </ngx-file-drop>\r\n  <div class=\"mt-2\">\r\n    <eqp-table\r\n      #attachmentTable\r\n      [createMatCard]=\"false\"\r\n      #table\r\n      [columns]=\"attachmentsColumns\"\r\n      [isMultiLanguage]=\"isEqpTableMultiLanguage\"\r\n      [data]=\"attachmentsList\"\r\n      [paginatorVisible]=\"tablePaginatorVisible\"\r\n      [matPaginatorSize]=\"tablePaginatorSize\"\r\n      [emptyTableMessage]=\"emptyTableMessage\"\r\n      [searchText]=\"eqpTableSearchText\"\r\n      [isTableSearcheable]=\"isTableSearcheable\">\r\n    </eqp-table>\r\n  </div>\r\n</div>\r\n\r\n<ng-template #dialogCropImage>\r\n  <!-- Richiama il template per le funzionalit\u00E0 del CROPPIE -->\r\n  <div style=\"overflow-x: hidden\" [ngClass]=\"cropDialogClass\">\r\n    <ng-container\r\n      [ngTemplateOutlet]=\"croppieTemplate\"\r\n      [ngTemplateOutletContext]=\"{ form: newAttachmentForm }\"\r\n      *ngIf=\"showCropImage == true\"></ng-container>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #inlinePreviewTemplate let-row=\"row\">\r\n  <div\r\n    class=\"inline-preview-container\"\r\n    *ngIf=\"row.AttachmentType != AttachmentType.LINK && row.IsImage\"\r\n    (click)=\"openPreviewDialog(row)\">\r\n    <img src=\"data:image/png;base64,{{ row.FileThumbnailBase64 ? row.FileThumbnailBase64 : row.FileDataBase64 }}\" />\r\n  </div>\r\n  <div\r\n    class=\"inline-preview-container\"\r\n    *ngIf=\"row.AttachmentType != AttachmentType.LINK && !row.IsImage\"\r\n    (click)=\"openPreviewDialog(row)\">\r\n    <i [ngClass]=\"getAttachmentIcon(row)\"></i>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #dialogPreview>\r\n  <mat-card class=\"example-card\" *ngIf=\"selectedAttachment\">\r\n    <mat-card-content>\r\n      <div class=\"row\">\r\n        <div class=\"header-title-standard\">\r\n          {{ previewLabel }} {{ selectedAttachment?.AttachmentType == attachmentType.FILE ? \"File\" : \"Link\" }}\r\n          <button\r\n            type=\"button\"\r\n            class=\"btn-close closeButton\"\r\n            mat-dialog-close\r\n            (click)=\"selectedAttachment = null\"></button>\r\n        </div>\r\n      </div>\r\n      <div class=\"row mt-2\">\r\n        <!-- ANTEPRIMA IMMAGINE -->\r\n        <div class=\"col-12 text-center preview-container\" *ngIf=\"selectedAttachment.IsImage\">\r\n          <img\r\n            class=\"image-preview\"\r\n            src=\"data:image/png;base64,{{\r\n              selectedAttachment.FileDataBase64\r\n                ? selectedAttachment.FileDataBase64\r\n                : selectedAttachment.FileThumbnailBase64\r\n            }}\" />\r\n        </div>\r\n\r\n        <!-- ANTEPRIMA LINK -->\r\n        <div class=\"col-12 preview-container\" *ngIf=\"!selectedAttachment.IsImage\">\r\n          <iframe\r\n            class=\"link-preview\"\r\n            [src]=\"selectedAttachment.TrustedUrl\"\r\n            [title]=\"selectedAttachment.FileName\"></iframe>\r\n        </div>\r\n      </div>\r\n      <div class=\"row mt-3\">\r\n        <div class=\"col-sm-12 text-center\">\r\n          <button\r\n            mat-mini-fab\r\n            color=\"primary\"\r\n            matTooltip=\"Download\"\r\n            (click)=\"viewAttachment(selectedAttachment)\"\r\n            *ngIf=\"selectedAttachment.AttachmentType != AttachmentType.LINK\">\r\n            <mat-icon>download</mat-icon>\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </mat-card-content>\r\n  </mat-card>\r\n</ng-template>\r\n\r\n<!-- TEMPLATE PER IL PULSANTE DI AGGIUNTA NUOVO ALLEGATO -->\r\n<ng-template #addAttachmentButton>\r\n  <!--\r\n        Pulsanti per l'aggiunta di un file o un link. Ne viene visualizzato uno se:\r\n        - gli allowedTypes sono stati specificati, nell'array ne \u00E8 presente uno solo, quello inserito \u00E8 AttachmentType.FILE (o AttachmentType.LINK)\r\n        e sono nella gestione di pi\u00F9 allegati (multipleAttachment == true)\r\n        OPPURE\r\n        - gli allowedTypes sono stati specificati, nell'array ne \u00E8 presente uno solo, quello inserito \u00E8 AttachmentType.FILE (o AttachmentType.LINK)\r\n        e sono nella gestione di un singolo allegato (multipleAttachment == true) e non ne \u00E8 ancora stato selezionato uno (ovvero attachmentsList non esiste o non ha elementi)\r\n    -->\r\n  <input\r\n    #fileInput\r\n    style=\"display: none\"\r\n    id=\"file_attachment\"\r\n    name=\"file_attachment\"\r\n    type=\"file\"\r\n    (change)=\"onFileAdded($event)\"\r\n    [accept]=\"acceptedFileTypes\"\r\n    [multiple]=\"loadMultipleFiles\" />\r\n  <button\r\n    class=\"btn btn-primary mb-4 me-5 eqp-attachments-add-btn\"\r\n    mat-raised-button\r\n    color=\"primary\"\r\n    type=\"button\"\r\n    *ngIf=\"\r\n      allowedTypes &&\r\n      allowedTypes.length == 1 &&\r\n      (multipleAttachment == true ||\r\n        !attachmentsList ||\r\n        attachmentsList.length == 0 ||\r\n        (attachmentsList.length > 0 && !attachmentsList[0]))\r\n    \"\r\n    (click)=\"addFile(allowedTypes[0], fileInput)\"\r\n    [disabled]=\"isDisabled\">\r\n    <!-- Per l'aggiunta dei file mostro un'icona diversa dall'aggiunta dei link -->\r\n    <mat-icon *ngIf=\"allowedTypes[0] == 1\">cloud_upload</mat-icon>\r\n    <i class=\"fas fa-link\" *ngIf=\"allowedTypes[0] == 2\"></i>\r\n    <i class=\"fa-brands fa-dropbox\" *ngIf=\"allowedTypes[0] == 3\"></i>\r\n    <span style=\"margin-left: 10px\">\r\n      {{\r\n        allowedTypes[0] == 1\r\n          ? addButtonLabel + \" file\"\r\n          : allowedTypes[0] == 2\r\n          ? addButtonLabel + \" link\"\r\n          : uploadWithDropboxLabel\r\n      }}</span\r\n    >\r\n  </button>\r\n\r\n  <!-- Pulsante per aprire il menu per la scelta del tipo di Attachment da creare -->\r\n  <button\r\n    class=\"btn btn-primary mb-4 me-5 eqp-attachments-add-btn\"\r\n    mat-raised-button\r\n    color=\"primary\"\r\n    type=\"button\"\r\n    [matMenuTriggerFor]=\"attachmentTypeMenu\"\r\n    [disabled]=\"isDisabled\"\r\n    *ngIf=\"\r\n      !separatedUploadButtons &&\r\n      allowedTypes &&\r\n      allowedTypes.length > 1 &&\r\n      (multipleAttachment == true ||\r\n        !attachmentsList ||\r\n        attachmentsList.length == 0 ||\r\n        (attachmentsList.length > 0 && !attachmentsList[0]))\r\n    \">\r\n    <mat-icon *ngIf=\"multipleAttachment != true\">cloud_upload</mat-icon>\r\n    <mat-icon *ngIf=\"multipleAttachment == true\">add</mat-icon>\r\n    <span style=\"margin-left: 0px\"> {{ addButtonLabel }} </span>\r\n  </button>\r\n  <mat-menu #attachmentTypeMenu=\"matMenu\">\r\n    <input\r\n      #imageInput\r\n      style=\"display: none\"\r\n      id=\"file_attachment\"\r\n      name=\"file_attachment\"\r\n      type=\"file\"\r\n      (change)=\"onFileAdded($event)\"\r\n      [accept]=\"acceptedFileTypes\"\r\n      [multiple]=\"loadMultipleFiles\" />\r\n    <button\r\n      *ngIf=\"allowedTypes.includes(1)\"\r\n      mat-menu-item\r\n      (click)=\"imageInput.click()\"\r\n      class=\"eqp-attachments-file-btn\">\r\n      <i class=\"fas fa-file\"></i>\r\n      <span style=\"margin-left: 10px\">File</span>\r\n    </button>\r\n    <button\r\n      *ngIf=\"allowedTypes.includes(2)\"\r\n      mat-menu-item\r\n      (click)=\"switchToAddingLinkMode()\"\r\n      class=\"eqp-attachments-link-btn\">\r\n      <i class=\"fas fa-link\"></i>\r\n      <span style=\"margin-left: 10px\">Link</span>\r\n    </button>\r\n    <button\r\n      *ngIf=\"allowedTypes.includes(3)\"\r\n      mat-menu-item\r\n      (click)=\"chooseDropboxFile()\"\r\n      class=\"eqp-attachments-link-btn\">\r\n      <i class=\"fa-brands fa-dropbox\"></i>\r\n      <span style=\"margin-left: 10px\">Dropbox</span>\r\n    </button>\r\n  </mat-menu>\r\n\r\n  <div\r\n    *ngIf=\"\r\n      separatedUploadButtons &&\r\n      allowedTypes &&\r\n      allowedTypes.length > 1 &&\r\n      (multipleAttachment == true ||\r\n        !attachmentsList ||\r\n        attachmentsList.length == 0 ||\r\n        (attachmentsList.length > 0 && !attachmentsList[0]))\r\n    \">\r\n    <div class=\"btn-group\">\r\n      <button\r\n        *ngIf=\"allowedTypes.includes(1)\"\r\n        (click)=\"imageInput.click()\"\r\n        class=\"btn btn-secondary eqp-attachments-add-btn\"\r\n        mat-raised-button\r\n        color=\"secondary\"\r\n        type=\"button\">\r\n        <i class=\"fa-solid fa-cloud-upload\"></i>\r\n        <span style=\"margin-left: 10px\">File</span>\r\n      </button>\r\n      <input\r\n        #imageInput\r\n        style=\"display: none\"\r\n        id=\"file_attachment\"\r\n        name=\"file_attachment\"\r\n        type=\"file\"\r\n        (change)=\"onFileAdded($event)\"\r\n        [accept]=\"acceptedFileTypes\"\r\n        [multiple]=\"loadMultipleFiles\" />\r\n      <button\r\n        *ngIf=\"allowedTypes.includes(2)\"\r\n        (click)=\"switchToAddingLinkMode()\"\r\n        class=\"btn btn-secondary eqp-attachments-add-btn\"\r\n        mat-raised-button\r\n        color=\"secondary\"\r\n        type=\"button\">\r\n        <i class=\"fas fa-link\"></i>\r\n        <span style=\"margin-left: 10px\">Link</span>\r\n      </button>\r\n      <button\r\n        *ngIf=\"allowedTypes.includes(3)\"\r\n        (click)=\"chooseDropboxFile()\"\r\n        class=\"btn btn-secondary eqp-attachments-add-btn\"\r\n        mat-raised-button\r\n        color=\"secondary\"\r\n        type=\"button\">\r\n        <i class=\"fa-brands fa-dropbox\"></i>\r\n        <span style=\"margin-left: 10px\">Dropbox</span>\r\n      </button>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #croppieTemplate>\r\n  <div class=\"row m-3\">\r\n    <h4>{{ cropLabel }}</h4>\r\n  </div>\r\n  <div class=\"row m-2 crop-large\">\r\n    <div class=\"col-md-12 d-flex align-items-center justify-content-center\">\r\n      <button\r\n        [matTooltip]=\"rotateLeftLabel\"\r\n        *ngIf=\"cropOptions.includes(1)\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"rotateLeft()\">\r\n        <mat-icon style=\"vertical-align: middle\">rotate_left</mat-icon>\r\n      </button>\r\n      <button\r\n        [matTooltip]=\"rotateRightLabel\"\r\n        *ngIf=\"cropOptions.includes(1)\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"rotateRight()\">\r\n        <mat-icon style=\"vertical-align: middle\">rotate_right</mat-icon>\r\n      </button>\r\n      <button\r\n        [matTooltip]=\"flipHorinzontalLabel\"\r\n        *ngIf=\"cropOptions.includes(2)\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"flipHorizontal()\">\r\n        <mat-icon style=\"vertical-align: middle\">flip_horizontal</mat-icon>\r\n      </button>\r\n      <button\r\n        [matTooltip]=\"flipVerticalLabel\"\r\n        *ngIf=\"cropOptions.includes(2)\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"flipVertical()\">\r\n        <div style=\"transform: rotate(90deg)\"><mat-icon style=\"vertical-align: middle\">flip_vertical</mat-icon></div>\r\n      </button>\r\n      <button\r\n        [matTooltip]=\"'Reset'\"\r\n        class=\"btn btn-primary mat-raised-button ms-2\"\r\n        (click)=\"restoreOriginalDimensions()\">\r\n        <mat-icon style=\"vertical-align: middle\">replay</mat-icon>\r\n      </button>\r\n    </div>\r\n  </div>\r\n  <div class=\"row m-2 crop-small\">\r\n    <div class=\"col-md-12 d-flex align-items-center justify-content-center\">\r\n      <mat-icon *ngIf=\"cropOptions.includes(1)\" style=\"font-size: 27px; vertical-align: middle\" (click)=\"rotateLeft()\"\r\n        >rotate_left</mat-icon\r\n      >\r\n      <mat-icon\r\n        class=\"ms-3\"\r\n        *ngIf=\"cropOptions.includes(1)\"\r\n        style=\"font-size: 27px; vertical-align: middle\"\r\n        (click)=\"rotateRight()\"\r\n        >rotate_right</mat-icon\r\n      >\r\n      <mat-icon\r\n        class=\"ms-3\"\r\n        *ngIf=\"cropOptions.includes(2)\"\r\n        style=\"font-size: 27px; vertical-align: middle\"\r\n        (click)=\"flipHorizontal()\"\r\n        >flip_horizontal</mat-icon\r\n      >\r\n      <div class=\"ms-3\" style=\"transform: rotate(90deg)\">\r\n        <mat-icon\r\n          *ngIf=\"cropOptions.includes(2)\"\r\n          style=\"font-size: 27px; vertical-align: middle\"\r\n          (click)=\"flipVertical()\"\r\n          >flip_vertical</mat-icon\r\n        >\r\n      </div>\r\n      <mat-icon class=\"ms-3\" (click)=\"restoreOriginalDimensions()\" style=\"font-size: 27px; vertical-align: middle\"\r\n        >replay</mat-icon\r\n      >\r\n    </div>\r\n  </div>\r\n  <div class=\"row justify-content-center\">\r\n    <div class=\"col-12 d-flex align-items-center justify-content-center\">\r\n      <div class=\"crop-container\">\r\n        <image-cropper\r\n          [imageFile]=\"selectedFile\"\r\n          [maintainAspectRatio]=\"false\"\r\n          [autoCrop]=\"false\"\r\n          [containWithinAspectRatio]=\"false\"\r\n          [aspectRatio]=\"4 / 3\"\r\n          [cropperMinWidth]=\"128\"\r\n          [onlyScaleDown]=\"true\"\r\n          [roundCropper]=\"false\"\r\n          [canvasRotation]=\"0\"\r\n          [transform]=\"transform\"\r\n          [alignImage]=\"'left'\"\r\n          format=\"png\"\r\n          (imageCropped)=\"imageCropped($event)\"\r\n          [resizeToWidth]=\"customWidth\"\r\n          [resizeToHeight]=\"customHeight\"\r\n          [canvasRotation]=\"canvasRotation\"\r\n          [output]=\"'base64'\">\r\n        </image-cropper>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"row justify-content-center mt-2 mb-2 crop-large\">\r\n    <div class=\"col-12 d-flex align-items-center justify-content-center\">\r\n      <button\r\n        class=\"btn btn-primary mat-raised-button eqp-attachments-confirm-btn me-2\"\r\n        type=\"button\"\r\n        (click)=\"confirmAddAttachment()\">\r\n        {{ confirmLabel }}\r\n      </button>\r\n      <button class=\"btn mat-raised-button eqp-attachments-abort-btn\" type=\"button\" (click)=\"abortFile()\">\r\n        {{ abortLabel }}\r\n      </button>\r\n    </div>\r\n  </div>\r\n  <div class=\"row justify-content-center mt-2 mb-2 crop-small\">\r\n    <div class=\"col-6 d-flex align-items-center justify-content-center\" style=\"font-size: 20px\">\r\n      <i class=\"fa fa-times\" (click)=\"abortFile()\"></i>\r\n    </div>\r\n    <div class=\"col-6 d-flex align-items-center justify-content-center\" style=\"font-size: 20px\">\r\n      <i class=\"fa fa-check\" (click)=\"confirmAddAttachment()\"></i>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n\r\n<!-- TEMPLATE PER FORM DI AGGIUNTA DI UN LINK -->\r\n<ng-template #addingLinkTemplate>\r\n  <span class=\"mb-1\" style=\"font-size: 20px\"><i class=\"fa fa-link\"></i>Inserisci l'URL</span>\r\n  <form [formGroup]=\"newAttachmentForm\" *ngIf=\"newAttachmentForm\">\r\n    <div class=\"row mb-2\" style=\"height: 80px\">\r\n      <div class=\"col-6 d-grid gap-2 mx-auto\">\r\n        <div class=\"input-group mb-1\">\r\n          <input\r\n            type=\"text\"\r\n            class=\"form-control\"\r\n            placeholder=\"{{ fileNameLabel }}\"\r\n            formControlName=\"name\"\r\n            [(ngModel)]=\"newAttachment.FileName\" />\r\n        </div>\r\n      </div>\r\n      <div class=\"col-12 d-grid gap-2\">\r\n        <div class=\"input-group\">\r\n          <input\r\n            required\r\n            type=\"text\"\r\n            class=\"form-control\"\r\n            placeholder=\"Link\"\r\n            formControlName=\"path\"\r\n            [(ngModel)]=\"newAttachment.FilePath\" />\r\n        </div>\r\n      </div>\r\n    </div>\r\n    <div class=\"row\">\r\n      <div class=\"col-6 d-grid gap-2\">\r\n        <button\r\n          class=\"btn btn-secondary mat-raised-button\"\r\n          (click)=\"selectedAttachment = null; addingLinkMode = false\"\r\n          type=\"button\">\r\n          {{ exitLabel }}\r\n        </button>\r\n      </div>\r\n      <div class=\"col-6 d-grid gap-2\">\r\n        <button\r\n          class=\"btn btn-primary mat-raised-button\"\r\n          type=\"submit\"\r\n          (click)=\"confirmAddAttachment(); selectedAttachment = null; addingLinkMode = false\">\r\n          {{ saveLabel }}\r\n        </button>\r\n      </div>\r\n    </div>\r\n  </form>\r\n</ng-template>\r\n", styles: ["ngx-file-drop ::ng-deep .ngx-file-drop__drop-zone{min-height:30vh;border-radius:5px!important;background-color:#e4e6ea!important;cursor:pointer;font-size:17px!important;border:dotted!important;padding-top:7vh}ngx-file-drop ::ng-deep .ngx-file-drop__drop-zone .ngx-file-drop__content{display:flex;flex-direction:column;align-items:center;justify-content:center;color:#73777a!important;margin:auto}.custom-height .mat-form-field-wrapper{height:20px}.eqp-attachments-header-title{font-weight:700;font-size:19px;line-height:24px;margin-bottom:auto}.single-attachment-inline-preview-container{max-height:400px;max-width:400px;display:flex;align-items:center}.single-attachment-inline-preview-container img{max-width:100%;max-height:120px}.inline-preview-container{max-height:100px;max-width:100px;display:flex;align-items:center;justify-content:center;width:100%;cursor:pointer}.inline-preview-container img{max-width:100%;max-height:100px}.inline-preview-container i{font-size:25px;margin:auto}.preview-container{max-height:60vh;max-width:100%}.preview-container .image-preview{max-width:100%;max-height:100%}.preview-container .link-preview{width:70vw;height:55vh}.closeButton{float:right}@media (max-width: 768px){.crop-large{display:none}}@media (min-width: 768px){.crop-small{display:none}}@media (max-width: 768px){.crop-container{max-width:55%}}@media (min-width: 768px){.crop-container{max-width:35%}}\n"] }]
         }], ctorParameters: () => [{ type: i1.MatDialog }, { type: i2.FormBuilder }, { type: i3.DomSanitizer }, { type: i4.HttpClient }, { type: i0.ChangeDetectorRef }, { type: EqpAttachmentService }], propDecorators: { disableAction: [{
                 type: Input,
                 args: ["disableAction"]