df-ae-forms-package 1.1.11 → 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 +5 -17
- package/dist/index.esm.js +46 -106
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +46 -106
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -327,16 +327,17 @@ var EIssueStatus;
|
|
|
327
327
|
EIssueStatus["OPEN"] = "Open";
|
|
328
328
|
EIssueStatus["IN_PROGRESS"] = "In-Progress";
|
|
329
329
|
EIssueStatus["REJECTED"] = "Rejected";
|
|
330
|
-
EIssueStatus["RESOLVE"] = "
|
|
330
|
+
EIssueStatus["RESOLVE"] = "Resolve";
|
|
331
331
|
})(EIssueStatus || (EIssueStatus = {}));
|
|
332
332
|
const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId, notes = '', attachments = null, issue = null, onCreateIssue, onUpdateIssue, user, availableUsers = [
|
|
333
333
|
'Priya Das',
|
|
334
334
|
'Maria Garcia',
|
|
335
335
|
'John Smith',
|
|
336
336
|
'Sarah Johnson'
|
|
337
|
-
], workOrderNumber: initialWorkOrderNumber, assetNumber: initialAssetNumber, isStandalone,
|
|
338
|
-
//
|
|
339
|
-
|
|
337
|
+
], workOrderNumber: initialWorkOrderNumber, assetNumber: initialAssetNumber, isStandalone, inEditMode = false, isEdit }) => {
|
|
338
|
+
// Determine if workflow actions should be enabled
|
|
339
|
+
// If explicitly provided, use that. Otherwise, default to isEdit (true if editing, false/undefined otherwise).
|
|
340
|
+
// Fallback to false if neither is provided.
|
|
340
341
|
const [title, setTitle] = React.useState('');
|
|
341
342
|
const [description, setDescription] = React.useState('');
|
|
342
343
|
const [workOrderNumber, setWorkOrderNumber] = React.useState('');
|
|
@@ -352,11 +353,6 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
352
353
|
const [isViewMode, setIsViewMode] = React.useState(!!issue && !inEditMode);
|
|
353
354
|
const fileInputRef = React.useRef(null);
|
|
354
355
|
const isEditMode = isEdit !== undefined ? isEdit : !!issue;
|
|
355
|
-
// Determine if workflow actions should be enabled
|
|
356
|
-
// If explicitly provided, use that. Otherwise, default to showing them if we have an existing issue.
|
|
357
|
-
const showWorkflowActions = allowWorkflowActions !== undefined
|
|
358
|
-
? allowWorkflowActions
|
|
359
|
-
: !!issue;
|
|
360
356
|
React.useEffect(() => {
|
|
361
357
|
if (isOpen) {
|
|
362
358
|
// In edit mode, prioritize issue attachments from API
|
|
@@ -410,14 +406,6 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
410
406
|
setLocalAttachments(prev => [...prev, ...newFiles]);
|
|
411
407
|
}
|
|
412
408
|
};
|
|
413
|
-
const convertFileToBase64 = (file) => {
|
|
414
|
-
return new Promise((resolve, reject) => {
|
|
415
|
-
const reader = new FileReader();
|
|
416
|
-
reader.readAsDataURL(file);
|
|
417
|
-
reader.onload = () => resolve(reader.result);
|
|
418
|
-
reader.onerror = error => reject(error);
|
|
419
|
-
});
|
|
420
|
-
};
|
|
421
409
|
const getAttachmentName = (file) => {
|
|
422
410
|
if (!file)
|
|
423
411
|
return 'Attachment';
|
|
@@ -448,25 +436,10 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
448
436
|
}
|
|
449
437
|
return null;
|
|
450
438
|
}
|
|
451
|
-
if (file.data)
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
// Handle raw base64 data from API
|
|
455
|
-
if (file.fileName && isImage(file.fileName)) {
|
|
456
|
-
const fileName = String(file.fileName).toLowerCase();
|
|
457
|
-
let mimeType = 'image/png'; // Default
|
|
458
|
-
if (fileName.endsWith('.jpg') || fileName.endsWith('.jpeg'))
|
|
459
|
-
mimeType = 'image/jpeg';
|
|
460
|
-
else if (fileName.endsWith('.png'))
|
|
461
|
-
mimeType = 'image/png';
|
|
462
|
-
else if (fileName.endsWith('.gif'))
|
|
463
|
-
mimeType = 'image/gif';
|
|
464
|
-
else if (fileName.endsWith('.webp'))
|
|
465
|
-
mimeType = 'image/webp';
|
|
466
|
-
return `data:${mimeType};base64,${file.data}`;
|
|
467
|
-
}
|
|
439
|
+
if (file.data && isDataUrlImage(file.data))
|
|
440
|
+
return file.data;
|
|
441
|
+
if (file.fileName && isImage(file.fileName) && file.data)
|
|
468
442
|
return file.data;
|
|
469
|
-
}
|
|
470
443
|
return null;
|
|
471
444
|
};
|
|
472
445
|
React.useEffect(() => {
|
|
@@ -478,22 +451,12 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
478
451
|
setWorkOrderNumber(issue?.workOrderNumber || initialWorkOrderNumber || '');
|
|
479
452
|
setAssetNumber(issue?.assetNumber || initialAssetNumber || '');
|
|
480
453
|
setPriority(issue?.priority || 'Medium');
|
|
454
|
+
// Use enum value or default to OPEN
|
|
481
455
|
const issueStatus = issue?.status || EIssueStatus.OPEN;
|
|
482
456
|
// Normalize to enum values if needed (handle legacy values)
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
486
|
-
if (statusLower === 'open')
|
|
487
|
-
normalizedStatus = EIssueStatus.OPEN;
|
|
488
|
-
else if (statusLower === 'in-progress' || statusLower === 'in progress' || statusLower === 'inprogress')
|
|
489
|
-
normalizedStatus = EIssueStatus.IN_PROGRESS;
|
|
490
|
-
else if (statusLower === 'rejected')
|
|
491
|
-
normalizedStatus = EIssueStatus.REJECTED;
|
|
492
|
-
else if (statusLower === 'resolved' || statusLower === 'resolve')
|
|
493
|
-
normalizedStatus = EIssueStatus.RESOLVE;
|
|
494
|
-
else
|
|
495
|
-
normalizedStatus = issueStatus; // Fallback to whatever it is if it's not matched but it might be valid
|
|
496
|
-
}
|
|
457
|
+
const normalizedStatus = issueStatus === EIssueStatus.OPEN || issueStatus === EIssueStatus.IN_PROGRESS || issueStatus === EIssueStatus.REJECTED || issueStatus === EIssueStatus.RESOLVE
|
|
458
|
+
? issueStatus
|
|
459
|
+
: EIssueStatus.OPEN;
|
|
497
460
|
setStatus(normalizedStatus);
|
|
498
461
|
// Correctly map assignTo or fallback to assignee
|
|
499
462
|
setAssignee(issue?.assignTo || '');
|
|
@@ -612,17 +575,6 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
612
575
|
try {
|
|
613
576
|
if (isEditMode && issue) {
|
|
614
577
|
// Update existing issue
|
|
615
|
-
// Convert attachments to base64 objects for API
|
|
616
|
-
const attachmentObjects = await Promise.all(localAttachments.map(async (file) => {
|
|
617
|
-
if (file instanceof File) {
|
|
618
|
-
const base64 = await convertFileToBase64(file);
|
|
619
|
-
return {
|
|
620
|
-
fileName: file.name,
|
|
621
|
-
data: base64
|
|
622
|
-
};
|
|
623
|
-
}
|
|
624
|
-
return file; // Already a data object
|
|
625
|
-
}));
|
|
626
578
|
const updateData = {
|
|
627
579
|
title: String(title || '').trim(),
|
|
628
580
|
description: String(description || '').trim(),
|
|
@@ -635,9 +587,7 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
635
587
|
status: status,
|
|
636
588
|
comments: String(comments || '').trim() || '',
|
|
637
589
|
task: issue.component?.basic?.label || '',
|
|
638
|
-
taskValue: issue.component?.basic?.value || ''
|
|
639
|
-
isStandalone: !!isStandalone,
|
|
640
|
-
attachments: attachmentObjects
|
|
590
|
+
taskValue: issue.component?.basic?.value || ''
|
|
641
591
|
};
|
|
642
592
|
if (onUpdateIssue && issue._id) {
|
|
643
593
|
await onUpdateIssue(issue._id, updateData);
|
|
@@ -669,17 +619,6 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
669
619
|
comments: String(notes || '')
|
|
670
620
|
}
|
|
671
621
|
};
|
|
672
|
-
// Convert attachments to base64 objects for API
|
|
673
|
-
const attachmentObjects = await Promise.all(localAttachments.map(async (file) => {
|
|
674
|
-
if (file instanceof File) {
|
|
675
|
-
const base64 = await convertFileToBase64(file);
|
|
676
|
-
return {
|
|
677
|
-
fileName: file.name,
|
|
678
|
-
data: base64
|
|
679
|
-
};
|
|
680
|
-
}
|
|
681
|
-
return file; // Already a data object
|
|
682
|
-
}));
|
|
683
622
|
const createdBy = user ? `${user.firstName || ''} ${user.lastName || ''}`.trim() : 'User';
|
|
684
623
|
const issueData = {
|
|
685
624
|
title: String(title || '').trim(),
|
|
@@ -694,13 +633,11 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
694
633
|
comments: String(comments || '').trim() || '',
|
|
695
634
|
createdBy,
|
|
696
635
|
task: component?.basic?.label || '',
|
|
697
|
-
taskValue: component?.basic?.value || ''
|
|
698
|
-
isStandalone: !!isStandalone,
|
|
699
|
-
attachments: attachmentObjects // Include in data as well
|
|
636
|
+
taskValue: component?.basic?.value || ''
|
|
700
637
|
};
|
|
701
|
-
let createdIssueResponse;
|
|
638
|
+
let createdIssueResponse; // Renamed to avoid conflict with instruction's const
|
|
702
639
|
if (onCreateIssue) {
|
|
703
|
-
createdIssueResponse = await onCreateIssue(issueData,
|
|
640
|
+
createdIssueResponse = await onCreateIssue(issueData, localAttachments);
|
|
704
641
|
}
|
|
705
642
|
toastService.showSuccess('Issue raised successfully');
|
|
706
643
|
if (onSuccess) {
|
|
@@ -754,12 +691,12 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
754
691
|
hour: '2-digit',
|
|
755
692
|
minute: '2-digit',
|
|
756
693
|
hour12: true
|
|
757
|
-
}) })] })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Description ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.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 })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Status ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsx("input", { type: "text", className: "raise-issue-field-input raise-issue-field-readonly", value: status, readOnly: true })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Assign to ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }),
|
|
694
|
+
}) })] })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Description ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.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 })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Status ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsx("input", { type: "text", className: "raise-issue-field-input raise-issue-field-readonly", value: status, readOnly: true })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Assign to ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsxs("select", { className: "raise-issue-field-select", value: assignee, onChange: (e) => setAssignee(e.target.value), disabled: isEditMode && isViewMode, children: [jsxRuntime.jsx("option", { value: "", children: "Unassigned" }), availableUsers.map(userName => (jsxRuntime.jsx("option", { value: userName, children: userName }, userName)))] })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label", children: ["Priority ", jsxRuntime.jsx("span", { className: "raise-issue-required", children: "*" })] }), jsxRuntime.jsxs("div", { className: "raise-issue-priority-buttons", children: [jsxRuntime.jsx("button", { type: "button", className: `priority-button priority-low ${priority === 'Low' ? 'active' : ''}`, onClick: () => setPriority('Low'), disabled: isEditMode && isViewMode, children: "Low" }), jsxRuntime.jsx("button", { type: "button", className: `priority-button priority-medium ${priority === 'Medium' ? 'active' : ''}`, onClick: () => setPriority('Medium'), disabled: isEditMode && isViewMode, children: "Medium" }), jsxRuntime.jsx("button", { type: "button", className: `priority-button priority-high ${priority === 'High' ? 'active' : ''}`, onClick: () => setPriority('High'), disabled: isEditMode && isViewMode, children: "High" })] })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", children: [jsxRuntime.jsxs("label", { className: "raise-issue-field-label-with-icon", children: [jsxRuntime.jsx(lucideReact.MessageSquare, { size: 16 }), jsxRuntime.jsx("span", { children: "Comments" })] }), !comments && (jsxRuntime.jsx("div", { className: "raise-issue-no-comments", children: "No comments yet" })), jsxRuntime.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 })] }), jsxRuntime.jsxs("div", { className: "raise-issue-field raise-issue-field-full-width", style: { marginTop: '1rem' }, children: [jsxRuntime.jsx("label", { className: "raise-issue-field-label", children: "Attachments" }), jsxRuntime.jsxs("div", { className: "raise-issue-attachments-container", children: [!isEditMode && (jsxRuntime.jsxs("div", { className: `raise-issue-dropzone ${isDragging ? 'dragging' : ''}`, onDragOver: handleDragOver, onDragLeave: handleDragLeave, onDrop: handleDrop, onClick: () => fileInputRef.current?.click(), children: [jsxRuntime.jsx("input", { type: "file", ref: fileInputRef, style: { display: 'none' }, onChange: handleFileChange, multiple: true }), jsxRuntime.jsx("div", { className: "raise-issue-dropzone-icon", children: jsxRuntime.jsx(lucideReact.UploadCloud, { size: 24 }) }), jsxRuntime.jsx("div", { className: "raise-issue-dropzone-text", children: "Click to upload or drag and drop" }), jsxRuntime.jsx("div", { className: "raise-issue-dropzone-hint", children: "PNG, JPG up to 10MB" })] })), localAttachments.length > 0 && (jsxRuntime.jsx("div", { className: "raise-issue-attachments-list", children: localAttachments.map((file, index) => (jsxRuntime.jsxs("div", { className: "raise-issue-attachment-item", children: [jsxRuntime.jsx("div", { className: "raise-issue-attachment-thumbnail", children: getAttachmentPreview(file) ? (jsxRuntime.jsx("img", { src: getAttachmentPreview(file), alt: "Thumbnail" })) : (jsxRuntime.jsx(lucideReact.Paperclip, { size: 20, color: "#9ca3af" })) }), jsxRuntime.jsxs("div", { className: "raise-issue-attachment-info", children: [jsxRuntime.jsx("span", { className: "attachment-name", title: getAttachmentName(file), children: getAttachmentName(file) }), file instanceof File && (jsxRuntime.jsxs("span", { className: "attachment-size", children: [(file.size / 1024).toFixed(1), " KB"] }))] }), !isEditMode && (jsxRuntime.jsx("button", { type: "button", className: "attachment-remove-btn", onClick: () => handleRemoveAttachment(index), title: "Remove", children: jsxRuntime.jsx(lucideReact.X, { size: 12 }) }))] }, index))) }))] })] })] }) }), jsxRuntime.jsx("div", { className: "raise-issue-modal-actions", children: jsxRuntime.jsxs("div", { className: "raise-issue-modal-actions-buttons", children: [isEditMode && issue && !isViewMode && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [status === EIssueStatus.OPEN && (jsxRuntime.jsx("button", { className: "raise-issue-modal-button raise-issue-modal-button-accept", onClick: handleAccept, disabled: isSubmitting, children: isSubmitting ? 'Processing...' : 'Accept' })), status === EIssueStatus.IN_PROGRESS && (jsxRuntime.jsx("button", { className: "raise-issue-modal-button raise-issue-modal-button-resolve", onClick: handleResolve, disabled: isSubmitting, children: isSubmitting ? 'Processing...' : 'Resolve' })), (status === EIssueStatus.OPEN) && (jsxRuntime.jsx("button", { className: "raise-issue-modal-button raise-issue-modal-button-reject", onClick: handleReject, disabled: isSubmitting, children: isSubmitting ? 'Processing...' : 'Reject' }))] })), !isEditMode && (jsxRuntime.jsx("button", { className: `raise-issue-modal-button raise-issue-modal-button-save ${!isFormValid ? 'disabled' : ''}`, onClick: handleSubmit, disabled: isSubmitting || !isFormValid, children: isSubmitting ? 'Creating...' : 'Create Issue' }))] }) })] }) }));
|
|
758
695
|
// Render modal using portal to document body for full-page overlay
|
|
759
696
|
return require$$0.createPortal(modalContent, document.body);
|
|
760
697
|
};
|
|
761
698
|
|
|
762
|
-
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 }) => {
|
|
763
700
|
const [showRaiseIssueModal, setShowRaiseIssueModal] = React.useState(false);
|
|
764
701
|
const [issue, setIssue] = React.useState(null);
|
|
765
702
|
const [isLoadingIssue, setIsLoadingIssue] = React.useState(false);
|
|
@@ -851,16 +788,16 @@ const ThresholdAlert = ({ component, condition, currentValue, thresholdValue, fo
|
|
|
851
788
|
// If issue is raised (either from prop or local state), don't show anything
|
|
852
789
|
// The ComponentActionFeatures will handle showing the raised issue state
|
|
853
790
|
if (isIssueRaised || localIssueRaised) {
|
|
854
|
-
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: showRaiseIssueModal && (jsxRuntime.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 (jsxRuntime.jsx(jsxRuntime.Fragment, { children: showRaiseIssueModal && (jsxRuntime.jsx(RaiseIssueModal, { isOpen: showRaiseIssueModal, onClose: handleRaiseIssueClose, onSuccess: handleRaiseIssueSuccess, component: component, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, notes: "", attachments: null, issue: issue })) }));
|
|
855
792
|
}
|
|
856
793
|
// Show compact version for small screens/tables
|
|
857
794
|
if (compact) {
|
|
858
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "threshold-alert threshold-alert-unresolved threshold-alert-compact", children: [jsxRuntime.jsx("div", { className: "threshold-alert-border" }), jsxRuntime.jsxs("div", { className: "threshold-alert-content-compact", children: [jsxRuntime.jsx(lucideReact.AlertTriangle, { className: "threshold-alert-icon-compact", size: 14 }), jsxRuntime.jsx("span", { className: "threshold-alert-message-compact", children: getCompactMessage() }), jsxRuntime.jsx("button", { type: "button", onClick: handleRaiseIssueClick, className: "threshold-alert-raise-issue-btn-compact", title: "Raise Issue", children: "Raise Issue" })] })] }), showRaiseIssueModal && (jsxRuntime.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 (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "threshold-alert threshold-alert-unresolved threshold-alert-compact", children: [jsxRuntime.jsx("div", { className: "threshold-alert-border" }), jsxRuntime.jsxs("div", { className: "threshold-alert-content-compact", children: [jsxRuntime.jsx(lucideReact.AlertTriangle, { className: "threshold-alert-icon-compact", size: 14 }), jsxRuntime.jsx("span", { className: "threshold-alert-message-compact", children: getCompactMessage() }), jsxRuntime.jsx("button", { type: "button", onClick: handleRaiseIssueClick, className: "threshold-alert-raise-issue-btn-compact", title: "Raise Issue", children: "Raise Issue" })] })] }), showRaiseIssueModal && (jsxRuntime.jsx(RaiseIssueModal, { isOpen: showRaiseIssueModal, onClose: handleRaiseIssueClose, onSuccess: handleRaiseIssueSuccess, component: component, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, notes: "", attachments: null, issue: issue }))] }));
|
|
859
796
|
}
|
|
860
|
-
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "threshold-alert threshold-alert-unresolved", children: [jsxRuntime.jsx("div", { className: "threshold-alert-border" }), jsxRuntime.jsxs("div", { className: "threshold-alert-content", children: [jsxRuntime.jsx("div", { className: "threshold-alert-header", children: jsxRuntime.jsxs("div", { className: "threshold-alert-title-group", children: [jsxRuntime.jsx(lucideReact.AlertTriangle, { className: "threshold-alert-icon", size: 20 }), jsxRuntime.jsx("span", { className: "threshold-alert-title", children: "Threshold Condition Met - Action Required" })] }) }), jsxRuntime.jsxs("div", { className: "threshold-alert-message", children: [getConditionMessage(), jsxRuntime.jsx("span", { className: "threshold-alert-warning", children: " You must raise an issue before submitting the form." })] }), jsxRuntime.jsx("div", { className: "threshold-alert-buttons", children: jsxRuntime.jsx("button", { type: "button", onClick: handleRaiseIssueClick, className: "threshold-alert-raise-issue-btn", children: "Raise Issue Now" }) })] })] }), showRaiseIssueModal && (jsxRuntime.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 (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "threshold-alert threshold-alert-unresolved", children: [jsxRuntime.jsx("div", { className: "threshold-alert-border" }), jsxRuntime.jsxs("div", { className: "threshold-alert-content", children: [jsxRuntime.jsx("div", { className: "threshold-alert-header", children: jsxRuntime.jsxs("div", { className: "threshold-alert-title-group", children: [jsxRuntime.jsx(lucideReact.AlertTriangle, { className: "threshold-alert-icon", size: 20 }), jsxRuntime.jsx("span", { className: "threshold-alert-title", children: "Threshold Condition Met - Action Required" })] }) }), jsxRuntime.jsxs("div", { className: "threshold-alert-message", children: [getConditionMessage(), jsxRuntime.jsx("span", { className: "threshold-alert-warning", children: " You must raise an issue before submitting the form." })] }), jsxRuntime.jsx("div", { className: "threshold-alert-buttons", children: jsxRuntime.jsx("button", { type: "button", onClick: handleRaiseIssueClick, className: "threshold-alert-raise-issue-btn", children: "Raise Issue Now" }) })] })] }), showRaiseIssueModal && (jsxRuntime.jsx(RaiseIssueModal, { isOpen: showRaiseIssueModal, onClose: handleRaiseIssueClose, onSuccess: handleRaiseIssueSuccess, component: component, formTemplateId: formTemplateId, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, notes: "", attachments: null, issue: issue }))] }));
|
|
861
798
|
};
|
|
862
799
|
|
|
863
|
-
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 }) => {
|
|
864
801
|
// Ensure formValue is always a string to prevent [object Object] errors
|
|
865
802
|
const getStringValue = (val) => {
|
|
866
803
|
if (val === null || val === undefined)
|
|
@@ -1224,7 +1161,7 @@ const DfFormInput = ({ id, properties, validationErrors = {}, formValue = '', in
|
|
|
1224
1161
|
inputWrapperRef.current?.closest('.datagrid-list-view') !== null ||
|
|
1225
1162
|
className.includes('table-cell') ||
|
|
1226
1163
|
className.includes('cell-content');
|
|
1227
|
-
return (jsxRuntime.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
|
|
1164
|
+
return (jsxRuntime.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}`));
|
|
1228
1165
|
})()] }));
|
|
1229
1166
|
};
|
|
1230
1167
|
|
|
@@ -3811,7 +3748,7 @@ const AttachmentThumbnails = ({ attachments, onRemove }) => {
|
|
|
3811
3748
|
return (jsxRuntime.jsx("div", { className: "attachment-thumbnail", children: isImage && objectUrl ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("img", { src: objectUrl, alt: file ? file.name : 'Attachment' }), jsxRuntime.jsx("button", { type: "button", className: "thumbnail-remove-btn", onClick: () => onRemove(index), title: "Remove attachment", children: jsxRuntime.jsx(lucideReact.X, { size: 14 }) })] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: "file-icon-placeholder", children: jsxRuntime.jsx(lucideReact.Paperclip, { size: 20 }) }), jsxRuntime.jsx("span", { className: "file-name", children: file ? file.name : 'Unknown File' }), jsxRuntime.jsx("button", { type: "button", className: "thumbnail-remove-btn", onClick: () => onRemove(index), title: "Remove attachment", children: jsxRuntime.jsx(lucideReact.X, { size: 14 }) })] })) }, index));
|
|
3812
3749
|
}) }));
|
|
3813
3750
|
};
|
|
3814
|
-
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 }) => {
|
|
3815
3752
|
// Determine effective form value (prefer prop, fallback to formData lookup)
|
|
3816
3753
|
const effectiveFormValue = formValue !== undefined ? formValue : (formData ? formData[component.id] : undefined);
|
|
3817
3754
|
// Use effectiveFormValue for logic instead of raw formValue
|
|
@@ -4089,8 +4026,10 @@ const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, f
|
|
|
4089
4026
|
}, 3000);
|
|
4090
4027
|
}, [getActiveThresholdConditions, onThresholdActionCompletion, component, onBasicPropertyActionCompletion]);
|
|
4091
4028
|
const handleRaiseIssueClick = React.useCallback(() => {
|
|
4029
|
+
if (issueRaised)
|
|
4030
|
+
return;
|
|
4092
4031
|
setShowRaiseIssueModal(true);
|
|
4093
|
-
}, []);
|
|
4032
|
+
}, [issueRaised]);
|
|
4094
4033
|
const handleRaiseIssueClose = React.useCallback(() => {
|
|
4095
4034
|
setShowRaiseIssueModal(false);
|
|
4096
4035
|
}, []);
|
|
@@ -4297,7 +4236,7 @@ const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, f
|
|
|
4297
4236
|
modalComponent.basic.value = selectedOption.value || effectiveValue;
|
|
4298
4237
|
}
|
|
4299
4238
|
return modalComponent;
|
|
4300
|
-
})(), formTemplateId: formTemplateId || '', notes: localNotes, attachments: localAttachments, isStandalone: isStandalone, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue
|
|
4239
|
+
})(), formTemplateId: formTemplateId || '', notes: localNotes, attachments: localAttachments, isStandalone: isStandalone, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user, onCreateIssue: onCreateIssue, onUpdateIssue: onUpdateIssue }))] }));
|
|
4301
4240
|
};
|
|
4302
4241
|
|
|
4303
4242
|
// Attachment Thumbnails Component for Submission View
|
|
@@ -4363,7 +4302,7 @@ function ensureStringId$2(id) {
|
|
|
4363
4302
|
}
|
|
4364
4303
|
return String(id);
|
|
4365
4304
|
}
|
|
4366
|
-
const DraggableGridComponent = ({ component, selectedComponent, mode, onComponentSelect, onComponentDelete, onComponentEdit, renderFormComponent, isOverlay = false, formData = {}, formTemplateId, onThresholdIssueRaised, onNotesChange, onAttachmentChange, shouldShowComponent }) => {
|
|
4305
|
+
const DraggableGridComponent = ({ component, selectedComponent, mode, onComponentSelect, onComponentDelete, onComponentEdit, renderFormComponent, isOverlay = false, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, shouldShowComponent }) => {
|
|
4367
4306
|
const formValue = formData[component.id];
|
|
4368
4307
|
const isVisible = shouldShowComponent ? shouldShowComponent(component.id) : true;
|
|
4369
4308
|
// Check if component has notes or attachments for submission view
|
|
@@ -4534,7 +4473,8 @@ const GridDropZone = ({ gridComponents, mode, onComponentSelect, onComponentDele
|
|
|
4534
4473
|
}, children: isOver ? (jsxRuntime.jsx("span", { style: { color: '#3b82f6', fontWeight: '500' }, children: "Drop component here to add to grid" })) : (jsxRuntime.jsx("span", { children: "+ Drop more components here" })) })] })) }));
|
|
4535
4474
|
};
|
|
4536
4475
|
// Sub-component for displaying entries (TableView)
|
|
4537
|
-
const TableView = ({ templateComponents, dataEntries, renderFormComponent, mode, allowAddRemoveEntries, addAnotherText, removeText, maxEntries, minEntries, displayAsGrid = true, onAddEntry, onRemoveEntry, formData,
|
|
4476
|
+
const TableView = ({ templateComponents, dataEntries, renderFormComponent, mode, allowAddRemoveEntries, addAnotherText, removeText, maxEntries, minEntries, displayAsGrid = true, onAddEntry, onRemoveEntry, formData, // Use current formData to render values
|
|
4477
|
+
formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, columnView, shouldShowComponent }) => {
|
|
4538
4478
|
const _formData = formData || {};
|
|
4539
4479
|
const visibleTemplateComponents = React.useMemo(() => {
|
|
4540
4480
|
if (!shouldShowComponent)
|
|
@@ -5201,7 +5141,7 @@ const DfFormDataGrid = ({ id, properties, mode = 'edit', formData = {}, onValueC
|
|
|
5201
5141
|
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 })) }))] }));
|
|
5202
5142
|
};
|
|
5203
5143
|
|
|
5204
|
-
const DraggableChild = ({ child, selectedChild, mode, onChildSelect, onChildDelete, renderFormComponent, isOverlay = false, isChildrenEditMode = false, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue
|
|
5144
|
+
const DraggableChild = ({ child, selectedChild, mode, onChildSelect, onChildDelete, renderFormComponent, isOverlay = false, isChildrenEditMode = false, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
|
|
5205
5145
|
const formValue = formData[child.id];
|
|
5206
5146
|
// Check if component has notes or attachments for submission view
|
|
5207
5147
|
const hasSubmissionData = mode === 'preview' && ((child.basic?.notes && child.basic.notes.trim().length > 0) ||
|
|
@@ -5219,9 +5159,9 @@ const DraggableChild = ({ child, selectedChild, mode, onChildSelect, onChildDele
|
|
|
5219
5159
|
return (jsxRuntime.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) && (jsxRuntime.jsx("div", { className: "child-drag-handle", ...listeners, ...attributes, onClick: (e) => e.stopPropagation(), onMouseDown: (e) => e.stopPropagation(), children: jsxRuntime.jsx(lucideReact.GripVertical, { size: 14 }) })), jsxRuntime.jsxs("div", { className: "form-component-content section-child-content", children: [(mode === 'edit' || isChildrenEditMode) && (jsxRuntime.jsxs("div", { className: "component-actions child-actions", children: [jsxRuntime.jsx("button", { className: "btn edit-btn", onClick: (e) => {
|
|
5220
5160
|
e.stopPropagation();
|
|
5221
5161
|
onChildSelect(child);
|
|
5222
|
-
}, onMouseDown: (e) => e.stopPropagation(), title: "Edit properties", children: jsxRuntime.jsx(lucideReact.Edit, { size: 12 }) }), jsxRuntime.jsx("button", { className: "btn delete-btn", onClick: (e) => onChildDelete(child, e), onMouseDown: (e) => e.stopPropagation(), title: "Delete component", children: jsxRuntime.jsx(lucideReact.Trash2, { size: 12 }) })] })), jsxRuntime.jsxs("div", { className: "component-preview child-preview", children: [renderFormComponent(child), !['section', 'table', 'heading', 'file', 'instructions', 'signature', 'location', 'datagrid'].includes(child.name) && (jsxRuntime.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
|
|
5162
|
+
}, onMouseDown: (e) => e.stopPropagation(), title: "Edit properties", children: jsxRuntime.jsx(lucideReact.Edit, { size: 12 }) }), jsxRuntime.jsx("button", { className: "btn delete-btn", onClick: (e) => onChildDelete(child, e), onMouseDown: (e) => e.stopPropagation(), title: "Delete component", children: jsxRuntime.jsx(lucideReact.Trash2, { size: 12 }) })] })), jsxRuntime.jsxs("div", { className: "component-preview child-preview", children: [renderFormComponent(child), !['section', 'table', 'heading', 'file', 'instructions', 'signature', 'location', 'datagrid'].includes(child.name) && (jsxRuntime.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 && (jsxRuntime.jsx(ComponentSubmissionActions, { component: child }))] })] })] }));
|
|
5223
5163
|
};
|
|
5224
|
-
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
|
|
5164
|
+
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 }) => {
|
|
5225
5165
|
const [isCollapsed, setIsCollapsed] = React.useState(properties.basic.collapsed);
|
|
5226
5166
|
const [isEditingTitle, setIsEditingTitle] = React.useState(false);
|
|
5227
5167
|
const [isEditingDescription, setIsEditingDescription] = React.useState(false);
|
|
@@ -5434,7 +5374,7 @@ const DfFormSection = ({ id, properties, mode = 'edit', formData = {}, onValueCh
|
|
|
5434
5374
|
}, children: isOver ? 'Drop components here' : 'Empty Section' }), jsxRuntime.jsx("div", { style: {
|
|
5435
5375
|
fontSize: '12px',
|
|
5436
5376
|
color: '#9ca3af'
|
|
5437
|
-
}, children: "Drag and drop components here to create your section" })] })) : (children.map((child) => (jsxRuntime.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
|
|
5377
|
+
}, children: "Drag and drop components here to create your section" })] })) : (children.map((child) => (jsxRuntime.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)))) }) }))] }));
|
|
5438
5378
|
};
|
|
5439
5379
|
|
|
5440
5380
|
// Dynamic imports to avoid circular dependencies
|
|
@@ -5484,7 +5424,7 @@ const normalizeTableRow = (row) => {
|
|
|
5484
5424
|
};
|
|
5485
5425
|
const DfFormPreview = ({ formComponents = [], currentDevice = 'desktop', isPreviewMode = false, initialFormData = [], onSubmit, onFormDataChange, formTitle, formDescription, formTemplateId,
|
|
5486
5426
|
// Add component management props for edit mode
|
|
5487
|
-
onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, selectedComponent, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue
|
|
5427
|
+
onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, selectedComponent, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
|
|
5488
5428
|
// Local copy of formComponents so structure updates (e.g. table cell init) are reflected immediately
|
|
5489
5429
|
const [localFormComponents, setLocalFormComponents] = React.useState(formComponents);
|
|
5490
5430
|
// Sync local state when the prop changes from the parent
|
|
@@ -6839,7 +6779,7 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
|
|
|
6839
6779
|
case 'email-input':
|
|
6840
6780
|
// Regular text/email/number input
|
|
6841
6781
|
return (jsxRuntime.jsx(DfFormInput, { ...commonProps, properties: component, inputType: component.name === 'text-input' ? 'text' :
|
|
6842
|
-
component.name === 'number-input' ? 'number' : 'email', formTemplateId: formTemplateId, onThresholdIssueRaised: handleThresholdIssueRaised, raisedThresholdIssues: raisedThresholdIssues, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user
|
|
6782
|
+
component.name === 'number-input' ? 'number' : 'email', formTemplateId: formTemplateId, onThresholdIssueRaised: handleThresholdIssueRaised, raisedThresholdIssues: raisedThresholdIssues, workOrderNumber: workOrderNumber, assetNumber: assetNumber, user: user }));
|
|
6843
6783
|
case 'textarea':
|
|
6844
6784
|
return jsxRuntime.jsx(DfFormTextarea, { ...commonProps, properties: component });
|
|
6845
6785
|
case 'select':
|
|
@@ -6905,13 +6845,13 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
|
|
|
6905
6845
|
case 'location':
|
|
6906
6846
|
return jsxRuntime.jsx(DfFormLocation, { ...commonProps, properties: component });
|
|
6907
6847
|
case 'section':
|
|
6908
|
-
return (jsxRuntime.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,
|
|
6848
|
+
return (jsxRuntime.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) => {
|
|
6909
6849
|
// Ensure the nested component gets the proper form value
|
|
6910
6850
|
// const fieldValue = formValues[field.id] || (field.basic as any)?.value || (field.basic as any)?.defaultValue || ''
|
|
6911
6851
|
return renderFormComponent(field);
|
|
6912
6852
|
} }));
|
|
6913
6853
|
case 'table':
|
|
6914
|
-
return (jsxRuntime.jsx(React.Suspense, { fallback: jsxRuntime.jsx("div", { children: "Loading table..." }), children: jsxRuntime.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,
|
|
6854
|
+
return (jsxRuntime.jsx(React.Suspense, { fallback: jsxRuntime.jsx("div", { children: "Loading table..." }), children: jsxRuntime.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) => {
|
|
6915
6855
|
return renderFormComponent(field);
|
|
6916
6856
|
}, onNotesChange: (componentId, notes) => {
|
|
6917
6857
|
// Handle notes change for table cell components
|
|
@@ -7249,7 +7189,7 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
|
|
|
7249
7189
|
return comp;
|
|
7250
7190
|
});
|
|
7251
7191
|
onFormDataChange?.(updatedComponents);
|
|
7252
|
-
}, 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
|
|
7192
|
+
}, 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 && (jsxRuntime.jsx(ComponentSubmissionActions, { component: component }))] }, component.id));
|
|
7253
7193
|
}), !isPreviewMode && (jsxRuntime.jsxs("div", { className: "form-actions", children: [!formSubmitted && (jsxRuntime.jsx("button", { type: "button", onClick: () => handleSubmit('Saved'), className: "form-save-button", disabled: formSubmitted && !isFormValid(), children: "Save" })), jsxRuntime.jsx("button", { type: "button", disabled: !isFormValid() || !thresholdValidationState.isValid, className: "form-submit-button", title: !thresholdValidationState.isValid ? thresholdValidationState.errorMessage : '', onClick: () => handleSubmit('Submitted'), children: "Submit" })] }))] }))] }) }) }));
|
|
7254
7194
|
};
|
|
7255
7195
|
|
|
@@ -7344,12 +7284,12 @@ const ensureComponentHasId = (component) => {
|
|
|
7344
7284
|
}
|
|
7345
7285
|
return component;
|
|
7346
7286
|
};
|
|
7347
|
-
const SimpleTableComponent = ({ component, mode, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue
|
|
7287
|
+
const SimpleTableComponent = ({ component, mode, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
|
|
7348
7288
|
const formValue = formData[component.id];
|
|
7349
7289
|
// Check if component has notes or attachments for submission view
|
|
7350
7290
|
const hasSubmissionData = mode === 'preview' && ((component.basic?.notes && component.basic.notes.trim().length > 0) ||
|
|
7351
7291
|
(component.basic?.attachments && Array.isArray(component.basic.attachments) && component.basic.attachments.length > 0));
|
|
7352
|
-
return (jsxRuntime.jsxs("div", { className: "simple-table-component", children: [renderFormComponent(component), !['section', 'table', 'heading', 'file', 'instructions', 'signature', 'location', 'datagrid'].includes(component.name) && (jsxRuntime.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
|
|
7292
|
+
return (jsxRuntime.jsxs("div", { className: "simple-table-component", children: [renderFormComponent(component), !['section', 'table', 'heading', 'file', 'instructions', 'signature', 'location', 'datagrid'].includes(component.name) && (jsxRuntime.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 && (jsxRuntime.jsx(ComponentSubmissionActions, { component: component }))] }));
|
|
7353
7293
|
};
|
|
7354
7294
|
const DraggableTableComponent = ({ component, selectedComponent, mode, onComponentSelect, onComponentDelete, onComponentEdit, renderFormComponent, isOverlay = false, }) => {
|
|
7355
7295
|
const { attributes, listeners, setNodeRef, transform, transition, isDragging, isSorting, } = sortable.useSortable({
|
|
@@ -7370,7 +7310,7 @@ const DraggableTableComponent = ({ component, selectedComponent, mode, onCompone
|
|
|
7370
7310
|
onComponentDelete(component, e);
|
|
7371
7311
|
}, type: "button", title: "Delete Component", children: jsxRuntime.jsx(lucideReact.Trash2, { size: 12 }) })] }))] }));
|
|
7372
7312
|
};
|
|
7373
|
-
const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete, onComponentEdit, selectedComponent, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, tableId, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, user, onCreateIssue, onUpdateIssue
|
|
7313
|
+
const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete, onComponentEdit, selectedComponent, renderFormComponent, formData = {}, formTemplateId, onThresholdActionCompletion, onThresholdIssueRaised, tableId, onNotesChange, onAttachmentChange, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
|
|
7374
7314
|
const dropZoneId = `table-cell-${tableId}-${cell.row}-${cell.column}`;
|
|
7375
7315
|
const { setNodeRef, isOver } = core.useDroppable({
|
|
7376
7316
|
id: dropZoneId,
|
|
@@ -7405,7 +7345,7 @@ const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete,
|
|
|
7405
7345
|
cell.components.map((component) => {
|
|
7406
7346
|
// Only ensure ID if it's truly missing - don't regenerate existing IDs
|
|
7407
7347
|
const componentWithId = component.id ? component : ensureComponentHasId(component);
|
|
7408
|
-
return (jsxRuntime.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
|
|
7348
|
+
return (jsxRuntime.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));
|
|
7409
7349
|
}))) : (
|
|
7410
7350
|
// Only show drop zone content in edit mode
|
|
7411
7351
|
mode === 'edit' ? (jsxRuntime.jsx("div", { className: "empty-cell-placeholder", children: jsxRuntime.jsxs("div", { className: "cell-info", children: [jsxRuntime.jsx("span", { className: "drop-zone-text", children: "Drag and Drop a form component" }), jsxRuntime.jsxs("span", { className: "cell-coordinates", children: ["Cell (", cell.row + 1, ", ", cell.column + 1, ")"] })] }) })) : (
|
|
@@ -7416,7 +7356,7 @@ const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete,
|
|
|
7416
7356
|
visibility: 'hidden' // Hide content but maintain space
|
|
7417
7357
|
}, children: "\u00A0" }))) }) }));
|
|
7418
7358
|
};
|
|
7419
|
-
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
|
|
7359
|
+
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 }) => {
|
|
7420
7360
|
const [isCollapsed, setIsCollapsed] = React.useState(false); // Always start expanded to show drop zones
|
|
7421
7361
|
// CRITICAL: Normalize cells from API format (object with numeric keys) to proper 2D array
|
|
7422
7362
|
// The API may return cells as [{"0": {cell}, "1": {cell}}, ...] instead of [[cell, cell], ...]
|
|
@@ -7654,7 +7594,7 @@ const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationE
|
|
|
7654
7594
|
fontSize: '14px',
|
|
7655
7595
|
textAlign: 'center'
|
|
7656
7596
|
}, children: columnName }, `header-${colIndex}`));
|
|
7657
|
-
}) }) })), jsxRuntime.jsx("tbody", { children: cellsWithIds.map((row, rowIndex) => (jsxRuntime.jsx("tr", { className: "table-row", children: row.map((cell) => (jsxRuntime.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
|
|
7597
|
+
}) }) })), jsxRuntime.jsx("tbody", { children: cellsWithIds.map((row, rowIndex) => (jsxRuntime.jsx("tr", { className: "table-row", children: row.map((cell) => (jsxRuntime.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))) })] })] }))] }));
|
|
7658
7598
|
};
|
|
7659
7599
|
|
|
7660
7600
|
var dfFormTable = /*#__PURE__*/Object.freeze({
|