Validation for reporting task so that completed tasks will not exceed total pending tasks for that activity

This commit is contained in:
Vikas Nale 2025-05-05 18:20:24 +05:30
parent e0264030f5
commit 029254e548
2 changed files with 80 additions and 21 deletions

View File

@ -9,12 +9,16 @@ import { TasksRepository } from "../../repositories/TaskRepository";
export const ReportTask = ({ report, closeModal, refetch }) => {
const [loading, setloading] = useState(false);
const maxPending =
report?.workItem?.plannedWork - report?.workItem?.completedWork;
const schema = z.object({
completedTask: z
.number()
.min(1, "Completed Work must be at least 1")
.int("Completed Work must be an integer")
.min(0, "Completed Work must be greater than 0")
.max(maxPending, {
message: `Completed task cannot exceed total pending tasks: ${maxPending}`,
})
.positive("Completed Work must be a positive number")
.optional(),
comment: z.string().min(1, "Comment cannot be empty"),
@ -25,6 +29,7 @@ export const ReportTask = ({ report, closeModal, refetch }) => {
formState: { errors },
} = useForm({
resolver: zodResolver(schema),
defaultValues: { completedTask: 0, comment: "" },
});
const onSubmit = async (data) => {
@ -34,7 +39,7 @@ export const ReportTask = ({ report, closeModal, refetch }) => {
...data,
id: report?.id,
reportedDate: new Date().toISOString(),
checkList:[]
checkList: [],
};
let response = await TasksRepository.reportTask(reportData);
@ -65,7 +70,10 @@ export const ReportTask = ({ report, closeModal, refetch }) => {
<div className="container m-0">
<div className="mb-1 row text-start">
<label htmlFor="html5-text-input" className="col-md-4 col-form-label">
<label
htmlFor="html5-text-input"
className="col-md-4 col-form-label"
>
Assigned Date :{" "}
</label>
<div className="col-md-8 text-start">
@ -75,7 +83,10 @@ export const ReportTask = ({ report, closeModal, refetch }) => {
</div>
</div>
<div className="mb-1 row text-start">
<label htmlFor="html5-search-input" className="col-md-4 col-form-label">
<label
htmlFor="html5-search-input"
className="col-md-4 col-form-label"
>
Assigned By :{" "}
</label>
<div className="col-md-8 text-start">
@ -83,7 +94,10 @@ export const ReportTask = ({ report, closeModal, refetch }) => {
</div>
</div>
<div className="mb-1 row text-start">
<label htmlFor="html5-email-input" className="col-md-4 col-form-label">
<label
htmlFor="html5-email-input"
className="col-md-4 col-form-label"
>
Wrok Area :
</label>
<div className="col-md-8 text-start text-wrap">
@ -98,7 +112,10 @@ export const ReportTask = ({ report, closeModal, refetch }) => {
</div>
</div>
<div className="mb-1 row text-start">
<label htmlFor="html5-email-input" className="col-md-4 col-form-label">
<label
htmlFor="html5-email-input"
className="col-md-4 col-form-label"
>
Activity :
</label>
<div className="col-md-8 text-start text-wrap">
@ -108,7 +125,10 @@ export const ReportTask = ({ report, closeModal, refetch }) => {
</div>
</div>
<div className="mb-1 row text-start">
<label htmlFor="html5-email-input" className="col-md-4 col-form-label">
<label
htmlFor="html5-email-input"
className="col-md-4 col-form-label"
>
Team Size :
</label>
<div className="col-md-8 text-start text-wrap">
@ -118,19 +138,27 @@ export const ReportTask = ({ report, closeModal, refetch }) => {
</div>
</div>
<div className="mb-1 row text-start">
<label htmlFor="html5-email-input" className="col-md-4 col-form-label">
Planned :
<label
htmlFor="html5-email-input"
className="col-md-4 col-form-label"
>
Assigned :
</label>
<div className="col-md-8 text-start text-wrap">
<label className=" col-form-label">
{report?.plannedTask
}
{report?.plannedTask} of{" "}
{report?.workItem.plannedWork -
report?.workItem.completedWork}{" "}
Pending
</label>
</div>
</div>
<form onSubmit={handleSubmit(onSubmit)}>
<div className="mb-1 row text-start">
<label htmlFor="html5-email-input" className="col-md-4 col-form-label">
<label
htmlFor="html5-email-input"
className="col-md-4 col-form-label"
>
Completed Work
</label>
<div className="col-md-8 text-start text-wrap">
@ -142,14 +170,17 @@ export const ReportTask = ({ report, closeModal, refetch }) => {
placeholder="Completed Work"
/>
{errors.completedTask && (
<div className="text-danger">
<div className="danger-text">
{errors.completedTask.message}
</div>
)}
</div>
</div>
<div className="mb-1 row text-start">
<label htmlFor="html5-email-input" className="col-md-4 col-form-label">
<label
htmlFor="html5-email-input"
className="col-md-4 col-form-label"
>
Comment
</label>
<div className="col-md-8 text-start text-wrap">

View File

@ -152,7 +152,7 @@ const DailyTask = () => {
<thead>
<tr>
<th>Activity</th>
<th>Planned </th>
<th>Assigned </th>
<th>Compeleted</th>
<th>Assign On</th>
<th>Team</th>
@ -180,11 +180,39 @@ const DailyTask = () => {
return (
<React.Fragment key={index}>
<tr>
<td className="flex-wrap">
{task.workItem.activityMaster.activityName ||
"No Activity Name"}
<td className="flex-wrap text-start">
<div>
{task.workItem.activityMaster.activityName ||
"No Activity Name"}
</div>
<div>
{" "}
<label className=" col-form-label text-sm">
{" "}
{
task?.workItem?.workArea?.floor?.building
?.name
}{" "}
<i
className="bx bx-chevron-right text-sm"
style={{ fontSize: ".75rem" }}
></i>{" "}
{task?.workItem?.workArea?.floor?.floorName}{" "}
<i
className="bx bx-chevron-right text-sm"
style={{ fontSize: ".75rem" }}
>
{" "}
</i>
{task?.workItem?.workArea?.areaName}
</label>
</div>
</td>
<td>
{task.plannedTask || "NA"} /
{task.workItem.plannedWork -
task.workItem.completedWork}
</td>
<td>{task.plannedTask || "NA"}</td>
<td>{task.completedTask}</td>
<td>{formatDate(task.assignmentDate)}</td>
<td className="text-center">