@topconsultnpm/sdkui-react-beta 6.6.46 → 6.6.47
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.
|
@@ -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, IconSave, IconUndo, IconWarning, SDKUI_Localizator, getColor } from '../../helper';
|
|
5
|
+
import { IconArrowDown, IconArrowLeft, IconArrowUp, IconCloseCircle, IconHide, IconSave, IconShow, IconUndo, IconWarning, MOBILE_WIDTH, SDKUI_Localizator, getColor, useWindowWidth } 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
|
-
|
|
17
|
-
|
|
16
|
+
let windowWidth = useWindowWidth();
|
|
17
|
+
let isMobile = windowWidth <= MOBILE_WIDTH;
|
|
18
18
|
const doSaveAsync = async () => { try {
|
|
19
19
|
await onSaveAsync?.();
|
|
20
20
|
}
|
|
@@ -64,10 +64,9 @@ 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; }
|
|
68
67
|
if (!isModified) {
|
|
69
68
|
onClose?.();
|
|
70
|
-
onShowList?.(true);
|
|
69
|
+
isMobile && setShowList(true), onShowList?.(true);
|
|
71
70
|
return;
|
|
72
71
|
}
|
|
73
72
|
TMMessageBoxManager.show({
|
|
@@ -77,9 +76,9 @@ const TMSaveForm = ({ id, formMode = FormModes.Update, title, children, isModal,
|
|
|
77
76
|
if (e == ButtonNames.CANCEL)
|
|
78
77
|
return;
|
|
79
78
|
if (e == ButtonNames.NO)
|
|
80
|
-
(onUndo(), setShowList(true), onShowList?.(true));
|
|
79
|
+
isMobile && (onUndo(), setShowList(true), onShowList?.(true));
|
|
81
80
|
if (e == ButtonNames.YES)
|
|
82
|
-
await onSaveAsync?.();
|
|
81
|
+
isMobile ? (await onSaveAsync?.(), setShowList(true), onShowList?.(true)) : await onSaveAsync?.();
|
|
83
82
|
onClose?.();
|
|
84
83
|
}
|
|
85
84
|
catch (ex) {
|
|
@@ -93,7 +92,9 @@ const TMSaveForm = ({ id, formMode = FormModes.Update, title, children, isModal,
|
|
|
93
92
|
const renderSaveForm = () => {
|
|
94
93
|
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 &&
|
|
95
94
|
_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 &&
|
|
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 })] }) })
|
|
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 })] }) }), onShowList &&
|
|
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
|
|
97
98
|
?
|
|
98
99
|
_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' })
|
|
99
100
|
: _jsx(_Fragment, { children: children }) }), showErrorGrid && validationItems.length > 0 ? _jsx(TMCard, { scrollY: true, padding: false, showBorder: false, children: _jsx(TMValidationItemsList, { validationItems: validationItems }) }) : _jsx(_Fragment, {})] }) })] }));
|
|
@@ -3,7 +3,7 @@ import { useEffect, useState } from 'react';
|
|
|
3
3
|
import { SDK_Globals, AppModules } from '@topconsultnpm/sdk-ts-beta';
|
|
4
4
|
import TMQueryResult from './TMQueryResult';
|
|
5
5
|
import styled from 'styled-components';
|
|
6
|
-
import { IconApply, IconCloseOutline, IconUser, IconInfo, IconRefresh, IconSync, IconDownload, IconPreview, IconPrinter, IconCheckIn, IconEdit, IconStar, IconRecursiveOps, IconMail, IconDcmtTypeOnlyMetadata, IconCopy, IconRelation, IconSignature, IconDelete, IconUndo, IconCloseCircle, IconMenuVertical, IconArchiveDoc, IconDuplicate, IconSubstFile, IconConvertFilePdf, IconCheckFile, IconBatchUpdate, IconShare, IconSharedDcmt, IconSearch, IconExportTo, IconShow, IconSettings, IconActivityLog, SDKUI_Localizator
|
|
6
|
+
import { IconApply, IconCloseOutline, IconUser, IconInfo, IconRefresh, IconSync, IconDownload, IconPreview, IconPrinter, IconCheckIn, IconEdit, IconStar, IconRecursiveOps, IconMail, IconDcmtTypeOnlyMetadata, IconCopy, IconRelation, IconSignature, IconDelete, IconUndo, IconCloseCircle, IconMenuVertical, IconArchiveDoc, IconDuplicate, IconSubstFile, IconConvertFilePdf, IconCheckFile, IconBatchUpdate, IconShare, IconSharedDcmt, IconSearch, IconExportTo, IconShow, IconSettings, IconActivityLog, SDKUI_Localizator } from '../../helper';
|
|
7
7
|
import { FormModes } from '../../ts';
|
|
8
8
|
import { TMColors } from '../../utils/theme';
|
|
9
9
|
import { StyledBadge } from '../base/Styled';
|
|
@@ -221,29 +221,13 @@ const TMQueryResultForm = ({ onUpdate, isModal, onClose, context = SearchResultC
|
|
|
221
221
|
_jsxs(StyledTitleContainer, { children: [context === SearchResultContext.WORKFLOW_APPROVE ? _jsx(IconActivityLog, { fontSize: 14 }) : context === SearchResultContext.FAVORITES ? _jsx(IconStar, {}) : context === SearchResultContext.RECENT ? _jsx(IconRefresh, {}) : '', context === SearchResultContext.WORKFLOW_APPROVE ? SDKUI_Localizator.WorkflowApproval : context === SearchResultContext.FAVORITES ? SDKUI_Localizator.Favorites : context === SearchResultContext.RECENT ? SDKUI_Localizator.Recent : ''] }, context === SearchResultContext.WORKFLOW_APPROVE ? 'title2' : context === SearchResultContext.FAVORITES ? 'title0' : context === SearchResultContext.RECENT ? 'title1' : '')
|
|
222
222
|
];
|
|
223
223
|
const [toolbar, setToolbar] = useState(toolbarElements);
|
|
224
|
-
let width = useWindowWidth()
|
|
225
|
-
let isMobile = width <= MOBILE_WIDTH
|
|
226
|
-
useEffect(() => { if (isMobile) {
|
|
227
|
-
setCurrentSearchResult1(undefined);
|
|
228
|
-
setCurrentSearchResult2(undefined);
|
|
229
|
-
}
|
|
230
|
-
else {
|
|
231
|
-
if (Array.isArray(result1)) {
|
|
232
|
-
setCurrentSearchResult1(orderByName(result1)[0]);
|
|
233
|
-
}
|
|
234
|
-
;
|
|
235
|
-
if (Array.isArray(result2)) {
|
|
236
|
-
setCurrentSearchResult2(orderByName(result2)[0]);
|
|
237
|
-
}
|
|
238
|
-
} }, [isMobile, result1, result2]);
|
|
224
|
+
// let width = useWindowWidth()
|
|
225
|
+
// let isMobile: boolean = width <= MOBILE_WIDTH
|
|
226
|
+
// useEffect(() => { if (isMobile) { setCurrentSearchResult1(undefined); setCurrentSearchResult2(undefined) } else { if (Array.isArray(result1)) { setCurrentSearchResult1(orderByName(result1)[0]) }; if (Array.isArray(result2)) { setCurrentSearchResult2(orderByName(result2)[0]) } } }, [ result1, result2])
|
|
239
227
|
useEffect(() => {
|
|
240
228
|
let arr = [...toolbarElements];
|
|
241
|
-
if (isMobile && hasBack) {
|
|
242
|
-
|
|
243
|
-
}
|
|
244
|
-
if (!isMobile || !hasBack) {
|
|
245
|
-
arr = arr.filter(item => item.key !== 'btn00');
|
|
246
|
-
}
|
|
229
|
+
// if (isMobile && hasBack) { arr.unshift(<TMButton key="btn00" caption={SDKUI_Localizator.Back} icon={<IconArrowLeft />} btnStyle='toolbar' color='tertiary' fontSize='1.3rem' onClick={() => { setSplitterSize(['100%', '0']); setHasBack(false); let arr = [...toolbar]; arr = arr.filter(item => item.key !== 'btn00'); }} />) }
|
|
230
|
+
// if (!isMobile || !hasBack) { arr = arr.filter(item => item.key !== 'btn00') }
|
|
247
231
|
if (context === SearchResultContext.METADATA_SEARCH) {
|
|
248
232
|
arr = arr.filter(item => item.key !== 'btn14');
|
|
249
233
|
arr = arr.filter(item => item.key !== 'btn5');
|
|
@@ -271,7 +255,7 @@ const TMQueryResultForm = ({ onUpdate, isModal, onClose, context = SearchResultC
|
|
|
271
255
|
arr = arr.filter(item => item.key !== 'title1');
|
|
272
256
|
}
|
|
273
257
|
setToolbar(arr);
|
|
274
|
-
}, [context, selectedItems,
|
|
258
|
+
}, [context, selectedItems, hasBack]);
|
|
275
259
|
useEffect(() => {
|
|
276
260
|
let c = 0;
|
|
277
261
|
if (Array.isArray(result1)) {
|
|
@@ -307,17 +291,14 @@ const TMQueryResultForm = ({ onUpdate, isModal, onClose, context = SearchResultC
|
|
|
307
291
|
// window.addEventListener('keydown', handleTabChange)
|
|
308
292
|
// return () => window.removeEventListener('keydown', handleTabChange)
|
|
309
293
|
// }, [selectedTabIndex])
|
|
310
|
-
return (_jsxs(TMApplyForm, { isModal: isModal, formMode: FormModes.None, showApply: false, showUndo: false, hasNavigation: false, onClose: onClose, showBack: context === SearchResultContext.METADATA_SEARCH, customToolbarElements: SDK_Globals.tmSession?.SessionDescr?.appModuleID == AppModules.ORCHESTRATOR ? [] :
|
|
294
|
+
return (_jsxs(TMApplyForm, { isModal: isModal, formMode: FormModes.None, showApply: false, showUndo: false, hasNavigation: false, onClose: onClose, showBack: context === SearchResultContext.METADATA_SEARCH, customToolbarElements: SDK_Globals.tmSession?.SessionDescr?.appModuleID == AppModules.ORCHESTRATOR ? [] : context !== SearchResultContext.METADATA_SEARCH && !hasBack ? mobileHeaderTitle : toolbar, children: [Array.isArray(result1)
|
|
311
295
|
?
|
|
312
|
-
_jsxs(TMSplitterLayout, {
|
|
296
|
+
_jsxs(TMSplitterLayout, { direction: 'horizontal', min: ['0', '0'], start: ['20%', '80%'], children: [_jsx(TMLayoutItem, { children: _jsxs("div", { style: { height: '100%', display: 'flex', flexDirection: 'column' }, children: [_jsx("div", { style: { width: '100%', height: 'calc(100% - 40px)' }, children: _jsx(TMListView, { orderBy: 'fromName', exprKey: 'fromTID', dataSource: selectedTabIndex === 0 ? result1 : result2 && Array.isArray(result2) ? result2 : [], customColor: '#0e7418', id: `workflow-approve-list-view${selectedTabIndex.toString()}`, itemTemplate: (data) => _jsx(WorfflowListItem, { data: data }), selectedItem: selectedTabIndex === 0 ? currentSearchResult1 : currentSearchResult2, onSelectionChanged: (e) => { if (selectedTabIndex === 0) {
|
|
313
297
|
setCurrentSearchResult1(e);
|
|
314
298
|
}
|
|
315
299
|
else {
|
|
316
300
|
setCurrentSearchResult2(e);
|
|
317
|
-
} ;
|
|
318
|
-
setSplitterSize(['0', '100%']);
|
|
319
|
-
setHasBack(true);
|
|
320
|
-
} }, onItemDblClick: (e) => alert(e.fromName), searchKeys: ['fromTID', 'fromName'] }) }), _jsxs("div", { style: { display: 'flex', flexDirection: 'row', gap: 10, alignItems: 'center', width: '100%', height: '40px', borderTop: '1px #e1e1e1 solid', borderBottom: '1px solid #e1e1e1' }, children: [_jsx(TabView, { clickable: result2 && Array.isArray(result2), count: tabCount1, icon: tabIcon1, onClick: () => setSelectedTabIndex(0), onMouseOut: () => setHoveredTab(undefined), onMouseOver: () => setHoveredTab(0), selectedTabBorderColor: selectedTabIndex === 0 ? '#0e7418' : hoveredTab === 0 ? '#c1c1c1' : 'transparent', title: tabTitle1 }), result2 && _jsx(TabView, { clickable: true, count: tabCount2, icon: tabIcon2, onClick: () => setSelectedTabIndex(1), onMouseOut: () => setHoveredTab(undefined), onMouseOver: () => setHoveredTab(1), selectedTabBorderColor: selectedTabIndex === 1 ? '#0e7418' : hoveredTab === 1 ? '#c1c1c1' : 'transparent', title: tabTitle2 })] })] }) }), _jsxs(TMLayoutItem, { children: [" ", _jsx(TMQueryResult, { onDblClick: () => alert('open form'), onSelectionChanged: (e) => setSelectedItems(e), result: selectedTabIndex === 0 ? currentSearchResult1 : currentSearchResult2, showHiddenSelectItems: showHiddenSelectItems, elapsedTime: elapsedTime, searchText: searchText })] })] })
|
|
301
|
+
} ; }, onItemDblClick: (e) => alert(e.fromName), searchKeys: ['fromTID', 'fromName'] }) }), _jsxs("div", { style: { display: 'flex', flexDirection: 'row', gap: 10, alignItems: 'center', width: '100%', height: '40px', borderTop: '1px #e1e1e1 solid', borderBottom: '1px solid #e1e1e1' }, children: [_jsx(TabView, { clickable: result2 && Array.isArray(result2), count: tabCount1, icon: tabIcon1, onClick: () => setSelectedTabIndex(0), onMouseOut: () => setHoveredTab(undefined), onMouseOver: () => setHoveredTab(0), selectedTabBorderColor: selectedTabIndex === 0 ? '#0e7418' : hoveredTab === 0 ? '#c1c1c1' : 'transparent', title: tabTitle1 }), result2 && _jsx(TabView, { clickable: true, count: tabCount2, icon: tabIcon2, onClick: () => setSelectedTabIndex(1), onMouseOut: () => setHoveredTab(undefined), onMouseOver: () => setHoveredTab(1), selectedTabBorderColor: selectedTabIndex === 1 ? '#0e7418' : hoveredTab === 1 ? '#c1c1c1' : 'transparent', title: tabTitle2 })] })] }) }), _jsxs(TMLayoutItem, { children: [" ", _jsx(TMQueryResult, { onDblClick: () => alert('open form'), onSelectionChanged: (e) => setSelectedItems(e), result: selectedTabIndex === 0 ? currentSearchResult1 : currentSearchResult2, showHiddenSelectItems: showHiddenSelectItems, elapsedTime: elapsedTime, searchText: searchText })] })] })
|
|
321
302
|
:
|
|
322
303
|
_jsx(TMQueryResult, { onSelectionChanged: (e) => setSelectedItems(e), result: result1, showHiddenSelectItems: showHiddenSelectItems, elapsedTime: elapsedTime, searchText: searchText }), showApprovePopup && _jsx(WorkFlowApproveRejectPopUp, { onUpdate: onUpdate, selectedItems: selectedItems, op: 0, onClose: () => setShowApprovePopup(false) }), showRejectPopup && _jsx(WorkFlowApproveRejectPopUp, { onUpdate: onUpdate, selectedItems: selectedItems, op: 1, onClose: () => setShowRejectPopup(false) }), showReAssignPopup && _jsx(WorkFlowReAssignPopUp, { onUpdate: onUpdate, selectedItems: selectedItems, onClose: () => setShowReAssignPopup(false) })] }));
|
|
323
304
|
};
|