blob: ee517a4a9d56f613b73a94fa47dd22ca0baa0d09 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
|
"use client"
import * as React from "react"
import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter } from "@/components/ui/dialog"
import { Button } from "@/components/ui/button"
import { ScrollArea } from "@/components/ui/scroll-area"
import { Separator } from "@/components/ui/separator"
import { Badge } from "@/components/ui/badge"
// import { PenIcon, InfoIcon } from "lucide-react" // 필요하다면
import type { ContractDetailParsed } from "@/db/schema/contract"
/**
* E-sign Status Dialog Props
*/
interface EsignStatusDialogProps {
open: boolean;
onOpenChange: (open: boolean) => void;
po: ContractDetailParsed | null; // 실제로 표시할 계약 데이터
}
export function EsignStatusDialog({
open,
onOpenChange,
po,
}: EsignStatusDialogProps) {
console.log(open)
console.log(po)
return (
<Dialog open={open} onOpenChange={onOpenChange}>
<DialogContent>
<DialogHeader>
<DialogTitle>Electronic Signature Status</DialogTitle>
<DialogDescription>
{po
? `Check the e-sign envelopes and signers for contract #${po.contractNo}.`
: "No contract selected."
}
</DialogDescription>
</DialogHeader>
{/* 본문 영역 */}
{po ? (
po.envelopes.length === 0 ? (
<div className="text-sm text-muted-foreground">
No e-sign envelopes found for this contract.
</div>
) : (
<ScrollArea className="h-64 pr-2">
{po.envelopes.map((envelope, idx) => {
return (
<div key={envelope.id} className="mb-4">
{/* Envelope Header */}
<div className="flex items-center justify-between mb-1">
<span className="font-semibold text-sm">
Envelope #{envelope.id}
</span>
<Badge variant="outline">
{envelope.envelopeStatus}
</Badge>
</div>
<div className="text-xs text-muted-foreground">
Updated at: {envelope.updatedAt}
</div>
{/* Signers */}
<Separator className="my-2" />
{envelope.signers && envelope.signers.length > 0 ? (
<div className="space-y-2">
{envelope.signers.map((signer) => (
<div key={signer.id} className="px-2 py-1 bg-muted rounded">
<div className="flex justify-between">
<span className="font-medium text-sm">
{signer.signerName} ({signer.signerEmail})
</span>
<Badge variant="secondary">
{signer.signerStatus}
</Badge>
</div>
{signer.signedAt && (
<div className="text-xs text-muted-foreground">
Signed at: {signer.signedAt}
</div>
)}
</div>
))}
</div>
) : (
<div className="text-sm text-muted-foreground">
No signers found.
</div>
)}
</div>
)
})}
</ScrollArea>
)
) : (
<div className="text-sm text-muted-foreground">
Please select a contract to see its e-sign status.
</div>
)}
<DialogFooter>
<Button variant="outline" onClick={() => onOpenChange(false)}>
Close
</Button>
</DialogFooter>
</DialogContent>
</Dialog>
)
}
|
