diff --git a/packages/common-lib/src/services/attendanceRegistryService.js b/packages/common-lib/src/services/attendanceRegistryService.js index d8cf1a92..e68669c4 100644 --- a/packages/common-lib/src/services/attendanceRegistryService.js +++ b/packages/common-lib/src/services/attendanceRegistryService.js @@ -22,7 +22,8 @@ const interfaceData = { parentName: 'parentName', contextId: 'contextId', contextType: 'contextType', - scope: 'scope' + scope: 'scope', + absentReason: 'absentReason' } let only = Object.keys(interfaceData) diff --git a/packages/profile/src/components/Dialog/DialogMsg.js b/packages/profile/src/components/Dialog/DialogMsg.js new file mode 100644 index 00000000..b846d561 --- /dev/null +++ b/packages/profile/src/components/Dialog/DialogMsg.js @@ -0,0 +1,77 @@ +import React from "react"; +import { Dialog, DialogActions, DialogTitle } from "@mui/material"; +import { Button, Box, Select, CheckIcon, Text } from "native-base"; +import { IconByName } from "@shiksha/common-lib"; + +export default function DialogMsg(props) { + return ( +
+ + + + + + + + {props.description} + + + + + + {props.showCancel && ( + + )} + + + +
+ ); +} diff --git a/packages/profile/src/components/SelfAttendanceSheet.js b/packages/profile/src/components/SelfAttendanceSheet.js index a3ce909d..941d3277 100644 --- a/packages/profile/src/components/SelfAttendanceSheet.js +++ b/packages/profile/src/components/SelfAttendanceSheet.js @@ -22,8 +22,13 @@ import { Pressable, Stack, VStack, + NativeBaseProvider, + Select, + CheckIcon, + Text, } from "native-base"; import React, { useEffect } from "react"; +import DialogMsg from "../components/Dialog/DialogMsg"; import { useTranslation } from "react-i18next"; import { useNavigate, useParams } from "react-router-dom"; import Camera from "./Camera"; @@ -137,6 +142,10 @@ export default function SelfAttendanceSheet({ const [selfAttendance, setSelfAttendance] = React.useState({}); const { cohortId } = useParams(); const navigate = useNavigate(); + const [showDialogModal, setShowDialogModal] = React.useState(false); + const [modalMsg, setModalMsg] = React.useState(""); + const [selectedReason, setSelectedReason] = React.useState(""); + const [error, setError] = React.useState(""); const handleTelemetry = (newAttedance) => { const telemetryData = telemetryFactory.interact({ @@ -193,6 +202,7 @@ export default function SelfAttendanceSheet({ id: newAttedance.id, attendance: newAttedance.attendance, remark: newAttedance.remark, + absentReason: newAttedance.absentReason, contextId: cohortId, scope: scope, contextType: "class", @@ -216,6 +226,7 @@ export default function SelfAttendanceSheet({ "contextId", "contextType", "scope", + "absentReason", ], } ) @@ -237,6 +248,7 @@ export default function SelfAttendanceSheet({ studentId: userId || localStorage.getItem("id"), contextId: cohortId, scope: scope, + absentReason: newAttedance.absentReason, contextType: "class", }; setSelfAttendance(newAttedance); @@ -260,6 +272,7 @@ export default function SelfAttendanceSheet({ "contextId", "contextType", "scope", + "absentReason", ], tenantid: process.env.REACT_APP_TENANT_ID, }) @@ -345,6 +358,20 @@ export default function SelfAttendanceSheet({ }; }, []); + const handleOk = (selfAttendance, selectedReason) => { + if (!selectedReason) { + setError("Please select a reason."); + return; + } + setError(""); // Clear any previous errors + const updatedAttendance = { + ...selfAttendance, + absentReason: selectedReason, + }; + setShowDialogModal(false); + handleMarkAttendance(updatedAttendance); + }; + const handleGoBack = () => { setDone(false); setCameraModal(false); @@ -357,10 +384,11 @@ export default function SelfAttendanceSheet({ const setAttendanceMark = (e) => { if (selfAttendance.attendance == ABSENT) { setLocationModal(false); - setShowModal(true); - setDone(true); setCameraModal(false); - handleMarkAttendance(selfAttendance); + setModalMsg( + "Please select the reason for marking the attendance as absent:" + ); + setShowDialogModal(true); } else if ( selfAttendance.attendance == PRESENT && selfAttendance.name === selfAttendance.remark @@ -407,7 +435,87 @@ export default function SelfAttendanceSheet({ } return data; }; + if (showDialogModal == true) { + const absentReasonOptions = [ + { label: "Paid leave - Half day", value: "Paid leave - Half day" }, + { label: "Paid leave - Full day", value: "Paid leave - Full day" }, + { label: "Unpaid leave - Half day", value: "Unpaid leave - Half day" }, + { label: "Unpaid leave - Full day", value: "Unpaid leave - Full day" }, + { + label: "Menstrual leave - Half day", + value: "Menstrual leave - Half day", + }, + { + label: "Menstrual leave - Full day", + value: "Menstrual leave - Full day", + }, + ]; + return ( + <> + + {showDialogModal && ( + { + setShowDialogModal(false); + }} + title={"Message"} + message={modalMsg} + description={ + <> + + Please select the reason for marking the attendance as + absent: + + + {error && ( + + {error} + + )} + + } + clickOk={() => handleOk(selfAttendance, selectedReason)} + showCancel={true} + /> + )} + + + ); + } if (showModal && config && config["captureSelfAttendace"] === "false") { return ( <>