Module Update

2025-12-30 14:42:30 +08:00
parent f1797265b2
commit e7c902e8e1
148 changed files with 19317 additions and 113 deletions
--- a/src/modules/exams/components/exam-actions.tsx
+++ b/src/modules/exams/components/exam-actions.tsx
@@ -0,0 +1,170 @@
+"use client"
+
+import { useState } from "react"
+import { useRouter } from "next/navigation"
+import { MoreHorizontal, Eye, Pencil, Trash, Archive, UploadCloud, Undo2, Copy } from "lucide-react"
+import { toast } from "sonner"
+
+import { Button } from "@/shared/components/ui/button"
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from "@/shared/components/ui/dropdown-menu"
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from "@/shared/components/ui/alert-dialog"
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle,
+} from "@/shared/components/ui/dialog"
+
+import { Exam } from "../types"
+
+interface ExamActionsProps {
+  exam: Exam
+}
+
+export function ExamActions({ exam }: ExamActionsProps) {
+  const router = useRouter()
+  const [showViewDialog, setShowViewDialog] = useState(false)
+  const [showDeleteDialog, setShowDeleteDialog] = useState(false)
+
+  const copyId = () => {
+    navigator.clipboard.writeText(exam.id)
+    toast.success("Exam ID copied to clipboard")
+  }
+
+  const publishExam = async () => {
+    toast.success("Exam published")
+  }
+
+  const unpublishExam = async () => {
+    toast.success("Exam moved to draft")
+  }
+
+  const archiveExam = async () => {
+    toast.success("Exam archived")
+  }
+
+  const handleDelete = async () => {
+    try {
+      await new Promise((r) => setTimeout(r, 800))
+      toast.success("Exam deleted successfully")
+      setShowDeleteDialog(false)
+    } catch (e) {
+      toast.error("Failed to delete exam")
+    }
+  }
+
+  return (
+    <>
+      <DropdownMenu>
+        <DropdownMenuTrigger asChild>
+          <Button variant="ghost" className="h-8 w-8 p-0">
+            <span className="sr-only">Open menu</span>
+            <MoreHorizontal className="h-4 w-4" />
+          </Button>
+        </DropdownMenuTrigger>
+        <DropdownMenuContent align="end">
+          <DropdownMenuLabel>Actions</DropdownMenuLabel>
+          <DropdownMenuItem onClick={copyId}>
+            <Copy className="mr-2 h-4 w-4" /> Copy ID
+          </DropdownMenuItem>
+          <DropdownMenuSeparator />
+          <DropdownMenuItem onClick={() => setShowViewDialog(true)}>
+            <Eye className="mr-2 h-4 w-4" /> View
+          </DropdownMenuItem>
+          <DropdownMenuItem>
+            <Pencil className="mr-2 h-4 w-4" /> Edit
+          </DropdownMenuItem>
+          <DropdownMenuItem onClick={() => router.push(`/teacher/exams/${exam.id}/build`)}>
+            <MoreHorizontal className="mr-2 h-4 w-4" /> Build
+          </DropdownMenuItem>
+          <DropdownMenuSeparator />
+          <DropdownMenuItem onClick={publishExam}>
+            <UploadCloud className="mr-2 h-4 w-4" /> Publish
+          </DropdownMenuItem>
+          <DropdownMenuItem onClick={unpublishExam}>
+            <Undo2 className="mr-2 h-4 w-4" /> Move to Draft
+          </DropdownMenuItem>
+          <DropdownMenuItem onClick={archiveExam}>
+            <Archive className="mr-2 h-4 w-4" /> Archive
+          </DropdownMenuItem>
+          <DropdownMenuItem
+            className="text-destructive focus:text-destructive"
+            onClick={() => setShowDeleteDialog(true)}
+          >
+            <Trash className="mr-2 h-4 w-4" /> Delete
+          </DropdownMenuItem>
+        </DropdownMenuContent>
+      </DropdownMenu>
+
+      <Dialog open={showViewDialog} onOpenChange={setShowViewDialog}>
+        <DialogContent>
+          <DialogHeader>
+            <DialogTitle>Exam Details</DialogTitle>
+            <DialogDescription>ID: {exam.id}</DialogDescription>
+          </DialogHeader>
+          <div className="grid gap-4 py-4">
+            <div className="grid grid-cols-4 items-center gap-4">
+              <span className="font-medium">Title:</span>
+              <span className="col-span-3">{exam.title}</span>
+            </div>
+            <div className="grid grid-cols-4 items-center gap-4">
+              <span className="font-medium">Subject:</span>
+              <span className="col-span-3">{exam.subject}</span>
+            </div>
+            <div className="grid grid-cols-4 items-center gap-4">
+              <span className="font-medium">Grade:</span>
+              <span className="col-span-3">{exam.grade}</span>
+            </div>
+            <div className="grid grid-cols-4 items-center gap-4">
+              <span className="font-medium">Total Score:</span>
+              <span className="col-span-3">{exam.totalScore}</span>
+            </div>
+            <div className="grid grid-cols-4 items-center gap-4">
+              <span className="font-medium">Duration:</span>
+              <span className="col-span-3">{exam.durationMin} min</span>
+            </div>
+          </div>
+        </DialogContent>
+      </Dialog>
+
+      <AlertDialog open={showDeleteDialog} onOpenChange={setShowDeleteDialog}>
+        <AlertDialogContent>
+          <AlertDialogHeader>
+            <AlertDialogTitle>Delete exam?</AlertDialogTitle>
+            <AlertDialogDescription>
+              This action cannot be undone. This will permanently delete the exam.
+            </AlertDialogDescription>
+          </AlertDialogHeader>
+          <AlertDialogFooter>
+            <AlertDialogCancel>Cancel</AlertDialogCancel>
+            <AlertDialogAction
+              onClick={(e) => {
+                e.preventDefault()
+                handleDelete()
+              }}
+            >
+              Delete
+            </AlertDialogAction>
+          </AlertDialogFooter>
+        </AlertDialogContent>
+      </AlertDialog>
+    </>
+  )
+}