Updation In Daily Progress Report filter icon. #197
@ -1,90 +1,98 @@
|
||||
import React, { useState, useEffect } from "react";
|
||||
|
||||
const FilterIcon = ({ taskListData, onApplyFilters, currentSelectedBuilding, currentSelectedFloors, currentSelectedActivities }) => {
|
||||
// State for filters, now managed within FilterIcon
|
||||
const [selectedBuilding, setSelectedBuilding] = useState(currentSelectedBuilding);
|
||||
const [selectedFloors, setSelectedFloors] = useState(currentSelectedFloors);
|
||||
const [selectedActivities, setSelectedActivities] = useState(currentSelectedActivities);
|
||||
const FilterIcon = ({
|
||||
taskListData,
|
||||
onApplyFilters,
|
||||
currentSelectedBuilding,
|
||||
currentSelectedFloors,
|
||||
currentSelectedActivities,
|
||||
}) => {
|
||||
const [selectedBuilding, setSelectedBuilding] = useState(currentSelectedBuilding || "");
|
||||
const [selectedFloors, setSelectedFloors] = useState(currentSelectedFloors || []);
|
||||
const [selectedActivities, setSelectedActivities] = useState(currentSelectedActivities || []);
|
||||
|
||||
// Update internal state when props change (e.g., project selection in DailyTask clears filters)
|
||||
useEffect(() => {
|
||||
setSelectedBuilding(currentSelectedBuilding);
|
||||
setSelectedFloors(currentSelectedFloors);
|
||||
setSelectedActivities(currentSelectedActivities);
|
||||
setSelectedBuilding(currentSelectedBuilding || "");
|
||||
setSelectedFloors(currentSelectedFloors || []);
|
||||
setSelectedActivities(currentSelectedActivities || []);
|
||||
}, [currentSelectedBuilding, currentSelectedFloors, currentSelectedActivities]);
|
||||
|
||||
// Helper to get unique values for filters based on current selections
|
||||
const getUniqueFilterValues = (key) => {
|
||||
const getUniqueFilterValues = (key, overrideBuilding, overrideFloors) => {
|
||||
if (!taskListData) return [];
|
||||
let relevantTasks = taskListData;
|
||||
|
||||
// Filter tasks based on selected building for floors and activities
|
||||
if (selectedBuilding) {
|
||||
relevantTasks = relevantTasks.filter(task =>
|
||||
task?.workItem?.workArea?.floor?.building?.name === selectedBuilding
|
||||
let filteredTasks = [...taskListData];
|
||||
|
||||
if (overrideBuilding) {
|
||||
filteredTasks = filteredTasks.filter(
|
||||
(task) =>
|
||||
task?.workItem?.workArea?.floor?.building?.name === overrideBuilding
|
||||
);
|
||||
}
|
||||
|
||||
// Filter tasks based on selected floors for activities
|
||||
if (selectedFloors.length > 0) {
|
||||
relevantTasks = relevantTasks.filter(task =>
|
||||
selectedFloors.includes(task?.workItem?.workArea?.floor?.floorName)
|
||||
if (overrideFloors?.length > 0) {
|
||||
filteredTasks = filteredTasks.filter((task) =>
|
||||
overrideFloors.includes(task?.workItem?.workArea?.floor?.floorName)
|
||||
);
|
||||
}
|
||||
|
||||
const values = relevantTasks.map(task => {
|
||||
if (key === 'building') return task?.workItem?.workArea?.floor?.building?.name;
|
||||
if (key === 'floor') return task?.workItem?.workArea?.floor?.floorName;
|
||||
if (key === 'activity') return task?.workItem?.activityMaster?.activityName;
|
||||
const values = filteredTasks.map((task) => {
|
||||
if (key === "building") return task?.workItem?.workArea?.floor?.building?.name;
|
||||
if (key === "floor") return task?.workItem?.workArea?.floor?.floorName;
|
||||
if (key === "activity") return task?.workItem?.activityMaster?.activityName;
|
||||
return null;
|
||||
}).filter(Boolean); // Remove null or undefined values
|
||||
return [...new Set(values)].sort(); // Sort for consistent order
|
||||
});
|
||||
|
||||
return [...new Set(values.filter(Boolean))].sort();
|
||||
};
|
||||
|
||||
const uniqueBuildings = getUniqueFilterValues('building');
|
||||
const uniqueFloors = getUniqueFilterValues('floor');
|
||||
const uniqueActivities = getUniqueFilterValues('activity');
|
||||
const uniqueBuildings = getUniqueFilterValues("building");
|
||||
const uniqueFloors = getUniqueFilterValues("floor", selectedBuilding);
|
||||
const uniqueActivities = getUniqueFilterValues("activity", selectedBuilding, selectedFloors);
|
||||
|
||||
// Handle filter selection with dependency logic
|
||||
const handleFilterChange = (filterType, value) => {
|
||||
let newSelectedBuilding = selectedBuilding;
|
||||
let newSelectedFloors = [...selectedFloors];
|
||||
let newSelectedActivities = [...selectedActivities];
|
||||
let updatedBuilding = selectedBuilding;
|
||||
let updatedFloors = [...selectedFloors];
|
||||
let updatedActivities = [...selectedActivities];
|
||||
|
||||
if (filterType === 'building') {
|
||||
if (selectedBuilding !== value) {
|
||||
newSelectedFloors = [];
|
||||
newSelectedActivities = [];
|
||||
if (filterType === "building") {
|
||||
updatedBuilding = value;
|
||||
updatedFloors = [];
|
||||
updatedActivities = [];
|
||||
} else if (filterType === "floor") {
|
||||
if (updatedFloors.includes(value)) {
|
||||
updatedFloors = updatedFloors.filter((floor) => floor !== value);
|
||||
} else {
|
||||
updatedFloors.push(value);
|
||||
}
|
||||
newSelectedBuilding = value;
|
||||
} else if (filterType === 'floor') {
|
||||
newSelectedFloors = selectedFloors.includes(value) ? selectedFloors.filter(item => item !== value) : [...selectedFloors, value];
|
||||
if (!newSelectedFloors.includes(value) && selectedFloors.includes(value)) {
|
||||
newSelectedActivities = [];
|
||||
|
||||
const validActivities = getUniqueFilterValues("activity", updatedBuilding, updatedFloors);
|
||||
updatedActivities = updatedActivities.filter((act) => validActivities.includes(act));
|
||||
} else if (filterType === "activity") {
|
||||
if (updatedActivities.includes(value)) {
|
||||
updatedActivities = updatedActivities.filter((act) => act !== value);
|
||||
} else {
|
||||
updatedActivities.push(value);
|
||||
}
|
||||
} else if (filterType === 'activity') {
|
||||
newSelectedActivities = selectedActivities.includes(value) ? selectedActivities.filter(item => item !== value) : [...selectedActivities, value];
|
||||
}
|
||||
|
||||
setSelectedBuilding(newSelectedBuilding);
|
||||
setSelectedFloors(newSelectedFloors);
|
||||
setSelectedActivities(newSelectedActivities);
|
||||
setSelectedBuilding(updatedBuilding);
|
||||
setSelectedFloors(updatedFloors);
|
||||
setSelectedActivities(updatedActivities);
|
||||
|
||||
// Communicate the updated filter states back to the parent
|
||||
onApplyFilters({
|
||||
selectedBuilding: newSelectedBuilding,
|
||||
selectedFloors: newSelectedFloors,
|
||||
selectedActivities: newSelectedActivities,
|
||||
selectedBuilding: updatedBuilding,
|
||||
selectedFloors: updatedFloors,
|
||||
selectedActivities: updatedActivities,
|
||||
});
|
||||
};
|
||||
|
||||
const clearAllFilters = () => {
|
||||
setSelectedBuilding('');
|
||||
setSelectedBuilding("");
|
||||
setSelectedFloors([]);
|
||||
setSelectedActivities([]);
|
||||
// Communicate cleared filters back to the parent
|
||||
|
||||
onApplyFilters({
|
||||
selectedBuilding: '',
|
||||
selectedBuilding: "",
|
||||
selectedFloors: [],
|
||||
selectedActivities: [],
|
||||
});
|
||||
@ -98,20 +106,19 @@ const FilterIcon = ({ taskListData, onApplyFilters, currentSelectedBuilding, cur
|
||||
data-bs-toggle="dropdown"
|
||||
aria-expanded="false"
|
||||
>
|
||||
<i className="fa-solid fa-filter bx-sm "></i>
|
||||
|
||||
<i
|
||||
className="fa-solid fa-filter bx-sm"
|
||||
style={{ color: selectedBuilding || selectedFloors.length > 0 || selectedActivities.length > 0 ? "#7161EF" : "gray" }}
|
||||
></i>
|
||||
|
||||
</a>
|
||||
<ul
|
||||
className="dropdown-menu p-2"
|
||||
aria-labelledby="filterDropdown"
|
||||
style={{
|
||||
minWidth: "360px",
|
||||
fontSize: "13px",
|
||||
}}
|
||||
// Prevent dropdown from closing when clicking inside it
|
||||
style={{ minWidth: "360px", fontSize: "13px" }}
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
>
|
||||
{/* Building Filter - Now a Dropdown */}
|
||||
{/* Building */}
|
||||
<li>
|
||||
<div className="fw-bold text-dark mb-1">Building</div>
|
||||
<div className="row">
|
||||
@ -122,33 +129,26 @@ const FilterIcon = ({ taskListData, onApplyFilters, currentSelectedBuilding, cur
|
||||
onChange={(e) => handleFilterChange("building", e.target.value)}
|
||||
>
|
||||
<option value="">Select Building</option>
|
||||
{uniqueBuildings.length > 0 ? (
|
||||
uniqueBuildings.map((building, idx) => (
|
||||
<option key={`building-option-${idx}`} value={building}>
|
||||
{building}
|
||||
</option>
|
||||
))
|
||||
) : (
|
||||
<option value="" disabled>No buildings available</option>
|
||||
)}
|
||||
{uniqueBuildings.map((building, idx) => (
|
||||
<option key={idx} value={building}>
|
||||
{building}
|
||||
</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
{/* Floor Filter - Visible only if a building is selected */}
|
||||
{/* Floor */}
|
||||
{selectedBuilding && (
|
||||
<>
|
||||
<li><hr className="my-1" /></li>
|
||||
<li>
|
||||
<hr className="my-1" />
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<div className="fw-bold text-dark mb-1">Floor</div>
|
||||
<div className="fw-bold text-dark mb-1">Floors</div>
|
||||
<div className="row">
|
||||
{uniqueFloors.length > 0 ? (
|
||||
uniqueFloors.map((floor, idx) => (
|
||||
<div className="col-6" key={`floor-${idx}`}>
|
||||
<div className="col-6" key={idx}>
|
||||
<div className="form-check mb-1">
|
||||
<input
|
||||
className="form-check-input"
|
||||
@ -157,36 +157,30 @@ const FilterIcon = ({ taskListData, onApplyFilters, currentSelectedBuilding, cur
|
||||
checked={selectedFloors.includes(floor)}
|
||||
onChange={() => handleFilterChange("floor", floor)}
|
||||
/>
|
||||
<label
|
||||
className="form-check-label"
|
||||
htmlFor={`floor-${floor}`}
|
||||
>
|
||||
<label className="form-check-label" htmlFor={`floor-${floor}`}>
|
||||
{floor}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
) : (
|
||||
<div className="col-12 text-muted">No floors for selected building.</div>
|
||||
<div className="col-12 text-muted">No floors found.</div>
|
||||
)}
|
||||
</div>
|
||||
</li>
|
||||
</>
|
||||
)}
|
||||
|
||||
{/* Activity Filter - Visible only if a floor is selected */}
|
||||
{/* Activity */}
|
||||
{selectedFloors.length > 0 && (
|
||||
<>
|
||||
<li><hr className="my-1" /></li>
|
||||
<li>
|
||||
<hr className="my-1" />
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<div className="fw-bold text-dark mb-1">Activity</div>
|
||||
<div className="fw-bold text-dark mb-1">Activities</div>
|
||||
<div className="row">
|
||||
{uniqueActivities.length > 0 ? (
|
||||
uniqueActivities.map((activity, idx) => (
|
||||
<div className="col-6" key={`activity-${idx}`}>
|
||||
<div className="col-6" key={idx}>
|
||||
<div className="form-check mb-1">
|
||||
<input
|
||||
className="form-check-input"
|
||||
@ -195,43 +189,60 @@ const FilterIcon = ({ taskListData, onApplyFilters, currentSelectedBuilding, cur
|
||||
checked={selectedActivities.includes(activity)}
|
||||
onChange={() => handleFilterChange("activity", activity)}
|
||||
/>
|
||||
<label
|
||||
className="form-check-label"
|
||||
htmlFor={`activity-${activity}`}
|
||||
>
|
||||
<label className="form-check-label" htmlFor={`activity-${activity}`}>
|
||||
{activity}
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
))
|
||||
) : (
|
||||
<div className="col-12 text-muted">No activities for selected floor(s).</div>
|
||||
<div className="col-12 text-muted">No activities found.</div>
|
||||
)}
|
||||
</div>
|
||||
</li>
|
||||
</>
|
||||
)}
|
||||
|
||||
{/* Clear Filters */}
|
||||
{(selectedBuilding ||
|
||||
selectedFloors.length > 0 ||
|
||||
selectedActivities.length > 0) && (
|
||||
<>
|
||||
<li>
|
||||
<hr className="my-1" />
|
||||
</li>
|
||||
<li>
|
||||
<button
|
||||
type="button"
|
||||
className="dropdown-item text-danger px-2 py-1"
|
||||
style={{ fontSize: "13px" }}
|
||||
onClick={clearAllFilters}
|
||||
>
|
||||
Clear All Filters
|
||||
</button>
|
||||
</li>
|
||||
</>
|
||||
)}
|
||||
{/* Action Buttons */}
|
||||
<li><hr className="my-1" /></li>
|
||||
{(selectedBuilding || selectedFloors.length > 0 || selectedActivities.length > 0) && (
|
||||
<li className="d-flex justify-content-end gap-2 px-2">
|
||||
<button
|
||||
type="button"
|
||||
className="btn btn-sm"
|
||||
style={{
|
||||
backgroundColor: "#7161EF",
|
||||
color: "white",
|
||||
fontSize: "13px",
|
||||
padding: "4px 16px",
|
||||
borderRadius: "8px",
|
||||
boxShadow: "0 1px 4px rgba(0,0,0,0.1)"
|
||||
}}
|
||||
onClick={clearAllFilters}
|
||||
>
|
||||
Clear
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="btn btn-sm"
|
||||
style={{
|
||||
backgroundColor: "#7161EF",
|
||||
color: "white",
|
||||
fontSize: "13px",
|
||||
padding: "4px 16px",
|
||||
borderRadius: "8px",
|
||||
boxShadow: "0 1px 4px rgba(0,0,0,0.1)"
|
||||
}}
|
||||
onClick={() => {
|
||||
document.getElementById("filterDropdown").click();
|
||||
}}
|
||||
>
|
||||
Apply
|
||||
</button>
|
||||
</li>
|
||||
)}
|
||||
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -26,20 +26,17 @@ const DailyTask = () => {
|
||||
const [initialized, setInitialized] = useState(false);
|
||||
const dispatch = useDispatch();
|
||||
|
||||
// State for filters (moved to FilterIcon, but we need to receive them here)
|
||||
const [filters, setFilters] = useState({
|
||||
selectedBuilding: "",
|
||||
selectedFloors: [],
|
||||
selectedActivities: [],
|
||||
});
|
||||
|
||||
// Sync projectId (either from URL or pick first accessible one)
|
||||
useEffect(() => {
|
||||
if (!project_loading && projects.length > 0 && !initialized) {
|
||||
if (projectIdFromUrl) {
|
||||
dispatch(setProjectId(projectIdFromUrl));
|
||||
} else if (selectedProject === 1 || selectedProject === undefined) {
|
||||
// If no project from URL or default/undefined, pick the first project
|
||||
dispatch(setProjectId(projects[0].id));
|
||||
}
|
||||
setInitialized(true);
|
||||
@ -57,7 +54,7 @@ const DailyTask = () => {
|
||||
|
||||
const {
|
||||
TaskList,
|
||||
loading: task_loading, // This `loading` state indicates if task data is being fetched
|
||||
loading: task_loading,
|
||||
error: task_error,
|
||||
refetch,
|
||||
} = useTaskList(
|
||||
@ -66,13 +63,11 @@ const DailyTask = () => {
|
||||
initialized ? dateRange.endDate : null
|
||||
);
|
||||
|
||||
const [TaskLists, setTaskLists] = useState([]); // This state holds the *filtered* tasks for display
|
||||
const [TaskLists, setTaskLists] = useState([]);
|
||||
const [dates, setDates] = useState([]);
|
||||
const popoverRefs = useRef([]);
|
||||
|
||||
// Effect to apply filters to TaskList (from useTaskList) and update TaskLists (filtered display)
|
||||
useEffect(() => {
|
||||
// Only filter if TaskList is available (not null or undefined)
|
||||
if (TaskList) {
|
||||
let filteredTasks = TaskList;
|
||||
|
||||
@ -101,8 +96,6 @@ const DailyTask = () => {
|
||||
}
|
||||
setTaskLists(filteredTasks);
|
||||
} else {
|
||||
// If TaskList is null (e.g., during initial load or project change before data arrives),
|
||||
// ensure TaskLists is also empty to avoid displaying stale data.
|
||||
setTaskLists([]);
|
||||
}
|
||||
}, [
|
||||
@ -137,52 +130,22 @@ const DailyTask = () => {
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
// Ensure Bootstrap's Popover is initialized correctly
|
||||
popoverRefs.current.forEach((el) => {
|
||||
if (
|
||||
el &&
|
||||
window.bootstrap &&
|
||||
typeof window.bootstrap.Popover === "function"
|
||||
) {
|
||||
// Dispose existing popovers to prevent duplicates if component re-renders
|
||||
const existingPopover = window.bootstrap.Popover.getInstance(el);
|
||||
if (existingPopover) {
|
||||
existingPopover.dispose();
|
||||
}
|
||||
new window.bootstrap.Popover(el, {
|
||||
if (el) {
|
||||
new bootstrap.Popover(el, {
|
||||
trigger: "focus",
|
||||
placement: "left",
|
||||
html: true,
|
||||
content: el.getAttribute("data-bs-content"),
|
||||
content: el.getAttribute("data-bs-content"),
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
// Cleanup function for popovers when component unmounts or dependencies change
|
||||
return () => {
|
||||
popoverRefs.current.forEach((el) => {
|
||||
if (
|
||||
el &&
|
||||
window.bootstrap &&
|
||||
typeof window.bootstrap.Popover === "function"
|
||||
) {
|
||||
const existingPopover = window.bootstrap.Popover.getInstance(el);
|
||||
if (existingPopover) {
|
||||
existingPopover.dispose();
|
||||
}
|
||||
}
|
||||
});
|
||||
popoverRefs.current = []; // Clear the refs array
|
||||
};
|
||||
}, [dates, TaskLists]); // Re-initialize popovers when tasks or dates change
|
||||
|
||||
// Handler for project selection
|
||||
},[dates, TaskLists]);
|
||||
|
||||
const handleProjectChange = (e) => {
|
||||
const newProjectId = e.target.value;
|
||||
dispatch(setProjectId(newProjectId));
|
||||
// --- IMPORTANT: Clear old data immediately to show loading state ---
|
||||
setTaskLists([]); // This makes the table empty, allowing the spinner to show
|
||||
// Reset filters when project changes (communicate to FilterIcon to clear)
|
||||
setTaskLists([]);
|
||||
setFilters({
|
||||
selectedBuilding: "",
|
||||
selectedFloors: [],
|
||||
@ -192,7 +155,6 @@ const DailyTask = () => {
|
||||
|
||||
return (
|
||||
<>
|
||||
{/* Report Task Modal */}
|
||||
<div
|
||||
className={`modal fade ${isModalOpen ? "show d-block" : ""}`}
|
||||
tabIndex="-1"
|
||||
@ -206,10 +168,8 @@ const DailyTask = () => {
|
||||
refetch={refetch}
|
||||
/>
|
||||
{isModalOpen && <div className="modal-backdrop fade show"></div>}{" "}
|
||||
{/* Add backdrop */}
|
||||
</div>
|
||||
|
||||
{/* Report Task Comments Modal */}
|
||||
<div
|
||||
className={`modal fade ${isModalOpenComment ? "show d-block" : ""}`}
|
||||
tabIndex="-1"
|
||||
@ -222,7 +182,6 @@ const DailyTask = () => {
|
||||
closeModal={closeCommentModal}
|
||||
/>
|
||||
{isModalOpenComment && <div className="modal-backdrop fade show"></div>}{" "}
|
||||
{/* Add backdrop */}
|
||||
</div>
|
||||
|
||||
<div className="container-xxl flex-grow-1 container-p-y">
|
||||
@ -242,15 +201,12 @@ const DailyTask = () => {
|
||||
DateDifference="6"
|
||||
dateFormat="DD-MM-YYYY"
|
||||
/>
|
||||
{/* FilterIcon component now manages its own filter states and logic */}
|
||||
<FilterIcon
|
||||
taskListData={TaskList} // Pass the raw TaskList to FilterIcon
|
||||
onApplyFilters={setFilters} // Callback to receive the filtered states from FilterIcon
|
||||
taskListData={TaskList}
|
||||
onApplyFilters={setFilters}
|
||||
currentSelectedBuilding={filters.selectedBuilding}
|
||||
currentSelectedFloors={filters.selectedFloors}
|
||||
currentSelectedActivities={filters.selectedActivities}
|
||||
// You can pass the project_loading state here if you want to disable filter during project load
|
||||
// isProjectLoading={project_loading}
|
||||
/>
|
||||
</div>
|
||||
<div className="col-md-4 col-12 text-center mb-2 mb-md-0">
|
||||
@ -261,7 +217,7 @@ const DailyTask = () => {
|
||||
value={selectedProject || ""}
|
||||
onChange={handleProjectChange}
|
||||
aria-label="Select Project"
|
||||
disabled={project_loading} // Disable dropdown while projects are loading
|
||||
disabled={project_loading}
|
||||
>
|
||||
{project_loading && (
|
||||
<option value="" disabled>
|
||||
@ -296,7 +252,6 @@ const DailyTask = () => {
|
||||
<tr>
|
||||
<td colSpan={6} className="text-center">
|
||||
{" "}
|
||||
{/* ColSpan set to 6 based on your table headers */}
|
||||
<div className="mt-10 mb-10 pt-5 pb-10">
|
||||
<div
|
||||
className="spinner-border text-primary"
|
||||
@ -309,7 +264,6 @@ const DailyTask = () => {
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
{/* --- "No Reports Found" message only if not loading and no tasks --- */}
|
||||
{!task_loading &&
|
||||
!project_loading &&
|
||||
TaskLists.length === 0 && (
|
||||
@ -317,20 +271,17 @@ const DailyTask = () => {
|
||||
<td colSpan={6} className="text-center">
|
||||
<div className="mt-10 mb-10 pt-10 pb-10">
|
||||
{" "}
|
||||
{/* ColSpan set to 6 */}
|
||||
<p>No Reports Found</p>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
)}
|
||||
{/* --- Render tasks when not loading and tasks exist --- */}
|
||||
{!task_loading &&
|
||||
TaskLists.length > 0 &&
|
||||
dates.map((date, i) => {
|
||||
const tasksForDate = TaskLists.filter((task) =>
|
||||
task.assignmentDate.includes(date)
|
||||
);
|
||||
// Only render the date header if there are tasks for that date after filtering
|
||||
if (tasksForDate.length === 0) return null;
|
||||
|
||||
return (
|
||||
@ -338,14 +289,13 @@ const DailyTask = () => {
|
||||
<tr className="table-row-header">
|
||||
<td colSpan={6} className="text-start">
|
||||
{" "}
|
||||
{/* ColSpan set to 6 */}
|
||||
<strong>
|
||||
{moment(date).format("DD-MM-YYYY")}
|
||||
</strong>
|
||||
</td>
|
||||
</tr>
|
||||
{tasksForDate.map((task, index) => {
|
||||
const refIndex = `${i}-${index}`;
|
||||
const refIndex = index * 10 + i;
|
||||
return (
|
||||
<React.Fragment key={refIndex}>
|
||||
<tr>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user