@topconsultnpm/sdkui-react 6.19.0-test.1 → 6.19.0

package/lib/components/features/search/TMSignSettingsForm.js

@@ -0,0 +1,621 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useState } from "react";
+import TMDropDown from "../../editors/TMDropDown";
+import { calcResponsiveSizes, IconUndo, parseSignatureConfiguration, SDKUI_Localizator } from "../../../helper";
+import TMTooltip from "../../base/TMTooltip";
+import { SDK_Globals, UpdateEngineByID } from "@topconsultnpm/sdk-ts";
+import { ButtonNames, TMExceptionBoxManager, TMMessageBoxManager } from "../../base/TMPopUp";
+import TMSpinner from "../../base/TMSpinner";
+import ShowAlert from "../../base/TMAlert";
+import { TagBox } from "devextreme-react/tag-box";
+import TMSaveForm, { TMSaveFormButtonSave, TMSaveFormButtonUndo } from "../../forms/TMSaveForm";
+import TMCheckBox from "../../editors/TMCheckBox";
+import TMTextBox from "../../editors/TMTextBox";
+import { DeviceType, useDeviceType } from "../../base/TMDeviceProvider";
+import { FormModes } from "../../../ts";
+import TMToppyMessage from "../../../helper/TMToppyMessage";
+const TMSignSettingsForm = (props) => {
+    const { fromDTD, inputDcmts, onCloseSignSettingsForm, onSavedAsyncCallback } = props;
+    const MODIFIED_COLOR = '#E29000';
+    const METADATA_FIELDS = {
+        SIGN_TYPE: 's4t_signtype',
+        EDITOR_CONFIG: 's4t_editorconfig',
+        INFORMATION_SIGN: 's4t_informationsign',
+        NAME: 's4t_name',
+        SURNAME: 's4t_surname',
+        SHARED_SIGN: 's4t_sharedsign',
+        MULTI_SIGNERS: 's4t_checksharedsign',
+    };
+    const defaultConfigValue = {
+        signType: null,
+        editorConfig: [],
+        allowDate: true,
+        allowSignerBy: false,
+        signerByValue: '',
+        allowLocation: false,
+        locationValue: SDKUI_Localizator.Torino,
+        allowCopyright: false,
+        copyrightValue: 'Sign4Top',
+        enableSharedSign: false,
+        multiSigners: [],
+    };
+    // Get the current device type (e.g., mobile, tablet, desktop) using a custom hook.
+    const deviceType = useDeviceType();
+    // This avoids unnecessary re-renders by only recalculating when deviceType changes.
+    let isMobile = useMemo(() => { return deviceType === DeviceType.MOBILE; }, [deviceType]);
+    const signTypeDataSource = [
+        { value: '', display: '- Non selezionato  -' },
+        { value: 'FEQ', display: 'Firma Elettronica Qualificata' },
+        { value: 'FES', display: 'Firma Elettronica Semplice' },
+        { value: 'FES_T', display: 'Firma Elettronica Semplice Testuale' },
+        { value: 'FES_M', display: 'Firma Elettronica Semplice Manuale' },
+        { value: 'FES_C', display: 'Firma Elettronica Semplice con Immagine' },
+    ];
+    const editorConfigDataSource = [
+        { value: 'signature', display: SDKUI_Localizator.SignatureField },
+        { value: 'text', display: SDKUI_Localizator.TextField },
+        { value: 'line', display: SDKUI_Localizator.Line },
+        { value: 'mark', display: SDKUI_Localizator.Mark },
+        { value: 'checkmark', display: SDKUI_Localizator.Checkmark },
+    ];
+    const [currentDcmt, setCurrentDcmt] = useState(null);
+    const [metadataByKey, setMetadataByKey] = useState({});
+    const [hasFields, setHasFields] = useState({
+        signType: false,
+        editorConfig: false,
+        informationSign: false,
+        sharedSign: false,
+        multiSigners: false
+    });
+    const [missingFields, setMissingFields] = useState([]);
+    const [hasAvailableFields, setHasAvailableFields] = useState(true);
+    const [isLoading, setIsLoading] = useState(true);
+    const [modalHeight, setModalHeight] = useState(calcResponsiveSizes(deviceType, '600px', '600px', '95%'));
+    const [modalWidth, setModalWidth] = useState(calcResponsiveSizes(deviceType, '600px', '600px', '95%'));
+    // form fields
+    const [isModified, setIsModified] = useState(false);
+    const [formDataOrigin, setFormDataOrigin] = useState({
+        signType: defaultConfigValue.signType,
+        editorConfig: defaultConfigValue.editorConfig,
+        allowDate: defaultConfigValue.allowDate,
+        allowSignerBy: defaultConfigValue.allowSignerBy,
+        signerByValue: defaultConfigValue.signerByValue,
+        allowLocation: defaultConfigValue.allowLocation,
+        locationValue: defaultConfigValue.locationValue,
+        allowCopyright: defaultConfigValue.allowCopyright,
+        copyrightValue: defaultConfigValue.copyrightValue,
+        enableSharedSign: defaultConfigValue.enableSharedSign,
+        multiSigners: defaultConfigValue.multiSigners,
+    });
+    const [signTypeSelected, setSignTypeSelected] = useState(defaultConfigValue.signType);
+    const [editorConfigSelected, setEditorConfigSelected] = useState(defaultConfigValue.editorConfig);
+    const [enableDate, setEnableDate] = useState(defaultConfigValue.allowDate);
+    const [enableSignerBy, setEnableSignerBy] = useState(defaultConfigValue.allowSignerBy);
+    const [signerBy, setSignerBy] = useState(defaultConfigValue.signerByValue);
+    const [enableLocation, setEnableLocation] = useState(defaultConfigValue.allowLocation);
+    const [location, setLocation] = useState(defaultConfigValue.locationValue);
+    const [enableCopyright, setEnableCopyright] = useState(defaultConfigValue.allowCopyright);
+    const [copyright, setCopyright] = useState(defaultConfigValue.copyrightValue);
+    const [enableSharedSign, setEnableSharedSign] = useState(false);
+    const [multiSigners, setMultiSigners] = useState(defaultConfigValue.multiSigners);
+    // Inizializza i campi del form dai metadati
+    const initializeFormFields = async (dcmt, metadata) => {
+        // Simula asincronicità con breve timeout
+        await new Promise(resolve => setTimeout(resolve, 50));
+        if (!dcmt || !dcmt.DID || !metadata) {
+            throw new Error("Dati del documento o metadati non validi per l'inizializzazione del form");
+        }
+        ;
+        // Inizializza signType
+        const signTypeMetadata = metadata[METADATA_FIELDS.SIGN_TYPE];
+        const signTypeValue = signTypeMetadata?.value || defaultConfigValue.signType;
+        // Inizializza editorConfig
+        const editorConfig = metadata[METADATA_FIELDS.EDITOR_CONFIG];
+        const editorConfigValue = editorConfig?.value || '';
+        // Converti la stringa in array
+        let configArray = [];
+        if (editorConfigValue) {
+            const lowerValue = editorConfigValue.toLowerCase().trim();
+            // Gestisce i casi speciali "all", "none" e stringa vuota
+            if (lowerValue === 'all') {
+                // Seleziona tutti i valori disponibili
+                configArray = editorConfigDataSource.map(item => item.value);
+            }
+            else if (lowerValue === 'none' || lowerValue === '') {
+                // Deseleziona tutti
+                configArray = [];
+            }
+            else {
+                // Comportamento normale: split della stringa
+                configArray = editorConfigValue.split(',').map((item) => item.trim().toLowerCase()).filter((item) => item !== '');
+            }
+        }
+        // Inizializza il valore di default per signerBy
+        const firstName = metadata[METADATA_FIELDS.NAME] ? metadata[METADATA_FIELDS.NAME].value : null;
+        const lastName = metadata[METADATA_FIELDS.SURNAME] ? metadata[METADATA_FIELDS.SURNAME].value : null;
+        if (firstName || lastName) {
+            const defaultSignerBy = `${firstName ?? ""} ${lastName ?? ""}`.trim();
+            setSignerBy(defaultSignerBy);
+        }
+        // Inizializza information sign
+        const informationSign = metadata[METADATA_FIELDS.INFORMATION_SIGN];
+        const did = Number(dcmt.DID);
+        const { allowDate, allowSignerBy, signerByValue, allowLocation, locationValue, allowCopyright, copyrightValue } = parseSignatureConfiguration(did, informationSign?.value, firstName, lastName, dcmt.title);
+        // Inizializza shared-sign e multi-signers
+        const sharedSignMetadata = metadata[METADATA_FIELDS.SHARED_SIGN];
+        const allowSharedSign = sharedSignMetadata?.value === 'S' ? true : sharedSignMetadata?.value === 'N' ? false : defaultConfigValue.enableSharedSign;
+        setEnableSharedSign(allowSharedSign);
+        const multiSignersMetadata = metadata[METADATA_FIELDS.MULTI_SIGNERS];
+        const multiSignersValue = (() => {
+            if (!multiSignersMetadata?.value)
+                return defaultConfigValue.multiSigners;
+            if (typeof multiSignersMetadata.value === 'string') {
+                return multiSignersMetadata.value.split(',').map((item) => item.trim()).filter((item) => item !== '');
+            }
+            return defaultConfigValue.multiSigners;
+        })();
+        setMultiSigners(multiSignersValue);
+        setFormDataOrigin({
+            signType: signTypeValue,
+            editorConfig: configArray.length > 0 ? configArray : defaultConfigValue.editorConfig,
+            allowDate: allowDate,
+            allowSignerBy: allowSignerBy,
+            signerByValue: signerByValue,
+            allowLocation: allowLocation,
+            locationValue: locationValue,
+            allowCopyright: allowCopyright,
+            copyrightValue: copyrightValue,
+            enableSharedSign: allowSharedSign,
+            multiSigners: multiSignersValue
+        });
+        setSignTypeSelected(signTypeValue);
+        setEditorConfigSelected(configArray);
+        setEnableDate(allowDate);
+        setEnableSignerBy(allowSignerBy);
+        setSignerBy(signerByValue);
+        setEnableLocation(allowLocation);
+        setLocation(locationValue);
+        setEnableCopyright(allowCopyright);
+        setCopyright(copyrightValue);
+    };
+    useEffect(() => {
+        const initialize = async () => {
+            if (inputDcmts && inputDcmts.length > 0) {
+                const dcmt = inputDcmts[0];
+                setCurrentDcmt(dcmt);
+                // Verifica quali campi esistono nel DTD
+                const metadataNames = fromDTD?.metadata?.map(m => m.name?.toLowerCase()).filter(Boolean) || [];
+                const hasSignTypeField = metadataNames.includes(METADATA_FIELDS.SIGN_TYPE);
+                const hasEditorConfigField = metadataNames.includes(METADATA_FIELDS.EDITOR_CONFIG);
+                const hasInformationSignField = metadataNames.includes(METADATA_FIELDS.INFORMATION_SIGN);
+                const hasSharedSignField = metadataNames.includes(METADATA_FIELDS.SHARED_SIGN);
+                const hasMultiSignersField = metadataNames.includes(METADATA_FIELDS.MULTI_SIGNERS);
+                setHasFields({
+                    signType: hasSignTypeField,
+                    editorConfig: hasEditorConfigField,
+                    informationSign: hasInformationSignField,
+                    sharedSign: hasSharedSignField,
+                    multiSigners: hasMultiSignersField
+                });
+                // Calcola i campi mancanti
+                const missing = [];
+                if (!hasSignTypeField)
+                    missing.push(METADATA_FIELDS.SIGN_TYPE);
+                if (!hasEditorConfigField)
+                    missing.push(METADATA_FIELDS.EDITOR_CONFIG);
+                if (!hasInformationSignField)
+                    missing.push(METADATA_FIELDS.INFORMATION_SIGN);
+                if (!hasSharedSignField)
+                    missing.push(METADATA_FIELDS.SHARED_SIGN);
+                if (!hasMultiSignersField)
+                    missing.push(METADATA_FIELDS.MULTI_SIGNERS);
+                setMissingFields(missing);
+                const atLeastOneFieldExists = hasSignTypeField || hasEditorConfigField || hasInformationSignField || hasSharedSignField || hasMultiSignersField;
+                if (!atLeastOneFieldExists) {
+                    setHasAvailableFields(false);
+                    setModalHeight('auto');
+                    setModalWidth('auto');
+                    setIsLoading(false);
+                    return;
+                }
+                // Carica i metadati dal documento
+                const metadata = {};
+                if (fromDTD?.metadata && dcmt) {
+                    fromDTD.metadata.forEach((meta) => {
+                        if (meta.id && meta.name) {
+                            const value = dcmt[dcmt.TID + "_" + meta.id];
+                            if (value === undefined)
+                                return;
+                            metadata[meta.name.toLowerCase()] = { value, mid: meta.id };
+                        }
+                    });
+                }
+                setMetadataByKey(metadata);
+                // Inizializza tutti i campi del form
+                if (Object.keys(metadata).length > 0) {
+                    try {
+                        TMSpinner.show({ description: SDKUI_Localizator.Loading });
+                        await initializeFormFields(dcmt, metadata);
+                    }
+                    catch (e) {
+                        setHasAvailableFields(false);
+                        setModalHeight('auto');
+                        setModalWidth('auto');
+                        setTimeout(() => TMExceptionBoxManager.show({ exception: e }), 200);
+                    }
+                    finally {
+                        TMSpinner.hide();
+                        setIsLoading(false);
+                    }
+                }
+            }
+        };
+        initialize();
+    }, [inputDcmts, fromDTD]);
+    const onSignTypeValueChange = (e) => {
+        const value = e?.target?.value;
+        // Se il valore è stringa vuota, imposta null, altrimenti usa il valore
+        setSignTypeSelected(value === '' ? null : value);
+        // Se il tipo di firma è FEQ, imposta sempre enableDate a true
+        if (value === 'FEQ') {
+            setEnableDate(true);
+        }
+    };
+    const onEditorConfigValueChange = (e) => {
+        const newValues = e.value || [];
+        setEditorConfigSelected(newValues);
+    };
+    const onMultiSignersValueChange = useCallback((e) => {
+        const newValues = e.value || [];
+        setMultiSigners(newValues);
+    }, []);
+    // Controlla se editorConfig è stato modificato
+    const isEditorConfigModified = () => {
+        if (editorConfigSelected.length !== formDataOrigin.editorConfig.length)
+            return true;
+        const sorted1 = [...editorConfigSelected].sort();
+        const sorted2 = [...formDataOrigin.editorConfig].sort();
+        return !sorted1.every((val, index) => val === sorted2[index]);
+    };
+    const isSignatureInformationModified = () => {
+        const dateModified = enableDate !== formDataOrigin.allowDate;
+        const signerByModified = enableSignerBy !== formDataOrigin.allowSignerBy || (enableSignerBy && signerBy !== formDataOrigin.signerByValue);
+        const locationModified = enableLocation !== formDataOrigin.allowLocation || (enableLocation && location !== formDataOrigin.locationValue);
+        const copyrightModified = enableCopyright !== formDataOrigin.allowCopyright || (enableCopyright && copyright !== formDataOrigin.copyrightValue);
+        return dateModified || signerByModified || locationModified || copyrightModified;
+    };
+    const isMultiSignersModified = () => {
+        if (multiSigners.length !== formDataOrigin.multiSigners.length)
+            return true;
+        const sorted1 = [...multiSigners].sort();
+        const sorted2 = [...formDataOrigin.multiSigners].sort();
+        return !sorted1.every((val, index) => val === sorted2[index]);
+    };
+    useEffect(() => {
+        if (signTypeSelected === undefined || isLoading)
+            return;
+        const signTypeChanged = signTypeSelected !== formDataOrigin.signType;
+        const sharedSignChanged = enableSharedSign !== formDataOrigin.enableSharedSign || (enableSharedSign && isMultiSignersModified());
+        setIsModified(signTypeChanged || isEditorConfigModified() || isSignatureInformationModified() || sharedSignChanged);
+    }, [signTypeSelected, isLoading, formDataOrigin, isEditorConfigModified, isSignatureInformationModified, enableSharedSign, isMultiSignersModified]);
+    const renderTag = (tagData) => {
+        const handleRemoveTag = () => {
+            const newValues = editorConfigSelected.filter(val => val !== tagData.value);
+            setEditorConfigSelected(newValues);
+        };
+        const isModified = isEditorConfigModified();
+        return (_jsxs("div", { style: {
+                background: '#f5f5f5',
+                border: `1px solid ${isModified ? MODIFIED_COLOR : '#d0d0d0'}`,
+                borderRadius: '16px',
+                padding: '2px 5px',
+                fontSize: '12px',
+                fontWeight: '500',
+                color: isModified ? MODIFIED_COLOR : '#555',
+                margin: '3px',
+                boxShadow: '0 1px 3px rgba(0, 0, 0, 0.08)',
+                display: 'inline-flex',
+                alignItems: 'center',
+                gap: '6px',
+                cursor: 'default'
+            }, onMouseEnter: (e) => {
+                e.currentTarget.style.background = '#ebebeb';
+                e.currentTarget.style.borderColor = isModified ? MODIFIED_COLOR : '#b8b8b8';
+                e.currentTarget.style.boxShadow = '0 2px 5px rgba(0, 0, 0, 0.12)';
+            }, onMouseLeave: (e) => {
+                e.currentTarget.style.background = '#f5f5f5';
+                e.currentTarget.style.borderColor = isModified ? MODIFIED_COLOR : '#d0d0d0';
+                e.currentTarget.style.boxShadow = '0 1px 3px rgba(0, 0, 0, 0.08)';
+            }, children: [_jsx("span", { style: { letterSpacing: '0.2px' }, children: tagData.display }), _jsx("span", { onClick: handleRemoveTag, style: {
+                        cursor: 'pointer',
+                        opacity: 0.5,
+                        fontSize: '16px',
+                        fontWeight: 'bold',
+                        color: isModified ? MODIFIED_COLOR : '#777',
+                        transition: 'opacity 0.2s ease'
+                    }, onMouseEnter: (e) => { e.currentTarget.style.opacity = '0.9'; }, onMouseLeave: (e) => { e.currentTarget.style.opacity = '0.5'; }, children: "\u00D7" })] }));
+    };
+    const renderMultiSignerTag = (tagData) => {
+        const handleRemoveTag = () => {
+            const newValues = multiSigners.filter(val => val !== tagData);
+            setMultiSigners(newValues);
+        };
+        const isModified = isMultiSignersModified();
+        return (_jsxs("div", { style: {
+                background: '#f5f5f5',
+                border: `1px solid ${isModified ? MODIFIED_COLOR : '#d0d0d0'}`,
+                borderRadius: '16px',
+                padding: '2px 5px',
+                fontSize: '12px',
+                fontWeight: '500',
+                color: isModified ? MODIFIED_COLOR : '#555',
+                margin: '3px',
+                boxShadow: '0 1px 3px rgba(0, 0, 0, 0.08)',
+                display: 'inline-flex',
+                alignItems: 'center',
+                gap: '6px',
+                cursor: 'default'
+            }, onMouseEnter: (e) => {
+                e.currentTarget.style.background = '#ebebeb';
+                e.currentTarget.style.borderColor = isModified ? MODIFIED_COLOR : '#b8b8b8';
+                e.currentTarget.style.boxShadow = '0 2px 5px rgba(0, 0, 0, 0.12)';
+            }, onMouseLeave: (e) => {
+                e.currentTarget.style.background = '#f5f5f5';
+                e.currentTarget.style.borderColor = isModified ? MODIFIED_COLOR : '#d0d0d0';
+                e.currentTarget.style.boxShadow = '0 1px 3px rgba(0, 0, 0, 0.08)';
+            }, children: [_jsx("span", { style: { letterSpacing: '0.2px' }, children: tagData }), _jsx("span", { onClick: handleRemoveTag, style: {
+                        cursor: 'pointer',
+                        opacity: 0.5,
+                        fontSize: '16px',
+                        fontWeight: 'bold',
+                        color: isModified ? MODIFIED_COLOR : '#777',
+                        transition: 'opacity 0.2s ease'
+                    }, onMouseEnter: (e) => { e.currentTarget.style.opacity = '0.9'; }, onMouseLeave: (e) => { e.currentTarget.style.opacity = '0.5'; }, children: _jsx("i", { className: "dx-icon-close" }) })] }));
+    };
+    const onResetSettings = () => {
+        setSignTypeSelected(formDataOrigin.signType);
+        setEditorConfigSelected(formDataOrigin.editorConfig);
+        setEnableDate(formDataOrigin.allowDate);
+        setEnableSignerBy(formDataOrigin.allowSignerBy);
+        setSignerBy(formDataOrigin.signerByValue);
+        setEnableLocation(formDataOrigin.allowLocation);
+        setLocation(formDataOrigin.locationValue);
+        setEnableCopyright(formDataOrigin.allowCopyright);
+        setCopyright(formDataOrigin.copyrightValue);
+        setEnableSharedSign(formDataOrigin.enableSharedSign);
+        setMultiSigners(formDataOrigin.multiSigners);
+    };
+    const onSaveSignSettings = async () => {
+        if (!isModified) {
+            return;
+        }
+        try {
+            TMSpinner.show({ description: 'Aggiornamento in corso...' });
+            if (currentDcmt && currentDcmt.TID && currentDcmt.DID) {
+                const ue = new UpdateEngineByID(SDK_Globals.tmSession);
+                ue.DID = currentDcmt.DID;
+                ue.TID = currentDcmt.TID;
+                ue.Metadata_ClearAll();
+                // Aggiorna signType solo se modificato
+                if (signTypeSelected !== formDataOrigin.signType) {
+                    const signTypeMetadata = metadataByKey[METADATA_FIELDS.SIGN_TYPE];
+                    const signTypeMid = signTypeMetadata?.mid;
+                    ue.Metadata_AddString(signTypeMid, signTypeSelected ?? '');
+                }
+                // Aggiorna editorConfig solo se modificato
+                const editorConfigMetadata = metadataByKey[METADATA_FIELDS.EDITOR_CONFIG];
+                const editorConfigMid = editorConfigMetadata?.mid;
+                if (editorConfigMid && isEditorConfigModified()) {
+                    const editorConfigValue = editorConfigSelected.join(',');
+                    ue.Metadata_AddString(editorConfigMid, editorConfigValue);
+                }
+                // Aggiorna informationSign solo se modificato
+                if (isSignatureInformationModified()) {
+                    const informationSignMetadata = metadataByKey[METADATA_FIELDS.INFORMATION_SIGN];
+                    const informationSignMid = informationSignMetadata?.mid;
+                    // Per FEQ, la Data è sempre true; per gli altri tipi, usa enableDate
+                    const dateEnabled = signTypeSelected === 'FEQ' ? true : enableDate;
+                    const informationSignValue = `${dateEnabled ? 'date=yes,' : 'date=no,'}${enableSignerBy ? `signerby=${signerBy},` : ''}${enableLocation ? `location=${location},` : ''}${enableCopyright ? `copyright=${copyright},` : ''}`.replace(/,$/, '');
+                    ue.Metadata_AddString(informationSignMid, informationSignValue);
+                }
+                // Aggiorna multi-signer solo se modificato
+                if (enableSharedSign !== formDataOrigin.enableSharedSign || isMultiSignersModified()) {
+                    const sharedSignMetadata = metadataByKey[METADATA_FIELDS.SHARED_SIGN];
+                    const sharedSignMid = sharedSignMetadata?.mid;
+                    const sharedSignValue = enableSharedSign ? 'S' : 'N';
+                    ue.Metadata_AddString(sharedSignMid, sharedSignValue);
+                    const multiSignersMetadata = metadataByKey[METADATA_FIELDS.MULTI_SIGNERS];
+                    const multiSignersMid = multiSignersMetadata?.mid;
+                    const multiSignersValue = sharedSignValue === 'N' ? '' : multiSigners.join(',');
+                    ue.Metadata_AddString(multiSignersMid, multiSignersValue);
+                }
+                await ue.UpdateAsync();
+                // Tenta di ottenere i metadati aggiornati
+                let metadataResult = undefined;
+                let hasGetMetadataError = false;
+                try {
+                    metadataResult = await SDK_Globals.tmSession?.NewSearchEngine().GetMetadataAsync(currentDcmt.TID, currentDcmt.DID, true);
+                }
+                catch (metadataError) {
+                    hasGetMetadataError = true;
+                    // Estrai ErrorCode dal campo detail se disponibile
+                    let errorCode = undefined;
+                    if (metadataError?.isApiException && metadataError?.response?.detail) {
+                        try {
+                            const detailObj = JSON.parse(metadataError.response.detail);
+                            errorCode = detailObj?.ErrorCode;
+                        }
+                        catch (parseError) {
+                            console.log("Impossibile parsare il detail dell'eccezione:", parseError);
+                        }
+                    }
+                    // Se ErrorCode è -5, mostra messaggio personalizzato, altrimenti mostra l'eccezione originale
+                    if (errorCode === -5) {
+                        TMMessageBoxManager.show({
+                            message: SDKUI_Localizator.DcmtOutOfView,
+                            buttons: [ButtonNames.OK],
+                        });
+                    }
+                    else {
+                        TMExceptionBoxManager.show({ exception: metadataError });
+                    }
+                    // Usa null per indicare al callback che c'è stato un errore e non deve ritentare
+                    metadataResult = null;
+                }
+                await onSavedAsyncCallback?.(currentDcmt.TID, currentDcmt.DID, metadataResult);
+                ShowAlert({ mode: 'success', title: SDKUI_Localizator.SignatureSettings, message: 'Le modifiche sono state salvate con successo', duration: 3000 });
+                onCloseSignSettingsForm();
+            }
+        }
+        catch (e) {
+            TMExceptionBoxManager.show({ exception: e });
+        }
+        finally {
+            TMSpinner.hide();
+        }
+    };
+    if (isLoading) {
+        return null;
+    }
+    return _jsx(TMSaveForm, { isModal: true, title: SDKUI_Localizator.SignatureSettings, width: modalWidth, height: modalHeight, isModified: isModified, showTitleFormMode: false, onClose: onCloseSignSettingsForm, onSaveAsync: onSaveSignSettings, showToolbar: false, children: !hasAvailableFields ? (_jsx(TMToppyMessage, { message: _jsxs("div", { style: {
+                    display: 'flex',
+                    flexDirection: 'column',
+                    justifyContent: 'center',
+                    alignItems: 'center',
+                    gap: '10px',
+                }, children: [_jsx("div", { style: {
+                            fontSize: '18px',
+                            fontWeight: '600',
+                            color: '#555',
+                            textAlign: 'center'
+                        }, children: "Configurazione non possibile" }), _jsx("div", { style: {
+                            fontSize: '14px',
+                            color: '#888',
+                            textAlign: 'center',
+                            lineHeight: '1.5'
+                        }, children: "Questo tipo di documento non supporta i campi necessari per la configurazione della firma." }), _jsxs("div", { style: {
+                            fontSize: '13px',
+                            color: '#999',
+                            textAlign: 'center',
+                        }, children: [_jsx("div", { style: { marginBottom: '10px', fontWeight: '500', color: '#666' }, children: "Campi richiesti:" }), _jsx("div", { style: { display: 'flex', gap: '8px', justifyContent: 'center', flexWrap: 'wrap' }, children: missingFields.map(field => (_jsx("span", { style: {
+                                        background: '#fff3e0',
+                                        border: '1px solid #ffcc80',
+                                        borderRadius: '16px',
+                                        padding: '4px 12px',
+                                        fontSize: '11px',
+                                        fontWeight: '500',
+                                        color: '#e65100',
+                                        boxShadow: '0 1px 2px rgba(0, 0, 0, 0.08)',
+                                        letterSpacing: '0.2px'
+                                    }, children: field }, field))) })] })] }), maxWidth: "80%" })) : (_jsxs("div", { style: { display: 'flex', flexDirection: 'column', gap: '16px', padding: '6px 12px', height: '100%', width: '100%', overflow: 'auto' }, children: [missingFields.length > 0 && (_jsxs("div", { style: {
+                        backgroundColor: '#fff5e6',
+                        border: `1px solid ${MODIFIED_COLOR}`,
+                        borderRadius: '4px',
+                        padding: '8px 12px',
+                        display: 'flex',
+                        alignItems: 'center',
+                        gap: '8px',
+                        flexWrap: 'wrap'
+                    }, children: [_jsx("i", { className: "dx-icon-warning", style: { fontSize: '18px', color: MODIFIED_COLOR } }), _jsx("span", { style: { fontSize: '13px', color: MODIFIED_COLOR, fontWeight: '500', whiteSpace: 'nowrap' }, children: "Campi mancanti:" }), missingFields.map(field => (_jsx("span", { style: {
+                                background: '#fff',
+                                border: `1px solid ${MODIFIED_COLOR}`,
+                                borderRadius: '12px',
+                                padding: '2px 8px',
+                                fontSize: '11px',
+                                fontWeight: '500',
+                                color: MODIFIED_COLOR,
+                                boxShadow: '0 1px 2px rgba(0, 0, 0, 0.05)'
+                            }, children: field }, field)))] })), _jsx("style", { children: `
+                                #editorConfigTagBox.dx-editor-outlined .dx-label,
+                                #multiSignersTagBox.dx-editor-outlined .dx-label {
+                                    border-bottom-color: #e0e0e0 !important;
+                                }
+                                #editorConfigTagBox.dx-editor-outlined .dx-label span,
+                                #multiSignersTagBox.dx-editor-outlined .dx-label span {
+                                    font-size: 0.9rem !important;
+                                    color: rgb(80, 80, 80) !important;
+                                    padding: 0 3px !important;
+                                }
+                                #editorConfigTagBox.dx-editor-outlined:hover .dx-label,
+                                #editorConfigTagBox.dx-editor-outlined.dx-state-hover .dx-label,
+                                #multiSignersTagBox.dx-editor-outlined:hover .dx-label,
+                                #multiSignersTagBox.dx-editor-outlined.dx-state-hover .dx-label {
+                                    border-bottom-color: rgba(0, 0, 0, 0.87) !important;
+                                }
+                                #multiSignersTagBox .dx-texteditor-input-container {
+                                    align-items: center !important;
+                                }
+                            ` }), hasFields.signType && (_jsx(TMDropDown, { label: SDKUI_Localizator.SignatureType, value: signTypeSelected ?? '', dataSource: signTypeDataSource, onValueChanged: onSignTypeValueChange, isModifiedWhen: signTypeSelected !== formDataOrigin.signType })), hasFields.editorConfig && (_jsx(TagBox, { id: "editorConfigTagBox", name: "editorConfig", inputAttr: { id: 'editorConfigInput', name: 'editorConfigInput' }, dataSource: editorConfigDataSource, displayExpr: "display", label: SDKUI_Localizator.EditorConfiguration, labelMode: "static", valueExpr: "value", value: editorConfigSelected, onValueChanged: onEditorConfigValueChange, placeholder: "Seleziona", showSelectionControls: true, applyValueMode: "useButtons", searchEnabled: false, stylingMode: "outlined", tagRender: renderTag, acceptCustomValue: false, style: isEditorConfigModified() ? {
+                        border: '2px solid',
+                        borderBottom: '3px solid',
+                        borderColor: MODIFIED_COLOR,
+                        color: MODIFIED_COLOR
+                    } : {
+                        borderColor: undefined,
+                        color: undefined
+                    } })), hasFields.informationSign && (_jsxs("div", { style: {
+                        position: 'relative',
+                        border: '1px solid #d0d0d0',
+                        borderRadius: '4px',
+                        padding: '16px 12px 5px',
+                        marginTop: '10px'
+                    }, children: [_jsx("div", { style: {
+                                position: 'absolute',
+                                fontSize: '0.9rem',
+                                top: '-10px',
+                                left: '10px',
+                                height: 'max-content',
+                                lineHeight: 'normal',
+                                backgroundColor: 'white',
+                                padding: '0 3px',
+                                color: 'rgb(80, 80, 80)',
+                            }, children: SDKUI_Localizator.SignatureInformation }), _jsxs("div", { style: { display: 'flex', alignItems: 'flex-start', gap: '5px', minHeight: '35px' }, children: [_jsx(TMCheckBox, { label: "Abilita Data", value: signTypeSelected === 'FEQ' ? true : enableDate, disabled: signTypeSelected === 'FEQ', isModifiedWhen: signTypeSelected === 'FEQ' ? false : enableDate !== formDataOrigin.allowDate, onValueChanged: () => setEnableDate(prev => !prev) }), signTypeSelected === 'FEQ' && (_jsx(TMTooltip, { content: "La data \u00E8 obbligatoria per la Firma Elettronica Qualificata", children: _jsx("i", { className: "dx-icon-info", style: { fontSize: '18px', color: '#2196F3' } }) }))] }), signTypeSelected !== 'FEQ' && (_jsxs("div", { style: { display: 'flex', flexDirection: isMobile ? 'column' : 'row', alignItems: isMobile ? 'stretch' : 'flex-start', gap: '12px', minHeight: '35px' }, children: [_jsx("div", { style: { minWidth: isMobile ? 'auto' : '130px' }, children: _jsx(TMCheckBox, { label: "Abilita Luogo", value: enableLocation, isModifiedWhen: enableLocation !== formDataOrigin.allowLocation, onValueChanged: () => setEnableLocation(prev => !prev) }) }), enableLocation && (_jsx("div", { style: { flex: 1 }, children: _jsx(TMTextBox, { value: location, onValueChanged: (e) => setLocation(e.target.value), isModifiedWhen: location !== formDataOrigin.locationValue, buttons: [
+                                            {
+                                                icon: _jsx("div", { style: { display: 'flex', alignItems: 'center', justifyContent: 'center', width: '22px', height: '22px', borderRadius: '50%', backgroundColor: '#f0f0f0', transition: 'all 0.2s ease' }, onMouseEnter: (e) => { e.currentTarget.style.backgroundColor = '#e0e0e0'; }, onMouseLeave: (e) => { e.currentTarget.style.backgroundColor = '#f0f0f0'; }, children: _jsx(IconUndo, { fontSize: 14 }) }),
+                                                text: SDKUI_Localizator.Undo,
+                                                onClick: () => setLocation(formDataOrigin.locationValue)
+                                            },
+                                        ] }) }))] })), _jsxs("div", { style: { display: 'flex', flexDirection: isMobile ? 'column' : 'row', alignItems: isMobile ? 'stretch' : 'flex-start', gap: '12px', minHeight: '35px' }, children: [_jsx("div", { style: { minWidth: isMobile ? 'auto' : '130px' }, children: _jsx(TMCheckBox, { label: "Abilita Copyright", value: enableCopyright, isModifiedWhen: enableCopyright !== formDataOrigin.allowCopyright, onValueChanged: () => setEnableCopyright(prev => !prev) }) }), enableCopyright && (_jsx("div", { style: { flex: 1 }, children: _jsx(TMTextBox, { value: copyright, onValueChanged: (e) => setCopyright(e.target.value), isModifiedWhen: copyright !== formDataOrigin.copyrightValue, buttons: [
+                                            {
+                                                icon: _jsx("div", { style: { display: 'flex', alignItems: 'center', justifyContent: 'center', width: '22px', height: '22px', borderRadius: '50%', backgroundColor: '#f0f0f0', transition: 'all 0.2s ease' }, onMouseEnter: (e) => { e.currentTarget.style.backgroundColor = '#e0e0e0'; }, onMouseLeave: (e) => { e.currentTarget.style.backgroundColor = '#f0f0f0'; }, children: _jsx(IconUndo, { fontSize: 14 }) }),
+                                                text: SDKUI_Localizator.Undo,
+                                                onClick: () => setCopyright(formDataOrigin.copyrightValue)
+                                            },
+                                        ] }) }))] }), signTypeSelected !== 'FEQ' && (_jsxs("div", { style: { display: 'flex', flexDirection: isMobile ? 'column' : 'row', alignItems: isMobile ? 'stretch' : 'flex-start', gap: '12px', minHeight: '35px' }, children: [_jsx("div", { style: { minWidth: isMobile ? 'auto' : '130px' }, children: _jsx(TMCheckBox, { label: "Abilita 'Firmato da'", value: enableSignerBy, isModifiedWhen: enableSignerBy !== formDataOrigin.allowSignerBy, onValueChanged: () => setEnableSignerBy(prev => !prev) }) }), enableSignerBy && (_jsx("div", { style: { flex: 1 }, children: _jsx(TMTextBox, { value: signerBy, onValueChanged: (e) => setSignerBy(e.target.value), isModifiedWhen: signerBy !== formDataOrigin.signerByValue, buttons: [
+                                            {
+                                                icon: _jsx("div", { style: { display: 'flex', alignItems: 'center', justifyContent: 'center', width: '22px', height: '22px', borderRadius: '50%', backgroundColor: '#f0f0f0', transition: 'all 0.2s ease' }, onMouseEnter: (e) => { e.currentTarget.style.backgroundColor = '#e0e0e0'; }, onMouseLeave: (e) => { e.currentTarget.style.backgroundColor = '#f0f0f0'; }, children: _jsx(IconUndo, { fontSize: 14 }) }),
+                                                text: SDKUI_Localizator.Undo,
+                                                onClick: () => setSignerBy(formDataOrigin.signerByValue)
+                                            },
+                                        ] }) }))] }))] })), (hasFields.sharedSign && hasFields.multiSigners) && _jsxs("div", { style: {
+                        position: 'relative',
+                        border: '1px solid #d0d0d0',
+                        borderRadius: '4px',
+                        padding: '16px 12px 5px',
+                        marginTop: '10px'
+                    }, children: [_jsx("div", { style: {
+                                position: 'absolute',
+                                fontSize: '0.9rem',
+                                top: '-10px',
+                                left: '10px',
+                                height: 'max-content',
+                                lineHeight: 'normal',
+                                backgroundColor: 'white',
+                                padding: '0 3px',
+                                color: 'rgb(80, 80, 80)',
+                            }, children: "Configurazione Firmatari Multipli" }), _jsxs("div", { style: { display: 'flex', flexDirection: isMobile ? 'column' : 'row', alignItems: isMobile ? 'stretch' : 'flex-start', gap: '12px', minHeight: '35px' }, children: [_jsx("div", { style: { minWidth: isMobile ? 'auto' : '130px' }, children: _jsx(TMCheckBox, { label: "Abilita Firmatari Multipli", value: enableSharedSign, isModifiedWhen: enableSharedSign !== formDataOrigin.enableSharedSign, onValueChanged: () => setEnableSharedSign(prev => !prev) }) }), enableSharedSign && (_jsx("div", { style: { flex: 1 }, children: _jsx(TagBox, { id: "multiSignersTagBox", name: "multiSigners", inputAttr: { id: 'multiSignersInput', name: 'multiSignersInput' }, dataSource: multiSigners, labelMode: "static", value: multiSigners, onValueChanged: onMultiSignersValueChange, placeholder: "Inserisci firmatari", showSelectionControls: false, searchEnabled: false, stylingMode: "outlined", acceptCustomValue: true, showDropDownButton: false, openOnFieldClick: false, tagRender: renderMultiSignerTag, style: isMultiSignersModified() ? {
+                                            border: '2px solid',
+                                            borderBottom: '3px solid',
+                                            borderColor: MODIFIED_COLOR,
+                                            color: MODIFIED_COLOR
+                                        } : {
+                                            borderColor: undefined,
+                                            color: undefined
+                                        } }) }))] })] }), _jsxs("div", { style: {
+                        display: 'flex',
+                        justifyContent: 'center',
+                        gap: '10px',
+                        marginTop: '5px'
+                    }, children: [_jsx(TMSaveFormButtonSave, { showTooltip: false, btnStyle: 'advanced', advancedColor: '#f09c0a', isModified: isModified, formMode: FormModes.Update, errorsCount: 0, onSaveAsync: onSaveSignSettings }), _jsx(TMSaveFormButtonUndo, { btnStyle: 'toolbar', showTooltip: true, color: 'primary', isModified: isModified, formMode: FormModes.Update, onUndo: onResetSettings })] })] })) });
+};
+export default TMSignSettingsForm;