Update : Action Button in AssReq
This commit is contained in:
parent
e242dda425
commit
f4eb4dd1ef
|
|
@ -23,7 +23,7 @@ export default function DashboardTable<T>({ table }: Props<T>) {
|
||||||
{headerGroup.headers.map((header) => (
|
{headerGroup.headers.map((header) => (
|
||||||
<TableHead
|
<TableHead
|
||||||
key={header.id}
|
key={header.id}
|
||||||
className={`px-6 py-3 text-left text-sm font-medium text-muted-foreground ${header.column.columnDef.header === 'Status' ? 'text-center' : ''}`}
|
className={`px-6 py-3 text-left text-sm font-medium text-muted-foreground ${header.column.columnDef.header === 'Status' ? 'text-center' : (header.column.columnDef.header === 'Aksi' && window.location.pathname === '/assessmentRequest') ? 'text-center' : ''}`}
|
||||||
style={{
|
style={{
|
||||||
maxWidth: `${header.column.columnDef.maxSize}px`,
|
maxWidth: `${header.column.columnDef.maxSize}px`,
|
||||||
width: `${header.getSize()}`,
|
width: `${header.getSize()}`,
|
||||||
|
|
|
||||||
|
|
@ -70,6 +70,7 @@
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
--primary-color: #2555FF;
|
--primary-color: #2555FF;
|
||||||
|
--hover-primary-color: #0032e6;
|
||||||
--levelOne-color: #FF2F32;
|
--levelOne-color: #FF2F32;
|
||||||
--levelTwo-color: #FE6939;
|
--levelTwo-color: #FE6939;
|
||||||
--levelThree-color: #EED42D;
|
--levelThree-color: #EED42D;
|
||||||
|
|
|
||||||
|
|
@ -8,8 +8,13 @@ import { createColumnHelper } from "@tanstack/react-table";
|
||||||
import { Badge } from "@/shadcn/components/ui/badge";
|
import { Badge } from "@/shadcn/components/ui/badge";
|
||||||
import { Button } from "@/shadcn/components/ui/button";
|
import { Button } from "@/shadcn/components/ui/button";
|
||||||
import StartAssessmentModal from "@/modules/assessmentRequest/modals/ConfirmModal";
|
import StartAssessmentModal from "@/modules/assessmentRequest/modals/ConfirmModal";
|
||||||
import { TbListCheck, TbClipboardText } from "react-icons/tb";
|
import { TbListCheck, TbClipboardText, TbChevronDown, TbChevronUp, TbChevronRight } from "react-icons/tb";
|
||||||
|
import { NavigationMenu,
|
||||||
|
NavigationMenuList,
|
||||||
|
NavigationMenuItem,
|
||||||
|
NavigationMenuTrigger,
|
||||||
|
NavigationMenuContent } from "@/shadcn/components/ui/navigation-menu";
|
||||||
|
import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem } from "@/shadcn/components/ui/dropdown-menu";
|
||||||
|
|
||||||
export const Route = createLazyFileRoute("/_dashboardLayout/assessmentRequest/")({
|
export const Route = createLazyFileRoute("/_dashboardLayout/assessmentRequest/")({
|
||||||
component: UsersPage,
|
component: UsersPage,
|
||||||
|
|
@ -141,47 +146,45 @@ export default function UsersPage() {
|
||||||
},
|
},
|
||||||
}),
|
}),
|
||||||
columnHelper.display({
|
columnHelper.display({
|
||||||
header: "Actions",
|
header: "Aksi",
|
||||||
cell: (props) => {
|
cell: (props) => {
|
||||||
const status = props.row.original.status;
|
const status = props.row.original.status;
|
||||||
const assessmentId = props.row.original.assessmentId; // Retrieve the assessmentId from the data row
|
const assessmentId = props.row.original.assessmentId; // Retrieve the assessmentId from the data row
|
||||||
|
const [isOpen, setIsOpen] = useState(false);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex gap-2">
|
<div className="flex items-center justify-center">
|
||||||
{/* Button Create Assessment */}
|
<DropdownMenu onOpenChange={(open) => setIsOpen(open)}>
|
||||||
{status === "selesai" ? (
|
<DropdownMenuTrigger asChild>
|
||||||
<Button variant={"secondary"} disabled><TbClipboardText className="mr-2" />Mulai Asesmen</Button>
|
<Button variant="secondary" className="pl-4 pr-2 rounded-lg bg-[--primary-color] text-white hover:bg-[--hover-primary-color] hover:text-white">
|
||||||
) : status === "diterima" ? (
|
Pilihan
|
||||||
<Button onClick={() => handleOpenModal(assessmentId ?? '')}>
|
{isOpen ? <TbChevronDown className="ml-10" /> : <TbChevronRight className="ml-10" />}
|
||||||
<TbClipboardText className="mr-2" />
|
|
||||||
Mulai Asesmen
|
|
||||||
</Button>
|
</Button>
|
||||||
) : status === "dalam pengerjaan" ? (
|
</DropdownMenuTrigger>
|
||||||
<Button onClick={() => {
|
<DropdownMenuContent align="start" className="w-full">
|
||||||
// Direct to assessment page without showing modal
|
<DropdownMenuItem
|
||||||
|
onClick={() => {
|
||||||
|
if (status === "diterima") {
|
||||||
|
handleOpenModal(assessmentId ?? '');
|
||||||
|
} else if (status === "dalam pengerjaan") {
|
||||||
const newUrl = `/assessment?id=${assessmentId}`;
|
const newUrl = `/assessment?id=${assessmentId}`;
|
||||||
window.open(newUrl, "_blank");
|
window.open(newUrl, "_blank");
|
||||||
}}>
|
}
|
||||||
|
}}
|
||||||
|
disabled={!(status === "diterima" || status === "dalam pengerjaan")}
|
||||||
|
>
|
||||||
<TbClipboardText className="mr-2" />
|
<TbClipboardText className="mr-2" />
|
||||||
Lanjutkan Asesmen
|
|
||||||
</Button>
|
|
||||||
) : (
|
|
||||||
<Button variant={"secondary"} disabled><TbClipboardText className="mr-2" />
|
|
||||||
Mulai Asesmen
|
Mulai Asesmen
|
||||||
</Button>
|
</DropdownMenuItem>
|
||||||
)}
|
<DropdownMenuItem
|
||||||
|
onClick={() => status === "selesai" || status === "belum diverifikasi" ? handleViewResult(assessmentId ?? '') : null}
|
||||||
{/* Button View Result */}
|
disabled={!(status === "selesai" || status === "belum diverifikasi")}
|
||||||
{status === "selesai" || status === "belum diverifikasi" ? (
|
>
|
||||||
<Button variant={"outline"} onClick={()=>handleViewResult(assessmentId ?? '')}>
|
|
||||||
<TbListCheck className="mr-2" />
|
<TbListCheck className="mr-2" />
|
||||||
Lihat Hasil
|
Lihat Hasil
|
||||||
</Button>
|
</DropdownMenuItem>
|
||||||
) : (
|
</DropdownMenuContent>
|
||||||
<Button variant={"outline"} disabled><TbListCheck className="mr-2" />
|
</DropdownMenu>
|
||||||
Lihat Hasil
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user