df-ae-forms-package 1.1.10 → 1.1.13
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 +2 -12
- package/dist/index.esm.js +41 -52
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +41 -52
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -423,8 +423,6 @@ 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;
|
|
428
426
|
}
|
|
429
427
|
declare const DfFormPreview: React.FC<DfFormPreviewProps>;
|
|
430
428
|
|
|
@@ -453,8 +451,6 @@ interface DfFormInputProps {
|
|
|
453
451
|
firstName?: string;
|
|
454
452
|
lastName?: string;
|
|
455
453
|
};
|
|
456
|
-
allowWorkflowActions?: boolean;
|
|
457
|
-
inEditMode?: boolean;
|
|
458
454
|
}
|
|
459
455
|
declare const DfFormInput: React.FC<DfFormInputProps>;
|
|
460
456
|
|
|
@@ -708,14 +704,13 @@ interface DfFormSectionProps {
|
|
|
708
704
|
onAttachmentChange?: (componentId: string, attachments: File[] | null) => void;
|
|
709
705
|
workOrderNumber?: string;
|
|
710
706
|
assetNumber?: string;
|
|
707
|
+
isStandalone?: boolean;
|
|
711
708
|
user?: {
|
|
712
709
|
firstName?: string;
|
|
713
710
|
lastName?: string;
|
|
714
711
|
};
|
|
715
712
|
onCreateIssue?: (issueData: any, attachments: File[]) => Promise<any>;
|
|
716
713
|
onUpdateIssue?: (issueId: string, updateData: any) => Promise<void>;
|
|
717
|
-
allowWorkflowActions?: boolean;
|
|
718
|
-
inEditMode?: boolean;
|
|
719
714
|
}
|
|
720
715
|
declare const DfFormSection: React.FC<DfFormSectionProps>;
|
|
721
716
|
|
|
@@ -785,14 +780,13 @@ interface DfFormTableProps {
|
|
|
785
780
|
onAttachmentChange?: (componentId: string, attachments: File[] | null) => void;
|
|
786
781
|
workOrderNumber?: string;
|
|
787
782
|
assetNumber?: string;
|
|
783
|
+
isStandalone?: boolean;
|
|
788
784
|
user?: {
|
|
789
785
|
firstName?: string;
|
|
790
786
|
lastName?: string;
|
|
791
787
|
};
|
|
792
788
|
onCreateIssue?: (issueData: any, attachments: File[]) => Promise<any>;
|
|
793
789
|
onUpdateIssue?: (issueId: string, updateData: any) => Promise<void>;
|
|
794
|
-
allowWorkflowActions?: boolean;
|
|
795
|
-
inEditMode?: boolean;
|
|
796
790
|
}
|
|
797
791
|
declare const DfFormTable: React.FC<DfFormTableProps>;
|
|
798
792
|
|
|
@@ -818,8 +812,6 @@ interface IComponentActionFeaturesProps {
|
|
|
818
812
|
};
|
|
819
813
|
onCreateIssue?: (issueData: any, attachments: File[]) => Promise<any>;
|
|
820
814
|
onUpdateIssue?: (issueId: string, updateData: any) => Promise<void>;
|
|
821
|
-
allowWorkflowActions?: boolean;
|
|
822
|
-
inEditMode?: boolean;
|
|
823
815
|
}
|
|
824
816
|
declare const ComponentActionFeatures: React.FC<IComponentActionFeaturesProps>;
|
|
825
817
|
|
|
@@ -844,8 +836,6 @@ interface IThresholdAlertProps {
|
|
|
844
836
|
onIssueRaised?: (conditionId: string) => void;
|
|
845
837
|
isIssueRaised?: boolean;
|
|
846
838
|
compact?: boolean;
|
|
847
|
-
allowWorkflowActions?: boolean;
|
|
848
|
-
inEditMode?: boolean;
|
|
849
839
|
}
|
|
850
840
|
declare const ThresholdAlert: React.FC<IThresholdAlertProps>;
|
|
851
841
|
|
package/dist/index.esm.js
CHANGED
|
@@ -325,14 +325,17 @@ var EIssueStatus;
|
|
|
325
325
|
EIssueStatus["OPEN"] = "Open";
|
|
326
326
|
EIssueStatus["IN_PROGRESS"] = "In-Progress";
|
|
327
327
|
EIssueStatus["REJECTED"] = "Rejected";
|
|
328
|
-
EIssueStatus["RESOLVE"] = "
|
|
328
|
+
EIssueStatus["RESOLVE"] = "Resolve";
|
|
329
329
|
})(EIssueStatus || (EIssueStatus = {}));
|
|
330
330
|
const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId, notes = '', attachments = null, issue = null, onCreateIssue, onUpdateIssue, user, availableUsers = [
|
|
331
331
|
'Priya Das',
|
|
332
332
|
'Maria Garcia',
|
|
333
333
|
'John Smith',
|
|
334
334
|
'Sarah Johnson'
|
|
335
|
-
], workOrderNumber: initialWorkOrderNumber, assetNumber: initialAssetNumber, isStandalone,
|
|
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.
|
|
336
339
|
const [title, setTitle] = useState('');
|
|
337
340
|
const [description, setDescription] = useState('');
|
|
338
341
|
const [workOrderNumber, setWorkOrderNumber] = useState('');
|
|
@@ -348,11 +351,6 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
348
351
|
const [isViewMode, setIsViewMode] = useState(!!issue && !inEditMode);
|
|
349
352
|
const fileInputRef = React.useRef(null);
|
|
350
353
|
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;
|
|
356
354
|
useEffect(() => {
|
|
357
355
|
if (isOpen) {
|
|
358
356
|
// In edit mode, prioritize issue attachments from API
|
|
@@ -451,22 +449,12 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
451
449
|
setWorkOrderNumber(issue?.workOrderNumber || initialWorkOrderNumber || '');
|
|
452
450
|
setAssetNumber(issue?.assetNumber || initialAssetNumber || '');
|
|
453
451
|
setPriority(issue?.priority || 'Medium');
|
|
452
|
+
// Use enum value or default to OPEN
|
|
454
453
|
const issueStatus = issue?.status || EIssueStatus.OPEN;
|
|
455
454
|
// Normalize to enum values if needed (handle legacy values)
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
if (statusLower === 'open')
|
|
460
|
-
normalizedStatus = EIssueStatus.OPEN;
|
|
461
|
-
else if (statusLower === 'in-progress' || statusLower === 'in progress' || statusLower === 'inprogress')
|
|
462
|
-
normalizedStatus = EIssueStatus.IN_PROGRESS;
|
|
463
|
-
else if (statusLower === 'rejected')
|
|
464
|
-
normalizedStatus = EIssueStatus.REJECTED;
|
|
465
|
-
else if (statusLower === 'resolved' || statusLower === 'resolve')
|
|
466
|
-
normalizedStatus = EIssueStatus.RESOLVE;
|
|
467
|
-
else
|
|
468
|
-
normalizedStatus = issueStatus; // Fallback to whatever it is if it's not matched but it might be valid
|
|
469
|
-
}
|
|
455
|
+
const normalizedStatus = issueStatus === EIssueStatus.OPEN || issueStatus === EIssueStatus.IN_PROGRESS || issueStatus === EIssueStatus.REJECTED || issueStatus === EIssueStatus.RESOLVE
|
|
456
|
+
? issueStatus
|
|
457
|
+
: EIssueStatus.OPEN;
|
|
470
458
|
setStatus(normalizedStatus);
|
|
471
459
|
// Correctly map assignTo or fallback to assignee
|
|
472
460
|
setAssignee(issue?.assignTo || '');
|
|
@@ -597,8 +585,7 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
597
585
|
status: status,
|
|
598
586
|
comments: String(comments || '').trim() || '',
|
|
599
587
|
task: issue.component?.basic?.label || '',
|
|
600
|
-
taskValue: issue.component?.basic?.value || ''
|
|
601
|
-
isStandalone: !!isStandalone
|
|
588
|
+
taskValue: issue.component?.basic?.value || ''
|
|
602
589
|
};
|
|
603
590
|
if (onUpdateIssue && issue._id) {
|
|
604
591
|
await onUpdateIssue(issue._id, updateData);
|
|
@@ -644,8 +631,7 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
644
631
|
comments: String(comments || '').trim() || '',
|
|
645
632
|
createdBy,
|
|
646
633
|
task: component?.basic?.label || '',
|
|
647
|
-
taskValue: component?.basic?.value || ''
|
|
648
|
-
isStandalone: !!isStandalone
|
|
634
|
+
taskValue: component?.basic?.value || ''
|
|
649
635
|
};
|
|
650
636
|
let createdIssueResponse; // Renamed to avoid conflict with instruction's const
|
|
651
637
|
if (onCreateIssue) {
|
|
@@ -703,12 +689,12 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
703
689
|
hour: '2-digit',
|
|
704
690
|
minute: '2-digit',
|
|
705
691
|
hour12: true
|
|
706
|
-
}) })] })] }), 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: "*" })] }),
|
|
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: [isEditMode && issue && !isViewMode && (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' }))] }) })] }) }));
|
|
707
693
|
// Render modal using portal to document body for full-page overlay
|
|
708
694
|
return createPortal(modalContent, document.body);
|
|
709
695
|
};
|
|
710
696
|
|
|
711
|
-
const ThresholdAlert = ({ component, condition, currentValue, thresholdValue, formTemplateId, workOrderNumber, assetNumber, user, onIssueRaised, isIssueRaised = false, compact = false
|
|
697
|
+
const ThresholdAlert = ({ component, condition, currentValue, thresholdValue, formTemplateId, workOrderNumber, assetNumber, user, onIssueRaised, isIssueRaised = false, compact = false }) => {
|
|
712
698
|
const [showRaiseIssueModal, setShowRaiseIssueModal] = useState(false);
|
|
713
699
|
const [issue, setIssue] = useState(null);
|
|
714
700
|
const [isLoadingIssue, setIsLoadingIssue] = useState(false);
|
|
@@ -800,16 +786,16 @@ const ThresholdAlert = ({ component, condition, currentValue, thresholdValue, fo
|
|
|
800
786
|
// If issue is raised (either from prop or local state), don't show anything
|
|
801
787
|
// The ComponentActionFeatures will handle showing the raised issue state
|
|
802
788
|
if (isIssueRaised || localIssueRaised) {
|
|
803
|
-
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
|
|
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 })) }));
|
|
804
790
|
}
|
|
805
791
|
// Show compact version for small screens/tables
|
|
806
792
|
if (compact) {
|
|
807
|
-
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
|
|
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 }))] }));
|
|
808
794
|
}
|
|
809
|
-
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
|
|
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 }))] }));
|
|
810
796
|
};
|
|
811
797
|
|
|
812
|
-
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
|
|
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 }) => {
|
|
813
799
|
// Ensure formValue is always a string to prevent [object Object] errors
|
|
814
800
|
const getStringValue = (val) => {
|
|
815
801
|
if (val === null || val === undefined)
|
|
@@ -1173,7 +1159,7 @@ const DfFormInput = ({ id, properties, validationErrors = {}, formValue = '', in
|
|
|
1173
1159
|
inputWrapperRef.current?.closest('.datagrid-list-view') !== null ||
|
|
1174
1160
|
className.includes('table-cell') ||
|
|
1175
1161
|
className.includes('cell-content');
|
|
1176
|
-
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
|
|
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}`));
|
|
1177
1163
|
})()] }));
|
|
1178
1164
|
};
|
|
1179
1165
|
|
|
@@ -3760,7 +3746,7 @@ const AttachmentThumbnails = ({ attachments, onRemove }) => {
|
|
|
3760
3746
|
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));
|
|
3761
3747
|
}) }));
|
|
3762
3748
|
};
|
|
3763
|
-
const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, formData, onNotesChange, onAttachmentChange, notes = '', attachments = null, onThresholdActionCompletion, onThresholdIssueRaised, onBasicPropertyActionCompletion, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue
|
|
3749
|
+
const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, formData, onNotesChange, onAttachmentChange, notes = '', attachments = null, onThresholdActionCompletion, onThresholdIssueRaised, onBasicPropertyActionCompletion, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
|
|
3764
3750
|
// Determine effective form value (prefer prop, fallback to formData lookup)
|
|
3765
3751
|
const effectiveFormValue = formValue !== undefined ? formValue : (formData ? formData[component.id] : undefined);
|
|
3766
3752
|
// Use effectiveFormValue for logic instead of raw formValue
|
|
@@ -4038,8 +4024,10 @@ const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, f
|
|
|
4038
4024
|
}, 3000);
|
|
4039
4025
|
}, [getActiveThresholdConditions, onThresholdActionCompletion, component, onBasicPropertyActionCompletion]);
|
|
4040
4026
|
const handleRaiseIssueClick = useCallback(() => {
|
|
4027
|
+
if (issueRaised)
|
|
4028
|
+
return;
|
|
4041
4029
|
setShowRaiseIssueModal(true);
|
|
4042
|
-
}, []);
|
|
4030
|
+
}, [issueRaised]);
|
|
4043
4031
|
const handleRaiseIssueClose = useCallback(() => {
|
|
4044
4032
|
setShowRaiseIssueModal(false);
|
|
4045
4033
|
}, []);
|
|
@@ -4246,7 +4234,7 @@ const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, f
|
|
|
4246
4234
|
modalComponent.basic.value = selectedOption.value || effectiveValue;
|
|
4247
4235
|
}
|
|
4248
4236
|
return modalComponent;
|
|
4249
|
-
})(), 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 }))] }));
|
|
4250
4238
|
};
|
|
4251
4239
|
|
|
4252
4240
|
// Attachment Thumbnails Component for Submission View
|
|
@@ -4312,7 +4300,7 @@ function ensureStringId$2(id) {
|
|
|
4312
4300
|
}
|
|
4313
4301
|
return String(id);
|
|
4314
4302
|
}
|
|
4315
|
-
const DraggableGridComponent = ({ component, selectedComponent, mode, onComponentSelect, onComponentDelete, onComponentEdit, renderFormComponent, isOverlay = false, formData = {}, formTemplateId, onThresholdIssueRaised, onNotesChange, onAttachmentChange, shouldShowComponent }) => {
|
|
4303
|
+
const DraggableGridComponent = ({ component, selectedComponent, mode, onComponentSelect, onComponentDelete, onComponentEdit, renderFormComponent, isOverlay = false, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, shouldShowComponent }) => {
|
|
4316
4304
|
const formValue = formData[component.id];
|
|
4317
4305
|
const isVisible = shouldShowComponent ? shouldShowComponent(component.id) : true;
|
|
4318
4306
|
// Check if component has notes or attachments for submission view
|
|
@@ -4483,7 +4471,8 @@ const GridDropZone = ({ gridComponents, mode, onComponentSelect, onComponentDele
|
|
|
4483
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" })) })] })) }));
|
|
4484
4472
|
};
|
|
4485
4473
|
// Sub-component for displaying entries (TableView)
|
|
4486
|
-
const TableView = ({ templateComponents, dataEntries, renderFormComponent, mode, allowAddRemoveEntries, addAnotherText, removeText, maxEntries, minEntries, displayAsGrid = true, onAddEntry, onRemoveEntry, formData,
|
|
4474
|
+
const TableView = ({ templateComponents, dataEntries, renderFormComponent, mode, allowAddRemoveEntries, addAnotherText, removeText, maxEntries, minEntries, displayAsGrid = true, onAddEntry, onRemoveEntry, formData, // Use current formData to render values
|
|
4475
|
+
formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, columnView, shouldShowComponent }) => {
|
|
4487
4476
|
const _formData = formData || {};
|
|
4488
4477
|
const visibleTemplateComponents = React.useMemo(() => {
|
|
4489
4478
|
if (!shouldShowComponent)
|
|
@@ -5150,7 +5139,7 @@ const DfFormDataGrid = ({ id, properties, mode = 'edit', formData = {}, onValueC
|
|
|
5150
5139
|
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 })) }))] }));
|
|
5151
5140
|
};
|
|
5152
5141
|
|
|
5153
|
-
const DraggableChild = ({ child, selectedChild, mode, onChildSelect, onChildDelete, renderFormComponent, isOverlay = false, isChildrenEditMode = false, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue
|
|
5142
|
+
const DraggableChild = ({ child, selectedChild, mode, onChildSelect, onChildDelete, renderFormComponent, isOverlay = false, isChildrenEditMode = false, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
|
|
5154
5143
|
const formValue = formData[child.id];
|
|
5155
5144
|
// Check if component has notes or attachments for submission view
|
|
5156
5145
|
const hasSubmissionData = mode === 'preview' && ((child.basic?.notes && child.basic.notes.trim().length > 0) ||
|
|
@@ -5168,9 +5157,9 @@ const DraggableChild = ({ child, selectedChild, mode, onChildSelect, onChildDele
|
|
|
5168
5157
|
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) => {
|
|
5169
5158
|
e.stopPropagation();
|
|
5170
5159
|
onChildSelect(child);
|
|
5171
|
-
}, 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
|
|
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, isStandalone: isStandalone, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue })), hasSubmissionData && (jsx(ComponentSubmissionActions, { component: child }))] })] })] }));
|
|
5172
5161
|
};
|
|
5173
|
-
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
|
|
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, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
|
|
5174
5163
|
const [isCollapsed, setIsCollapsed] = useState(properties.basic.collapsed);
|
|
5175
5164
|
const [isEditingTitle, setIsEditingTitle] = useState(false);
|
|
5176
5165
|
const [isEditingDescription, setIsEditingDescription] = useState(false);
|
|
@@ -5383,7 +5372,7 @@ const DfFormSection = ({ id, properties, mode = 'edit', formData = {}, onValueCh
|
|
|
5383
5372
|
}, children: isOver ? 'Drop components here' : 'Empty Section' }), jsx("div", { style: {
|
|
5384
5373
|
fontSize: '12px',
|
|
5385
5374
|
color: '#9ca3af'
|
|
5386
|
-
}, 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
|
|
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, isStandalone: isStandalone, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue }, child.id)))) }) }))] }));
|
|
5387
5376
|
};
|
|
5388
5377
|
|
|
5389
5378
|
// Dynamic imports to avoid circular dependencies
|
|
@@ -5433,7 +5422,7 @@ const normalizeTableRow = (row) => {
|
|
|
5433
5422
|
};
|
|
5434
5423
|
const DfFormPreview = ({ formComponents = [], currentDevice = 'desktop', isPreviewMode = false, initialFormData = [], onSubmit, onFormDataChange, formTitle, formDescription, formTemplateId,
|
|
5435
5424
|
// Add component management props for edit mode
|
|
5436
|
-
onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, selectedComponent, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue
|
|
5425
|
+
onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, selectedComponent, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
|
|
5437
5426
|
// Local copy of formComponents so structure updates (e.g. table cell init) are reflected immediately
|
|
5438
5427
|
const [localFormComponents, setLocalFormComponents] = useState(formComponents);
|
|
5439
5428
|
// Sync local state when the prop changes from the parent
|
|
@@ -6788,7 +6777,7 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
|
|
|
6788
6777
|
case 'email-input':
|
|
6789
6778
|
// Regular text/email/number input
|
|
6790
6779
|
return (jsx(DfFormInput, { ...commonProps, properties: component, inputType: component.name === 'text-input' ? 'text' :
|
|
6791
|
-
component.name === 'number-input' ? 'number' : 'email', formTemplateId: formTemplateId, onThresholdIssueRaised: handleThresholdIssueRaised, raisedThresholdIssues: raisedThresholdIssues, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user
|
|
6780
|
+
component.name === 'number-input' ? 'number' : 'email', formTemplateId: formTemplateId, onThresholdIssueRaised: handleThresholdIssueRaised, raisedThresholdIssues: raisedThresholdIssues, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user }));
|
|
6792
6781
|
case 'textarea':
|
|
6793
6782
|
return jsx(DfFormTextarea, { ...commonProps, properties: component });
|
|
6794
6783
|
case 'select':
|
|
@@ -6854,13 +6843,13 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
|
|
|
6854
6843
|
case 'location':
|
|
6855
6844
|
return jsx(DfFormLocation, { ...commonProps, properties: component });
|
|
6856
6845
|
case 'section':
|
|
6857
|
-
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,
|
|
6846
|
+
return (jsx(DfFormSection, { ...commonProps, properties: component, formData: formValues, formTemplateId: formTemplateId, onThresholdActionCompletion: handleThresholdActionCompletion, onThresholdIssueRaised: handleThresholdIssueRaised, onNotesChange: handleComponentNotesChange, onAttachmentChange: handleComponentAttachmentChange, workOrderNumber: workOrderNumber, assetNumber: assetNumber, isStandalone: isStandalone, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, renderFormComponent: (field) => {
|
|
6858
6847
|
// Ensure the nested component gets the proper form value
|
|
6859
6848
|
// const fieldValue = formValues[field.id] || (field.basic as any)?.value || (field.basic as any)?.defaultValue || ''
|
|
6860
6849
|
return renderFormComponent(field);
|
|
6861
6850
|
} }));
|
|
6862
6851
|
case 'table':
|
|
6863
|
-
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,
|
|
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, isStandalone: isStandalone, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue, renderFormComponent: (field) => {
|
|
6864
6853
|
return renderFormComponent(field);
|
|
6865
6854
|
}, onNotesChange: (componentId, notes) => {
|
|
6866
6855
|
// Handle notes change for table cell components
|
|
@@ -7198,7 +7187,7 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
|
|
|
7198
7187
|
return comp;
|
|
7199
7188
|
});
|
|
7200
7189
|
onFormDataChange?.(updatedComponents);
|
|
7201
|
-
}, 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
|
|
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));
|
|
7202
7191
|
}), !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" })] }))] }))] }) }) }));
|
|
7203
7192
|
};
|
|
7204
7193
|
|
|
@@ -7293,12 +7282,12 @@ const ensureComponentHasId = (component) => {
|
|
|
7293
7282
|
}
|
|
7294
7283
|
return component;
|
|
7295
7284
|
};
|
|
7296
|
-
const SimpleTableComponent = ({ component, mode, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue
|
|
7285
|
+
const SimpleTableComponent = ({ component, mode, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
|
|
7297
7286
|
const formValue = formData[component.id];
|
|
7298
7287
|
// Check if component has notes or attachments for submission view
|
|
7299
7288
|
const hasSubmissionData = mode === 'preview' && ((component.basic?.notes && component.basic.notes.trim().length > 0) ||
|
|
7300
7289
|
(component.basic?.attachments && Array.isArray(component.basic.attachments) && component.basic.attachments.length > 0));
|
|
7301
|
-
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
|
|
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, isStandalone: isStandalone, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue })), hasSubmissionData && (jsx(ComponentSubmissionActions, { component: component }))] }));
|
|
7302
7291
|
};
|
|
7303
7292
|
const DraggableTableComponent = ({ component, selectedComponent, mode, onComponentSelect, onComponentDelete, onComponentEdit, renderFormComponent, isOverlay = false, }) => {
|
|
7304
7293
|
const { attributes, listeners, setNodeRef, transform, transition, isDragging, isSorting, } = useSortable({
|
|
@@ -7319,7 +7308,7 @@ const DraggableTableComponent = ({ component, selectedComponent, mode, onCompone
|
|
|
7319
7308
|
onComponentDelete(component, e);
|
|
7320
7309
|
}, type: "button", title: "Delete Component", children: jsx(Trash2, { size: 12 }) })] }))] }));
|
|
7321
7310
|
};
|
|
7322
|
-
const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete, onComponentEdit, selectedComponent, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, tableId, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue
|
|
7311
|
+
const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete, onComponentEdit, selectedComponent, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, tableId, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
|
|
7323
7312
|
const dropZoneId = `table-cell-${tableId}-${cell.row}-${cell.column}`;
|
|
7324
7313
|
const { setNodeRef, isOver } = useDroppable({
|
|
7325
7314
|
id: dropZoneId,
|
|
@@ -7354,7 +7343,7 @@ const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete,
|
|
|
7354
7343
|
cell.components.map((component) => {
|
|
7355
7344
|
// Only ensure ID if it's truly missing - don't regenerate existing IDs
|
|
7356
7345
|
const componentWithId = component.id ? component : ensureComponentHasId(component);
|
|
7357
|
-
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
|
|
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, isStandalone: isStandalone, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue }, componentWithId.id));
|
|
7358
7347
|
}))) : (
|
|
7359
7348
|
// Only show drop zone content in edit mode
|
|
7360
7349
|
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, ")"] })] }) })) : (
|
|
@@ -7365,7 +7354,7 @@ const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete,
|
|
|
7365
7354
|
visibility: 'hidden' // Hide content but maintain space
|
|
7366
7355
|
}, children: "\u00A0" }))) }) }));
|
|
7367
7356
|
};
|
|
7368
|
-
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
|
|
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, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
|
|
7369
7358
|
const [isCollapsed, setIsCollapsed] = useState(false); // Always start expanded to show drop zones
|
|
7370
7359
|
// CRITICAL: Normalize cells from API format (object with numeric keys) to proper 2D array
|
|
7371
7360
|
// The API may return cells as [{"0": {cell}, "1": {cell}}, ...] instead of [[cell, cell], ...]
|
|
@@ -7603,7 +7592,7 @@ const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationE
|
|
|
7603
7592
|
fontSize: '14px',
|
|
7604
7593
|
textAlign: 'center'
|
|
7605
7594
|
}, children: columnName }, `header-${colIndex}`));
|
|
7606
|
-
}) }) })), 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
|
|
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, isStandalone: isStandalone, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue }, cell.id))) }, rowIndex))) })] })] }))] }));
|
|
7607
7596
|
};
|
|
7608
7597
|
|
|
7609
7598
|
var dfFormTable = /*#__PURE__*/Object.freeze({
|