Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 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 | 2x 2x 3x 3x 3x 3x 3x 35x 2x | import { Form, Modal } from "antd";
import "./AssignmentDetailsModal.css";
import { AssignmentResponse } from "@/types/AssignmentResponse";
interface Props {
data: AssignmentResponse | undefined;
show?: boolean;
handleClose?: () => void;
}
function AssignmenDetailsModal({ data, show = false, handleClose }: Props) {
function formatDate(dateInput: Date) {
// Extract day, month, and year from the date object
const date = new Date(dateInput);
const day = String(date.getDate()).padStart(2, "0");
const month = String(date.getMonth() + 1).padStart(2, "0"); // Months are zero based
const year = date.getFullYear();
// Return the formatted date string in DD/MM/YYYY format
return `${day}/${month}/${year}`;
}
return (
<Modal
className=""
title={
<div>
<p className="text-lg font-semibold primary-color">
Detailed Assignment Infomation
</p>
<br />
<hr />
</div>
}
open={show}
footer={null}
onCancel={handleClose}
>
{data ? (
<Form layout="horizontal">
<Form.Item
label="Asset Code"
className="custom-form-item"
labelCol={{ span: 6 }}
labelAlign="left"
>
<div>{data.asset.assetCode}</div>
</Form.Item>
<Form.Item
label="Asset Name"
className="custom-form-item"
labelCol={{ span: 6 }}
labelAlign="left"
>
<div>{data.asset.name}</div>
</Form.Item>
<Form.Item
label="Specification"
className="custom-form-item"
labelCol={{ span: 6 }}
labelAlign="left"
>
<p>{data.asset.specification}</p>
</Form.Item>
<Form.Item
label="Assigned to"
className="custom-form-item"
labelCol={{ span: 6 }}
labelAlign="left"
>
<p>{data.assignTo}</p>
</Form.Item>
<Form.Item
label="Assigned by"
className="custom-form-item"
labelCol={{ span: 6 }}
labelAlign="left"
>
<p>{data.assignBy}</p>
</Form.Item>
<Form.Item
label="Assigned Date"
className="custom-form-item"
labelCol={{ span: 6 }}
labelAlign="left"
>
<p>{formatDate(data.assignedDate)}</p>
</Form.Item>
<Form.Item
label="State"
className="custom-form-item"
labelCol={{ span: 6 }}
labelAlign="left"
>
<p>{data.state}</p>
</Form.Item>
<Form.Item
label="Note"
className="custom-form-item"
labelCol={{ span: 6 }}
labelAlign="left"
>
<p>{data.note}</p>
</Form.Item>
</Form>
) : (
<></>
)}
</Modal>
);
}
export default AssignmenDetailsModal;
|