df-ae-forms-package 1.1.7 → 1.1.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/dist/index.d.ts +12 -0
- package/dist/index.esm.js +33 -34
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +33 -34
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -423,6 +423,8 @@ interface DfFormPreviewProps {
|
|
|
423
423
|
};
|
|
424
424
|
onCreateIssue?: (issueData: any, attachments: File[]) => Promise<any>;
|
|
425
425
|
onUpdateIssue?: (issueId: string, updateData: any) => Promise<void>;
|
|
426
|
+
allowWorkflowActions?: boolean;
|
|
427
|
+
inEditMode?: boolean;
|
|
426
428
|
}
|
|
427
429
|
declare const DfFormPreview: React.FC<DfFormPreviewProps>;
|
|
428
430
|
|
|
@@ -451,6 +453,8 @@ interface DfFormInputProps {
|
|
|
451
453
|
firstName?: string;
|
|
452
454
|
lastName?: string;
|
|
453
455
|
};
|
|
456
|
+
allowWorkflowActions?: boolean;
|
|
457
|
+
inEditMode?: boolean;
|
|
454
458
|
}
|
|
455
459
|
declare const DfFormInput: React.FC<DfFormInputProps>;
|
|
456
460
|
|
|
@@ -710,6 +714,8 @@ interface DfFormSectionProps {
|
|
|
710
714
|
};
|
|
711
715
|
onCreateIssue?: (issueData: any, attachments: File[]) => Promise<any>;
|
|
712
716
|
onUpdateIssue?: (issueId: string, updateData: any) => Promise<void>;
|
|
717
|
+
allowWorkflowActions?: boolean;
|
|
718
|
+
inEditMode?: boolean;
|
|
713
719
|
}
|
|
714
720
|
declare const DfFormSection: React.FC<DfFormSectionProps>;
|
|
715
721
|
|
|
@@ -785,6 +791,8 @@ interface DfFormTableProps {
|
|
|
785
791
|
};
|
|
786
792
|
onCreateIssue?: (issueData: any, attachments: File[]) => Promise<any>;
|
|
787
793
|
onUpdateIssue?: (issueId: string, updateData: any) => Promise<void>;
|
|
794
|
+
allowWorkflowActions?: boolean;
|
|
795
|
+
inEditMode?: boolean;
|
|
788
796
|
}
|
|
789
797
|
declare const DfFormTable: React.FC<DfFormTableProps>;
|
|
790
798
|
|
|
@@ -810,6 +818,8 @@ interface IComponentActionFeaturesProps {
|
|
|
810
818
|
};
|
|
811
819
|
onCreateIssue?: (issueData: any, attachments: File[]) => Promise<any>;
|
|
812
820
|
onUpdateIssue?: (issueId: string, updateData: any) => Promise<void>;
|
|
821
|
+
allowWorkflowActions?: boolean;
|
|
822
|
+
inEditMode?: boolean;
|
|
813
823
|
}
|
|
814
824
|
declare const ComponentActionFeatures: React.FC<IComponentActionFeaturesProps>;
|
|
815
825
|
|
|
@@ -834,6 +844,8 @@ interface IThresholdAlertProps {
|
|
|
834
844
|
onIssueRaised?: (conditionId: string) => void;
|
|
835
845
|
isIssueRaised?: boolean;
|
|
836
846
|
compact?: boolean;
|
|
847
|
+
allowWorkflowActions?: boolean;
|
|
848
|
+
inEditMode?: boolean;
|
|
837
849
|
}
|
|
838
850
|
declare const ThresholdAlert: React.FC<IThresholdAlertProps>;
|
|
839
851
|
|
package/dist/index.esm.js
CHANGED
|
@@ -332,10 +332,7 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
332
332
|
'Maria Garcia',
|
|
333
333
|
'John Smith',
|
|
334
334
|
'Sarah Johnson'
|
|
335
|
-
], workOrderNumber: initialWorkOrderNumber, assetNumber: initialAssetNumber, isStandalone, inEditMode = false, isEdit }) => {
|
|
336
|
-
// Determine if workflow actions should be enabled
|
|
337
|
-
// If explicitly provided, use that. Otherwise, default to isEdit (true if editing, false/undefined otherwise).
|
|
338
|
-
// Fallback to false if neither is provided.
|
|
335
|
+
], workOrderNumber: initialWorkOrderNumber, assetNumber: initialAssetNumber, isStandalone, allowWorkflowActions, inEditMode = false, isEdit }) => {
|
|
339
336
|
const [title, setTitle] = useState('');
|
|
340
337
|
const [description, setDescription] = useState('');
|
|
341
338
|
const [workOrderNumber, setWorkOrderNumber] = useState('');
|
|
@@ -351,6 +348,11 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
351
348
|
const [isViewMode, setIsViewMode] = useState(!!issue && !inEditMode);
|
|
352
349
|
const fileInputRef = React.useRef(null);
|
|
353
350
|
const isEditMode = isEdit !== undefined ? isEdit : !!issue;
|
|
351
|
+
// Determine if workflow actions should be enabled
|
|
352
|
+
// If explicitly provided, use that. Otherwise, default to showing them if we have an existing issue.
|
|
353
|
+
const showWorkflowActions = allowWorkflowActions !== undefined
|
|
354
|
+
? allowWorkflowActions
|
|
355
|
+
: !!issue;
|
|
354
356
|
useEffect(() => {
|
|
355
357
|
if (isOpen) {
|
|
356
358
|
// In edit mode, prioritize issue attachments from API
|
|
@@ -689,12 +691,12 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
689
691
|
hour: '2-digit',
|
|
690
692
|
minute: '2-digit',
|
|
691
693
|
hour12: true
|
|
692
|
-
}) })] })] }), jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxs("label", { className: "raise-issue-field-label", children: ["Description ", jsx("span", { className: "raise-issue-required", children: "*" })] }), jsx("textarea", { className: `raise-issue-field-textarea ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: description, onChange: (e) => setDescription(e.target.value), placeholder: "Enter issue description", rows: 4, readOnly: isEditMode && isViewMode })] }), jsxs("div", { className: "raise-issue-field", children: [jsxs("label", { className: "raise-issue-field-label", children: ["Status ", jsx("span", { className: "raise-issue-required", children: "*" })] }), jsx("input", { type: "text", className: "raise-issue-field-input raise-issue-field-readonly", value: status, readOnly: true })] }), jsxs("div", { className: "raise-issue-field", children: [jsxs("label", { className: "raise-issue-field-label", children: ["Assign to ", jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxs("select", { className: "raise-issue-field-select", value: assignee, onChange: (e) => setAssignee(e.target.value), disabled: isEditMode && isViewMode, children: [jsx("option", { value: "", children: "Unassigned" }), availableUsers.map(userName => (jsx("option", { value: userName, children: userName }, userName)))] })] }), jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxs("label", { className: "raise-issue-field-label", children: ["Priority ", jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxs("div", { className: "raise-issue-priority-buttons", children: [jsx("button", { type: "button", className: `priority-button priority-low ${priority === 'Low' ? 'active' : ''}`, onClick: () => setPriority('Low'), disabled: isEditMode && isViewMode, children: "Low" }), jsx("button", { type: "button", className: `priority-button priority-medium ${priority === 'Medium' ? 'active' : ''}`, onClick: () => setPriority('Medium'), disabled: isEditMode && isViewMode, children: "Medium" }), jsx("button", { type: "button", className: `priority-button priority-high ${priority === 'High' ? 'active' : ''}`, onClick: () => setPriority('High'), disabled: isEditMode && isViewMode, children: "High" })] })] }), jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxs("label", { className: "raise-issue-field-label-with-icon", children: [jsx(MessageSquare, { size: 16 }), jsx("span", { children: "Comments" })] }), !comments && (jsx("div", { className: "raise-issue-no-comments", children: "No comments yet" })), jsx("textarea", { className: `raise-issue-field-textarea raise-issue-comments-textarea ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: comments, onChange: (e) => setComments(e.target.value), placeholder: "Add a comment...", rows: 4, readOnly: isEditMode })] }), jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", style: { marginTop: '1rem' }, children: [jsx("label", { className: "raise-issue-field-label", children: "Attachments" }), jsxs("div", { className: "raise-issue-attachments-container", children: [!isEditMode && (jsxs("div", { className: `raise-issue-dropzone ${isDragging ? 'dragging' : ''}`, onDragOver: handleDragOver, onDragLeave: handleDragLeave, onDrop: handleDrop, onClick: () => fileInputRef.current?.click(), children: [jsx("input", { type: "file", ref: fileInputRef, style: { display: 'none' }, onChange: handleFileChange, multiple: true }), jsx("div", { className: "raise-issue-dropzone-icon", children: jsx(UploadCloud, { size: 24 }) }), jsx("div", { className: "raise-issue-dropzone-text", children: "Click to upload or drag and drop" }), jsx("div", { className: "raise-issue-dropzone-hint", children: "PNG, JPG up to 10MB" })] })), localAttachments.length > 0 && (jsx("div", { className: "raise-issue-attachments-list", children: localAttachments.map((file, index) => (jsxs("div", { className: "raise-issue-attachment-item", children: [jsx("div", { className: "raise-issue-attachment-thumbnail", children: getAttachmentPreview(file) ? (jsx("img", { src: getAttachmentPreview(file), alt: "Thumbnail" })) : (jsx(Paperclip, { size: 20, color: "#9ca3af" })) }), jsxs("div", { className: "raise-issue-attachment-info", children: [jsx("span", { className: "attachment-name", title: getAttachmentName(file), children: getAttachmentName(file) }), file instanceof File && (jsxs("span", { className: "attachment-size", children: [(file.size / 1024).toFixed(1), " KB"] }))] }), !isEditMode && (jsx("button", { type: "button", className: "attachment-remove-btn", onClick: () => handleRemoveAttachment(index), title: "Remove", children: jsx(X$1, { size: 12 }) }))] }, index))) }))] })] })] }) }), jsx("div", { className: "raise-issue-modal-actions", children: jsxs("div", { className: "raise-issue-modal-actions-buttons", children: [
|
|
694
|
+
}) })] })] }), jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxs("label", { className: "raise-issue-field-label", children: ["Description ", jsx("span", { className: "raise-issue-required", children: "*" })] }), jsx("textarea", { className: `raise-issue-field-textarea ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: description, onChange: (e) => setDescription(e.target.value), placeholder: "Enter issue description", rows: 4, readOnly: isEditMode && isViewMode })] }), jsxs("div", { className: "raise-issue-field", children: [jsxs("label", { className: "raise-issue-field-label", children: ["Status ", jsx("span", { className: "raise-issue-required", children: "*" })] }), jsx("input", { type: "text", className: "raise-issue-field-input raise-issue-field-readonly", value: status, readOnly: true })] }), jsxs("div", { className: "raise-issue-field", children: [jsxs("label", { className: "raise-issue-field-label", children: ["Assign to ", jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxs("select", { className: "raise-issue-field-select", value: assignee, onChange: (e) => setAssignee(e.target.value), disabled: isEditMode && isViewMode, children: [jsx("option", { value: "", children: "Unassigned" }), availableUsers.map(userName => (jsx("option", { value: userName, children: userName }, userName)))] })] }), jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxs("label", { className: "raise-issue-field-label", children: ["Priority ", jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxs("div", { className: "raise-issue-priority-buttons", children: [jsx("button", { type: "button", className: `priority-button priority-low ${priority === 'Low' ? 'active' : ''}`, onClick: () => setPriority('Low'), disabled: isEditMode && isViewMode, children: "Low" }), jsx("button", { type: "button", className: `priority-button priority-medium ${priority === 'Medium' ? 'active' : ''}`, onClick: () => setPriority('Medium'), disabled: isEditMode && isViewMode, children: "Medium" }), jsx("button", { type: "button", className: `priority-button priority-high ${priority === 'High' ? 'active' : ''}`, onClick: () => setPriority('High'), disabled: isEditMode && isViewMode, children: "High" })] })] }), jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxs("label", { className: "raise-issue-field-label-with-icon", children: [jsx(MessageSquare, { size: 16 }), jsx("span", { children: "Comments" })] }), !comments && (jsx("div", { className: "raise-issue-no-comments", children: "No comments yet" })), jsx("textarea", { className: `raise-issue-field-textarea raise-issue-comments-textarea ${isEditMode ? 'raise-issue-field-readonly' : ''}`, value: comments, onChange: (e) => setComments(e.target.value), placeholder: "Add a comment...", rows: 4, readOnly: isEditMode })] }), jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", style: { marginTop: '1rem' }, children: [jsx("label", { className: "raise-issue-field-label", children: "Attachments" }), jsxs("div", { className: "raise-issue-attachments-container", children: [!isEditMode && (jsxs("div", { className: `raise-issue-dropzone ${isDragging ? 'dragging' : ''}`, onDragOver: handleDragOver, onDragLeave: handleDragLeave, onDrop: handleDrop, onClick: () => fileInputRef.current?.click(), children: [jsx("input", { type: "file", ref: fileInputRef, style: { display: 'none' }, onChange: handleFileChange, multiple: true }), jsx("div", { className: "raise-issue-dropzone-icon", children: jsx(UploadCloud, { size: 24 }) }), jsx("div", { className: "raise-issue-dropzone-text", children: "Click to upload or drag and drop" }), jsx("div", { className: "raise-issue-dropzone-hint", children: "PNG, JPG up to 10MB" })] })), localAttachments.length > 0 && (jsx("div", { className: "raise-issue-attachments-list", children: localAttachments.map((file, index) => (jsxs("div", { className: "raise-issue-attachment-item", children: [jsx("div", { className: "raise-issue-attachment-thumbnail", children: getAttachmentPreview(file) ? (jsx("img", { src: getAttachmentPreview(file), alt: "Thumbnail" })) : (jsx(Paperclip, { size: 20, color: "#9ca3af" })) }), jsxs("div", { className: "raise-issue-attachment-info", children: [jsx("span", { className: "attachment-name", title: getAttachmentName(file), children: getAttachmentName(file) }), file instanceof File && (jsxs("span", { className: "attachment-size", children: [(file.size / 1024).toFixed(1), " KB"] }))] }), !isEditMode && (jsx("button", { type: "button", className: "attachment-remove-btn", onClick: () => handleRemoveAttachment(index), title: "Remove", children: jsx(X$1, { size: 12 }) }))] }, index))) }))] })] })] }) }), jsx("div", { className: "raise-issue-modal-actions", children: jsxs("div", { className: "raise-issue-modal-actions-buttons", children: [(showWorkflowActions && issue) && (jsxs(Fragment, { children: [status === EIssueStatus.OPEN && (jsx("button", { className: "raise-issue-modal-button raise-issue-modal-button-accept", onClick: handleAccept, disabled: isSubmitting, children: isSubmitting ? 'Processing...' : 'Accept' })), status === EIssueStatus.IN_PROGRESS && (jsx("button", { className: "raise-issue-modal-button raise-issue-modal-button-resolve", onClick: handleResolve, disabled: isSubmitting, children: isSubmitting ? 'Processing...' : 'Resolve' })), (status === EIssueStatus.OPEN) && (jsx("button", { className: "raise-issue-modal-button raise-issue-modal-button-reject", onClick: handleReject, disabled: isSubmitting, children: isSubmitting ? 'Processing...' : 'Reject' }))] })), !isEditMode && (jsx("button", { className: `raise-issue-modal-button raise-issue-modal-button-save ${!isFormValid ? 'disabled' : ''}`, onClick: handleSubmit, disabled: isSubmitting || !isFormValid, children: isSubmitting ? 'Creating...' : 'Create Issue' }))] }) })] }) }));
|
|
693
695
|
// Render modal using portal to document body for full-page overlay
|
|
694
696
|
return createPortal(modalContent, document.body);
|
|
695
697
|
};
|
|
696
698
|
|
|
697
|
-
const ThresholdAlert = ({ component, condition, currentValue, thresholdValue, formTemplateId, workOrderNumber, assetNumber, user, onIssueRaised, isIssueRaised = false, compact = false }) => {
|
|
699
|
+
const ThresholdAlert = ({ component, condition, currentValue, thresholdValue, formTemplateId, workOrderNumber, assetNumber, user, onIssueRaised, isIssueRaised = false, compact = false, allowWorkflowActions, inEditMode }) => {
|
|
698
700
|
const [showRaiseIssueModal, setShowRaiseIssueModal] = useState(false);
|
|
699
701
|
const [issue, setIssue] = useState(null);
|
|
700
702
|
const [isLoadingIssue, setIsLoadingIssue] = useState(false);
|
|
@@ -786,16 +788,16 @@ const ThresholdAlert = ({ component, condition, currentValue, thresholdValue, fo
|
|
|
786
788
|
// If issue is raised (either from prop or local state), don't show anything
|
|
787
789
|
// The ComponentActionFeatures will handle showing the raised issue state
|
|
788
790
|
if (isIssueRaised || localIssueRaised) {
|
|
789
|
-
return (jsx(Fragment, { children: showRaiseIssueModal && (jsx(RaiseIssueModal, { isOpen: showRaiseIssueModal, onClose: handleRaiseIssueClose, onSuccess: handleRaiseIssueSuccess, component: component, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, notes: "", attachments: null, issue: issue })) }));
|
|
791
|
+
return (jsx(Fragment, { children: showRaiseIssueModal && (jsx(RaiseIssueModal, { isOpen: showRaiseIssueModal, onClose: handleRaiseIssueClose, onSuccess: handleRaiseIssueSuccess, component: component, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, notes: "", attachments: null, issue: issue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode })) }));
|
|
790
792
|
}
|
|
791
793
|
// Show compact version for small screens/tables
|
|
792
794
|
if (compact) {
|
|
793
|
-
return (jsxs(Fragment, { children: [jsxs("div", { className: "threshold-alert threshold-alert-unresolved threshold-alert-compact", children: [jsx("div", { className: "threshold-alert-border" }), jsxs("div", { className: "threshold-alert-content-compact", children: [jsx(AlertTriangle, { className: "threshold-alert-icon-compact", size: 14 }), jsx("span", { className: "threshold-alert-message-compact", children: getCompactMessage() }), jsx("button", { type: "button", onClick: handleRaiseIssueClick, className: "threshold-alert-raise-issue-btn-compact", title: "Raise Issue", children: "Raise Issue" })] })] }), showRaiseIssueModal && (jsx(RaiseIssueModal, { isOpen: showRaiseIssueModal, onClose: handleRaiseIssueClose, onSuccess: handleRaiseIssueSuccess, component: component, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, notes: "", attachments: null, issue: issue }))] }));
|
|
795
|
+
return (jsxs(Fragment, { children: [jsxs("div", { className: "threshold-alert threshold-alert-unresolved threshold-alert-compact", children: [jsx("div", { className: "threshold-alert-border" }), jsxs("div", { className: "threshold-alert-content-compact", children: [jsx(AlertTriangle, { className: "threshold-alert-icon-compact", size: 14 }), jsx("span", { className: "threshold-alert-message-compact", children: getCompactMessage() }), jsx("button", { type: "button", onClick: handleRaiseIssueClick, className: "threshold-alert-raise-issue-btn-compact", title: "Raise Issue", children: "Raise Issue" })] })] }), showRaiseIssueModal && (jsx(RaiseIssueModal, { isOpen: showRaiseIssueModal, onClose: handleRaiseIssueClose, onSuccess: handleRaiseIssueSuccess, component: component, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, notes: "", attachments: null, issue: issue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode }))] }));
|
|
794
796
|
}
|
|
795
|
-
return (jsxs(Fragment, { children: [jsxs("div", { className: "threshold-alert threshold-alert-unresolved", children: [jsx("div", { className: "threshold-alert-border" }), jsxs("div", { className: "threshold-alert-content", children: [jsx("div", { className: "threshold-alert-header", children: jsxs("div", { className: "threshold-alert-title-group", children: [jsx(AlertTriangle, { className: "threshold-alert-icon", size: 20 }), jsx("span", { className: "threshold-alert-title", children: "Threshold Condition Met - Action Required" })] }) }), jsxs("div", { className: "threshold-alert-message", children: [getConditionMessage(), jsx("span", { className: "threshold-alert-warning", children: " You must raise an issue before submitting the form." })] }), jsx("div", { className: "threshold-alert-buttons", children: jsx("button", { type: "button", onClick: handleRaiseIssueClick, className: "threshold-alert-raise-issue-btn", children: "Raise Issue Now" }) })] })] }), showRaiseIssueModal && (jsx(RaiseIssueModal, { isOpen: showRaiseIssueModal, onClose: handleRaiseIssueClose, onSuccess: handleRaiseIssueSuccess, component: component, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, notes: "", attachments: null, issue: issue }))] }));
|
|
797
|
+
return (jsxs(Fragment, { children: [jsxs("div", { className: "threshold-alert threshold-alert-unresolved", children: [jsx("div", { className: "threshold-alert-border" }), jsxs("div", { className: "threshold-alert-content", children: [jsx("div", { className: "threshold-alert-header", children: jsxs("div", { className: "threshold-alert-title-group", children: [jsx(AlertTriangle, { className: "threshold-alert-icon", size: 20 }), jsx("span", { className: "threshold-alert-title", children: "Threshold Condition Met - Action Required" })] }) }), jsxs("div", { className: "threshold-alert-message", children: [getConditionMessage(), jsx("span", { className: "threshold-alert-warning", children: " You must raise an issue before submitting the form." })] }), jsx("div", { className: "threshold-alert-buttons", children: jsx("button", { type: "button", onClick: handleRaiseIssueClick, className: "threshold-alert-raise-issue-btn", children: "Raise Issue Now" }) })] })] }), showRaiseIssueModal && (jsx(RaiseIssueModal, { isOpen: showRaiseIssueModal, onClose: handleRaiseIssueClose, onSuccess: handleRaiseIssueSuccess, component: component, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, notes: "", attachments: null, issue: issue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode }))] }));
|
|
796
798
|
};
|
|
797
799
|
|
|
798
|
-
const DfFormInput = ({ id, properties, validationErrors = {}, formValue = '', inputType = 'text', readonly = false, disabled = false, touchedFields = {}, formSubmitted = false, mode = 'test', onValueChange, onBlur, onFocus, className = '', hideLabel = false, formTemplateId, onThresholdIssueRaised, raisedThresholdIssues = new Set(), workOrderNumber, assetNumber, user }) => {
|
|
800
|
+
const DfFormInput = ({ id, properties, validationErrors = {}, formValue = '', inputType = 'text', readonly = false, disabled = false, touchedFields = {}, formSubmitted = false, mode = 'test', onValueChange, onBlur, onFocus, className = '', hideLabel = false, formTemplateId, onThresholdIssueRaised, raisedThresholdIssues = new Set(), workOrderNumber, assetNumber, user, allowWorkflowActions, inEditMode }) => {
|
|
799
801
|
// Ensure formValue is always a string to prevent [object Object] errors
|
|
800
802
|
const getStringValue = (val) => {
|
|
801
803
|
if (val === null || val === undefined)
|
|
@@ -1159,7 +1161,7 @@ const DfFormInput = ({ id, properties, validationErrors = {}, formValue = '', in
|
|
|
1159
1161
|
inputWrapperRef.current?.closest('.datagrid-list-view') !== null ||
|
|
1160
1162
|
className.includes('table-cell') ||
|
|
1161
1163
|
className.includes('cell-content');
|
|
1162
|
-
return (jsx(ThresholdAlert, { component: properties, condition: activeThresholdCondition, currentValue: value, thresholdValue: activeThresholdCondition.value, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onDismiss: () => handleDismissAlert(activeThresholdCondition.id), onIssueRaised: onThresholdIssueRaised, isIssueRaised: issueRaised, compact: isInTable }, `${activeThresholdCondition.id}-${issueRaised}`));
|
|
1164
|
+
return (jsx(ThresholdAlert, { component: properties, condition: activeThresholdCondition, currentValue: value, thresholdValue: activeThresholdCondition.value, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onDismiss: () => handleDismissAlert(activeThresholdCondition.id), onIssueRaised: onThresholdIssueRaised, isIssueRaised: issueRaised, compact: isInTable, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode }, `${activeThresholdCondition.id}-${issueRaised}`));
|
|
1163
1165
|
})()] }));
|
|
1164
1166
|
};
|
|
1165
1167
|
|
|
@@ -3746,7 +3748,7 @@ const AttachmentThumbnails = ({ attachments, onRemove }) => {
|
|
|
3746
3748
|
return (jsx("div", { className: "attachment-thumbnail", children: isImage && objectUrl ? (jsxs(Fragment, { children: [jsx("img", { src: objectUrl, alt: file ? file.name : 'Attachment' }), jsx("button", { type: "button", className: "thumbnail-remove-btn", onClick: () => onRemove(index), title: "Remove attachment", children: jsx(X$1, { size: 14 }) })] })) : (jsxs(Fragment, { children: [jsx("div", { className: "file-icon-placeholder", children: jsx(Paperclip, { size: 20 }) }), jsx("span", { className: "file-name", children: file ? file.name : 'Unknown File' }), jsx("button", { type: "button", className: "thumbnail-remove-btn", onClick: () => onRemove(index), title: "Remove attachment", children: jsx(X$1, { size: 14 }) })] })) }, index));
|
|
3747
3749
|
}) }));
|
|
3748
3750
|
};
|
|
3749
|
-
const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, formData, onNotesChange, onAttachmentChange, notes = '', attachments = null, onThresholdActionCompletion, onThresholdIssueRaised, onBasicPropertyActionCompletion, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
|
|
3751
|
+
const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, formData, onNotesChange, onAttachmentChange, notes = '', attachments = null, onThresholdActionCompletion, onThresholdIssueRaised, onBasicPropertyActionCompletion, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue, allowWorkflowActions, inEditMode }) => {
|
|
3750
3752
|
// Determine effective form value (prefer prop, fallback to formData lookup)
|
|
3751
3753
|
const effectiveFormValue = formValue !== undefined ? formValue : (formData ? formData[component.id] : undefined);
|
|
3752
3754
|
// Use effectiveFormValue for logic instead of raw formValue
|
|
@@ -4024,10 +4026,8 @@ const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, f
|
|
|
4024
4026
|
}, 3000);
|
|
4025
4027
|
}, [getActiveThresholdConditions, onThresholdActionCompletion, component, onBasicPropertyActionCompletion]);
|
|
4026
4028
|
const handleRaiseIssueClick = useCallback(() => {
|
|
4027
|
-
if (issueRaised)
|
|
4028
|
-
return;
|
|
4029
4029
|
setShowRaiseIssueModal(true);
|
|
4030
|
-
}, [
|
|
4030
|
+
}, []);
|
|
4031
4031
|
const handleRaiseIssueClose = useCallback(() => {
|
|
4032
4032
|
setShowRaiseIssueModal(false);
|
|
4033
4033
|
}, []);
|
|
@@ -4234,7 +4234,7 @@ const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, f
|
|
|
4234
4234
|
modalComponent.basic.value = selectedOption.value || effectiveValue;
|
|
4235
4235
|
}
|
|
4236
4236
|
return modalComponent;
|
|
4237
|
-
})(), formTemplateId: formTemplateId || '', notes: localNotes, attachments: localAttachments, isStandalone: isStandalone, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue }))] }));
|
|
4237
|
+
})(), formTemplateId: formTemplateId || '', notes: localNotes, attachments: localAttachments, isStandalone: isStandalone, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode }))] }));
|
|
4238
4238
|
};
|
|
4239
4239
|
|
|
4240
4240
|
// Attachment Thumbnails Component for Submission View
|
|
@@ -4300,7 +4300,7 @@ function ensureStringId$2(id) {
|
|
|
4300
4300
|
}
|
|
4301
4301
|
return String(id);
|
|
4302
4302
|
}
|
|
4303
|
-
const DraggableGridComponent = ({ component, selectedComponent, mode, onComponentSelect, onComponentDelete, onComponentEdit, renderFormComponent, isOverlay = false, formData = {}, formTemplateId,
|
|
4303
|
+
const DraggableGridComponent = ({ component, selectedComponent, mode, onComponentSelect, onComponentDelete, onComponentEdit, renderFormComponent, isOverlay = false, formData = {}, formTemplateId, onThresholdIssueRaised, onNotesChange, onAttachmentChange, shouldShowComponent }) => {
|
|
4304
4304
|
const formValue = formData[component.id];
|
|
4305
4305
|
const isVisible = shouldShowComponent ? shouldShowComponent(component.id) : true;
|
|
4306
4306
|
// Check if component has notes or attachments for submission view
|
|
@@ -4471,8 +4471,7 @@ const GridDropZone = ({ gridComponents, mode, onComponentSelect, onComponentDele
|
|
|
4471
4471
|
}, children: isOver ? (jsx("span", { style: { color: '#3b82f6', fontWeight: '500' }, children: "Drop component here to add to grid" })) : (jsx("span", { children: "+ Drop more components here" })) })] })) }));
|
|
4472
4472
|
};
|
|
4473
4473
|
// Sub-component for displaying entries (TableView)
|
|
4474
|
-
const TableView = ({ templateComponents, dataEntries, renderFormComponent, mode, allowAddRemoveEntries, addAnotherText, removeText, maxEntries, minEntries, displayAsGrid = true, onAddEntry, onRemoveEntry, formData,
|
|
4475
|
-
formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, columnView, shouldShowComponent }) => {
|
|
4474
|
+
const TableView = ({ templateComponents, dataEntries, renderFormComponent, mode, allowAddRemoveEntries, addAnotherText, removeText, maxEntries, minEntries, displayAsGrid = true, onAddEntry, onRemoveEntry, formData, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, columnView, shouldShowComponent, allowWorkflowActions, inEditMode }) => {
|
|
4476
4475
|
const _formData = formData || {};
|
|
4477
4476
|
const visibleTemplateComponents = React.useMemo(() => {
|
|
4478
4477
|
if (!shouldShowComponent)
|
|
@@ -5139,7 +5138,7 @@ const DfFormDataGrid = ({ id, properties, mode = 'edit', formData = {}, onValueC
|
|
|
5139
5138
|
templateComponents: gridComponents, dataEntries: dataEntries, renderFormComponent: renderFormComponent || renderComponent, mode: mode, allowAddRemoveEntries: properties.datagrid?.allowAddRemoveEntries ?? true, addAnotherText: properties.datagrid?.addAnotherText ?? 'Add Entry', removeText: properties.datagrid?.removeText ?? 'Remove', maxEntries: properties.datagrid?.maxEntries ?? 10, minEntries: properties.datagrid?.minEntries ?? 1, displayAsGrid: properties.datagrid?.displayAsGrid ?? true, onAddEntry: handleAddEntry, onRemoveEntry: handleRemoveEntry, formData: formData, formTemplateId: formTemplateId, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, onNotesChange: onNotesChange, onAttachmentChange: onAttachmentChange, columnView: properties.datagrid?.columnView, shouldShowComponent: shouldShowComponent })) }))] }));
|
|
5140
5139
|
};
|
|
5141
5140
|
|
|
5142
|
-
const DraggableChild = ({ child, selectedChild, mode, onChildSelect, onChildDelete, renderFormComponent, isOverlay = false, isChildrenEditMode = false, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue }) => {
|
|
5141
|
+
const DraggableChild = ({ child, selectedChild, mode, onChildSelect, onChildDelete, renderFormComponent, isOverlay = false, isChildrenEditMode = false, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue, allowWorkflowActions, inEditMode }) => {
|
|
5143
5142
|
const formValue = formData[child.id];
|
|
5144
5143
|
// Check if component has notes or attachments for submission view
|
|
5145
5144
|
const hasSubmissionData = mode === 'preview' && ((child.basic?.notes && child.basic.notes.trim().length > 0) ||
|
|
@@ -5157,9 +5156,9 @@ const DraggableChild = ({ child, selectedChild, mode, onChildSelect, onChildDele
|
|
|
5157
5156
|
return (jsxs("div", { ref: setNodeRef, style: style, className: `form-component section-child ${selectedChild?.id === child.id ? 'selected' : ''} ${isDragging ? 'dragging' : ''} ${isSorting ? 'sorting' : ''} ${isChildrenEditMode ? 'children-edit-active' : ''}`, onClick: () => !isDragging && onChildSelect(child), role: "button", tabIndex: 0, children: [(mode === 'edit' || isChildrenEditMode) && (jsx("div", { className: "child-drag-handle", ...listeners, ...attributes, onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: jsx(GripVertical, { size: 14 }) })), jsxs("div", { className: "form-component-content section-child-content", children: [(mode === 'edit' || isChildrenEditMode) && (jsxs("div", { className: "component-actions child-actions", children: [jsx("button", { className: "btn edit-btn", onClick: (e) => {
|
|
5158
5157
|
e.stopPropagation();
|
|
5159
5158
|
onChildSelect(child);
|
|
5160
|
-
}, onMouseDown: (e) => e.stopPropagation(), title: "Edit properties", children: jsx(Edit, { size: 12 }) }), jsx("button", { className: "btn delete-btn", onClick: (e) => onChildDelete(child, e), onMouseDown: (e) => e.stopPropagation(), title: "Delete component", children: jsx(Trash2, { size: 12 }) })] })), jsxs("div", { className: "component-preview child-preview", children: [renderFormComponent(child), !['section', 'table', 'heading', 'file', 'instructions', 'signature', 'location', 'datagrid'].includes(child.name) && (jsx(ComponentActionFeatures, { component: child, mode: "test", formTemplateId: formTemplateId, formValue: formValue, formData: formData, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, onNotesChange: onNotesChange ? (notes) => onNotesChange(child.id, notes) : undefined, onAttachmentChange: onAttachmentChange ? (attachments) => onAttachmentChange(child.id, attachments) : undefined, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue })), hasSubmissionData && (jsx(ComponentSubmissionActions, { component: child }))] })] })] }));
|
|
5159
|
+
}, onMouseDown: (e) => e.stopPropagation(), title: "Edit properties", children: jsx(Edit, { size: 12 }) }), jsx("button", { className: "btn delete-btn", onClick: (e) => onChildDelete(child, e), onMouseDown: (e) => e.stopPropagation(), title: "Delete component", children: jsx(Trash2, { size: 12 }) })] })), jsxs("div", { className: "component-preview child-preview", children: [renderFormComponent(child), !['section', 'table', 'heading', 'file', 'instructions', 'signature', 'location', 'datagrid'].includes(child.name) && (jsx(ComponentActionFeatures, { component: child, mode: "test", formTemplateId: formTemplateId, formValue: formValue, formData: formData, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, onNotesChange: onNotesChange ? (notes) => onNotesChange(child.id, notes) : undefined, onAttachmentChange: onAttachmentChange ? (attachments) => onAttachmentChange(child.id, attachments) : undefined, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode })), hasSubmissionData && (jsx(ComponentSubmissionActions, { component: child }))] })] })] }));
|
|
5161
5160
|
};
|
|
5162
|
-
const DfFormSection = ({ id, properties, mode = 'edit', formData = {}, onValueChange, onSelect, isSelected = false, className = '', onSectionSelect, onChildSelect, onChildDelete, selectedChild, renderFormComponent, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue }) => {
|
|
5161
|
+
const DfFormSection = ({ id, properties, mode = 'edit', formData = {}, onValueChange, onSelect, isSelected = false, className = '', onSectionSelect, onChildSelect, onChildDelete, selectedChild, renderFormComponent, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue, allowWorkflowActions, inEditMode }) => {
|
|
5163
5162
|
const [isCollapsed, setIsCollapsed] = useState(properties.basic.collapsed);
|
|
5164
5163
|
const [isEditingTitle, setIsEditingTitle] = useState(false);
|
|
5165
5164
|
const [isEditingDescription, setIsEditingDescription] = useState(false);
|
|
@@ -5372,7 +5371,7 @@ const DfFormSection = ({ id, properties, mode = 'edit', formData = {}, onValueCh
|
|
|
5372
5371
|
}, children: isOver ? 'Drop components here' : 'Empty Section' }), jsx("div", { style: {
|
|
5373
5372
|
fontSize: '12px',
|
|
5374
5373
|
color: '#9ca3af'
|
|
5375
|
-
}, children: "Drag and drop components here to create your section" })] })) : (children.map((child) => (jsx(DraggableChild, { child: child, selectedChild: selectedChild || null, mode: mode, onChildSelect: handleChildSelect, onChildDelete: handleChildDelete, renderFormComponent: renderComponent, isChildrenEditMode: isChildrenEditMode, formData: formData, formTemplateId: formTemplateId, onNotesChange: onNotesChange, onAttachmentChange: onAttachmentChange, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue }, child.id)))) }) }))] }));
|
|
5374
|
+
}, children: "Drag and drop components here to create your section" })] })) : (children.map((child) => (jsx(DraggableChild, { child: child, selectedChild: selectedChild || null, mode: mode, onChildSelect: handleChildSelect, onChildDelete: handleChildDelete, renderFormComponent: renderComponent, isChildrenEditMode: isChildrenEditMode, formData: formData, formTemplateId: formTemplateId, onNotesChange: onNotesChange, onAttachmentChange: onAttachmentChange, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode }, child.id)))) }) }))] }));
|
|
5376
5375
|
};
|
|
5377
5376
|
|
|
5378
5377
|
// Dynamic imports to avoid circular dependencies
|
|
@@ -5422,7 +5421,7 @@ const normalizeTableRow = (row) => {
|
|
|
5422
5421
|
};
|
|
5423
5422
|
const DfFormPreview = ({ formComponents = [], currentDevice = 'desktop', isPreviewMode = false, initialFormData = [], onSubmit, onFormDataChange, formTitle, formDescription, formTemplateId,
|
|
5424
5423
|
// Add component management props for edit mode
|
|
5425
|
-
onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, selectedComponent, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
|
|
5424
|
+
onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, selectedComponent, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue, allowWorkflowActions, inEditMode }) => {
|
|
5426
5425
|
// Local copy of formComponents so structure updates (e.g. table cell init) are reflected immediately
|
|
5427
5426
|
const [localFormComponents, setLocalFormComponents] = useState(formComponents);
|
|
5428
5427
|
// Sync local state when the prop changes from the parent
|
|
@@ -6777,7 +6776,7 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
|
|
|
6777
6776
|
case 'email-input':
|
|
6778
6777
|
// Regular text/email/number input
|
|
6779
6778
|
return (jsx(DfFormInput, { ...commonProps, properties: component, inputType: component.name === 'text-input' ? 'text' :
|
|
6780
|
-
component.name === 'number-input' ? 'number' : 'email', formTemplateId: formTemplateId, onThresholdIssueRaised: handleThresholdIssueRaised, raisedThresholdIssues: raisedThresholdIssues, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user }));
|
|
6779
|
+
component.name === 'number-input' ? 'number' : 'email', formTemplateId: formTemplateId, onThresholdIssueRaised: handleThresholdIssueRaised, raisedThresholdIssues: raisedThresholdIssues, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode }));
|
|
6781
6780
|
case 'textarea':
|
|
6782
6781
|
return jsx(DfFormTextarea, { ...commonProps, properties: component });
|
|
6783
6782
|
case 'select':
|
|
@@ -6843,13 +6842,13 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
|
|
|
6843
6842
|
case 'location':
|
|
6844
6843
|
return jsx(DfFormLocation, { ...commonProps, properties: component });
|
|
6845
6844
|
case 'section':
|
|
6846
|
-
return (jsx(DfFormSection, { ...commonProps, properties: component, formData: formValues, formTemplateId: formTemplateId, onThresholdActionCompletion: handleThresholdActionCompletion, onThresholdIssueRaised: handleThresholdIssueRaised, onNotesChange: handleComponentNotesChange, onAttachmentChange: handleComponentAttachmentChange, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, renderFormComponent: (field) => {
|
|
6845
|
+
return (jsx(DfFormSection, { ...commonProps, properties: component, formData: formValues, formTemplateId: formTemplateId, onThresholdActionCompletion: handleThresholdActionCompletion, onThresholdIssueRaised: handleThresholdIssueRaised, onNotesChange: handleComponentNotesChange, onAttachmentChange: handleComponentAttachmentChange, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode, renderFormComponent: (field) => {
|
|
6847
6846
|
// Ensure the nested component gets the proper form value
|
|
6848
6847
|
// const fieldValue = formValues[field.id] || (field.basic as any)?.value || (field.basic as any)?.defaultValue || ''
|
|
6849
6848
|
return renderFormComponent(field);
|
|
6850
6849
|
} }));
|
|
6851
6850
|
case 'table':
|
|
6852
|
-
return (jsx(React.Suspense, { fallback: jsx("div", { children: "Loading table..." }), children: jsx(DfFormTable$1, { ...commonProps, properties: component, formData: formValues, formTemplateId: formTemplateId, mode: commonProps.mode, validationErrors: validationErrors, touchedFields: touchedFields, formSubmitted: formSubmitted, onThresholdActionCompletion: handleThresholdActionCompletion, onThresholdIssueRaised: handleThresholdIssueRaised, workOrderNumber: workOrderNumber, assetNumber: assetNumber, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, renderFormComponent: (field) => {
|
|
6851
|
+
return (jsx(React.Suspense, { fallback: jsx("div", { children: "Loading table..." }), children: jsx(DfFormTable$1, { ...commonProps, properties: component, formData: formValues, formTemplateId: formTemplateId, mode: commonProps.mode, validationErrors: validationErrors, touchedFields: touchedFields, formSubmitted: formSubmitted, onThresholdActionCompletion: handleThresholdActionCompletion, onThresholdIssueRaised: handleThresholdIssueRaised, workOrderNumber: workOrderNumber, assetNumber: assetNumber, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode, renderFormComponent: (field) => {
|
|
6853
6852
|
return renderFormComponent(field);
|
|
6854
6853
|
}, onNotesChange: (componentId, notes) => {
|
|
6855
6854
|
// Handle notes change for table cell components
|
|
@@ -7187,7 +7186,7 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
|
|
|
7187
7186
|
return comp;
|
|
7188
7187
|
});
|
|
7189
7188
|
onFormDataChange?.(updatedComponents);
|
|
7190
|
-
}, notes: componentNotes[component.id] !== undefined ? componentNotes[component.id] : (component.basic?.notes || ''), attachments: componentAttachments[component.id] !== undefined ? componentAttachments[component.id] : (component.basic?.attachments || null), workOrderNumber: workOrderNumber, assetNumber: assetNumber, isStandalone: isStandalone, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue })), isPreviewMode && hasSubmissionData && (jsx(ComponentSubmissionActions, { component: component }))] }, component.id));
|
|
7189
|
+
}, notes: componentNotes[component.id] !== undefined ? componentNotes[component.id] : (component.basic?.notes || ''), attachments: componentAttachments[component.id] !== undefined ? componentAttachments[component.id] : (component.basic?.attachments || null), workOrderNumber: workOrderNumber, assetNumber: assetNumber, isStandalone: isStandalone, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode })), isPreviewMode && hasSubmissionData && (jsx(ComponentSubmissionActions, { component: component }))] }, component.id));
|
|
7191
7190
|
}), !isPreviewMode && (jsxs("div", { className: "form-actions", children: [!formSubmitted && (jsx("button", { type: "button", onClick: () => handleSubmit('Saved'), className: "form-save-button", disabled: formSubmitted && !isFormValid(), children: "Save" })), jsx("button", { type: "button", disabled: !isFormValid() || !thresholdValidationState.isValid, className: "form-submit-button", title: !thresholdValidationState.isValid ? thresholdValidationState.errorMessage : '', onClick: () => handleSubmit('Submitted'), children: "Submit" })] }))] }))] }) }) }));
|
|
7192
7191
|
};
|
|
7193
7192
|
|
|
@@ -7282,12 +7281,12 @@ const ensureComponentHasId = (component) => {
|
|
|
7282
7281
|
}
|
|
7283
7282
|
return component;
|
|
7284
7283
|
};
|
|
7285
|
-
const SimpleTableComponent = ({ component, mode, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue }) => {
|
|
7284
|
+
const SimpleTableComponent = ({ component, mode, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue, allowWorkflowActions, inEditMode }) => {
|
|
7286
7285
|
const formValue = formData[component.id];
|
|
7287
7286
|
// Check if component has notes or attachments for submission view
|
|
7288
7287
|
const hasSubmissionData = mode === 'preview' && ((component.basic?.notes && component.basic.notes.trim().length > 0) ||
|
|
7289
7288
|
(component.basic?.attachments && Array.isArray(component.basic.attachments) && component.basic.attachments.length > 0));
|
|
7290
|
-
return (jsxs("div", { className: "simple-table-component", children: [renderFormComponent(component), !['section', 'table', 'heading', 'file', 'instructions', 'signature', 'location', 'datagrid'].includes(component.name) && (jsx(ComponentActionFeatures, { component: component, mode: "test", formTemplateId: formTemplateId, formValue: formValue, formData: formData, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, onNotesChange: onNotesChange ? (notes) => onNotesChange(component.id, notes) : undefined, onAttachmentChange: onAttachmentChange ? (attachments) => onAttachmentChange(component.id, attachments) : undefined, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue })), hasSubmissionData && (jsx(ComponentSubmissionActions, { component: component }))] }));
|
|
7289
|
+
return (jsxs("div", { className: "simple-table-component", children: [renderFormComponent(component), !['section', 'table', 'heading', 'file', 'instructions', 'signature', 'location', 'datagrid'].includes(component.name) && (jsx(ComponentActionFeatures, { component: component, mode: "test", formTemplateId: formTemplateId, formValue: formValue, formData: formData, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, onNotesChange: onNotesChange ? (notes) => onNotesChange(component.id, notes) : undefined, onAttachmentChange: onAttachmentChange ? (attachments) => onAttachmentChange(component.id, attachments) : undefined, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode })), hasSubmissionData && (jsx(ComponentSubmissionActions, { component: component }))] }));
|
|
7291
7290
|
};
|
|
7292
7291
|
const DraggableTableComponent = ({ component, selectedComponent, mode, onComponentSelect, onComponentDelete, onComponentEdit, renderFormComponent, isOverlay = false, }) => {
|
|
7293
7292
|
const { attributes, listeners, setNodeRef, transform, transition, isDragging, isSorting, } = useSortable({
|
|
@@ -7308,7 +7307,7 @@ const DraggableTableComponent = ({ component, selectedComponent, mode, onCompone
|
|
|
7308
7307
|
onComponentDelete(component, e);
|
|
7309
7308
|
}, type: "button", title: "Delete Component", children: jsx(Trash2, { size: 12 }) })] }))] }));
|
|
7310
7309
|
};
|
|
7311
|
-
const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete, onComponentEdit, selectedComponent, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, tableId, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue }) => {
|
|
7310
|
+
const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete, onComponentEdit, selectedComponent, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, tableId, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue, allowWorkflowActions, inEditMode }) => {
|
|
7312
7311
|
const dropZoneId = `table-cell-${tableId}-${cell.row}-${cell.column}`;
|
|
7313
7312
|
const { setNodeRef, isOver } = useDroppable({
|
|
7314
7313
|
id: dropZoneId,
|
|
@@ -7343,7 +7342,7 @@ const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete,
|
|
|
7343
7342
|
cell.components.map((component) => {
|
|
7344
7343
|
// Only ensure ID if it's truly missing - don't regenerate existing IDs
|
|
7345
7344
|
const componentWithId = component.id ? component : ensureComponentHasId(component);
|
|
7346
|
-
return (jsx(SimpleTableComponent, { component: componentWithId, mode: mode, renderFormComponent: renderFormComponent, formData: formData, formTemplateId: formTemplateId, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, onNotesChange: onNotesChange, onAttachmentChange: onAttachmentChange, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue }, componentWithId.id));
|
|
7345
|
+
return (jsx(SimpleTableComponent, { component: componentWithId, mode: mode, renderFormComponent: renderFormComponent, formData: formData, formTemplateId: formTemplateId, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, onNotesChange: onNotesChange, onAttachmentChange: onAttachmentChange, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode }, componentWithId.id));
|
|
7347
7346
|
}))) : (
|
|
7348
7347
|
// Only show drop zone content in edit mode
|
|
7349
7348
|
mode === 'edit' ? (jsx("div", { className: "empty-cell-placeholder", children: jsxs("div", { className: "cell-info", children: [jsx("span", { className: "drop-zone-text", children: "Drag and Drop a form component" }), jsxs("span", { className: "cell-coordinates", children: ["Cell (", cell.row + 1, ", ", cell.column + 1, ")"] })] }) })) : (
|
|
@@ -7354,7 +7353,7 @@ const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete,
|
|
|
7354
7353
|
visibility: 'hidden' // Hide content but maintain space
|
|
7355
7354
|
}, children: "\u00A0" }))) }) }));
|
|
7356
7355
|
};
|
|
7357
|
-
const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationErrors = {}, touchedFields = {}, formSubmitted = false, onValueChange, onSelect, isSelected = false, className = '', onTableSelect, onComponentSelect, onComponentDelete, onComponentEdit, selectedComponent, renderFormComponent, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue }) => {
|
|
7356
|
+
const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationErrors = {}, touchedFields = {}, formSubmitted = false, onValueChange, onSelect, isSelected = false, className = '', onTableSelect, onComponentSelect, onComponentDelete, onComponentEdit, selectedComponent, renderFormComponent, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue, allowWorkflowActions, inEditMode }) => {
|
|
7358
7357
|
const [isCollapsed, setIsCollapsed] = useState(false); // Always start expanded to show drop zones
|
|
7359
7358
|
// CRITICAL: Normalize cells from API format (object with numeric keys) to proper 2D array
|
|
7360
7359
|
// The API may return cells as [{"0": {cell}, "1": {cell}}, ...] instead of [[cell, cell], ...]
|
|
@@ -7592,7 +7591,7 @@ const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationE
|
|
|
7592
7591
|
fontSize: '14px',
|
|
7593
7592
|
textAlign: 'center'
|
|
7594
7593
|
}, children: columnName }, `header-${colIndex}`));
|
|
7595
|
-
}) }) })), jsx("tbody", { children: cellsWithIds.map((row, rowIndex) => (jsx("tr", { className: "table-row", children: row.map((cell) => (jsx(TableCellComponent, { cell: cell, mode: mode, onComponentSelect: onComponentSelect || (() => { }), onComponentDelete: handleComponentDelete, onComponentEdit: onComponentEdit, selectedComponent: selectedComponent || null, renderFormComponent: renderComponent, formData: formData, formTemplateId: formTemplateId, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, tableId: id, onNotesChange: onNotesChange, onAttachmentChange: onAttachmentChange, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue }, cell.id))) }, rowIndex))) })] })] }))] }));
|
|
7594
|
+
}) }) })), jsx("tbody", { children: cellsWithIds.map((row, rowIndex) => (jsx("tr", { className: "table-row", children: row.map((cell) => (jsx(TableCellComponent, { cell: cell, mode: mode, onComponentSelect: onComponentSelect || (() => { }), onComponentDelete: handleComponentDelete, onComponentEdit: onComponentEdit, selectedComponent: selectedComponent || null, renderFormComponent: renderComponent, formData: formData, formTemplateId: formTemplateId, onThresholdActionCompletion: onThresholdActionCompletion, onThresholdIssueRaised: onThresholdIssueRaised, tableId: id, onNotesChange: onNotesChange, onAttachmentChange: onAttachmentChange, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, allowWorkflowActions: allowWorkflowActions, inEditMode: inEditMode }, cell.id))) }, rowIndex))) })] })] }))] }));
|
|
7596
7595
|
};
|
|
7597
7596
|
|
|
7598
7597
|
var dfFormTable = /*#__PURE__*/Object.freeze({
|