@topconsultnpm/sdkui-react 6.20.0-dev2.46 → 6.20.0-dev2.48
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/TMTreeView.d.ts +3 -1
- package/lib/components/base/TMTreeView.js +63 -20
- package/lib/components/editors/TMTextBox.js +8 -9
- package/lib/components/features/documents/TMDcmtForm.js +2 -2
- package/lib/components/features/documents/TMMasterDetailDcmts.js +66 -5
- package/lib/components/features/documents/TMRelationViewer.d.ts +7 -1
- package/lib/components/features/documents/TMRelationViewer.js +389 -76
- package/lib/components/features/tasks/TMTaskForm.js +35 -182
- package/lib/components/features/tasks/TMTaskFormUtils.d.ts +86 -0
- package/lib/components/features/tasks/TMTaskFormUtils.js +432 -0
- package/lib/components/features/tasks/TMTasksUtils.js +1 -0
- package/lib/components/features/tasks/TMTasksUtilsView.d.ts +0 -7
- package/lib/components/features/tasks/TMTasksUtilsView.js +1 -12
- package/lib/components/features/tasks/TMTasksView.js +2 -2
- package/lib/components/forms/TMSaveForm.js +61 -13
- package/lib/components/grids/TMBlogsPost.js +2 -2
- package/lib/helper/SDKUI_Localizator.d.ts +6 -2
- package/lib/helper/SDKUI_Localizator.js +52 -12
- package/lib/helper/helpers.d.ts +6 -2
- package/lib/helper/helpers.js +22 -8
- package/package.json +1 -1
|
@@ -1,64 +1,19 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { useEffect, useMemo, useRef, useState } from 'react';
|
|
3
|
-
import { ObjectClasses, TaskDescriptor,
|
|
4
|
-
import {
|
|
3
|
+
import { ObjectClasses, TaskDescriptor, PdGs, UserListCacheService, SDK_Localizator } from '@topconsultnpm/sdk-ts';
|
|
4
|
+
import { gotoPDGExtendedLabel, taskValidatorAsync } from './TMTasksUtils';
|
|
5
5
|
import ScrollView from 'devextreme-react/scroll-view';
|
|
6
6
|
import TMLayoutContainer from '../../base/TMLayout';
|
|
7
7
|
import { FormModes } from '../../../ts';
|
|
8
8
|
import { useWorkflowApprove } from '../../../hooks/useWorkflowApprove';
|
|
9
9
|
import { SaveFormOptions, useSaveForm } from '../../../hooks/useForm';
|
|
10
|
-
import { SDKUI_Localizator, calcIsModified,
|
|
10
|
+
import { SDKUI_Localizator, calcIsModified, getMoreInfoTasksForDocument } from '../../../helper';
|
|
11
11
|
import { TMExceptionBoxManager } from '../../base/TMPopUp';
|
|
12
12
|
import TMSpinner from '../../base/TMSpinner';
|
|
13
|
-
import TMTooltip from '../../base/TMTooltip';
|
|
14
|
-
import TMUserChooser from '../../choosers/TMUserChooser';
|
|
15
|
-
import TMDateBox from '../../editors/TMDateBox';
|
|
16
|
-
import TMDropDown from '../../editors/TMDropDown';
|
|
17
|
-
import TMTextArea from '../../editors/TMTextArea';
|
|
18
|
-
import TMTextBox from '../../editors/TMTextBox';
|
|
19
13
|
import TMSaveForm from '../../forms/TMSaveForm';
|
|
20
14
|
import TMDcmtForm from '../documents/TMDcmtForm';
|
|
21
|
-
import styled from 'styled-components';
|
|
22
|
-
import { TMColors } from '../../../utils/theme';
|
|
23
|
-
import { renderContextBlock } from './TMTasksUtilsView';
|
|
24
15
|
import { DeviceType, useDeviceType } from '../../base/TMDeviceProvider';
|
|
25
|
-
|
|
26
|
-
position: relative;
|
|
27
|
-
width: 100%;
|
|
28
|
-
`;
|
|
29
|
-
const ResponseCommentLabel = styled.label `
|
|
30
|
-
position: absolute;
|
|
31
|
-
top: -8px;
|
|
32
|
-
left: 12px;
|
|
33
|
-
background-color: white;
|
|
34
|
-
padding: 0 4px;
|
|
35
|
-
font-size: 0.9rem;
|
|
36
|
-
color: rgb(80,80,80);
|
|
37
|
-
display: inline-flex;
|
|
38
|
-
align-items: center;
|
|
39
|
-
gap: 4px;
|
|
40
|
-
`;
|
|
41
|
-
const ResponseCommentTextArea = styled.textarea.attrs({
|
|
42
|
-
maxLength: 500,
|
|
43
|
-
}) `
|
|
44
|
-
width: 100%;
|
|
45
|
-
height: 100px;
|
|
46
|
-
border: 1px solid ${props => props.$isValid ? (props.$isModifiedWhen ? "#E29000" : '#b4b4b4') : TMColors.error};
|
|
47
|
-
border-radius: 10px;
|
|
48
|
-
padding: 10px;
|
|
49
|
-
resize: none;
|
|
50
|
-
cursor: ${props => props.disabled ? 'not-allowed' : 'text'};
|
|
51
|
-
&:focus {
|
|
52
|
-
outline: none;
|
|
53
|
-
border-bottom: 4px solid ${props => props.$isValid ? TMColors.primaryColor : TMColors.error};
|
|
54
|
-
}
|
|
55
|
-
`;
|
|
56
|
-
const ResponseCommentCharacterCounter = styled.div `
|
|
57
|
-
text-align: right;
|
|
58
|
-
font-size: 0.8rem;
|
|
59
|
-
color: #6c757d;
|
|
60
|
-
margin-top: 4px;
|
|
61
|
-
`;
|
|
16
|
+
import { getCurrentUserTaskRole, RenderDescriptionField, RenderEndDateField, RenderNameField, RenderPriorityField, RenderRemindDateField, RenderStartDateField, RenderTaskFormStateField, TaskAssigneeField, TaskFormAssignmentNoticeBadge, TaskFormContextualAttachments, TaskFormResponseComment, TaskPdgOriginNavigator, TMChangeStateForm } from './TMTaskFormUtils';
|
|
62
17
|
const TMTaskForm = (props) => {
|
|
63
18
|
// Custom hook to manage workflow approval data
|
|
64
19
|
const { refreshWorkflowApprove } = useWorkflowApprove();
|
|
@@ -109,10 +64,9 @@ const TMTaskForm = (props) => {
|
|
|
109
64
|
// Get the current device type (e.g., mobile, tablet, desktop) using a custom hook.
|
|
110
65
|
const deviceType = useDeviceType();
|
|
111
66
|
// This avoids unnecessary re-renders by only recalculating when deviceType changes.
|
|
112
|
-
let
|
|
113
|
-
const [isMobile, setIsMobile] = useState(false);
|
|
67
|
+
let isMobile = useMemo(() => { return deviceType === DeviceType.MOBILE; }, [deviceType]);
|
|
114
68
|
const [showDcmtForm, setShowDcmtForm] = useState(false);
|
|
115
|
-
const
|
|
69
|
+
const [showChangeStateForm, setShowChangeStateForm] = useState(false);
|
|
116
70
|
const [users, setUsers] = useState([]); // State to store the users
|
|
117
71
|
// Initial state for the fields' editability (readonly)
|
|
118
72
|
const [fieldsReadOnly, setFieldsReadOnly] = useState({
|
|
@@ -144,22 +98,18 @@ const TMTaskForm = (props) => {
|
|
|
144
98
|
};
|
|
145
99
|
fetchUsers();
|
|
146
100
|
}, []);
|
|
147
|
-
useEffect(() => {
|
|
148
|
-
if (isModal)
|
|
149
|
-
setIsMobile(true);
|
|
150
|
-
}, [isModal]);
|
|
151
101
|
useEffect(() => {
|
|
152
102
|
if (formDataOrig && formMode === FormModes.Update) {
|
|
153
|
-
const
|
|
103
|
+
const taskRole = getCurrentUserTaskRole(formDataOrig);
|
|
154
104
|
setFieldsReadOnly({
|
|
155
|
-
name:
|
|
156
|
-
description:
|
|
157
|
-
fromID:
|
|
158
|
-
assignedTO:
|
|
105
|
+
name: taskRole === 'receiver',
|
|
106
|
+
description: taskRole === 'receiver',
|
|
107
|
+
fromID: taskRole === 'receiver',
|
|
108
|
+
assignedTO: taskRole === 'receiver',
|
|
159
109
|
status: false,
|
|
160
|
-
priority:
|
|
161
|
-
startDate:
|
|
162
|
-
endDate:
|
|
110
|
+
priority: taskRole === 'receiver',
|
|
111
|
+
startDate: taskRole === 'receiver',
|
|
112
|
+
endDate: taskRole === 'receiver',
|
|
163
113
|
remTime: false,
|
|
164
114
|
response: false
|
|
165
115
|
});
|
|
@@ -183,44 +133,12 @@ const TMTaskForm = (props) => {
|
|
|
183
133
|
});
|
|
184
134
|
}
|
|
185
135
|
}, [formDataOrig, formMode]);
|
|
186
|
-
useEffect(() => {
|
|
187
|
-
if (!isModal) {
|
|
188
|
-
// Function to handle resize events and update the mobile state based on container width.
|
|
189
|
-
const updateDimensions = (entries) => {
|
|
190
|
-
for (let entry of entries) {
|
|
191
|
-
const { width } = entry.contentRect;
|
|
192
|
-
setIsMobile(width <= mobileBreakpoint);
|
|
193
|
-
}
|
|
194
|
-
};
|
|
195
|
-
// Create a ResizeObserver to observe container size changes
|
|
196
|
-
const resizeObserver = new ResizeObserver(updateDimensions);
|
|
197
|
-
if (containerRef.current) {
|
|
198
|
-
resizeObserver.observe(containerRef.current);
|
|
199
|
-
}
|
|
200
|
-
// Cleanup: Stop observing when the component unmounts or the dependency changes.
|
|
201
|
-
return () => {
|
|
202
|
-
if (containerRef.current) {
|
|
203
|
-
resizeObserver.unobserve(containerRef.current);
|
|
204
|
-
}
|
|
205
|
-
};
|
|
206
|
-
}
|
|
207
|
-
return undefined;
|
|
208
|
-
}, [containerRef, isModal]); // Dependency array ensures this effect runs when containerRef changes.
|
|
209
|
-
// Function to handle changes in the status value of a TM Drop Down
|
|
210
|
-
const onStatusValueChange = (e) => {
|
|
211
|
-
if (!e?.target?.value)
|
|
212
|
-
return;
|
|
213
|
-
setFormData({ ...formData ?? {}, state: e?.target?.value });
|
|
214
|
-
};
|
|
215
136
|
// Function to handle changes in the priority value of a TM Drop Down
|
|
216
137
|
const onPriorityValueChange = (e) => {
|
|
217
138
|
if (!e?.target?.value)
|
|
218
139
|
return;
|
|
219
140
|
setFormData({ ...formData ?? {}, priority: e?.target?.value });
|
|
220
141
|
};
|
|
221
|
-
const onAnswerChange = (e) => {
|
|
222
|
-
setFormData({ ...formData ?? {}, response: e.target.value ?? '' });
|
|
223
|
-
};
|
|
224
142
|
// Function to handle the undo action
|
|
225
143
|
const onUndoCallback = () => {
|
|
226
144
|
setFormData(formDataOrig);
|
|
@@ -330,6 +248,9 @@ const TMTaskForm = (props) => {
|
|
|
330
248
|
await editTaskCallback(task);
|
|
331
249
|
onClose?.();
|
|
332
250
|
};
|
|
251
|
+
const handleShowChangeStateForm = (value) => {
|
|
252
|
+
setShowChangeStateForm(value);
|
|
253
|
+
};
|
|
333
254
|
const handleNavigateToReference = (ref) => {
|
|
334
255
|
switch (ref.objClass) {
|
|
335
256
|
case ObjectClasses.Dossier:
|
|
@@ -349,94 +270,26 @@ const TMTaskForm = (props) => {
|
|
|
349
270
|
console.warn(`Unhandled object type: ${ref.objClass}`);
|
|
350
271
|
}
|
|
351
272
|
};
|
|
352
|
-
return (_jsx("div", { style: { width: "100%", height: "100%", overflow: "auto" }, ref: containerRef, children:
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
condition: formMode === FormModes.Create && isContextualCreate && !!taskContext?.workingGroup?.id,
|
|
358
|
-
pdg: PdGs.WG,
|
|
359
|
-
label: getOriginLabel(PdGs.WG, taskContext?.workingGroup?.name),
|
|
360
|
-
isMobile: isMobile
|
|
361
|
-
}), renderContextBlock({
|
|
362
|
-
condition: formMode === FormModes.Create && isContextualCreate && !!taskContext?.dossier?.id,
|
|
363
|
-
pdg: PdGs.CF,
|
|
364
|
-
label: getOriginLabel(PdGs.CF, taskContext?.dossier?.name),
|
|
365
|
-
isMobile: isMobile
|
|
366
|
-
}), renderContextBlock({
|
|
367
|
-
condition: formMode === FormModes.Create && isContextualCreate && !!taskContext?.document?.tid && !!taskContext?.document?.did,
|
|
368
|
-
pdg: PdGs.DT,
|
|
369
|
-
label: getOriginLabel(PdGs.DT, taskContext?.document?.name),
|
|
370
|
-
isMobile: isMobile
|
|
371
|
-
}), renderContextBlock({
|
|
372
|
-
condition: formMode === FormModes.Create && isContextualCreate && !!taskContext?.workItem?.tid && !!taskContext?.workItem?.did,
|
|
373
|
-
pdg: PdGs.DT,
|
|
374
|
-
label: getOriginLabel(PdGs.DT, taskContext?.workItem?.name),
|
|
375
|
-
isMobile: isMobile
|
|
376
|
-
}), formMode === FormModes.Update && formData?.pdG && formData?.iD1Name && (_jsx(TMConditionalWrapper, { condition: !isMobile, wrapper: children => (_jsx("div", { style: {
|
|
377
|
-
display: 'flex',
|
|
378
|
-
flexDirection: 'row',
|
|
379
|
-
width: '100%',
|
|
380
|
-
gap: 16,
|
|
381
|
-
padding: '8px 0'
|
|
382
|
-
}, children: children })), children: _jsx("div", { style: {
|
|
383
|
-
width: "100%",
|
|
384
|
-
display: 'flex',
|
|
385
|
-
alignItems: 'center',
|
|
386
|
-
justifyContent: 'center',
|
|
387
|
-
marginTop: 12
|
|
388
|
-
}, children: _jsxs("div", { onClick: () => formData.pdG !== PdGs.None ? gotoPDGExtendedLabelClickCallback() : null, style: {
|
|
389
|
-
backgroundColor: "#C2388B",
|
|
390
|
-
color: "#fff",
|
|
391
|
-
padding: "10px 16px",
|
|
392
|
-
borderRadius: "20px",
|
|
393
|
-
display: "flex",
|
|
394
|
-
alignItems: "center",
|
|
395
|
-
justifyContent: "space-between",
|
|
396
|
-
cursor: "pointer",
|
|
397
|
-
fontWeight: 500,
|
|
398
|
-
transition: "background-color 0.3s",
|
|
399
|
-
minWidth: "180px",
|
|
400
|
-
maxWidth: "100%",
|
|
401
|
-
flexWrap: "wrap",
|
|
402
|
-
gap: "8px",
|
|
403
|
-
}, onMouseEnter: e => {
|
|
404
|
-
if (formData.pdG !== PdGs.None)
|
|
405
|
-
e.currentTarget.style.backgroundColor = "#A12D78";
|
|
406
|
-
}, onMouseLeave: e => {
|
|
407
|
-
if (formData.pdG !== PdGs.None)
|
|
408
|
-
e.currentTarget.style.backgroundColor = "#C2388B";
|
|
409
|
-
}, children: [_jsxs("span", { style: {
|
|
410
|
-
flex: 1,
|
|
411
|
-
textAlign: "center",
|
|
412
|
-
gap: "6px",
|
|
413
|
-
display: "flex",
|
|
414
|
-
justifyContent: "center",
|
|
415
|
-
alignItems: "center",
|
|
416
|
-
}, children: [formData.pdG === PdGs.WG && _jsx("span", { children: SDKUI_Localizator.GoToWorkgroup }), formData.pdG === PdGs.CF && _jsx("span", { children: SDKUI_Localizator.GoToDossier }), formData.pdG === PdGs.DT && _jsx("span", { children: SDKUI_Localizator.GoToDocument }), (() => {
|
|
417
|
-
const originLabel = getOriginLabel(formData.pdG, formData.iD1Name);
|
|
418
|
-
if (!originLabel)
|
|
419
|
-
return null;
|
|
420
|
-
const maxLength = isMobileDevice ? 10 : 25;
|
|
421
|
-
const displayText = originLabel.length > maxLength
|
|
422
|
-
? originLabel.slice(0, maxLength) + "..."
|
|
423
|
-
: originLabel;
|
|
424
|
-
return _jsxs("span", { children: ["\u201C", displayText, "\u201D"] });
|
|
425
|
-
})()] }), _jsx(TMTooltip, { content: _jsxs("div", { style: { textAlign: "left" }, children: [formData.pdG && (_jsxs(_Fragment, { children: [_jsxs("div", { style: {
|
|
426
|
-
display: "flex",
|
|
427
|
-
alignItems: "center",
|
|
428
|
-
gap: "6px",
|
|
429
|
-
fontWeight: 600,
|
|
430
|
-
}, children: [_jsx("span", { style: { display: "flex", alignItems: "center" }, children: getPdgsIconMap().get(formData.pdG) }), _jsx("span", { children: formData.pdG === PdGs.WG ? SDKUI_Localizator.WorkGroup : formData.pdG === PdGs.CF ? SDKUI_Localizator.Dossier : formData.pdG === PdGs.DT ? SDKUI_Localizator.Document : "" })] }), _jsx("hr", { style: { margin: "4px 0 8px 0" } })] })), formData.iD1 != null && formData.iD1 !== 0 && (_jsxs("div", { children: [_jsx("b", { children: "ID1" }), ": ", formData.iD1.toString()] })), formData.iD1Name && (_jsxs("div", { children: [_jsx("b", { children: "ID1NAME" }), ": ", formData.iD1Name.toString()] })), formData.iD2 != null && formData.iD2 !== 0 && (_jsxs("div", { children: [_jsx("b", { children: "ID2" }), ": ", formData.iD2.toString()] }))] }), children: _jsx("i", { className: "dx-icon-info", style: { fontSize: "1.3rem", flexShrink: 0 } }) })] }) }) })), _jsx(TMConditionalWrapper, { condition: !isMobile, wrapper: children => _jsx("div", { style: { display: 'flex', flexDirection: 'row', width: '100%', gap: 10 }, children: children }), children: _jsx("div", { style: { width: isMobile ? '100%' : '50%' }, children: _jsx(TMTextBox, { label: SDKUI_Localizator.Name, value: formData?.name ?? '', readOnly: fieldsReadOnly.name, autoFocus: true, maxLength: 100, isModifiedWhen: formData?.name !== formDataOrig?.name, onValueChanged: (e) => { setFormData({ ...formData ?? {}, name: e.target.value }); }, validationItems: validationItems?.filter(o => o.PropertyName === SDKUI_Localizator.Name) }) }) }), _jsx("div", { style: { width: '100%' }, children: _jsx(TMTextArea, { label: SDKUI_Localizator.Description, value: formData?.description ?? '', maxLength: 200, readOnly: fieldsReadOnly.description, isModifiedWhen: formData?.description !== formDataOrig?.description, onValueChanged: (e) => { setFormData({ ...formData ?? {}, description: e.target.value }); }, validationItems: validationItems?.filter(o => o.PropertyName === SDKUI_Localizator.Description), resize: false }) }), _jsx(TMConditionalWrapper, { condition: !isMobile, wrapper: children => _jsx("div", { style: { display: 'flex', flexDirection: 'row', width: '100%', gap: 10 }, children: children }), children: (formMode === FormModes.Create || !areDifferentIDs(formDataOrig?.fromID, SDK_Globals.tmSession?.SessionDescr?.userID)) ?
|
|
431
|
-
_jsx("div", { id: "assignedToAnotherUserField", style: { width: isMobile ? '100%' : '50%' }, children: _jsx(TMUserChooser, { dataSource: usersList ?? undefined, allowShowAllUsers: !!taskContext?.dossier, allowMultipleSelection: false, label: SDKUI_Localizator.AssignedTo_Female, readOnly: fieldsReadOnly.assignedTO, values: formData?.toID ? [formData?.toID] : [], isModifiedWhen: formData?.toID !== formDataOrig?.toID, validationItems: validationItems?.filter(o => o.PropertyName === SDKUI_Localizator.AssignedTo_Female), onValueChanged: (newValue) => {
|
|
273
|
+
return (_jsx("div", { style: { width: "100%", height: "100%", overflow: "auto" }, ref: containerRef, children: _jsxs(TMSaveForm, { width: width, height: height, id: id, title: title, isModal: isModal, formMode: formMode, onSaveAsync: saveDataAsync, onClose: onCloseCallback, onUndo: onUndoCallback, exception: exception, isModified: calcIsModified(formData, formDataOrig), validationItems: validationItems, showBackButton: showBackButton, hasNavigation: (hasNavigation && formMode !== FormModes.Create), canNext: canNext(), onNext: onNextCallback, canPrev: canPrev(), onPrev: onPrevCallback, showToolbar: !(showDcmtForm && formData?.iD1 && formData?.iD2), children: [_jsxs(_Fragment, { children: [_jsx(ScrollView, { direction: "vertical", useNative: true, height: formData && (formMode === FormModes.Create || formMode === FormModes.None) ? "calc(100% - 70px)" : "calc(100% - 35px)", children: _jsx("div", { style: { marginRight: "5px" }, children: _jsxs(TMLayoutContainer, { direction: 'vertical', gap: 2, children: [(formMode === FormModes.Create || formMode === FormModes.None) && _jsxs("div", { style: { width: '100%', height: '100%' }, children: [_jsx(RenderNameField, { fieldsReadOnly: fieldsReadOnly, setFormData: setFormData, formData: formData, formDataOrig: formDataOrig, validationItems: validationItems }), _jsx(RenderDescriptionField, { fieldsReadOnly: fieldsReadOnly, setFormData: setFormData, formData: formData, formDataOrig: formDataOrig, validationItems: validationItems }), _jsx(TaskAssigneeField, { formMode: formMode, formData: formData, formDataOrig: formDataOrig, taskContext: taskContext, validationItems: validationItems, fieldsReadOnly: fieldsReadOnly, usersList: usersList, onValueChanged: (newValue) => {
|
|
274
|
+
if (newValue === undefined)
|
|
275
|
+
return;
|
|
276
|
+
setFormData({ ...formData ?? {}, toID: newValue[0] });
|
|
277
|
+
} }), _jsx(RenderStartDateField, { fieldsReadOnly: fieldsReadOnly, formData: formData, formDataOrig: formDataOrig, validationItems: validationItems, setFormData: setFormData, onContentReady: handleStartTimeContentReady }), _jsx(RenderEndDateField, { fieldsReadOnly: fieldsReadOnly, formData: formData, formDataOrig: formDataOrig, validationItems: validationItems, setFormData: setFormData, onContentReady: handleEndTimeContentReady }), _jsx(RenderRemindDateField, { fieldsReadOnly: fieldsReadOnly, formData: formData, formDataOrig: formDataOrig, validationItems: validationItems, setFormData: setFormData }), _jsx(RenderPriorityField, { formData: formData, formDataOrig: formDataOrig, fieldsReadOnly: fieldsReadOnly, onPriorityValueChange: onPriorityValueChange }), _jsx(TaskFormContextualAttachments, { taskContext: taskContext })] }), (formMode === FormModes.Update || formMode === FormModes.Duplicate) && _jsxs("div", { style: { width: '100%', height: '100%' }, children: [_jsx(RenderNameField, { fieldsReadOnly: fieldsReadOnly, setFormData: setFormData, formData: formData, formDataOrig: formDataOrig, validationItems: validationItems }), _jsx(RenderDescriptionField, { fieldsReadOnly: fieldsReadOnly, setFormData: setFormData, formData: formData, formDataOrig: formDataOrig, validationItems: validationItems }), _jsx(TaskAssigneeField, { formMode: formMode, formData: formData, formDataOrig: formDataOrig, taskContext: taskContext, validationItems: validationItems, fieldsReadOnly: fieldsReadOnly, usersList: usersList, onValueChanged: (newValue) => {
|
|
432
278
|
if (newValue === undefined)
|
|
433
279
|
return;
|
|
434
280
|
setFormData({ ...formData ?? {}, toID: newValue[0] });
|
|
435
|
-
} }) })
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
281
|
+
} }), _jsx(RenderStartDateField, { fieldsReadOnly: fieldsReadOnly, formData: formData, formDataOrig: formDataOrig, validationItems: validationItems, setFormData: setFormData, onContentReady: handleStartTimeContentReady }), _jsx(RenderEndDateField, { fieldsReadOnly: fieldsReadOnly, formData: formData, formDataOrig: formDataOrig, validationItems: validationItems, setFormData: setFormData, onContentReady: handleEndTimeContentReady }), _jsx(RenderPriorityField, { formData: formData, formDataOrig: formDataOrig, fieldsReadOnly: fieldsReadOnly, onPriorityValueChange: onPriorityValueChange }), _jsx(RenderRemindDateField, { fieldsReadOnly: fieldsReadOnly, formData: formData, formDataOrig: formDataOrig, validationItems: validationItems, setFormData: setFormData }), _jsx(RenderTaskFormStateField, { formData: formData, formDataOrig: formDataOrig, handleShowChangeStateForm: handleShowChangeStateForm, onSavedCallback: onSaved }), _jsx(TaskFormResponseComment, { originalResponse: formDataOrig?.response, currentResponse: formData?.response, readonly: true }), _jsx(TaskPdgOriginNavigator, { formMode: formMode, formData: formDataOrig, isMobile: isMobile, gotoPDGExtendedLabelClickCallback: gotoPDGExtendedLabelClickCallback })] })] }) }) }), formData && (_jsx("div", { style: {
|
|
282
|
+
position: 'absolute',
|
|
283
|
+
bottom: 0,
|
|
284
|
+
left: 0,
|
|
285
|
+
right: 0,
|
|
286
|
+
padding: '8px 12px',
|
|
287
|
+
backgroundColor: '#fff',
|
|
288
|
+
borderTop: '1px solid #e6e6e6',
|
|
289
|
+
display: 'flex',
|
|
290
|
+
justifyContent: 'flex-end',
|
|
291
|
+
alignItems: 'center'
|
|
292
|
+
}, children: _jsx(TaskFormAssignmentNoticeBadge, { task: formData, users: users }) })), (showDcmtForm && formData?.iD1 && formData?.iD2) &&
|
|
293
|
+
_jsx(TMDcmtForm, { titleModal: formData.iD1Name ?? '-', isModal: true, TID: formData.iD1, DID: formData.iD2, allowButtonsRefs: true, moreInfoTasks: getMoreInfoTasksForDocument(allTasks, formData?.iD1, formData?.iD2), onWFOperationCompleted: refreshWorkflowApprove, onTaskCompleted: onTaskCompleted, onClose: () => { setShowDcmtForm(false); }, onOpenS4TViewerRequest: onOpenS4TViewerRequest, s4TViewerDialogComponent: s4TViewerDialogComponent, allTasks: allTasks, getAllTasks: getAllTasks, deleteTaskByIdsCallback: deleteTaskByIdsCallback, addTaskCallback: addTaskCallback, editTaskCallback: editTaskCallback, handleNavigateToWGs: handleNavigateToWGs, handleNavigateToDossiers: handleNavigateToDossiers, onReferenceClick: handleNavigateToReference })] }), formData && showChangeStateForm && _jsx(TMChangeStateForm, { formData: formData, formDataOrig: formDataOrig, handleShowChangeStateForm: handleShowChangeStateForm, setFormData: setFormData })] }) }));
|
|
441
294
|
};
|
|
442
295
|
export default TMTaskForm;
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
import React, { ChangeEvent } from "react";
|
|
2
|
+
import { PdGs, Task_States, TaskDescriptor, UserDescriptor, ValidationItem } from "@topconsultnpm/sdk-ts";
|
|
3
|
+
import { FormModes, TaskContext } from "../../../ts";
|
|
4
|
+
import { IFieldsEditability } from "./TMTasksUtils";
|
|
5
|
+
export declare const getCurrentUserTaskRole: (task?: TaskDescriptor) => TaskRole;
|
|
6
|
+
interface TaskFormAssignmentNoticeSectionProps {
|
|
7
|
+
task: TaskDescriptor;
|
|
8
|
+
users: Array<UserDescriptor>;
|
|
9
|
+
}
|
|
10
|
+
export declare const TaskFormAssignmentNoticeBadge: (props: TaskFormAssignmentNoticeSectionProps) => import("react/jsx-runtime").JSX.Element | null;
|
|
11
|
+
interface RenderContextBlockParams {
|
|
12
|
+
condition: boolean;
|
|
13
|
+
pdg: PdGs;
|
|
14
|
+
label: string | undefined;
|
|
15
|
+
}
|
|
16
|
+
export declare const RenderAttachmentBlock: ({ condition, pdg, label }: RenderContextBlockParams) => JSX.Element | null;
|
|
17
|
+
interface TaskFormContextualAttachmentsProps {
|
|
18
|
+
taskContext: TaskContext | undefined;
|
|
19
|
+
}
|
|
20
|
+
export declare const TaskFormContextualAttachments: ({ taskContext }: TaskFormContextualAttachmentsProps) => JSX.Element | null;
|
|
21
|
+
interface TaskPdgOriginNavigatorProps {
|
|
22
|
+
formMode: FormModes;
|
|
23
|
+
formData: TaskDescriptor | undefined;
|
|
24
|
+
isMobile: boolean;
|
|
25
|
+
gotoPDGExtendedLabelClickCallback: () => void;
|
|
26
|
+
}
|
|
27
|
+
export declare const TaskPdgOriginNavigator: (props: TaskPdgOriginNavigatorProps) => false | "" | import("react/jsx-runtime").JSX.Element | undefined;
|
|
28
|
+
interface TaskFormAssignedToProps {
|
|
29
|
+
formMode: FormModes;
|
|
30
|
+
formData: TaskDescriptor | undefined;
|
|
31
|
+
formDataOrig: TaskDescriptor | undefined;
|
|
32
|
+
taskContext: TaskContext | undefined;
|
|
33
|
+
validationItems: Array<ValidationItem>;
|
|
34
|
+
fieldsReadOnly: IFieldsEditability;
|
|
35
|
+
usersList?: Array<UserDescriptor>;
|
|
36
|
+
onValueChanged: (newValue: Array<number> | undefined) => void;
|
|
37
|
+
}
|
|
38
|
+
export declare const TaskAssigneeField: (props: TaskFormAssignedToProps) => import("react/jsx-runtime").JSX.Element;
|
|
39
|
+
interface TaskFormResponseCommentProps {
|
|
40
|
+
originalResponse?: string;
|
|
41
|
+
currentResponse?: string;
|
|
42
|
+
readonly?: boolean;
|
|
43
|
+
onAnswerChange?: (e: ChangeEvent<HTMLTextAreaElement>) => void;
|
|
44
|
+
}
|
|
45
|
+
export declare const TaskFormResponseComment: (props: TaskFormResponseCommentProps) => import("react/jsx-runtime").JSX.Element;
|
|
46
|
+
interface RenderFieldBaseProps {
|
|
47
|
+
fieldsReadOnly: IFieldsEditability;
|
|
48
|
+
formDataOrig?: TaskDescriptor;
|
|
49
|
+
formData?: TaskDescriptor;
|
|
50
|
+
}
|
|
51
|
+
interface RenderFieldProps extends RenderFieldBaseProps {
|
|
52
|
+
validationItems?: Array<ValidationItem>;
|
|
53
|
+
setFormData: React.Dispatch<React.SetStateAction<TaskDescriptor | undefined>>;
|
|
54
|
+
}
|
|
55
|
+
interface RenderPriorityFieldProps extends RenderFieldBaseProps {
|
|
56
|
+
onPriorityValueChange: (e: React.ChangeEvent<HTMLSelectElement>) => void;
|
|
57
|
+
}
|
|
58
|
+
interface RenderDateFieldProps extends RenderFieldProps {
|
|
59
|
+
onContentReady?: () => void;
|
|
60
|
+
}
|
|
61
|
+
export declare const RenderNameField: ({ validationItems, setFormData, formData, formDataOrig, fieldsReadOnly }: RenderFieldProps) => import("react/jsx-runtime").JSX.Element;
|
|
62
|
+
export declare const RenderDescriptionField: ({ validationItems, setFormData, formData, formDataOrig, fieldsReadOnly }: RenderFieldProps) => import("react/jsx-runtime").JSX.Element;
|
|
63
|
+
export declare const RenderPriorityField: ({ formData, formDataOrig, fieldsReadOnly, onPriorityValueChange }: RenderPriorityFieldProps) => import("react/jsx-runtime").JSX.Element;
|
|
64
|
+
export declare const RenderStartDateField: ({ validationItems, setFormData, formData, formDataOrig, fieldsReadOnly, onContentReady }: RenderDateFieldProps) => import("react/jsx-runtime").JSX.Element;
|
|
65
|
+
export declare const RenderEndDateField: ({ validationItems, setFormData, formData, formDataOrig, fieldsReadOnly, onContentReady }: RenderDateFieldProps) => import("react/jsx-runtime").JSX.Element;
|
|
66
|
+
export declare const RenderRemindDateField: ({ validationItems, setFormData, formData, formDataOrig, fieldsReadOnly }: RenderFieldProps) => import("react/jsx-runtime").JSX.Element;
|
|
67
|
+
interface RenderTaskFormStateFieldProps {
|
|
68
|
+
formDataOrig: TaskDescriptor | undefined;
|
|
69
|
+
formData: TaskDescriptor | undefined;
|
|
70
|
+
handleShowChangeStateForm: (value: boolean) => void;
|
|
71
|
+
onSavedCallback?: (task: TaskDescriptor) => void;
|
|
72
|
+
}
|
|
73
|
+
export declare const RenderTaskFormStateField: (props: RenderTaskFormStateFieldProps) => JSX.Element | null;
|
|
74
|
+
interface TMChangeStateFormProps {
|
|
75
|
+
formData: TaskDescriptor;
|
|
76
|
+
formDataOrig?: TaskDescriptor;
|
|
77
|
+
handleShowChangeStateForm: (value: boolean) => void;
|
|
78
|
+
setFormData: React.Dispatch<React.SetStateAction<TaskDescriptor | undefined>>;
|
|
79
|
+
}
|
|
80
|
+
export declare const TMChangeStateForm: (props: TMChangeStateFormProps) => import("react/jsx-runtime").JSX.Element;
|
|
81
|
+
type TaskRole = "personal" | "sender" | "receiver";
|
|
82
|
+
type StatusTransitionMap = {
|
|
83
|
+
[key in Task_States]?: Task_States[];
|
|
84
|
+
};
|
|
85
|
+
export declare const STATUS_TRANSITIONS: Record<TaskRole, StatusTransitionMap>;
|
|
86
|
+
export {};
|