summaryrefslogtreecommitdiff
path: root/components/form-data/sedp-components.tsx
diff options
context:
space:
mode:
authordujinkim <dujin.kim@dtsolution.co.kr>2025-04-28 02:13:30 +0000
committerdujinkim <dujin.kim@dtsolution.co.kr>2025-04-28 02:13:30 +0000
commitef4c533ebacc2cdc97e518f30e9a9350004fcdfb (patch)
tree345251a3ed0f4429716fa5edaa31024d8f4cb560 /components/form-data/sedp-components.tsx
parent9ceed79cf32c896f8a998399bf1b296506b2cd4a (diff)
~20250428 작업사항
Diffstat (limited to 'components/form-data/sedp-components.tsx')
-rw-r--r--components/form-data/sedp-components.tsx173
1 files changed, 173 insertions, 0 deletions
diff --git a/components/form-data/sedp-components.tsx b/components/form-data/sedp-components.tsx
new file mode 100644
index 00000000..4865e23d
--- /dev/null
+++ b/components/form-data/sedp-components.tsx
@@ -0,0 +1,173 @@
+"use client";
+
+import * as React from "react";
+import { Button } from "@/components/ui/button";
+import {
+ Dialog,
+ DialogContent,
+ DialogDescription,
+ DialogFooter,
+ DialogHeader,
+ DialogTitle
+} from "@/components/ui/dialog";
+import { Loader, Send, AlertTriangle, CheckCircle } from "lucide-react";
+import { Badge } from "@/components/ui/badge";
+import { Progress } from "@/components/ui/progress";
+
+// SEDP Send Confirmation Dialog
+export function SEDPConfirmationDialog({
+ isOpen,
+ onClose,
+ onConfirm,
+ formName,
+ tagCount,
+ isLoading
+}: {
+ isOpen: boolean;
+ onClose: () => void;
+ onConfirm: () => void;
+ formName: string;
+ tagCount: number;
+ isLoading: boolean;
+}) {
+ return (
+ <Dialog open={isOpen} onOpenChange={onClose}>
+ <DialogContent className="sm:max-w-md">
+ <DialogHeader>
+ <DialogTitle>Send Data to SEDP</DialogTitle>
+ <DialogDescription>
+ You are about to send form data to the Samsung Engineering Design Platform (SEDP).
+ </DialogDescription>
+ </DialogHeader>
+
+ <div className="py-4">
+ <div className="grid grid-cols-2 gap-4 mb-4">
+ <div className="text-muted-foreground">Form Name:</div>
+ <div className="font-medium">{formName}</div>
+
+ <div className="text-muted-foreground">Total Tags:</div>
+ <div className="font-medium">{tagCount}</div>
+ </div>
+
+ <div className="bg-amber-50 p-3 rounded-md border border-amber-200 flex items-start gap-2">
+ <AlertTriangle className="h-5 w-5 text-amber-500 mt-0.5 flex-shrink-0" />
+ <div className="text-sm text-amber-800">
+ Data sent to SEDP cannot be easily reverted. Please ensure all information is correct before proceeding.
+ </div>
+ </div>
+ </div>
+
+ <DialogFooter className="gap-2 sm:gap-0">
+ <Button variant="outline" onClick={onClose} disabled={isLoading}>
+ Cancel
+ </Button>
+ <Button
+ variant="samsung"
+ onClick={onConfirm}
+ disabled={isLoading}
+ className="gap-2"
+ >
+ {isLoading ? (
+ <>
+ <Loader className="h-4 w-4 animate-spin" />
+ Sending...
+ </>
+ ) : (
+ <>
+ <Send className="h-4 w-4" />
+ Send to SEDP
+ </>
+ )}
+ </Button>
+ </DialogFooter>
+ </DialogContent>
+ </Dialog>
+ );
+}
+
+// SEDP Status Dialog - shows the result of the SEDP operation
+export function SEDPStatusDialog({
+ isOpen,
+ onClose,
+ status,
+ message,
+ successCount,
+ errorCount,
+ totalCount
+}: {
+ isOpen: boolean;
+ onClose: () => void;
+ status: 'success' | 'error' | 'partial';
+ message: string;
+ successCount: number;
+ errorCount: number;
+ totalCount: number;
+}) {
+ // Calculate percentage for the progress bar
+ const percentage = Math.round((successCount / totalCount) * 100);
+
+ return (
+ <Dialog open={isOpen} onOpenChange={onClose}>
+ <DialogContent className="sm:max-w-md">
+ <DialogHeader>
+ <DialogTitle>
+ {status === 'success' ? 'Data Sent Successfully' :
+ status === 'partial' ? 'Partially Successful' :
+ 'Failed to Send Data'}
+ </DialogTitle>
+ </DialogHeader>
+
+ <div className="py-4">
+ {/* Status Icon */}
+ <div className="flex justify-center mb-4">
+ {status === 'success' ? (
+ <div className="h-12 w-12 rounded-full bg-green-100 flex items-center justify-center">
+ <CheckCircle className="h-8 w-8 text-green-600" />
+ </div>
+ ) : status === 'partial' ? (
+ <div className="h-12 w-12 rounded-full bg-amber-100 flex items-center justify-center">
+ <AlertTriangle className="h-8 w-8 text-amber-600" />
+ </div>
+ ) : (
+ <div className="h-12 w-12 rounded-full bg-red-100 flex items-center justify-center">
+ <AlertTriangle className="h-8 w-8 text-red-600" />
+ </div>
+ )}
+ </div>
+
+ {/* Message */}
+ <p className="text-center mb-4">{message}</p>
+
+ {/* Progress Stats */}
+ <div className="space-y-2 mb-4">
+ <div className="flex justify-between text-sm">
+ <span>Progress</span>
+ <span>{percentage}%</span>
+ </div>
+ <Progress value={percentage} className="h-2" />
+ <div className="flex justify-between text-sm pt-1">
+ <div>
+ <Badge variant="outline" className="bg-green-50 text-green-700 hover:bg-green-50">
+ {successCount} Successful
+ </Badge>
+ </div>
+ {errorCount > 0 && (
+ <div>
+ <Badge variant="outline" className="bg-red-50 text-red-700 hover:bg-red-50">
+ {errorCount} Failed
+ </Badge>
+ </div>
+ )}
+ </div>
+ </div>
+ </div>
+
+ <DialogFooter>
+ <Button onClick={onClose}>
+ Close
+ </Button>
+ </DialogFooter>
+ </DialogContent>
+ </Dialog>
+ );
+} \ No newline at end of file