@topconsultnpm/sdkui-react-beta 6.13.7 → 6.13.8
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.
- package/lib/components/base/TMPanel.js +11 -6
- package/lib/components/choosers/TMDistinctValues.js +2 -2
- package/lib/components/features/archive/TMArchive.js +3 -3
- package/lib/components/features/search/TMSearch.js +4 -4
- package/lib/helper/helpers.d.ts +1 -0
- package/lib/helper/helpers.js +4 -0
- package/package.json +1 -1
|
@@ -1,10 +1,9 @@
|
|
|
1
|
-
import { jsx as _jsx,
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useState } from 'react';
|
|
3
3
|
import styled from 'styled-components';
|
|
4
4
|
import TMRightSidebar from './TMRightSidebar';
|
|
5
|
-
import { IconArrowLeft, IconWindowMaximize, IconWindowMinimize, SDKUI_Localizator } from '../../helper';
|
|
5
|
+
import { IconArrowLeft, IconWindowMaximize, IconWindowMinimize, isPositiveNumber, SDKUI_Localizator } from '../../helper';
|
|
6
6
|
import { TMColors } from '../../utils/theme';
|
|
7
|
-
import { StyledBadge } from './Styled';
|
|
8
7
|
import TMButton from './TMButton';
|
|
9
8
|
const StyledPanelContainer = styled.div `
|
|
10
9
|
width: 100%;
|
|
@@ -13,14 +12,15 @@ const StyledPanelContainer = styled.div `
|
|
|
13
12
|
box-shadow: 3px 3px 5px #D3D3D3BF;
|
|
14
13
|
border-radius: 10px;
|
|
15
14
|
opacity: 1;
|
|
16
|
-
background: #FFFFFF
|
|
15
|
+
background: #FFFFFF;
|
|
17
16
|
position: ${({ $isMaximized }) => $isMaximized ? 'fixed' : 'relative'};
|
|
18
17
|
top: ${({ $isMaximized }) => $isMaximized ? '50px' : 'auto'};
|
|
19
18
|
left: ${({ $isMaximized }) => $isMaximized ? '50px' : 'auto'};
|
|
20
19
|
width: ${({ $isMaximized }) => $isMaximized ? 'calc(100vw - 50px)' : '100%'};
|
|
21
20
|
height: ${({ $isMaximized }) => $isMaximized ? 'calc(100vh - 50px)' : '100%'};
|
|
22
21
|
z-index: ${({ $isMaximized }) => $isMaximized ? 2000 : 'auto'};
|
|
23
|
-
|
|
22
|
+
padding: ${({ $isMaximized }) => $isMaximized ? '20px' : '0'};
|
|
23
|
+
/* transition: all 0.2s; */
|
|
24
24
|
`;
|
|
25
25
|
const StyledPanelHeader = styled.div `
|
|
26
26
|
width:100% ;
|
|
@@ -57,7 +57,12 @@ const TMPanel = ({ items = [], onItemClick, selectedItem, showPanel, color, back
|
|
|
57
57
|
const [isMaximized, setIsMaximized] = useState(false);
|
|
58
58
|
return (_jsxs(StyledPanelContainer, { "$isMaximized": isMaximized, children: [showHeader &&
|
|
59
59
|
_jsx(StyledPanelHeader, { "$backgroundColor": backgroundColor, "$color": color, "$isActive": isActive, onDoubleClick: () => { if (onHeaderDoubleClick)
|
|
60
|
-
onHeaderDoubleClick(); },
|
|
60
|
+
onHeaderDoubleClick(); }, tabIndex: -1, onFocus: () => setIsActive(true), onBlur: () => setIsActive(false), onClick: () => setIsActive(true), children: _jsxs("div", { style: { display: 'flex', flexDirection: 'row', alignItems: 'center', justifyContent: 'space-between', width: '100%' }, children: [_jsxs("div", { style: { display: 'flex', flexDirection: 'row', alignItems: 'center', gap: '8px' }, children: [onBack &&
|
|
61
|
+
_jsx(TMButton, { btnStyle: 'icon', icon: _jsx("div", { style: { backgroundColor: 'white', minWidth: '24px', minHeight: '24px', borderRadius: '24px', display: 'flex', alignItems: 'center', justifyContent: 'center' }, children: _jsx(IconArrowLeft, { color: TMColors.primaryColor }) }), caption: SDKUI_Localizator.Back, onClick: onBack }), _jsx("div", { style: { display: 'flex', flexDirection: 'row', alignItems: 'center' }, children: _jsxs("p", { children: [title, isPositiveNumber(displayedItemsCount) && isPositiveNumber(totalItems)
|
|
62
|
+
? ` (${displayedItemsCount} / ${totalItems})`
|
|
63
|
+
: isPositiveNumber(totalItems)
|
|
64
|
+
? ` (${totalItems})`
|
|
65
|
+
: ''] }) })] }), _jsxs("div", { style: { display: 'flex', flexDirection: 'row', alignItems: 'center', gap: '5px' }, children: [toolbar, _jsx(TMButton, { color: 'primaryOutline', caption: isMaximized ? 'Exit Full Screen' : 'Full Screen', icon: isMaximized
|
|
61
66
|
? _jsx(IconWindowMinimize, { style: { color: isActive ? '#FFFFFF' : '#2559A5' } })
|
|
62
67
|
: _jsx(IconWindowMaximize, { style: { color: isActive ? '#FFFFFF' : '#2559A5' } }), btnStyle: 'icon', onClick: () => setIsMaximized(m => !m) }), onClose && _jsx(TMButton, { color: 'primaryOutline', caption: SDKUI_Localizator.Close, icon: _jsx("i", { className: 'dx-icon-remove', style: { color: isActive ? '#FFFFFF' : '#2559A5' } }), btnStyle: 'icon', onClick: () => onClose?.() })] })] }) }), _jsxs(StyledPanelContent, { "$height": showHeader ? "calc(100% - 40px)" : "100%", "$padding": padding, "$backgroundColor": backgroundColorContainer ?? `#FFFFFF`, tabIndex: -1, onFocus: () => setIsActive(true), onBlur: () => setIsActive(false), onClick: () => setIsActive(true), children: [_jsx("div", { style: { width: items.length > 0 ? 'calc(100% - 30px)' : '100%' }, tabIndex: -1, onFocus: () => setIsActive(true), onBlur: () => setIsActive(false), onClick: () => setIsActive(true), children: children }), items.length > 0 &&
|
|
63
68
|
_jsx(TMRightSidebar, { items: items, onItemClick: onItemClick, selectedItem: selectedItem, showPanel: showPanel })] })] }));
|
|
@@ -8,7 +8,7 @@ import TMDataGrid from '../base/TMDataGrid';
|
|
|
8
8
|
import { TMExceptionBoxManager } from '../base/TMPopUp';
|
|
9
9
|
import TMSpinner from '../base/TMSpinner';
|
|
10
10
|
import TMCheckBox from '../editors/TMCheckBox';
|
|
11
|
-
import
|
|
11
|
+
import TMPanel from '../base/TMPanel';
|
|
12
12
|
const StyledDistinctValues = styled.div `display: flex; flex-direction: column; height: 100%; overflow: hidden; gap: 10px;`;
|
|
13
13
|
const StyledPanelContainer = styled.div ` width: 100%; height: 100%; padding: 20px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; `;
|
|
14
14
|
const TMDistinctValues = ({ tid, mid, layoutMode = LayoutModes.None, allowAppendMode = true, showHeader = true, separator = " ", onSelectionChanged, onClosePanelCallback }) => {
|
|
@@ -141,7 +141,7 @@ const TMDistinctValues = ({ tid, mid, layoutMode = LayoutModes.None, allowAppend
|
|
|
141
141
|
return false;
|
|
142
142
|
return md.dataDomain === undefined || md.dataDomain === MetadataDataDomains.None;
|
|
143
143
|
};
|
|
144
|
-
return (_jsx(
|
|
144
|
+
return (_jsx(TMPanel, { title: SDKUI_Localizator.DistinctValues + (md?.nameLoc ? ` (${md?.nameLoc})` : ''), showHeader: showHeader, onClose: onClosePanelCallback, children: showPrompt
|
|
145
145
|
? _jsxs(StyledPanelContainer, { children: [_jsx(IconDataList, { fontSize: 96 }), _jsxs("p", { children: ["Caricare i valori distinti di ", _jsx("strong", { children: `"${md?.nameLoc}" ` }), "? "] }), _jsx(TMButton, { caption: SDKUI_Localizator.Yes, onClick: handleLoadData, showTooltip: false })] })
|
|
146
146
|
: _jsxs(StyledDistinctValues, { children: [isVisibleAppend() && _jsx(TMCheckBox, { elementStyle: { position: 'absolute', right: '15px', top: '15px', zIndex: 10000 }, label: 'Accoda', value: isAppendMode, onValueChanged: () => { setIsAppendMode(!isAppendMode); } }), _jsx(TMDataGrid, { focusedRowKey: focusedItem ? focusedItem.rowIndex : undefined, selection: { showCheckBoxesMode: 'none' }, searchPanel: { highlightCaseSensitive: true, visible: true }, dataColumns: customColumns, dataSource: dataSource, keyExpr: 'rowIndex', height: 'calc(100%)', onFocusedRowChanged: onFocusedRowChanged, paging: { pageSize: 30 }, summary: customSummary })] }) }));
|
|
147
147
|
};
|
|
@@ -5,11 +5,11 @@ import { LayoutModes } from '@topconsultnpm/sdk-ts-beta';
|
|
|
5
5
|
import { IconTree, IconProgressReady, SDKUI_Globals } from '../../../helper';
|
|
6
6
|
import { useDeviceType, DeviceType } from '../../base/TMDeviceProvider';
|
|
7
7
|
import TMLayoutContainer, { TMSplitterLayout, TMLayoutItem } from '../../base/TMLayout';
|
|
8
|
-
import TMToolbarCard from '../../base/TMToolbarCard';
|
|
9
8
|
import TMRecentsManager from '../../grids/TMRecentsManager';
|
|
10
9
|
import TMDcmtForm from '../documents/TMDcmtForm';
|
|
11
10
|
import { StyledToppyTextContainer, StyledToppyText } from '../search/TMSearchQueryPanel';
|
|
12
11
|
import TMTreeSelector from '../search/TMTreeSelector';
|
|
12
|
+
import TMPanel from '../../base/TMPanel';
|
|
13
13
|
const TMArchive = ({ inputTID }) => {
|
|
14
14
|
const TIDs = SDKUI_Globals.userSettings.archivingSettings.mruTIDs;
|
|
15
15
|
const [currentTID, setCurrentTID] = useState(0);
|
|
@@ -42,7 +42,7 @@ const TMArchive = ({ inputTID }) => {
|
|
|
42
42
|
{ icon: _jsx(IconProgressReady, {}), id: 'recents', visibleName: 'Recenti', isActive: showRecentsPanel, onClick: () => { setShowRecentsPanel(!showRecentsPanel); } }
|
|
43
43
|
]);
|
|
44
44
|
}, [showTreesPanel, showRecentsPanel]);
|
|
45
|
-
return (_jsxs(TMSplitterLayout, { direction: 'horizontal', separatorSize:
|
|
45
|
+
return (_jsxs(TMSplitterLayout, { direction: 'horizontal', overflow: 'visible', separatorSize: SDKUI_Globals.userSettings.themeSettings.gutters, showSeparator: deviceType !== DeviceType.MOBILE && showTreesPanel, separatorColor: 'transparent', separatorActiveColor: 'transparent', min: ['0', '0'], start: getPrimarySplitterStartValues(), children: [showTreesPanel ? _jsx(TMLayoutItem, { children: deviceType !== DeviceType.MOBILE && _jsx(TMTreeSelector, { onClose: () => setShowTreesPanel(false), layoutMode: LayoutModes.Ark, onSelectedTIDChanged: (tid) => { setSearchByTID(tid); } }) }) : _jsx(_Fragment, {}), _jsx(TMLayoutItem, { children: _jsxs(TMSplitterLayout, { separatorSize: SDKUI_Globals.userSettings.themeSettings.gutters, direction: 'horizontal', overflow: 'visible', showSeparator: deviceType !== DeviceType.MOBILE && showRecentsPanel, separatorColor: 'transparent', separatorActiveColor: 'transparent', min: ['0', '0'], start: getSecondarySplitterStartValues(), children: [showRecentsPanel ? _jsx(TMLayoutItem, { children: _jsx(TMPanel, { title: 'Recenti', onClose: () => setShowRecentsPanel(false), totalItems: mruTIDs.length, children: _jsx(TMRecentsManager, { mruTIDs: mruTIDs, deviceType: deviceType, onSelectedTID: (tid) => setCurrentTID(tid), onDeletedTID: (tid) => {
|
|
46
46
|
let newMruTIDS = mruTIDs.slice();
|
|
47
47
|
let index = newMruTIDS.findIndex(o => o == tid);
|
|
48
48
|
if (index >= 0)
|
|
@@ -52,6 +52,6 @@ const TMArchive = ({ inputTID }) => {
|
|
|
52
52
|
} }) }) }) : _jsx(_Fragment, {}), _jsx(TMLayoutItem, { children: currentTID ?
|
|
53
53
|
_jsx(TMDcmtForm, { TID: currentTID, DID: undefined, layoutMode: LayoutModes.Ark, customRightSidebarItems: customSidebarItems, showPreview: deviceType !== DeviceType.MOBILE, onClose: deviceType === DeviceType.MOBILE ? () => setCurrentTID(undefined) : undefined, onSaveRecents: (TIDs) => setMruTIDs(TIDs) })
|
|
54
54
|
:
|
|
55
|
-
_jsx(
|
|
55
|
+
_jsx(TMPanel, { items: customSidebarItems, title: 'Archiviazione', children: _jsxs(TMLayoutContainer, { gap: 30, alignItems: 'center', justifyContent: 'center', children: [_jsxs(TMLayoutItem, { width: 'max-content', height: 'max-content', children: [" ", _jsxs(StyledToppyTextContainer, { children: [" ", _jsxs(StyledToppyText, { children: [" ", 'Selezionare un tipo documento', " "] }), " "] }), " "] }), _jsxs(TMLayoutItem, { width: 'max-content', height: 'max-content', children: [" ", _jsx("img", { src: Logo, width: 120, alt: '' }), " "] })] }) }) })] }) })] }));
|
|
56
56
|
};
|
|
57
57
|
export default TMArchive;
|
|
@@ -6,7 +6,7 @@ import TMTreeSelector from './TMTreeSelector';
|
|
|
6
6
|
import { TabPanel, Item } from 'devextreme-react/tab-panel';
|
|
7
7
|
import TMSearchQueryPanel, { refreshLastSearch } from './TMSearchQueryPanel';
|
|
8
8
|
import { getSysAllDcmtsSQD, IconDataList, IconProgressReady, IconSavedQuery, IconTree, SDKUI_Globals, SDKUI_Localizator } from '../../../helper';
|
|
9
|
-
import
|
|
9
|
+
import { TMLayoutItem, TMSplitterLayout } from '../../base/TMLayout';
|
|
10
10
|
import TMPanel from '../../base/TMPanel';
|
|
11
11
|
import TMSearchResult from './TMSearchResult';
|
|
12
12
|
import TMRecentsManager from '../../grids/TMRecentsManager';
|
|
@@ -146,7 +146,7 @@ const TMSearch = ({ inputTID, inputSqdID, isExpertMode = SDKUI_Globals.userSetti
|
|
|
146
146
|
default: break;
|
|
147
147
|
}
|
|
148
148
|
};
|
|
149
|
-
return (_jsxs(
|
|
149
|
+
return (_jsxs(_Fragment, { children: [_jsx(StyledMultiViewPanel, { "$isVisible": currentSearchView === TMSearchViews.None, children: _jsxs(TMSplitterLayout, { direction: 'horizontal', overflow: 'visible', showSeparator: deviceType !== DeviceType.MOBILE && showTreesPanel, separatorSize: SDKUI_Globals.userSettings.themeSettings.gutters, separatorColor: 'transparent', separatorActiveColor: 'transparent', min: ['0', '0'], start: (deviceType === DeviceType.MOBILE) ? ['100%', '0%'] : showTreesPanel ? ['20%', '80%'] : ['0%', '100%'], children: [deviceType !== DeviceType.MOBILE &&
|
|
150
150
|
_jsx(TMTreeSelector, { onClose: () => setShowTreesPanel(false), onSelectedTIDChanged: (tid) => {
|
|
151
151
|
setCurrentTID(tid);
|
|
152
152
|
if (tid && mruTIDs.includes(tid))
|
|
@@ -183,10 +183,10 @@ const TMSearch = ({ inputTID, inputSqdID, isExpertMode = SDKUI_Globals.userSetti
|
|
|
183
183
|
await setSQDAsync(newSqd);
|
|
184
184
|
} })] }) }), _jsx(StyledMultiViewPanel, { "$isVisible": !showDistinctValuesPanel, children: _jsx(TMLayoutItem, { children: _jsx(TMPanel, { title: SDK_Localizator.SavedQueries, onClose: () => setShowSavedQueryPanel(false), children: _jsxs(TabPanel, { width: "100%", height: "100%", showNavButtons: true, repaintChangesOnly: true, selectedIndex: currentSQDMode, onSelectedIndexChange: (index) => setCurrentSQDMode(index), children: [(currentTID || currentSQD) ? _jsx(Item, { title: fromDTD?.nameLoc, children: _jsx(TMSavedQuerySelector, { allowShowSearch: false, items: filteredByTIDSQDs, selectedId: currentSQD?.id, onRefreshData: () => { loadDataSQDsAsync(true); }, onItemClick: (sqd) => onSQDItemClick(sqd, setSQDAsync), onDeleted: (sqd) => onSQDDeleted(sqd, sqd.id == currentSQD?.id ? filteredByTIDSQDs.find(o => o.id == 1) : currentSQD, setSQDAsync) }) }) : _jsx(_Fragment, {}), _jsx(Item, { title: SDKUI_Localizator.Alls2, children: _jsx(TMSavedQuerySelector, { allowShowSearch: true, items: allSQDs, manageDefault: false,
|
|
185
185
|
// selectedId={currentSQD?.id}
|
|
186
|
-
onItemClick: (sqd) => onSQDItemClick(sqd, setSQDAsync), onDeleted: (sqd) => onSQDDeleted(sqd, sqd.id == currentSQD?.id ? undefined : currentSQD, setSQDAsync) }) })] }) }) }) })] })] }) }
|
|
186
|
+
onItemClick: (sqd) => onSQDItemClick(sqd, setSQDAsync), onDeleted: (sqd) => onSQDDeleted(sqd, sqd.id == currentSQD?.id ? undefined : currentSQD, setSQDAsync) }) })] }) }) }) })] })] }) }), _jsx(StyledMultiViewPanel, { "$isVisible": currentSearchView === TMSearchViews.Result, children: searchResult.length > 0 &&
|
|
187
187
|
_jsx(TMSearchResult, { context: SearchResultContext.METADATA_SEARCH, searchResults: searchResult, onRefreshAfterAddDcmtToFavs: onRefreshAfterAddDcmtToFavs, onRefreshSearchAsync: async () => {
|
|
188
188
|
// setSearchResult([]);
|
|
189
189
|
setSearchResult(await refreshLastSearch(lastQdSearched) ?? []);
|
|
190
|
-
}, onTaskCreateRequest: onTaskCreateRequest, onClose: () => { setCurrentSearchView(TMSearchViews.None); } }) }
|
|
190
|
+
}, onTaskCreateRequest: onTaskCreateRequest, onClose: () => { setCurrentSearchView(TMSearchViews.None); } }) })] }));
|
|
191
191
|
};
|
|
192
192
|
export default TMSearch;
|
package/lib/helper/helpers.d.ts
CHANGED
|
@@ -36,6 +36,7 @@ export declare function versionAndBuildtypeInfo(module: moduleTypes): string;
|
|
|
36
36
|
export declare const getListMaxItems: (deviceType: DeviceType | undefined) => number;
|
|
37
37
|
export declare const svgToString: (icon: React.ReactElement) => string;
|
|
38
38
|
export declare function stringIsNullOrEmpty(value: string | undefined): boolean;
|
|
39
|
+
export declare function isPositiveNumber(val: unknown): val is number;
|
|
39
40
|
export declare function sleep(ms: number): Promise<void>;
|
|
40
41
|
export declare const dialogConfirmOperation: (title: string, msg: string, operationAsync: () => Promise<void>) => void;
|
|
41
42
|
export declare function getExceptionMessage(ex: any): string;
|
package/lib/helper/helpers.js
CHANGED
|
@@ -640,6 +640,10 @@ export function stringIsNullOrEmpty(value) {
|
|
|
640
640
|
return true;
|
|
641
641
|
return false;
|
|
642
642
|
}
|
|
643
|
+
export function isPositiveNumber(val) {
|
|
644
|
+
// unknown is used to maximize type safety and reusability for type guard functions.
|
|
645
|
+
return typeof val === 'number' && val > 0;
|
|
646
|
+
}
|
|
643
647
|
export async function sleep(ms) {
|
|
644
648
|
return new Promise((resolve) => setTimeout(resolve, ms));
|
|
645
649
|
}
|