@topconsultnpm/sdkui-react-beta 6.6.45 → 6.6.46
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -3,7 +3,7 @@ import { useState, useEffect, useRef } from 'react';
|
|
|
3
3
|
import styled from 'styled-components';
|
|
4
4
|
import { StyledEditor, StyledEditorContainer, StyledEditorIcon, StyledEditorLabel, editorColorManager } from './TMEditorStyled';
|
|
5
5
|
import { FontSize, TMColors } from '../../utils/theme';
|
|
6
|
-
import { genUniqueId, IconClearButton, IconHide, IconShow } from '../../helper';
|
|
6
|
+
import { genUniqueId, IconClearButton, IconHide, IconShow, useWindowWidth } from '../../helper';
|
|
7
7
|
import ShowAlert from '../base/TMAlert';
|
|
8
8
|
import { TMExceptionBoxManager } from '../base/TMPopUp';
|
|
9
9
|
import TMLayoutContainer, { TMLayoutItem } from '../base/TMLayout';
|
|
@@ -38,7 +38,7 @@ const TMTextBox = ({ autoFocus, maxLength, precision, scale, showClearButton, va
|
|
|
38
38
|
const [formulaMenuItems, setFormulaMenuItems] = useState([]);
|
|
39
39
|
const [isFocused, setIsFocused] = useState(false);
|
|
40
40
|
const inputRef = useRef(null);
|
|
41
|
-
|
|
41
|
+
let screenWidth = useWindowWidth();
|
|
42
42
|
const [id, setID] = useState('');
|
|
43
43
|
useEffect(() => { setID(genUniqueId()); }, []);
|
|
44
44
|
useEffect(() => { setCurrentType(type); setInitialType(type); }, [type]);
|
|
@@ -140,7 +140,7 @@ const TMTextBox = ({ autoFocus, maxLength, precision, scale, showClearButton, va
|
|
|
140
140
|
if (!scale && (e.key == "." || e.key == ","))
|
|
141
141
|
e.preventDefault();
|
|
142
142
|
}
|
|
143
|
-
}, "$disabled": disabled, "$vil": validationItems, "$isModified": isModifiedWhen, "$fontSize": fontSize, "$maxValue": maxValue, "$width": width, "$type": currentType }), initialType === 'password' && currentValue && _jsx(StyledShowPasswordIcon, { onClick: toggleShowPassword, "$disabled": disabled, "$vil": validationItems, "$isModified": isModifiedWhen, children: showPasswordIcon() }), initialType !== 'password' &&
|
|
143
|
+
}, "$isMobile": screenWidth < 640, "$disabled": disabled, "$vil": validationItems, "$isModified": isModifiedWhen, "$fontSize": fontSize, "$maxValue": maxValue, "$width": width, "$type": currentType }), initialType === 'password' && currentValue && _jsx(StyledShowPasswordIcon, { onClick: toggleShowPassword, "$disabled": disabled, "$vil": validationItems, "$isModified": isModifiedWhen, children: showPasswordIcon() }), initialType !== 'password' &&
|
|
144
144
|
_jsxs("div", { style: { display: 'flex', flexDirection: 'row', justifyContent: 'flex-start', alignItems: 'center', position: 'absolute', right: '6px', top: label.length > 0 ? '20px' : '7px', pointerEvents: disabled ? 'none' : 'auto', opacity: disabled ? 0.4 : 1 }, children: [showClearButton && currentValue &&
|
|
145
145
|
_jsx(StyledTextBoxEditorButton, { onClick: () => {
|
|
146
146
|
onValueChanged?.({ target: { value: undefined } });
|
|
@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
|
|
|
2
2
|
import { useState } from 'react';
|
|
3
3
|
import { ResultTypes } from '@topconsultnpm/sdk-ts-beta';
|
|
4
4
|
import { FormModes } from '../../ts/types';
|
|
5
|
-
import { IconArrowDown, IconArrowLeft, IconArrowUp, IconCloseCircle,
|
|
5
|
+
import { IconArrowDown, IconArrowLeft, IconArrowUp, IconCloseCircle, IconSave, IconUndo, IconWarning, SDKUI_Localizator, getColor } from '../../helper';
|
|
6
6
|
import { ButtonNames, TMExceptionBoxManager, TMMessageBoxManager } from '../base/TMPopUp';
|
|
7
7
|
import TMLayoutContainer, { TMCard, TMLayoutItem, TMSplitterLayout } from '../base/TMLayout';
|
|
8
8
|
import { StyledResultTypeContainer, StyledToolbarForm } from '../base/Styled';
|
|
@@ -13,8 +13,8 @@ import TMModal from '../base/TMModal';
|
|
|
13
13
|
const TMSaveForm = ({ id, formMode = FormModes.Update, title, children, isModal, exception, customToolbarElements, hasNavigation, showBackButton, onClose, onSaveAsync, onNext, onPrev, canNext, canPrev, isModified, onShowList, validationItems = [], onUndo, onCancel, width, height }) => {
|
|
14
14
|
const [showList, setShowList] = useState(true);
|
|
15
15
|
const [showErrorGrid, setShowErrorGrid] = useState(false);
|
|
16
|
-
let windowWidth = useWindowWidth()
|
|
17
|
-
let isMobile = windowWidth <= MOBILE_WIDTH;
|
|
16
|
+
// let windowWidth = useWindowWidth()
|
|
17
|
+
// let isMobile: boolean = windowWidth <= MOBILE_WIDTH;
|
|
18
18
|
const doSaveAsync = async () => { try {
|
|
19
19
|
await onSaveAsync?.();
|
|
20
20
|
}
|
|
@@ -64,9 +64,10 @@ const TMSaveForm = ({ id, formMode = FormModes.Update, title, children, isModal,
|
|
|
64
64
|
});
|
|
65
65
|
};
|
|
66
66
|
const doClose = () => {
|
|
67
|
+
// if (!isModified) { onClose?.(); isMobile && setShowList(true), onShowList?.(true); return; }
|
|
67
68
|
if (!isModified) {
|
|
68
69
|
onClose?.();
|
|
69
|
-
|
|
70
|
+
onShowList?.(true);
|
|
70
71
|
return;
|
|
71
72
|
}
|
|
72
73
|
TMMessageBoxManager.show({
|
|
@@ -76,9 +77,9 @@ const TMSaveForm = ({ id, formMode = FormModes.Update, title, children, isModal,
|
|
|
76
77
|
if (e == ButtonNames.CANCEL)
|
|
77
78
|
return;
|
|
78
79
|
if (e == ButtonNames.NO)
|
|
79
|
-
|
|
80
|
+
(onUndo(), setShowList(true), onShowList?.(true));
|
|
80
81
|
if (e == ButtonNames.YES)
|
|
81
|
-
|
|
82
|
+
await onSaveAsync?.();
|
|
82
83
|
onClose?.();
|
|
83
84
|
}
|
|
84
85
|
catch (ex) {
|
|
@@ -92,9 +93,7 @@ const TMSaveForm = ({ id, formMode = FormModes.Update, title, children, isModal,
|
|
|
92
93
|
const renderSaveForm = () => {
|
|
93
94
|
return (_jsxs(TMLayoutContainer, { direction: 'vertical', children: [_jsx(TMLayoutItem, { height: 'max-content', children: _jsxs(StyledToolbarForm, { children: [showBackButton && _jsx(TMButton, { btnStyle: 'toolbar', color: 'tertiary', caption: SDKUI_Localizator.Back, icon: _jsx(IconArrowLeft, {}), elementStyle: { marginRight: '10px' }, onClick: () => { doClose(); } }), _jsx(TMButton, { caption: SDKUI_Localizator.Save, icon: _jsx(IconSave, {}), keyGesture: "alt+s", backgroundColor: errorsCount > 0 ? TMColors.error : isModified ? TMColors.success : TMColors.disabled, onClick: doSaveAsync, color: "success", btnStyle: "toolbar", disabled: !(isModified && errorsCount <= 0) }), hasNavigation && _jsx(TMButton, { caption: SDKUI_Localizator.Previous, icon: _jsx(IconArrowUp, {}), btnStyle: "toolbar", disabled: !canPrev || isModified || formMode == FormModes.Create || formMode == FormModes.Duplicate, onClick: doPrev }), hasNavigation && _jsx(TMButton, { caption: SDKUI_Localizator.Next, icon: _jsx(IconArrowDown, {}), btnStyle: "toolbar", disabled: !canNext || isModified || formMode == FormModes.Create || formMode == FormModes.Duplicate, onClick: doNext }), _jsx(TMButton, { caption: SDKUI_Localizator.Undo, icon: _jsx(IconUndo, {}), keyGesture: "alt+z", color: "tertiary", btnStyle: "toolbar", disabled: isModified ? false : true, onClick: onUndo }), customToolbarElements, warningsCount > 0 &&
|
|
94
95
|
_jsx(TMLayoutItem, { width: 'fit-content', height: '90%', children: _jsxs(StyledResultTypeContainer, { style: { marginLeft: '10px' }, onClick: () => setShowErrorGrid(!showErrorGrid), "$resultType": ResultTypes.WARNING, children: [" ", _jsx(IconWarning, { fontSize: 16 }), " ", _jsx("span", { children: warningsCount })] }) }), errorsCount > 0 &&
|
|
95
|
-
_jsx(TMLayoutItem, { width: 'fit-content', height: '90%', children: _jsxs(StyledResultTypeContainer, { style: { marginLeft: warningsCount <= 0 ? '10px' : '0' }, onClick: () => setShowErrorGrid(!showErrorGrid), "$resultType": ResultTypes.ERROR, children: [" ", _jsx(IconCloseCircle, { fontSize: 16 }), " ", _jsx("span", { children: errorsCount })] }) }),
|
|
96
|
-
_jsx("div", { style: { right: '10px', position: 'absolute' }, children: !isMobile && _jsx(TMButton, { caption: showList ? SDKUI_Localizator.List_Hide : SDKUI_Localizator.List_Show, icon: showList ? _jsx(IconHide, {}) : _jsx(IconShow, {}), keyGesture: "alt+h", onClick: () => { setShowList(!showList); onShowList?.(!showList); }, btnStyle: 'toolbar' }) }), (formMode == FormModes.Create || formMode == FormModes.Duplicate) &&
|
|
97
|
-
_jsx("div", { style: { right: '50px', position: 'absolute' }, children: !isMobile && onCancel && _jsx(TMButton, { icon: _jsx(IconCloseCircle, {}), onClick: onCancel, btnStyle: 'toolbar', caption: SDKUI_Localizator.Cancel, color: 'tertiary' }) })] }) }), _jsx(TMLayoutItem, { children: _jsxs(TMSplitterLayout, { separatorSize: 4, direction: 'vertical', start: showErrorGrid && validationItems.length > 0 ? ['80%', '20%'] : ['100%', '0'], min: ['0', '0'], children: [_jsx(TMCard, { showBorder: false, children: exception
|
|
96
|
+
_jsx(TMLayoutItem, { width: 'fit-content', height: '90%', children: _jsxs(StyledResultTypeContainer, { style: { marginLeft: warningsCount <= 0 ? '10px' : '0' }, onClick: () => setShowErrorGrid(!showErrorGrid), "$resultType": ResultTypes.ERROR, children: [" ", _jsx(IconCloseCircle, { fontSize: 16 }), " ", _jsx("span", { children: errorsCount })] }) })] }) }), _jsx(TMLayoutItem, { children: _jsxs(TMSplitterLayout, { separatorSize: 4, direction: 'vertical', start: showErrorGrid && validationItems.length > 0 ? ['80%', '20%'] : ['100%', '0'], min: ['0', '0'], children: [_jsx(TMCard, { showBorder: false, children: exception
|
|
98
97
|
?
|
|
99
98
|
_jsx("div", { style: { width: '100%', height: '100%', marginTop: '50px', display: 'flex', alignItems: 'center', justifyContent: 'center', flexDirection: 'column', color: getColor('error') }, children: 'Si è verificato un errore' })
|
|
100
99
|
: _jsx(_Fragment, { children: children }) }), showErrorGrid && validationItems.length > 0 ? _jsx(TMCard, { scrollY: true, padding: false, showBorder: false, children: _jsx(TMValidationItemsList, { validationItems: validationItems }) }) : _jsx(_Fragment, {})] }) })] }));
|