Compare commits
No commits in common. "30a990849999ebaa0738f407eb2f089f63413dd9" and "a39002ccf33ecd4aadc4ef090ccdb3e576bf2e70" have entirely different histories.
30a9908499
...
a39002ccf3
@ -63,65 +63,78 @@ export const ReportTask = ({ report, closeModal, refetch }) => {
|
||||
></button>
|
||||
|
||||
<div className="container m-0">
|
||||
<div class="mb-1 row text-start">
|
||||
<label for="html5-text-input" class="col-md-4 col-form-label">
|
||||
Assigned Date :{" "}
|
||||
</label>
|
||||
<div class="col-md-8 text-start">
|
||||
<label class="col-md-2 col-form-label">
|
||||
{formatDate(report?.assignmentDate)}
|
||||
</label>
|
||||
</div>
|
||||
<div className="d-flex justify-content-between">
|
||||
<figure className="text-start p-0 m-0">
|
||||
<blockquote className="blockquote">
|
||||
<small>
|
||||
{" "}
|
||||
Assigned Date : {formatDate(report?.assignmentDate)}
|
||||
</small>
|
||||
</blockquote>
|
||||
</figure>
|
||||
<figure className="text-end p-0 m-0">
|
||||
<blockquote className="blockquote">
|
||||
<small>Assigned By</small>
|
||||
</blockquote>
|
||||
<figcaption className="blockquote-footer mb-0">
|
||||
{/* <div className="d-flex avatar avatar-xs">
|
||||
<span className="avatar-initial rounded-circle bg-label-primary">
|
||||
{report?.assignedBy?.firstName.slice(0, 1)}
|
||||
</span> */}
|
||||
<cite title="Source Title m-0">{` ${report?.assignedBy.firstName} ${report?.assignedBy.lastName}`}</cite>
|
||||
{/* </div> */}
|
||||
</figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
<div class="mb-1 row text-start">
|
||||
<label for="html5-search-input" class="col-md-4 col-form-label">
|
||||
Assigned By :{" "}
|
||||
</label>
|
||||
<div class="col-md-8 text-start">
|
||||
<label class=" col-form-label">{` ${report?.assignedBy.firstName} ${report?.assignedBy.lastName}`}</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-1 row text-start">
|
||||
<label for="html5-email-input" class="col-md-4 col-form-label">
|
||||
Wrok Area :
|
||||
</label>
|
||||
<div class="col-md-8 text-start text-wrap">
|
||||
<label class=" col-form-label">
|
||||
{" "}
|
||||
{report?.workItem?.workArea?.floor?.building?.name}{" "}
|
||||
<i class="bx bx-chevron-right"></i>{" "}
|
||||
{report?.workItem?.workArea?.floor?.floorName}{" "}
|
||||
<i class="bx bx-chevron-right"> </i>
|
||||
{report?.workItem?.workArea?.areaName}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-1 row text-start">
|
||||
<label for="html5-email-input" class="col-md-4 col-form-label">
|
||||
Activity :
|
||||
</label>
|
||||
<div class="col-md-8 text-start text-wrap">
|
||||
<label class=" col-form-label">
|
||||
{report?.workItem?.activityMaster.activityName}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-1 row text-start">
|
||||
<label for="html5-email-input" class="col-md-4 col-form-label">
|
||||
Team Size :
|
||||
</label>
|
||||
<div class="col-md-8 text-start text-wrap">
|
||||
<label class=" col-form-label">
|
||||
{report?.teamMembers?.length}
|
||||
</label>
|
||||
|
||||
<div className="d-flex p-0 m-0">
|
||||
<div className="flex-shrink-0 mt-1 mx-sm-0 px-2 mx-auto">
|
||||
<i className="bx bx-buildings"></i>
|
||||
</div>
|
||||
<p className="lead">
|
||||
{report?.workItem?.workArea?.floor?.building?.name}
|
||||
</p>
|
||||
<p className="lead ms-12">
|
||||
{report?.workItem?.workArea?.floor?.floorName}
|
||||
</p>
|
||||
</div>
|
||||
<dl className="row text-start ms-3">
|
||||
<dt className="col-sm-6">
|
||||
Work Area : {report?.workItem?.workArea?.areaName}
|
||||
</dt>
|
||||
<dd className="col-sm-6">
|
||||
<small> {report?.workItem?.activityMaster.activityName}</small>
|
||||
</dd>
|
||||
</dl>
|
||||
<dl className="row text-start ms-3">
|
||||
<dt className="col-sm-4">Team</dt>
|
||||
|
||||
<dd className="col-sm-4 d-flex align-items-center avatar-group justify-content-start">
|
||||
{report?.teamMembers.map((member) => (
|
||||
<>
|
||||
<div
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-html="true"
|
||||
data-popup="tooltip-custom"
|
||||
data-bs-placement="top"
|
||||
title={`${member.firstName} ${member.lastName}`}
|
||||
className="avatar avatar-xs"
|
||||
>
|
||||
{/* <img src="..." alt="Avatar" className="rounded-circle pull-up" /> */}
|
||||
<span className="avatar-initial rounded-circle bg-label-primary">
|
||||
{member?.firstName.slice(0, 1)}
|
||||
</span>
|
||||
</div>
|
||||
</>
|
||||
))}
|
||||
</dd>
|
||||
<dt className="col-sm-4 text-start">
|
||||
Planned : {report?.plannedTask}
|
||||
</dt>
|
||||
</dl>
|
||||
<form onSubmit={handleSubmit(onSubmit)}>
|
||||
<div class="mb-1 row text-start">
|
||||
<label for="html5-email-input" class="col-md-4 col-form-label">
|
||||
Completed Work
|
||||
</label>
|
||||
<div class="col-md-8 text-start text-wrap">
|
||||
<div className="row p-0">
|
||||
<div className="col-4">
|
||||
<input
|
||||
{...register("completedTask", { valueAsNumber: true })}
|
||||
id="smallInput"
|
||||
@ -135,12 +148,7 @@ export const ReportTask = ({ report, closeModal, refetch }) => {
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-1 row text-start">
|
||||
<label for="html5-email-input" class="col-md-4 col-form-label">
|
||||
Comment
|
||||
</label>
|
||||
<div class="col-md-8 text-start text-wrap">
|
||||
<div className="col-8">
|
||||
<textarea
|
||||
{...register("comment")}
|
||||
className="form-control"
|
||||
@ -149,10 +157,11 @@ export const ReportTask = ({ report, closeModal, refetch }) => {
|
||||
placeholder="Enter comment"
|
||||
/>
|
||||
{errors.comment && (
|
||||
<div className="danger-text">{errors.comment.message}</div>
|
||||
<div className="text-danger">{errors.comment.message}</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-12 text-center my-2">
|
||||
<button type="submit" className="btn btn-sm btn-primary me-3">
|
||||
{loading ? "Please wait" : "Submit Report"}
|
||||
|
||||
@ -69,7 +69,7 @@ const Header = () =>
|
||||
<a
|
||||
aria-label="toggle for sidebar"
|
||||
className="nav-item nav-link px-0 me-xl-4"
|
||||
|
||||
href="#"
|
||||
>
|
||||
<i className="bx bx-menu bx-sm"></i>
|
||||
</a>
|
||||
|
||||
@ -160,14 +160,13 @@ const ProjectCard = ({ projectData }) => {
|
||||
data-bs-toggle="dropdown"
|
||||
aria-expanded="false"
|
||||
>
|
||||
<i className="bx bx-dots-vertical-rounded bx-sm text-muted" data-bs-toggle="tooltip" data-bs-offset="0,8" data-bs-placement="top" data-bs-custom-class="tooltip-dark" title="More Action"></i>
|
||||
<i className="bx bx-dots-vertical-rounded bx-sm text-muted"></i>
|
||||
</button>
|
||||
<ul className="dropdown-menu dropdown-menu-end">
|
||||
<li>
|
||||
<a
|
||||
aria-label="click to View details"
|
||||
className="dropdown-item"
|
||||
|
||||
onClick={handleViewProject}
|
||||
>
|
||||
<i className="bx bx-detail me-2"></i>
|
||||
|
||||
@ -5,14 +5,16 @@ const DateRangePicker = ({ onRangeChange }) => {
|
||||
const inputRef = useRef(null);
|
||||
|
||||
useEffect(() => {
|
||||
|
||||
const today = new Date();
|
||||
const fifteenDaysAgo = new Date();
|
||||
fifteenDaysAgo.setDate(today.getDate() - 15);
|
||||
|
||||
|
||||
const fp = flatpickr(inputRef.current, {
|
||||
mode: "range",
|
||||
dateFormat: "Y-m-d",
|
||||
defaultDate: [fifteenDaysAgo, today],
|
||||
defaultDate: [fifteenDaysAgo, today], // ✅ set default range
|
||||
static: true,
|
||||
clickOpens: true,
|
||||
onChange: (selectedDates, dateStr) => {
|
||||
@ -21,11 +23,6 @@ const DateRangePicker = ({ onRangeChange }) => {
|
||||
},
|
||||
});
|
||||
|
||||
onRangeChange?.({
|
||||
startDate: fifteenDaysAgo.toISOString().split("T")[0],
|
||||
endDate: today.toISOString().split("T")[0],
|
||||
});
|
||||
|
||||
return () => {
|
||||
fp.destroy();
|
||||
};
|
||||
|
||||
@ -1,29 +1,25 @@
|
||||
import React, { useState, useEffect } from "react";
|
||||
import { useFieldArray, useForm } from "react-hook-form";
|
||||
import { z } from "zod";
|
||||
import { zodResolver } from "@hookform/resolvers/zod";
|
||||
import React,{useState,useEffect} from 'react'
|
||||
import {useFieldArray, useForm } from 'react-hook-form';
|
||||
import { z } from 'zod';
|
||||
import {zodResolver} from '@hookform/resolvers/zod';
|
||||
|
||||
import { MasterRespository } from "../../repositories/MastersRepository";
|
||||
import { clearApiCacheKey } from "../../slices/apiCacheSlice";
|
||||
import { getCachedData, cacheData } from "../../slices/apiDataManager";
|
||||
import showToast from "../../services/toastService";
|
||||
import { MasterRespository } from '../../repositories/MastersRepository';
|
||||
import { clearApiCacheKey } from '../../slices/apiCacheSlice';
|
||||
import { getCachedData,cacheData } from '../../slices/apiDataManager';
|
||||
import showToast from '../../services/toastService';
|
||||
|
||||
const schema = z.object({
|
||||
activityName: z.string().min(1, { message: "Activity Name is required" }),
|
||||
unitOfMeasurement: z.string().min(1, { message: "Unit of Measurement is required" }),
|
||||
activityName: z.string().min(1, { message: "Role is required" }),
|
||||
unitOfMeasurement: z.string().min(1, { message: "Description is required" }),
|
||||
checkList: z
|
||||
.array(
|
||||
z.object({
|
||||
check: z.string().min(1, { message: "Checklist item cannot be empty" }),
|
||||
isMandatory: z.boolean().default(false),
|
||||
id: z.any().default(0),
|
||||
})
|
||||
)
|
||||
.optional(),
|
||||
});
|
||||
.array(z.string().min(1, { message: "Checklist item cannot be empty" }))
|
||||
.optional(),
|
||||
});
|
||||
|
||||
const CreateActivity = ({ onClose }) => {
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
const CreateActivity = ({onClose}) =>
|
||||
{
|
||||
|
||||
const [ isLoading, setIsLoading ] = useState( false )
|
||||
|
||||
const {
|
||||
register,
|
||||
@ -38,197 +34,147 @@ const CreateActivity = ({ onClose }) => {
|
||||
} = useForm({
|
||||
resolver: zodResolver(schema),
|
||||
defaultValues: {
|
||||
activityName: "",
|
||||
unitOfMeasurement: "",
|
||||
activityName: '',
|
||||
unitOfMeasurement: '',
|
||||
checkList: [],
|
||||
},
|
||||
});
|
||||
|
||||
|
||||
// Setting up field array for checkList (dynamic fields)
|
||||
const {
|
||||
fields: checkListItems,
|
||||
append,
|
||||
remove,
|
||||
} = useFieldArray({
|
||||
control,
|
||||
name: "checkList",
|
||||
name: 'checkList',
|
||||
});
|
||||
|
||||
// Form submission handler
|
||||
const onSubmit = (data) => {
|
||||
console.log(data);
|
||||
setIsLoading(true);
|
||||
const onSubmit = ( data ) =>
|
||||
{
|
||||
console.log(data)
|
||||
setIsLoading(true)
|
||||
|
||||
MasterRespository.createActivity(data)
|
||||
.then( ( resp ) =>
|
||||
{
|
||||
|
||||
const cachedData = getCachedData("Activity");
|
||||
const updatedData = [ ...cachedData, resp?.data ];
|
||||
cacheData("Activity", updatedData);
|
||||
showToast("Activity Successfully Added.", "success");
|
||||
setIsLoading(false);
|
||||
handleClose()
|
||||
})
|
||||
.catch((error) => {
|
||||
showToast(error.message, "error");
|
||||
setIsLoading(false);
|
||||
});
|
||||
MasterRespository.updateActivity(data).then((resp)=>{
|
||||
setIsLoading(false)
|
||||
|
||||
const cachedData = getCachedData("Activity");
|
||||
const updatedData = [...cachedData, resp?.data];
|
||||
cacheData("Activity", updatedData);
|
||||
showToast("Activity Added successfully.", "success");
|
||||
|
||||
onClose()
|
||||
}).catch((error)=>{
|
||||
showToast(error.message, "error");
|
||||
setIsLoading(false)
|
||||
})
|
||||
};
|
||||
|
||||
|
||||
// Add a new checklist item
|
||||
const addChecklistItem = () => {
|
||||
const values = getValues("checkList");
|
||||
const values = getValues('checkList');
|
||||
const lastIndex = checkListItems.length - 1;
|
||||
if (
|
||||
checkListItems.length > 0 &&
|
||||
(!values?.[lastIndex] || values[lastIndex].check.trim() === "")
|
||||
) {
|
||||
setError(`checkList.${lastIndex}.check`, {
|
||||
type: "manual",
|
||||
message: "Please fill this checklist item before adding another.",
|
||||
|
||||
|
||||
if (checkListItems.length > 0 && (!values?.[lastIndex] || values[lastIndex].trim() === '')) {
|
||||
setError(`checkList.${lastIndex}`, {
|
||||
type: 'manual',
|
||||
message: 'Please fill this checklist item before adding another.',
|
||||
});
|
||||
return;
|
||||
}
|
||||
clearErrors(`checkList.${lastIndex}.check`);
|
||||
append({
|
||||
id: 0,
|
||||
check: "",
|
||||
isMandatory: false,
|
||||
});
|
||||
|
||||
clearErrors(`checkList.${lastIndex}`); // Clear the error if the input is filled.
|
||||
append(''); // Add a new empty checklist input
|
||||
};
|
||||
|
||||
|
||||
const removeChecklistItem = (index) => {
|
||||
remove(index);
|
||||
};
|
||||
|
||||
|
||||
// Handle checklist item input change
|
||||
const handleChecklistChange = (index, value) => {
|
||||
setValue(`checkList.${index}`, value);
|
||||
};
|
||||
|
||||
const handleClose = () => {
|
||||
reset();
|
||||
onClose();
|
||||
};
|
||||
const handleClose = () =>
|
||||
{
|
||||
reset()
|
||||
onClose()
|
||||
}
|
||||
return (
|
||||
<form onSubmit={handleSubmit(onSubmit)}>
|
||||
<h6>Create Activity</h6>
|
||||
<div className="row">
|
||||
<div className="col-6">
|
||||
<label className="form-label">Activity</label>
|
||||
<input
|
||||
type="text"
|
||||
{...register("activityName")}
|
||||
className={`form-control form-control-sm ${
|
||||
errors.activityName ? "is-invalid" : ""
|
||||
}`}
|
||||
/>
|
||||
{errors.activityName && (
|
||||
<p className="danger-text">{errors.activityName.message}</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="col-6">
|
||||
<label className="form-label">Measurement</label>
|
||||
<input
|
||||
type="text"
|
||||
{...register("unitOfMeasurement")}
|
||||
className={`form-control form-control-sm ${
|
||||
errors.unitOfMeasurement ? "is-invalid" : ""
|
||||
}`}
|
||||
/>
|
||||
{errors.unitOfMeasurement && (
|
||||
<p className="danger-text">{errors.unitOfMeasurement.message}</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="col-md-12 text-start mt-1">
|
||||
<p className="py-1 my-0">{checkListItems.length > 0 ? "Check List" : "Add Check List" }</p>
|
||||
{checkListItems.length > 0 && (
|
||||
<table className="table mt-1 border-0">
|
||||
<thead className="py-0 my-0 table-border-top-0">
|
||||
<tr className="py-1">
|
||||
<th colSpan={2} className="py-1">
|
||||
<small>Name</small>
|
||||
</th>
|
||||
<th colSpan={2} className="py-1 text-center">
|
||||
<small>Is Mandatory</small>
|
||||
</th>
|
||||
<th className="text-center py-1">Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="table-border-bottom-0 ">
|
||||
{checkListItems.map((item, index) => (
|
||||
<tr key={index} className="border-top-0">
|
||||
<td colSpan={2} className="border-top-0 border-0">
|
||||
<input
|
||||
className="d-none"
|
||||
{...register(`checkList.${index}.id`)}
|
||||
></input>
|
||||
<input
|
||||
{...register(`checkList.${index}.check`)}
|
||||
className="form-control form-control-sm"
|
||||
placeholder={`Checklist item ${index + 1}`}
|
||||
onChange={(e) =>
|
||||
handleChecklistChange(index, e.target.value)
|
||||
}
|
||||
/>
|
||||
{errors.checkList?.[index]?.check && (
|
||||
<small
|
||||
style={{ fontSize: "10px" }}
|
||||
className="danger-text"
|
||||
>
|
||||
{errors.checkList[index]?.check?.message}
|
||||
</small>
|
||||
)}
|
||||
</td>
|
||||
<td colSpan={2} className="text-center border-0">
|
||||
<input
|
||||
className="form-check-input"
|
||||
type="checkbox"
|
||||
{...register(`checkList.${index}.isMandatory`)}
|
||||
defaultChecked={item.isMandatory}
|
||||
/>
|
||||
</td>
|
||||
<td className="text-center border-0">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => removeChecklistItem(index)}
|
||||
className="btn btn-xs btn-icon btn-text-secondary"
|
||||
>
|
||||
<i class="bx bxs-minus-circle text-danger"></i>
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
)}
|
||||
<button
|
||||
type="button"
|
||||
className="btn btn-xs btn-primary mt-2"
|
||||
onClick={addChecklistItem}
|
||||
>
|
||||
<i class="bx bx-plus-circle"></i>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="col-12 text-center mt-3">
|
||||
<button type="submit" className="btn btn-sm btn-primary me-3">
|
||||
{isLoading ? "Please Wait" : "Submit"}
|
||||
</button>
|
||||
<button
|
||||
type="reset"
|
||||
className="btn btn-sm btn-label-secondary"
|
||||
onClick={handleClose}
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-6">
|
||||
<label className="form-label">Activity</label>
|
||||
<input
|
||||
type="text"
|
||||
{...register('activityName')}
|
||||
className={`form-control form-control-sm ${errors.activityName ? 'is-invalid' : ''}`}
|
||||
/>
|
||||
{errors.activityName && <p className="danger-text">{errors.activityName.message}</p>}
|
||||
</div>
|
||||
</form>
|
||||
);
|
||||
};
|
||||
|
||||
export default CreateActivity;
|
||||
<div className="col-6">
|
||||
<label className="form-label">Measurement</label>
|
||||
<input
|
||||
type="text"
|
||||
{...register('unitOfMeasurement')}
|
||||
className={`form-control form-control-sm ${errors.unitOfMeasurement ? 'is-invalid' : ''}`}
|
||||
/>
|
||||
{errors.unitOfMeasurement && (
|
||||
<p className="danger-text">{errors.unitOfMeasurement.message}</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<div className="col-md-6 text-start">
|
||||
{/* Dynamic checklist items */}
|
||||
{checkListItems.map((item, index) => (
|
||||
<div key={item.id} className=" align-items-center my-1">
|
||||
<div className='d-flex align-items-center gap-2'>
|
||||
<input
|
||||
{...register(`checkList.${index}`)}
|
||||
className="form-control form-control-sm"
|
||||
placeholder={`Checklist item ${index + 1}`}
|
||||
onChange={(e) => handleChecklistChange(index, e.target.value)} // Handle input change
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => removeChecklistItem(index)} // Remove button
|
||||
className="btn btn-xs btn-icon btn-text-secondary"
|
||||
>
|
||||
<span class='icon-base bx bx bx-x'></span>
|
||||
</button>
|
||||
</div>
|
||||
{errors.checkList?.[index] && (
|
||||
<p className="danger-text">{errors.checkList[index]?.message}</p>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
{/* Add new checklist item */}
|
||||
<button type="button" className="btn btn-sm btn-primary mt-2" onClick={addChecklistItem}>
|
||||
+ Add Checklist Item
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="col-12 text-center mt-3">
|
||||
<button type="submit" className="btn btn-sm btn-primary me-3">
|
||||
{isLoading ? "Please Wait" : "Submit"}
|
||||
</button>
|
||||
<button
|
||||
type="reset"
|
||||
className="btn btn-sm btn-label-secondary"
|
||||
onClick={handleClose}
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
)
|
||||
}
|
||||
|
||||
export default CreateActivity
|
||||
@ -57,12 +57,15 @@ const onSubmit = (values) => {
|
||||
};
|
||||
|
||||
MasterRespository.createRole(result).then((resp)=>{
|
||||
console.log(resp)
|
||||
setIsLoading(false)
|
||||
const cachedData = getCachedData( "Role" );
|
||||
const updatedData = [...cachedData, resp.data];
|
||||
|
||||
cacheData("Application Role", updatedData);
|
||||
showToast("Application Role Added successfully.", "success");
|
||||
const cachedData = getCachedData( "Role" );
|
||||
console.log(cachedData)
|
||||
const updatedData = [...cachedData, resp];
|
||||
|
||||
cacheData("Role", updatedData);
|
||||
showToast("Role Added successfully.", "success");
|
||||
onClose()
|
||||
} ).catch( ( err ) =>
|
||||
{
|
||||
|
||||
@ -10,6 +10,7 @@ const DeleteMaster = ({ master, onClose }) => {
|
||||
const index = mastersdata[master?.masterType]?.findIndex(
|
||||
(item) => String(item?.id) === String(master?.item?.id)
|
||||
);
|
||||
console.log(index);
|
||||
if (index !== -1) {
|
||||
mastersdata[master?.masterType].splice(index, 1);
|
||||
}
|
||||
|
||||
@ -1,28 +1,23 @@
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { useForm, useFieldArray } from "react-hook-form";
|
||||
import { z } from "zod";
|
||||
import { zodResolver } from "@hookform/resolvers/zod";
|
||||
import {MasterRespository} from "../../repositories/MastersRepository";
|
||||
import showToast from "../../services/toastService";
|
||||
import {getCachedData,cacheData} from "../../slices/apiDataManager";
|
||||
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { useFieldArray, useForm } from 'react-hook-form';
|
||||
import { z } from 'zod';
|
||||
import { zodResolver } from '@hookform/resolvers/zod';
|
||||
import {MasterRespository} from '../../repositories/MastersRepository';
|
||||
import axios from 'axios';
|
||||
import showToast from '../../services/toastService';
|
||||
import {cacheData, getCachedData} from '../../slices/apiDataManager';
|
||||
|
||||
// Zod Schema for validation
|
||||
const schema = z.object({
|
||||
activityName: z.string().min(1, { message: "Activity name is required" }),
|
||||
unitOfMeasurement: z.string().min(1, { message: "Measurement is required" }),
|
||||
checkList: z
|
||||
.array(
|
||||
z.object({
|
||||
id: z.any().default(0),
|
||||
check: z.string().min(1, { message: "Checklist item cannot be empty" }),
|
||||
isMandatory: z.boolean().default(false),
|
||||
})
|
||||
)
|
||||
.array(z.string().min(1, { message: "Checklist item cannot be empty" }))
|
||||
.optional(),
|
||||
});
|
||||
} );
|
||||
|
||||
|
||||
const UpdateActivity = ({ activityData, onClose }) => {
|
||||
let token = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOlsiOGFmNjFlNDgtYzRkMy00MTYzLWI4NjAtMmEyZWNiNjQ3NDZiIiwiYjUxMzcwOWEtYmZiZS00OTM1LTlmNWMtOGVjN2IwMzFjNTFlIl0sInN1YiI6InZpa2FzQG1hcmNvYWlvdC5jb20iLCJUZW5hbnRJZCI6IjIiLCJleHAiOjE3NDQzNzQyNzAsImlzcyI6Imh0dHA6Ly9sb2NhbGhvc3Q6NTI0NiIsImF1ZCI6Imh0dHA6Ly9sb2NhbGhvc3Q6NTI0NiJ9.reQlePmwDpBL-_mcGOrWwADLJrxmUse5Gd7A-OgDi9s"
|
||||
const EditActivity = ({activityData,onClose}) => {
|
||||
const [isLoading, setIsLoading] = useState(false);
|
||||
|
||||
const {
|
||||
@ -30,212 +25,166 @@ const UpdateActivity = ({ activityData, onClose }) => {
|
||||
handleSubmit,
|
||||
control,
|
||||
setValue,
|
||||
reset,
|
||||
setError,
|
||||
clearErrors,
|
||||
setError,
|
||||
getValues,
|
||||
reset,
|
||||
formState: { errors },
|
||||
} = useForm({
|
||||
resolver: zodResolver(schema),
|
||||
defaultValues: {
|
||||
id:activityData.id,
|
||||
activityName: activityData.activityName,
|
||||
unitOfMeasurement: activityData.unitOfMeasurement,
|
||||
checkLists: activityData.checkLists || [],
|
||||
activityName: '',
|
||||
unitOfMeasurement: '',
|
||||
checkList: [],
|
||||
},
|
||||
});
|
||||
|
||||
const { fields: checkListItems, append, remove } = useFieldArray({
|
||||
// Setting up field array for checkList (dynamic fields)
|
||||
const {
|
||||
fields: checkListItems,
|
||||
append,
|
||||
remove,
|
||||
} = useFieldArray({
|
||||
control,
|
||||
name: "checkList",
|
||||
name: 'checkList',
|
||||
});
|
||||
|
||||
// Load initial data
|
||||
// Pre-populating the form with initial data when component mounts or initialData changes
|
||||
useEffect(() => {
|
||||
if (activityData) {
|
||||
reset( {
|
||||
id:activityData.id,
|
||||
reset({
|
||||
activityName: activityData.activityName,
|
||||
unitOfMeasurement: activityData.unitOfMeasurement,
|
||||
checkList: activityData.checkLists || [],
|
||||
checkList: activityData.checkList || [],
|
||||
});
|
||||
}
|
||||
}, [activityData]);
|
||||
}, [activityData, reset]);
|
||||
|
||||
|
||||
const handleChecklistChange = (index, value) => {
|
||||
setValue(`checkList.${index}`, value);
|
||||
};
|
||||
|
||||
// Submit handler
|
||||
const onSubmit = async(data) => {
|
||||
setIsLoading(true);
|
||||
|
||||
const Activity = {...data, id:activityData.id}
|
||||
try
|
||||
// Form submission handler
|
||||
const onSubmit = async( data ) =>
|
||||
{
|
||||
const response = await MasterRespository.updateActivity( activityData?.id, Activity );
|
||||
const updatedActivity = response.data;
|
||||
const cachedData = getCachedData("Activity")
|
||||
console.log(data)
|
||||
setIsLoading(true)
|
||||
MasterRespository.updateActivity(activityData?.id,data).then((resp)=>{
|
||||
setIsLoading(false)
|
||||
const cachedData = getCachedData("Activity");
|
||||
if (cachedData) {
|
||||
const updatedData = cachedData.map((activity) =>
|
||||
activity.id === activityData?.id
|
||||
? {
|
||||
...activity,
|
||||
activityName: resp.data.activityName,
|
||||
unitOfMeasurement: resp.data.unitOfMeasurement,
|
||||
}
|
||||
: activity
|
||||
);
|
||||
|
||||
if (cachedData) {
|
||||
const updatedActivities = cachedData.map((activity) =>
|
||||
activity.id === updatedActivity.id ? { ...activity, ...updatedActivity } : activity
|
||||
);
|
||||
|
||||
cacheData( "Activity", updatedActivities );
|
||||
cacheData("Activity", updatedData);
|
||||
}
|
||||
showToast("Activity Added successfully.", "success");
|
||||
onClose()
|
||||
}
|
||||
setIsLoading( false )
|
||||
showToast("Activity Successfully Updated", "success");
|
||||
} catch ( err )
|
||||
{
|
||||
setIsLoading( false )
|
||||
|
||||
showToast("error.message", "error");
|
||||
console.log(err)
|
||||
}
|
||||
};
|
||||
}).catch((error)=>{
|
||||
showToast(error.message, "error");
|
||||
setIsLoading(false)
|
||||
})
|
||||
|
||||
|
||||
};
|
||||
|
||||
// Add new checklist item
|
||||
// Add a new checklist item
|
||||
const addChecklistItem = () => {
|
||||
const values = getValues("checkList");
|
||||
const values = getValues('checkList');
|
||||
const lastIndex = checkListItems.length - 1;
|
||||
|
||||
if (
|
||||
checkListItems.length > 0 &&
|
||||
(!values?.[lastIndex] || values[lastIndex].check.trim() === "")
|
||||
) {
|
||||
setError(`checkList.${lastIndex}.check`, {
|
||||
type: "manual",
|
||||
message: "Please fill this checklist item before adding another.",
|
||||
// Prevent adding new input if the last one is empty
|
||||
if (checkListItems.length > 0 && (!values?.[lastIndex] || values[lastIndex].trim() === '')) {
|
||||
setError(`checkList.${lastIndex}`, {
|
||||
type: 'manual',
|
||||
message: 'Please fill this checklist item before adding another.',
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
clearErrors(`checkList.${lastIndex}.check`);
|
||||
append({ id: 0, check: "", isMandatory: false });
|
||||
clearErrors(`checkList.${lastIndex}`); // Clear the error if the input is filled.
|
||||
append(''); // Add a new empty checklist input
|
||||
};
|
||||
|
||||
// Remove a checklist item
|
||||
const removeChecklistItem = (index) => {
|
||||
remove(index);
|
||||
remove(index); // Remove the checklist item from the field array
|
||||
};
|
||||
|
||||
// Handle checklist item input change
|
||||
const handleChecklistChange = (index, value) => {
|
||||
setValue(`checkList.${index}`, value); // Update the value of the checklist item
|
||||
};
|
||||
|
||||
const handleCLose = () =>
|
||||
{
|
||||
() => reset()
|
||||
onClose()
|
||||
}
|
||||
return (
|
||||
<form onSubmit={handleSubmit(onSubmit)}>
|
||||
<h6>Update Activity</h6>
|
||||
<div className="row">
|
||||
{/* Activity Name */}
|
||||
<div className="col-md-6">
|
||||
<label className="form-label">Activity Name</label>
|
||||
<div className="col-6">
|
||||
<label className="form-label">Activity</label>
|
||||
<input
|
||||
type="text"
|
||||
{...register("activityName")}
|
||||
className={`form-control form-control-sm ${errors.activityName ? "is-invalid" : ""}`}
|
||||
{...register('activityName')}
|
||||
className={`form-control form-control-sm ${errors.activityName ? 'is-invalid' : ''}`}
|
||||
/>
|
||||
{errors.activityName && (
|
||||
<div className="text-danger">{errors.activityName.message}</div>
|
||||
)}
|
||||
{errors.activityName && <p className="danger-text">{errors.activityName.message}</p>}
|
||||
</div>
|
||||
|
||||
{/* Unit of Measurement */}
|
||||
<div className="col-md-6">
|
||||
<label className="form-label">Measurement</label>
|
||||
<div className="col-6">
|
||||
<label className="form-label">Measurement</label>
|
||||
<input
|
||||
type="text"
|
||||
{...register("unitOfMeasurement")}
|
||||
className={`form-control form-control-sm ${errors.unitOfMeasurement ? "is-invalid" : ""}`}
|
||||
{...register('unitOfMeasurement')}
|
||||
className={`form-control form-control-sm ${errors.unitOfMeasurement ? 'is-invalid' : ''}`}
|
||||
/>
|
||||
{errors.unitOfMeasurement && (
|
||||
<div className="text-danger">{errors.unitOfMeasurement.message}</div>
|
||||
<p className="danger-text">{errors.unitOfMeasurement.message}</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Checklist */}
|
||||
<div className="col-md-12 text-start mt-1">
|
||||
<p className="py-1 my-0">{checkListItems.length > 0 ? "Check List" : "Add Check List"}</p>
|
||||
{checkListItems.length > 0 && (
|
||||
<table className="table mt-1 border-0">
|
||||
<thead className="py-0 my-0 table-border-top-0">
|
||||
<tr className="py-1">
|
||||
<th colSpan={2} className="py-1">
|
||||
<small>Name</small>
|
||||
</th>
|
||||
<th colSpan={2} className="py-1 text-center">
|
||||
<small>Is Mandatory</small>
|
||||
</th>
|
||||
<th className="text-center py-1">Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{checkListItems.map((item, index) => (
|
||||
<tr key={item.id} className="border-top-0">
|
||||
<td colSpan={2} className=" border-0">
|
||||
<input
|
||||
className="d-none"
|
||||
{...register(`checkList.${index}.id`)}
|
||||
></input>
|
||||
<input
|
||||
{...register(`checkList.${index}.check`)}
|
||||
className="form-control form-control-sm"
|
||||
placeholder={`Checklist item ${index + 1}`}
|
||||
onChange={(e) =>
|
||||
handleChecklistChange(index, e.target.value)
|
||||
}
|
||||
/>
|
||||
{errors.checkList?.[index]?.check && (
|
||||
<small
|
||||
style={{ fontSize: "10px" }}
|
||||
className="danger-text"
|
||||
>
|
||||
{errors.checkList[index]?.check?.message}
|
||||
</small>
|
||||
)}
|
||||
</td>
|
||||
<td colSpan={2} className="text-center border-0">
|
||||
<input
|
||||
className="form-check-input"
|
||||
type="checkbox"
|
||||
{...register(`checkList.${index}.isMandatory`)}
|
||||
defaultChecked={item.isMandatory}
|
||||
/>
|
||||
</td>
|
||||
<td className="text-center border-0">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => removeChecklistItem(index)}
|
||||
className="btn btn-xs btn-icon btn-text-secondary"
|
||||
>
|
||||
<i class="bx bxs-minus-circle text-danger"></i>
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
)}
|
||||
|
||||
|
||||
<button
|
||||
type="button"
|
||||
className="btn btn-xs btn-primary mt-2"
|
||||
onClick={addChecklistItem}
|
||||
>
|
||||
<i class="bx bx-plus-circle"></i>
|
||||
<div className="col-md-6 text-start">
|
||||
{/* Dynamic checklist items */}
|
||||
{checkListItems.map((item, index) => (
|
||||
<div key={item.id} className="d-flex align-items-center gap-2 my-1">
|
||||
<input
|
||||
{...register(`checkList.${index}`)}
|
||||
className="form-control form-control-sm"
|
||||
placeholder={`Checklist item ${index + 1}`}
|
||||
onChange={(e) => handleChecklistChange(index, e.target.value)} // Handle input change
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => removeChecklistItem(index)} // Remove button
|
||||
className="btn btn-xs btn-icon btn-text-secondary"
|
||||
>
|
||||
<span className="icon-base bx bx-x"/>
|
||||
</button>
|
||||
{errors.checkList?.[index] && (
|
||||
<p className="danger-text">{errors.checkList[index]?.message}</p>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
{/* Add new checklist item */}
|
||||
<button type="button" className="btn btn-sm btn-primary mt-2" onClick={addChecklistItem}>
|
||||
+ Add Checklist Item
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{/* Submit / Cancel */}
|
||||
<div className="col-12 text-center mt-3">
|
||||
<button type="submit" className="btn btn-sm btn-primary me-3">
|
||||
{isLoading ? "Please Wait" : "Submit"}
|
||||
Submit
|
||||
</button>
|
||||
<button
|
||||
type="reset"
|
||||
className="btn btn-sm btn-label-secondary"
|
||||
onClick={onClose}
|
||||
onClick={handleCLose}
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
@ -245,4 +194,4 @@ const UpdateActivity = ({ activityData, onClose }) => {
|
||||
);
|
||||
};
|
||||
|
||||
export default UpdateActivity;
|
||||
export default EditActivity;
|
||||
|
||||
@ -101,7 +101,7 @@ const EditMaster=({master,onClose})=> {
|
||||
setIsLoading( false )
|
||||
|
||||
|
||||
const cachedData = getCachedData("Application Role");
|
||||
const cachedData = getCachedData("Role");
|
||||
|
||||
if (cachedData) {
|
||||
|
||||
@ -109,9 +109,9 @@ const EditMaster=({master,onClose})=> {
|
||||
role.id === resp.data?.id ? { ...role, ...resp.data } : role
|
||||
);
|
||||
|
||||
cacheData("Application Role", updatedData);
|
||||
cacheData("Role", updatedData);
|
||||
}
|
||||
showToast( "Application Role Updated successfully.", "success" );
|
||||
showToast( "Role Update successfully.", "success" );
|
||||
setIsLoading(false)
|
||||
onClose()
|
||||
}).catch((Err)=>{
|
||||
|
||||
@ -33,13 +33,13 @@ const MasterModal = ({ modaldata, closeModal }) => {
|
||||
onClick={closeModal}
|
||||
></button>
|
||||
<div className="text-center mb-2"></div>
|
||||
{modaldata?.modalType === "Application Role" && (
|
||||
{modaldata?.modalType === "Role" && (
|
||||
<CreateRole
|
||||
masmodalType={modaldata.masterType}
|
||||
onClose={closeModal}
|
||||
/>
|
||||
)}
|
||||
{modaldata?.modalType === "Edit-Application Role" && (
|
||||
{modaldata?.modalType === "Edit-Role" && (
|
||||
<EditRole master={modaldata} onClose={closeModal} />
|
||||
)}
|
||||
{modaldata?.modalType === "delete" && (
|
||||
|
||||
@ -1,6 +1,4 @@
|
||||
// it important ------
|
||||
export const mastersList = [ {id: 1, name: "Application Role"}, {id: 2, name: "Job Role"}, {id: 3, name: "Activity"} ]
|
||||
// -------------------
|
||||
export const mastersList = [{id:1, name: "Role"},{id:2, name: "Job Role"},{id:3,name:"Activity"}]
|
||||
|
||||
export const dailyTask = [
|
||||
{
|
||||
|
||||
@ -35,7 +35,7 @@ const useMaster = () => {
|
||||
} else {
|
||||
let response;
|
||||
switch (selectedMaster) {
|
||||
case "Application Role":
|
||||
case "Role":
|
||||
response = await MasterRespository.getRoles();
|
||||
response = response.data;
|
||||
break;
|
||||
|
||||
@ -15,7 +15,7 @@ import DateRangePicker from "../../components/common/DateRangePicker";
|
||||
import DatePicker from "../../components/common/DatePicker";
|
||||
|
||||
const DailyTask = () => {
|
||||
const { profile: LoggedUser } = useProfile();
|
||||
const {profile: LoggedUser} = useProfile();
|
||||
|
||||
const {
|
||||
projects,
|
||||
@ -27,13 +27,13 @@ const DailyTask = () => {
|
||||
);
|
||||
const dispatch = useDispatch(selectedProject);
|
||||
const [dateRange, setDateRange] = useState({ startDate: "", endDate: "" });
|
||||
|
||||
const {
|
||||
TaskList,
|
||||
loading: task_loading,
|
||||
error: task_error,
|
||||
refetch,
|
||||
} = useTaskList(selectedProject, dateRange.startDate, dateRange.endDate);
|
||||
} = useTaskList( selectedProject, dateRange.startDate, dateRange.endDate );
|
||||
|
||||
|
||||
const [TaskLists, setTaskLists] = useState([]);
|
||||
|
||||
@ -56,6 +56,7 @@ const DailyTask = () => {
|
||||
selectTask(task);
|
||||
openModal();
|
||||
};
|
||||
console.log(dateRange)
|
||||
|
||||
return (
|
||||
<>
|
||||
@ -125,6 +126,7 @@ const DailyTask = () => {
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div className="table-responsive text-nowrap">
|
||||
<table className="table">
|
||||
@ -189,7 +191,7 @@ const DailyTask = () => {
|
||||
<td>{formatDate(task.assignmentDate)}</td>
|
||||
<td className="text-center">
|
||||
<div className="d-flex align-items-center avatar-group justify-content-center">
|
||||
{task.teamMembers.slice(0, 3).map((member) => (
|
||||
{task.teamMembers.map((member) => (
|
||||
<div
|
||||
key={member.id}
|
||||
data-bs-toggle="tooltip"
|
||||
@ -205,27 +207,14 @@ const DailyTask = () => {
|
||||
</span>
|
||||
</div>
|
||||
))}
|
||||
{task.teamMembers.length > 3 && (
|
||||
<div
|
||||
className="avatar avatar-xs"
|
||||
data-bs-toggle="tooltip"
|
||||
data-bs-placement="bottom"
|
||||
title={`${task.teamMembers.length - 3} more`}
|
||||
>
|
||||
<span className="avatar-initial rounded-circle bg-label-secondary pull-up">
|
||||
+{task.teamMembers.length - 3}
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</td>
|
||||
<td className="text-center">
|
||||
<div className="d-flex justify-content-center">
|
||||
<button
|
||||
type="button"
|
||||
className={`btn btn-xs btn-primary ${
|
||||
task.completedTask > 0 ? "d-none" : ""
|
||||
}`}
|
||||
className={`btn btn-xs btn-primary ${task.completedTask > 0 ? "d-none":""}`}
|
||||
|
||||
onClick={() => {
|
||||
selectTask(task);
|
||||
openModal();
|
||||
|
||||
@ -36,8 +36,9 @@ const ForgotPasswordPage = () => {
|
||||
const response = await AuthRepository.forgotPassword(data)
|
||||
if ( response.data && response.success )
|
||||
showToast( response.message, "success" )
|
||||
reset()
|
||||
setLoading( false )
|
||||
setEmail( "" )
|
||||
console.log(response)
|
||||
} catch ( err )
|
||||
{
|
||||
|
||||
|
||||
@ -7,7 +7,7 @@ const MasterTable = ( {data, columns, loading, handleModalData} ) =>
|
||||
{
|
||||
const hasMasterPermission = useHasUserPermission(MANAGE_MASTER)
|
||||
const selectedMaster = useSelector((store)=>store.localVariables.selectedMaster)
|
||||
const hiddenColumns = ["id", "featurePermission","tenant","tenantId","checkLists"];
|
||||
const hiddenColumns = ["id", "featurePermission","tenant","tenantId"];
|
||||
|
||||
const safeData = Array.isArray(data) ? data : [];
|
||||
const [currentPage, setCurrentPage] = useState(1);
|
||||
@ -28,7 +28,7 @@ const MasterTable = ( {data, columns, loading, handleModalData} ) =>
|
||||
.map((col) => ({
|
||||
...col,
|
||||
label:
|
||||
col.key === "role" || col.key === "activityName" || col.key === "status" ? "Name" : col.label,
|
||||
col.key === "role" || col.key === "Activity" || col.key === "status" ? "Name" : col.label,
|
||||
}));
|
||||
|
||||
return (
|
||||
@ -45,7 +45,7 @@ const MasterTable = ( {data, columns, loading, handleModalData} ) =>
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th> Name</th>
|
||||
<th>{ selectedMaster} Name</th>
|
||||
<th>{selectedMaster} {selectedMaster === "Activity" ? "Unit":"Description" }</th>
|
||||
<th className={` ${!hasMasterPermission && 'd-none'}`}>Actions</th>
|
||||
</tr>
|
||||
|
||||
@ -3,7 +3,7 @@ import { createSlice } from "@reduxjs/toolkit";
|
||||
const localVariablesSlice = createSlice({
|
||||
name: "localVariables",
|
||||
initialState: {
|
||||
selectedMaster:"Application Role",
|
||||
selectedMaster:"Role",
|
||||
regularizationCount:0,
|
||||
projectId:1,
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user