admin/marco.pms.web
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

For project progress widget set default selection 15W

Browse Source
This commit is contained in:
Vikas Nale 2025-06-13 09:39:27 +05:30
parent 31a9f55b63
commit 41f3628d45
1 changed files with 36 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
src/components/Dashboard/ProjectProgressChart.jsx
View File

@ -5,21 +5,31 @@ import { useDashboard_Data } from "../../hooks/useDashboard_Data";
import { useSelector } from "react-redux"; import { useSelector } from "react-redux";
const ProjectProgressChart = () => { const ProjectProgressChart = () => {
const selectedProject = useSelector((store) => store.localVariables.projectId); const selectedProject = useSelector(
(store) => store.localVariables.projectId
);
const { projects } = useProjects(); const { projects } = useProjects();
const [range, setRange] = useState("1W"); const [range, setRange] = useState("15D");
const [showAllEmployees, setShowAllEmployees] = useState(false); const [showAllEmployees, setShowAllEmployees] = useState(false);
const getDaysFromRange = (range) => { const getDaysFromRange = (range) => {
switch (range) { switch (range) {
case "1D": return 1; case "1D":
case "1W": return 7; return 1;
case "15D": return 15; case "1W":
case "1M": return 30; return 7;
case "3M": return 90; case "15D":
case "1Y": return 365; return 15;
case "5Y": return 1825; case "1M":
default: return 7; return 30;
case "3M":
return 90;
case "1Y":
return 365;
case "5Y":
return 1825;
default:
return 7;
} }
}; };
@ -27,9 +37,8 @@ const ProjectProgressChart = () => {
const today = new Date(); const today = new Date();
const FromDate = today.toLocaleDateString("en-CA"); const FromDate = today.toLocaleDateString("en-CA");
const projectId = showAllEmployees || !selectedProject?.trim() const projectId =
? null showAllEmployees || !selectedProject?.trim() ? null : selectedProject;
: selectedProject;
const { dashboard_data, loading: isLineChartLoading } = useDashboard_Data({ const { dashboard_data, loading: isLineChartLoading } = useDashboard_Data({
days, days,
@ -53,7 +62,10 @@ const ProjectProgressChart = () => {
]; ];
const lineChartCategories = sortedDashboardData.map((d) => const lineChartCategories = sortedDashboardData.map((d) =>
new Date(d.date).toLocaleDateString("en-US", { month: "short", day: "numeric" }) new Date(d.date).toLocaleDateString("en-US", {
month: "short",
day: "numeric",
})
); );
const lineChartCategoriesDates = sortedDashboardData.map((d) => const lineChartCategoriesDates = sortedDashboardData.map((d) =>
new Date(d.date).toLocaleDateString("en-US", { new Date(d.date).toLocaleDateString("en-US", {
@ -89,7 +101,10 @@ const ProjectProgressChart = () => {
checked={showAllEmployees} checked={showAllEmployees}
onChange={(e) => setShowAllEmployees(e.target.checked)} onChange={(e) => setShowAllEmployees(e.target.checked)}
/> />
<label className="form-check-label ms-2" htmlFor="showAllEmployees"> <label
className="form-check-label ms-2"
htmlFor="showAllEmployees"
>
All Projects All Projects
</label> </label>
</div> </div>
@ -99,15 +114,18 @@ const ProjectProgressChart = () => {
</p> </p>
)} )}
</div> </div>
</div> </div>
{/* Row 2: Time Range Buttons */} {/* Row 2: Time Range Buttons */}
<div className="d-flex flex-wrap mt-2"> <div className="d-flex flex-wrap mt-2">
{["1D", "1W", "15D", "1M", "3M", "1Y", "5Y"].map((key) => ( {["1D", "1W", "15D", "1M", "3M", "1Y", "5Y"].map((key) => (
<button <button
key={key} key={key}
className={`border-0 bg-transparent px-2 py-1 text-sm rounded ${range === key ? "border-bottom border-primary text-primary" : "text-muted" className={`border-0 bg-transparent px-2 py-1 text-sm rounded ${
}`} range === key
? "border-bottom border-primary text-primary"
: "text-muted"
}`}
style={{ cursor: "pointer", transition: "all 0.2s ease" }} style={{ cursor: "pointer", transition: "all 0.2s ease" }}
onClick={() => setRange(key)} onClick={() => setRange(key)}
> >