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.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,15 +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
|
-
onCreateIssue?: (issueData: any, attachments:
|
|
712
|
+
onCreateIssue?: (issueData: any, attachments: File[]) => Promise<any>;
|
|
716
713
|
onUpdateIssue?: (issueId: string, updateData: any) => Promise<void>;
|
|
717
|
-
allowWorkflowActions?: boolean;
|
|
718
|
-
inEditMode?: boolean;
|
|
719
|
-
isStandalone?: boolean;
|
|
720
714
|
}
|
|
721
715
|
declare const DfFormSection: React.FC<DfFormSectionProps>;
|
|
722
716
|
|
|
@@ -786,15 +780,13 @@ interface DfFormTableProps {
|
|
|
786
780
|
onAttachmentChange?: (componentId: string, attachments: File[] | null) => void;
|
|
787
781
|
workOrderNumber?: string;
|
|
788
782
|
assetNumber?: string;
|
|
783
|
+
isStandalone?: boolean;
|
|
789
784
|
user?: {
|
|
790
785
|
firstName?: string;
|
|
791
786
|
lastName?: string;
|
|
792
787
|
};
|
|
793
|
-
onCreateIssue?: (issueData: any, attachments:
|
|
788
|
+
onCreateIssue?: (issueData: any, attachments: File[]) => Promise<any>;
|
|
794
789
|
onUpdateIssue?: (issueId: string, updateData: any) => Promise<void>;
|
|
795
|
-
allowWorkflowActions?: boolean;
|
|
796
|
-
inEditMode?: boolean;
|
|
797
|
-
isStandalone?: boolean;
|
|
798
790
|
}
|
|
799
791
|
declare const DfFormTable: React.FC<DfFormTableProps>;
|
|
800
792
|
|
|
@@ -820,8 +812,6 @@ interface IComponentActionFeaturesProps {
|
|
|
820
812
|
};
|
|
821
813
|
onCreateIssue?: (issueData: any, attachments: File[]) => Promise<any>;
|
|
822
814
|
onUpdateIssue?: (issueId: string, updateData: any) => Promise<void>;
|
|
823
|
-
allowWorkflowActions?: boolean;
|
|
824
|
-
inEditMode?: boolean;
|
|
825
815
|
}
|
|
826
816
|
declare const ComponentActionFeatures: React.FC<IComponentActionFeaturesProps>;
|
|
827
817
|
|
|
@@ -846,8 +836,6 @@ interface IThresholdAlertProps {
|
|
|
846
836
|
onIssueRaised?: (conditionId: string) => void;
|
|
847
837
|
isIssueRaised?: boolean;
|
|
848
838
|
compact?: boolean;
|
|
849
|
-
allowWorkflowActions?: boolean;
|
|
850
|
-
inEditMode?: boolean;
|
|
851
839
|
}
|
|
852
840
|
declare const ThresholdAlert: React.FC<IThresholdAlertProps>;
|
|
853
841
|
|
|
@@ -878,7 +866,7 @@ interface IRaiseIssueModalProps {
|
|
|
878
866
|
notes?: string;
|
|
879
867
|
attachments?: File[] | null;
|
|
880
868
|
issue?: IIssue | null;
|
|
881
|
-
onCreateIssue?: (issueData: any, attachments:
|
|
869
|
+
onCreateIssue?: (issueData: any, attachments: File[]) => Promise<IIssue>;
|
|
882
870
|
onUpdateIssue?: (issueId: string, updateData: any) => Promise<void>;
|
|
883
871
|
user?: {
|
|
884
872
|
firstName?: string;
|
package/dist/index.esm.js
CHANGED
|
@@ -325,16 +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,
|
|
336
|
-
//
|
|
337
|
-
|
|
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.
|
|
338
339
|
const [title, setTitle] = useState('');
|
|
339
340
|
const [description, setDescription] = useState('');
|
|
340
341
|
const [workOrderNumber, setWorkOrderNumber] = useState('');
|
|
@@ -350,11 +351,6 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
350
351
|
const [isViewMode, setIsViewMode] = useState(!!issue && !inEditMode);
|
|
351
352
|
const fileInputRef = React.useRef(null);
|
|
352
353
|
const isEditMode = isEdit !== undefined ? isEdit : !!issue;
|
|
353
|
-
// Determine if workflow actions should be enabled
|
|
354
|
-
// If explicitly provided, use that. Otherwise, default to showing them if we have an existing issue.
|
|
355
|
-
const showWorkflowActions = allowWorkflowActions !== undefined
|
|
356
|
-
? allowWorkflowActions
|
|
357
|
-
: !!issue;
|
|
358
354
|
useEffect(() => {
|
|
359
355
|
if (isOpen) {
|
|
360
356
|
// In edit mode, prioritize issue attachments from API
|
|
@@ -408,14 +404,6 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
408
404
|
setLocalAttachments(prev => [...prev, ...newFiles]);
|
|
409
405
|
}
|
|
410
406
|
};
|
|
411
|
-
const convertFileToBase64 = (file) => {
|
|
412
|
-
return new Promise((resolve, reject) => {
|
|
413
|
-
const reader = new FileReader();
|
|
414
|
-
reader.readAsDataURL(file);
|
|
415
|
-
reader.onload = () => resolve(reader.result);
|
|
416
|
-
reader.onerror = error => reject(error);
|
|
417
|
-
});
|
|
418
|
-
};
|
|
419
407
|
const getAttachmentName = (file) => {
|
|
420
408
|
if (!file)
|
|
421
409
|
return 'Attachment';
|
|
@@ -446,25 +434,10 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
446
434
|
}
|
|
447
435
|
return null;
|
|
448
436
|
}
|
|
449
|
-
if (file.data)
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
// Handle raw base64 data from API
|
|
453
|
-
if (file.fileName && isImage(file.fileName)) {
|
|
454
|
-
const fileName = String(file.fileName).toLowerCase();
|
|
455
|
-
let mimeType = 'image/png'; // Default
|
|
456
|
-
if (fileName.endsWith('.jpg') || fileName.endsWith('.jpeg'))
|
|
457
|
-
mimeType = 'image/jpeg';
|
|
458
|
-
else if (fileName.endsWith('.png'))
|
|
459
|
-
mimeType = 'image/png';
|
|
460
|
-
else if (fileName.endsWith('.gif'))
|
|
461
|
-
mimeType = 'image/gif';
|
|
462
|
-
else if (fileName.endsWith('.webp'))
|
|
463
|
-
mimeType = 'image/webp';
|
|
464
|
-
return `data:${mimeType};base64,${file.data}`;
|
|
465
|
-
}
|
|
437
|
+
if (file.data && isDataUrlImage(file.data))
|
|
438
|
+
return file.data;
|
|
439
|
+
if (file.fileName && isImage(file.fileName) && file.data)
|
|
466
440
|
return file.data;
|
|
467
|
-
}
|
|
468
441
|
return null;
|
|
469
442
|
};
|
|
470
443
|
useEffect(() => {
|
|
@@ -476,22 +449,12 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
476
449
|
setWorkOrderNumber(issue?.workOrderNumber || initialWorkOrderNumber || '');
|
|
477
450
|
setAssetNumber(issue?.assetNumber || initialAssetNumber || '');
|
|
478
451
|
setPriority(issue?.priority || 'Medium');
|
|
452
|
+
// Use enum value or default to OPEN
|
|
479
453
|
const issueStatus = issue?.status || EIssueStatus.OPEN;
|
|
480
454
|
// Normalize to enum values if needed (handle legacy values)
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
if (statusLower === 'open')
|
|
485
|
-
normalizedStatus = EIssueStatus.OPEN;
|
|
486
|
-
else if (statusLower === 'in-progress' || statusLower === 'in progress' || statusLower === 'inprogress')
|
|
487
|
-
normalizedStatus = EIssueStatus.IN_PROGRESS;
|
|
488
|
-
else if (statusLower === 'rejected')
|
|
489
|
-
normalizedStatus = EIssueStatus.REJECTED;
|
|
490
|
-
else if (statusLower === 'resolved' || statusLower === 'resolve')
|
|
491
|
-
normalizedStatus = EIssueStatus.RESOLVE;
|
|
492
|
-
else
|
|
493
|
-
normalizedStatus = issueStatus; // Fallback to whatever it is if it's not matched but it might be valid
|
|
494
|
-
}
|
|
455
|
+
const normalizedStatus = issueStatus === EIssueStatus.OPEN || issueStatus === EIssueStatus.IN_PROGRESS || issueStatus === EIssueStatus.REJECTED || issueStatus === EIssueStatus.RESOLVE
|
|
456
|
+
? issueStatus
|
|
457
|
+
: EIssueStatus.OPEN;
|
|
495
458
|
setStatus(normalizedStatus);
|
|
496
459
|
// Correctly map assignTo or fallback to assignee
|
|
497
460
|
setAssignee(issue?.assignTo || '');
|
|
@@ -610,17 +573,6 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
610
573
|
try {
|
|
611
574
|
if (isEditMode && issue) {
|
|
612
575
|
// Update existing issue
|
|
613
|
-
// Convert attachments to base64 objects for API
|
|
614
|
-
const attachmentObjects = await Promise.all(localAttachments.map(async (file) => {
|
|
615
|
-
if (file instanceof File) {
|
|
616
|
-
const base64 = await convertFileToBase64(file);
|
|
617
|
-
return {
|
|
618
|
-
fileName: file.name,
|
|
619
|
-
data: base64
|
|
620
|
-
};
|
|
621
|
-
}
|
|
622
|
-
return file; // Already a data object
|
|
623
|
-
}));
|
|
624
576
|
const updateData = {
|
|
625
577
|
title: String(title || '').trim(),
|
|
626
578
|
description: String(description || '').trim(),
|
|
@@ -633,9 +585,7 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
633
585
|
status: status,
|
|
634
586
|
comments: String(comments || '').trim() || '',
|
|
635
587
|
task: issue.component?.basic?.label || '',
|
|
636
|
-
taskValue: issue.component?.basic?.value || ''
|
|
637
|
-
isStandalone: !!isStandalone,
|
|
638
|
-
attachments: attachmentObjects
|
|
588
|
+
taskValue: issue.component?.basic?.value || ''
|
|
639
589
|
};
|
|
640
590
|
if (onUpdateIssue && issue._id) {
|
|
641
591
|
await onUpdateIssue(issue._id, updateData);
|
|
@@ -667,17 +617,6 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
667
617
|
comments: String(notes || '')
|
|
668
618
|
}
|
|
669
619
|
};
|
|
670
|
-
// Convert attachments to base64 objects for API
|
|
671
|
-
const attachmentObjects = await Promise.all(localAttachments.map(async (file) => {
|
|
672
|
-
if (file instanceof File) {
|
|
673
|
-
const base64 = await convertFileToBase64(file);
|
|
674
|
-
return {
|
|
675
|
-
fileName: file.name,
|
|
676
|
-
data: base64
|
|
677
|
-
};
|
|
678
|
-
}
|
|
679
|
-
return file; // Already a data object
|
|
680
|
-
}));
|
|
681
620
|
const createdBy = user ? `${user.firstName || ''} ${user.lastName || ''}`.trim() : 'User';
|
|
682
621
|
const issueData = {
|
|
683
622
|
title: String(title || '').trim(),
|
|
@@ -692,13 +631,11 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
692
631
|
comments: String(comments || '').trim() || '',
|
|
693
632
|
createdBy,
|
|
694
633
|
task: component?.basic?.label || '',
|
|
695
|
-
taskValue: component?.basic?.value || ''
|
|
696
|
-
isStandalone: !!isStandalone,
|
|
697
|
-
attachments: attachmentObjects // Include in data as well
|
|
634
|
+
taskValue: component?.basic?.value || ''
|
|
698
635
|
};
|
|
699
|
-
let createdIssueResponse;
|
|
636
|
+
let createdIssueResponse; // Renamed to avoid conflict with instruction's const
|
|
700
637
|
if (onCreateIssue) {
|
|
701
|
-
createdIssueResponse = await onCreateIssue(issueData,
|
|
638
|
+
createdIssueResponse = await onCreateIssue(issueData, localAttachments);
|
|
702
639
|
}
|
|
703
640
|
toastService.showSuccess('Issue raised successfully');
|
|
704
641
|
if (onSuccess) {
|
|
@@ -752,12 +689,12 @@ const RaiseIssueModal = ({ isOpen, onClose, onSuccess, component, formTemplateId
|
|
|
752
689
|
hour: '2-digit',
|
|
753
690
|
minute: '2-digit',
|
|
754
691
|
hour12: true
|
|
755
|
-
}) })] })] }), 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' }))] }) })] }) }));
|
|
756
693
|
// Render modal using portal to document body for full-page overlay
|
|
757
694
|
return createPortal(modalContent, document.body);
|
|
758
695
|
};
|
|
759
696
|
|
|
760
|
-
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 }) => {
|
|
761
698
|
const [showRaiseIssueModal, setShowRaiseIssueModal] = useState(false);
|
|
762
699
|
const [issue, setIssue] = useState(null);
|
|
763
700
|
const [isLoadingIssue, setIsLoadingIssue] = useState(false);
|
|
@@ -849,16 +786,16 @@ const ThresholdAlert = ({ component, condition, currentValue, thresholdValue, fo
|
|
|
849
786
|
// If issue is raised (either from prop or local state), don't show anything
|
|
850
787
|
// The ComponentActionFeatures will handle showing the raised issue state
|
|
851
788
|
if (isIssueRaised || localIssueRaised) {
|
|
852
|
-
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 })) }));
|
|
853
790
|
}
|
|
854
791
|
// Show compact version for small screens/tables
|
|
855
792
|
if (compact) {
|
|
856
|
-
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 }))] }));
|
|
857
794
|
}
|
|
858
|
-
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 }))] }));
|
|
859
796
|
};
|
|
860
797
|
|
|
861
|
-
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 }) => {
|
|
862
799
|
// Ensure formValue is always a string to prevent [object Object] errors
|
|
863
800
|
const getStringValue = (val) => {
|
|
864
801
|
if (val === null || val === undefined)
|
|
@@ -1222,7 +1159,7 @@ const DfFormInput = ({ id, properties, validationErrors = {}, formValue = '', in
|
|
|
1222
1159
|
inputWrapperRef.current?.closest('.datagrid-list-view') !== null ||
|
|
1223
1160
|
className.includes('table-cell') ||
|
|
1224
1161
|
className.includes('cell-content');
|
|
1225
|
-
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}`));
|
|
1226
1163
|
})()] }));
|
|
1227
1164
|
};
|
|
1228
1165
|
|
|
@@ -3809,7 +3746,7 @@ const AttachmentThumbnails = ({ attachments, onRemove }) => {
|
|
|
3809
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));
|
|
3810
3747
|
}) }));
|
|
3811
3748
|
};
|
|
3812
|
-
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 }) => {
|
|
3813
3750
|
// Determine effective form value (prefer prop, fallback to formData lookup)
|
|
3814
3751
|
const effectiveFormValue = formValue !== undefined ? formValue : (formData ? formData[component.id] : undefined);
|
|
3815
3752
|
// Use effectiveFormValue for logic instead of raw formValue
|
|
@@ -4087,8 +4024,10 @@ const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, f
|
|
|
4087
4024
|
}, 3000);
|
|
4088
4025
|
}, [getActiveThresholdConditions, onThresholdActionCompletion, component, onBasicPropertyActionCompletion]);
|
|
4089
4026
|
const handleRaiseIssueClick = useCallback(() => {
|
|
4027
|
+
if (issueRaised)
|
|
4028
|
+
return;
|
|
4090
4029
|
setShowRaiseIssueModal(true);
|
|
4091
|
-
}, []);
|
|
4030
|
+
}, [issueRaised]);
|
|
4092
4031
|
const handleRaiseIssueClose = useCallback(() => {
|
|
4093
4032
|
setShowRaiseIssueModal(false);
|
|
4094
4033
|
}, []);
|
|
@@ -4295,7 +4234,7 @@ const ComponentActionFeatures = ({ component, mode, formTemplateId, formValue, f
|
|
|
4295
4234
|
modalComponent.basic.value = selectedOption.value || effectiveValue;
|
|
4296
4235
|
}
|
|
4297
4236
|
return modalComponent;
|
|
4298
|
-
})(), 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 }))] }));
|
|
4299
4238
|
};
|
|
4300
4239
|
|
|
4301
4240
|
// Attachment Thumbnails Component for Submission View
|
|
@@ -4361,7 +4300,7 @@ function ensureStringId$2(id) {
|
|
|
4361
4300
|
}
|
|
4362
4301
|
return String(id);
|
|
4363
4302
|
}
|
|
4364
|
-
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 }) => {
|
|
4365
4304
|
const formValue = formData[component.id];
|
|
4366
4305
|
const isVisible = shouldShowComponent ? shouldShowComponent(component.id) : true;
|
|
4367
4306
|
// Check if component has notes or attachments for submission view
|
|
@@ -4532,7 +4471,8 @@ const GridDropZone = ({ gridComponents, mode, onComponentSelect, onComponentDele
|
|
|
4532
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" })) })] })) }));
|
|
4533
4472
|
};
|
|
4534
4473
|
// Sub-component for displaying entries (TableView)
|
|
4535
|
-
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 }) => {
|
|
4536
4476
|
const _formData = formData || {};
|
|
4537
4477
|
const visibleTemplateComponents = React.useMemo(() => {
|
|
4538
4478
|
if (!shouldShowComponent)
|
|
@@ -5199,7 +5139,7 @@ const DfFormDataGrid = ({ id, properties, mode = 'edit', formData = {}, onValueC
|
|
|
5199
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 })) }))] }));
|
|
5200
5140
|
};
|
|
5201
5141
|
|
|
5202
|
-
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 }) => {
|
|
5203
5143
|
const formValue = formData[child.id];
|
|
5204
5144
|
// Check if component has notes or attachments for submission view
|
|
5205
5145
|
const hasSubmissionData = mode === 'preview' && ((child.basic?.notes && child.basic.notes.trim().length > 0) ||
|
|
@@ -5217,9 +5157,9 @@ const DraggableChild = ({ child, selectedChild, mode, onChildSelect, onChildDele
|
|
|
5217
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) => {
|
|
5218
5158
|
e.stopPropagation();
|
|
5219
5159
|
onChildSelect(child);
|
|
5220
|
-
}, 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 }))] })] })] }));
|
|
5221
5161
|
};
|
|
5222
|
-
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 }) => {
|
|
5223
5163
|
const [isCollapsed, setIsCollapsed] = useState(properties.basic.collapsed);
|
|
5224
5164
|
const [isEditingTitle, setIsEditingTitle] = useState(false);
|
|
5225
5165
|
const [isEditingDescription, setIsEditingDescription] = useState(false);
|
|
@@ -5432,7 +5372,7 @@ const DfFormSection = ({ id, properties, mode = 'edit', formData = {}, onValueCh
|
|
|
5432
5372
|
}, children: isOver ? 'Drop components here' : 'Empty Section' }), jsx("div", { style: {
|
|
5433
5373
|
fontSize: '12px',
|
|
5434
5374
|
color: '#9ca3af'
|
|
5435
|
-
}, 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)))) }) }))] }));
|
|
5436
5376
|
};
|
|
5437
5377
|
|
|
5438
5378
|
// Dynamic imports to avoid circular dependencies
|
|
@@ -5482,7 +5422,7 @@ const normalizeTableRow = (row) => {
|
|
|
5482
5422
|
};
|
|
5483
5423
|
const DfFormPreview = ({ formComponents = [], currentDevice = 'desktop', isPreviewMode = false, initialFormData = [], onSubmit, onFormDataChange, formTitle, formDescription, formTemplateId,
|
|
5484
5424
|
// Add component management props for edit mode
|
|
5485
|
-
onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, selectedComponent, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue
|
|
5425
|
+
onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, selectedComponent, workOrderNumber, assetNumber, isStandalone, user, onCreateIssue, onUpdateIssue }) => {
|
|
5486
5426
|
// Local copy of formComponents so structure updates (e.g. table cell init) are reflected immediately
|
|
5487
5427
|
const [localFormComponents, setLocalFormComponents] = useState(formComponents);
|
|
5488
5428
|
// Sync local state when the prop changes from the parent
|
|
@@ -6837,7 +6777,7 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
|
|
|
6837
6777
|
case 'email-input':
|
|
6838
6778
|
// Regular text/email/number input
|
|
6839
6779
|
return (jsx(DfFormInput, { ...commonProps, properties: component, inputType: component.name === 'text-input' ? 'text' :
|
|
6840
|
-
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 }));
|
|
6841
6781
|
case 'textarea':
|
|
6842
6782
|
return jsx(DfFormTextarea, { ...commonProps, properties: component });
|
|
6843
6783
|
case 'select':
|
|
@@ -6903,13 +6843,13 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
|
|
|
6903
6843
|
case 'location':
|
|
6904
6844
|
return jsx(DfFormLocation, { ...commonProps, properties: component });
|
|
6905
6845
|
case 'section':
|
|
6906
|
-
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) => {
|
|
6907
6847
|
// Ensure the nested component gets the proper form value
|
|
6908
6848
|
// const fieldValue = formValues[field.id] || (field.basic as any)?.value || (field.basic as any)?.defaultValue || ''
|
|
6909
6849
|
return renderFormComponent(field);
|
|
6910
6850
|
} }));
|
|
6911
6851
|
case 'table':
|
|
6912
|
-
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) => {
|
|
6913
6853
|
return renderFormComponent(field);
|
|
6914
6854
|
}, onNotesChange: (componentId, notes) => {
|
|
6915
6855
|
// Handle notes change for table cell components
|
|
@@ -7247,7 +7187,7 @@ onComponentSelect, onComponentDelete, onComponentEdit, onComponentUpdate, select
|
|
|
7247
7187
|
return comp;
|
|
7248
7188
|
});
|
|
7249
7189
|
onFormDataChange?.(updatedComponents);
|
|
7250
|
-
}, 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));
|
|
7251
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" })] }))] }))] }) }) }));
|
|
7252
7192
|
};
|
|
7253
7193
|
|
|
@@ -7342,12 +7282,12 @@ const ensureComponentHasId = (component) => {
|
|
|
7342
7282
|
}
|
|
7343
7283
|
return component;
|
|
7344
7284
|
};
|
|
7345
|
-
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 }) => {
|
|
7346
7286
|
const formValue = formData[component.id];
|
|
7347
7287
|
// Check if component has notes or attachments for submission view
|
|
7348
7288
|
const hasSubmissionData = mode === 'preview' && ((component.basic?.notes && component.basic.notes.trim().length > 0) ||
|
|
7349
7289
|
(component.basic?.attachments && Array.isArray(component.basic.attachments) && component.basic.attachments.length > 0));
|
|
7350
|
-
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 }))] }));
|
|
7351
7291
|
};
|
|
7352
7292
|
const DraggableTableComponent = ({ component, selectedComponent, mode, onComponentSelect, onComponentDelete, onComponentEdit, renderFormComponent, isOverlay = false, }) => {
|
|
7353
7293
|
const { attributes, listeners, setNodeRef, transform, transition, isDragging, isSorting, } = useSortable({
|
|
@@ -7368,7 +7308,7 @@ const DraggableTableComponent = ({ component, selectedComponent, mode, onCompone
|
|
|
7368
7308
|
onComponentDelete(component, e);
|
|
7369
7309
|
}, type: "button", title: "Delete Component", children: jsx(Trash2, { size: 12 }) })] }))] }));
|
|
7370
7310
|
};
|
|
7371
|
-
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 }) => {
|
|
7372
7312
|
const dropZoneId = `table-cell-${tableId}-${cell.row}-${cell.column}`;
|
|
7373
7313
|
const { setNodeRef, isOver } = useDroppable({
|
|
7374
7314
|
id: dropZoneId,
|
|
@@ -7403,7 +7343,7 @@ const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete,
|
|
|
7403
7343
|
cell.components.map((component) => {
|
|
7404
7344
|
// Only ensure ID if it's truly missing - don't regenerate existing IDs
|
|
7405
7345
|
const componentWithId = component.id ? component : ensureComponentHasId(component);
|
|
7406
|
-
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));
|
|
7407
7347
|
}))) : (
|
|
7408
7348
|
// Only show drop zone content in edit mode
|
|
7409
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, ")"] })] }) })) : (
|
|
@@ -7414,7 +7354,7 @@ const TableCellComponent = ({ cell, mode, onComponentSelect, onComponentDelete,
|
|
|
7414
7354
|
visibility: 'hidden' // Hide content but maintain space
|
|
7415
7355
|
}, children: "\u00A0" }))) }) }));
|
|
7416
7356
|
};
|
|
7417
|
-
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 }) => {
|
|
7418
7358
|
const [isCollapsed, setIsCollapsed] = useState(false); // Always start expanded to show drop zones
|
|
7419
7359
|
// CRITICAL: Normalize cells from API format (object with numeric keys) to proper 2D array
|
|
7420
7360
|
// The API may return cells as [{"0": {cell}, "1": {cell}}, ...] instead of [[cell, cell], ...]
|
|
@@ -7652,7 +7592,7 @@ const DfFormTable = ({ id, properties, mode = 'edit', formData = {}, validationE
|
|
|
7652
7592
|
fontSize: '14px',
|
|
7653
7593
|
textAlign: 'center'
|
|
7654
7594
|
}, children: columnName }, `header-${colIndex}`));
|
|
7655
|
-
}) }) })), 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))) })] })] }))] }));
|
|
7656
7596
|
};
|
|
7657
7597
|
|
|
7658
7598
|
var dfFormTable = /*#__PURE__*/Object.freeze({
|