Implementing api for Expense data
This commit is contained in:
parent
014012abf3
commit
edebc2e471
@ -14,10 +14,7 @@ import { useSelector } from "react-redux";
|
||||
// import ProjectProgressChart from "./ProjectProgressChart";
|
||||
// import ProjectOverview from "../Project/ProjectOverview";
|
||||
import AttendanceOverview from "./AttendanceChart";
|
||||
import ExpenseChart from "./ExpenseChart";
|
||||
import ExpenseChartDesign2 from "./ExpenseChartDesign2";
|
||||
import ExpenseChartDesign1 from "./ExpenseChartDesign1";
|
||||
import ExpenseChartBar from "./ExpenseChartBar";
|
||||
|
||||
const Dashboard = () => {
|
||||
// const { projectsCardData } = useDashboardProjectsCardData();
|
||||
@ -31,20 +28,11 @@ const Dashboard = () => {
|
||||
return (
|
||||
<div className="container-fluid mt-5">
|
||||
<div className="row gy-4">
|
||||
<div className="col-xxl-6 col-lg-6">
|
||||
<ExpenseChart />
|
||||
</div>
|
||||
|
||||
<div className="col-xxl-6 col-lg-6">
|
||||
<ExpenseChartDesign2 />
|
||||
</div>
|
||||
<div className="col-xxl-6 col-lg-6">
|
||||
<ExpenseChartDesign1 />
|
||||
</div>
|
||||
<div className="col-xxl-6 col-lg-6">
|
||||
<ExpenseChartBar />
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
{!isAllProjectsSelected && (
|
||||
<div className="col-xxl-6 col-lg-6">
|
||||
<AttendanceOverview /> {/* Removed unnecessary projectId prop */}
|
||||
|
@ -1,145 +0,0 @@
|
||||
import React from "react";
|
||||
import Chart from "react-apexcharts";
|
||||
|
||||
const ExpenseChart = () => {
|
||||
// Radial Bar chart config
|
||||
const radialBarOptions = {
|
||||
chart: {
|
||||
type: "radialBar",
|
||||
},
|
||||
plotOptions: {
|
||||
radialBar: {
|
||||
hollow: {
|
||||
size: "60%",
|
||||
},
|
||||
dataLabels: {
|
||||
name: {
|
||||
show: true,
|
||||
},
|
||||
value: {
|
||||
fontSize: "18px",
|
||||
fontWeight: 600,
|
||||
color: "#000",
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
labels: ["Expenses"],
|
||||
series: [68], // % of budget spent
|
||||
colors: ["#FF4560"],
|
||||
};
|
||||
|
||||
// Dummy expense data
|
||||
const expenses = {
|
||||
food: 450,
|
||||
transport: 300,
|
||||
shopping: 150,
|
||||
bills: 200,
|
||||
};
|
||||
|
||||
const total =
|
||||
expenses.food + expenses.transport + expenses.shopping + expenses.bills;
|
||||
|
||||
return (
|
||||
<div className="card" style={{ minHeight: "490px" }}>
|
||||
{/* Card Header */}
|
||||
<div className="card-header text-start">
|
||||
<h5 className="mb-1 fw-bold">Expense Breakdown-1</h5>
|
||||
<p className="card-subtitle">Detailed project expenses</p>
|
||||
</div>
|
||||
|
||||
{/* Card Body */}
|
||||
<div className="card-body">
|
||||
<ul className="list-unstyled m-0 p-0">
|
||||
<li className="d-flex flex-wrap">
|
||||
<div className="w-100 d-flex flex-wrap">
|
||||
{/* Centered Chart */}
|
||||
<div className="w-100 d-flex justify-content-center mb-3">
|
||||
<div>
|
||||
<Chart
|
||||
options={radialBarOptions}
|
||||
series={radialBarOptions.series}
|
||||
type="radialBar"
|
||||
height="250"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Info Section */}
|
||||
<div className="mb-2 w-100" style={{ flex: "1 1 auto" }}>
|
||||
<div>
|
||||
{/* Food */}
|
||||
<div className="d-flex align-items-center mb-3">
|
||||
<div className="avatar me-2">
|
||||
<span className="avatar-initial rounded-2 bg-label-primary">
|
||||
<i className="bx bx-bowl-hot text-primary fs-4"></i>
|
||||
</span>
|
||||
</div>
|
||||
<div className="d-flex flex-column text-start">
|
||||
<small className="fw-bold">Food</small>
|
||||
<h5 className="mb-0">{expenses.food}</h5>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Transport */}
|
||||
<div className="d-flex align-items-center mb-3">
|
||||
<div className="avatar me-2">
|
||||
<span className="avatar-initial rounded-2 bg-label-info">
|
||||
<i className="bx bx-car text-info fs-4"></i>
|
||||
</span>
|
||||
</div>
|
||||
<div className="d-flex flex-column text-start">
|
||||
<small className="fw-bold">Transport</small>
|
||||
<h5 className="mb-0">{expenses.transport}</h5>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Shopping */}
|
||||
<div className="d-flex align-items-center mb-3">
|
||||
<div className="avatar me-2">
|
||||
<span className="avatar-initial rounded-2 bg-label-warning">
|
||||
<i className="bx bx-cart text-warning fs-4"></i>
|
||||
</span>
|
||||
</div>
|
||||
<div className="d-flex flex-column text-start">
|
||||
<small className="fw-bold">Shopping</small>
|
||||
<h5 className="mb-0">{expenses.shopping}</h5>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Bills */}
|
||||
<div className="d-flex align-items-center mb-3">
|
||||
<div className="avatar me-2">
|
||||
<span className="avatar-initial rounded-2 bg-label-danger">
|
||||
<i className="bx bx-receipt text-danger fs-4"></i>
|
||||
</span>
|
||||
</div>
|
||||
<div className="d-flex flex-column text-start">
|
||||
<small className="fw-bold">Bills</small>
|
||||
<h5 className="mb-0">{expenses.bills}</h5>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Total */}
|
||||
<div className="d-flex align-items-center">
|
||||
<div className="avatar me-2">
|
||||
<span className="avatar-initial rounded-2 bg-label-success">
|
||||
<i className="bx bx-wallet text-success fs-4"></i>
|
||||
</span>
|
||||
</div>
|
||||
<div className="d-flex flex-column text-start">
|
||||
<small className="fw-bold">Total</small>
|
||||
<h5 className="mb-0">{total}</h5>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ExpenseChart;
|
@ -1,48 +0,0 @@
|
||||
import React from "react";
|
||||
import Chart from "react-apexcharts";
|
||||
|
||||
const ExpenseChartBar = () => {
|
||||
const series = [
|
||||
{
|
||||
name: "Expenses",
|
||||
data: [450, 300, 150, 200],
|
||||
},
|
||||
];
|
||||
const options = {
|
||||
chart: { type: "bar", height: 350 },
|
||||
plotOptions: {
|
||||
bar: {
|
||||
horizontal: true,
|
||||
borderRadius: 6,
|
||||
},
|
||||
},
|
||||
dataLabels: { enabled: true },
|
||||
xaxis: {
|
||||
categories: ["Food", "Transport", "Shopping", "Bills"],
|
||||
},
|
||||
colors: ["#1E90FF"],
|
||||
};
|
||||
|
||||
const total = 450 + 300 + 150 + 200;
|
||||
|
||||
return (
|
||||
<div className="card" style={{ minHeight: "490px" }}>
|
||||
<div className="card-header text-start">
|
||||
<h5 className="mb-1 fw-bold">Expense Breakdown-2</h5>
|
||||
<p className="card-subtitle">Detailed project expenses</p>
|
||||
</div>
|
||||
<div className="card-body">
|
||||
{/* Bar Chart */}
|
||||
<Chart options={options} series={series} type="bar" height={300} />
|
||||
|
||||
{/* Total */}
|
||||
<div className="d-flex justify-content-between mt-3">
|
||||
<span className="fw-bold">Total Expenses</span>
|
||||
<span className="fw-bold text-success">{total}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ExpenseChartBar;
|
@ -1,72 +0,0 @@
|
||||
import React from "react";
|
||||
import Chart from "react-apexcharts";
|
||||
|
||||
const ExpenseChartDesign1 = () => {
|
||||
const budget = 1500;
|
||||
const expenses = {
|
||||
food: 450,
|
||||
transport: 300,
|
||||
shopping: 250,
|
||||
bills: 200,
|
||||
};
|
||||
|
||||
const total = Object.values(expenses).reduce((a, b) => a + b, 0);
|
||||
const percent = Math.round((total / budget) * 100);
|
||||
|
||||
const radialOptions = {
|
||||
chart: { type: "radialBar" },
|
||||
plotOptions: {
|
||||
radialBar: {
|
||||
hollow: { size: "65%" },
|
||||
dataLabels: {
|
||||
name: { show: true, fontSize: "14px" },
|
||||
value: { fontSize: "20px", fontWeight: "bold" },
|
||||
},
|
||||
},
|
||||
},
|
||||
labels: ["Budget Used"],
|
||||
colors: ["#7367F0"],
|
||||
series: [percent],
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="card shadow-sm" style={{ minHeight: "490px" }}>
|
||||
<div className="card-header text-start">
|
||||
<h5 className="mb-1 fw-bold">Expense Breakdown-4</h5>
|
||||
<p className="card-subtitle">Detailed project expenses</p>
|
||||
</div>
|
||||
|
||||
<div className="card-body d-flex flex-column align-items-center">
|
||||
{/* Radial Chart */}
|
||||
<Chart
|
||||
options={radialOptions}
|
||||
series={radialOptions.series}
|
||||
type="radialBar"
|
||||
height="250"
|
||||
/>
|
||||
<h6 className="mt-3 text-muted">
|
||||
${total} / ${budget} spent
|
||||
</h6>
|
||||
|
||||
{/* Categories */}
|
||||
<div className="mt-4 w-100">
|
||||
{Object.entries(expenses).map(([key, value], idx) => (
|
||||
<div className="d-flex align-items-center mb-3" key={idx}>
|
||||
<div className="avatar me-2">
|
||||
<span className="avatar-initial rounded-2 bg-label-primary">
|
||||
<i className="bx bx-wallet text-primary fs-5"></i>
|
||||
</span>
|
||||
</div>
|
||||
<div className="d-flex justify-content-between flex-grow-1">
|
||||
<small className="fw-bold text-capitalize">{key}</small>
|
||||
<span className="fw-bold">${value}</span>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ExpenseChartDesign1;
|
@ -1,131 +1,119 @@
|
||||
|
||||
import React from "react";
|
||||
import React, { useState } from "react";
|
||||
import Chart from "react-apexcharts";
|
||||
import DateRangePicker from "../common/DateRangePicker";
|
||||
import { useDashboard_ExpenseData } from "../../hooks/useDashboard_Data";
|
||||
import { useSelectedProject } from "../../slices/apiDataManager";
|
||||
|
||||
const ExpenseChartDesign2 = () => {
|
||||
const expenses = {
|
||||
food: 450,
|
||||
transport: 300,
|
||||
shopping: 250,
|
||||
bills: 200,
|
||||
};
|
||||
const projectId = useSelectedProject()
|
||||
const [dateRange, setDateRange] = useState({ startDate: "", endDate: "" });
|
||||
|
||||
const total = Object.values(expenses).reduce((a, b) => a + b, 0);
|
||||
const { data, isLoading, isError, error } = useDashboard_ExpenseData(
|
||||
projectId,
|
||||
dateRange.startDate,
|
||||
dateRange.endDate
|
||||
);
|
||||
|
||||
const donutOptions = {
|
||||
chart: { type: "donut" },
|
||||
labels: ["Food", "Transport", "Shopping", "Bills"],
|
||||
legend: { show: false },
|
||||
dataLabels: {
|
||||
enabled: true,
|
||||
formatter: (val) => `${val.toFixed(0)}%`,
|
||||
},
|
||||
colors: ["#7367F0", "#28C76F", "#FF9F43", "#EA5455"],
|
||||
plotOptions: {
|
||||
pie: {
|
||||
donut: {
|
||||
size: "70%",
|
||||
labels: {
|
||||
show: true,
|
||||
total: {
|
||||
show: true,
|
||||
label: "Total",
|
||||
fontSize: "16px",
|
||||
formatter: () => `$${total}`,
|
||||
if (isLoading) return <div>Loading....</div>
|
||||
if (isError) return <div>{error.message}</div>;
|
||||
|
||||
const report = data?.report || [];
|
||||
|
||||
// Map the API data to chart labels and series
|
||||
const labels = report.map((item) => item.projectName);
|
||||
const series = report.map((item) => item.totalApprovedAmount || 0);
|
||||
const total = data?.totalAmount || 0;
|
||||
|
||||
const donutOptions = {
|
||||
chart: { type: "donut" },
|
||||
labels,
|
||||
legend: { show: false },
|
||||
dataLabels: { enabled: true, formatter: (val) => `${val.toFixed(0)}%` },
|
||||
colors: ["#7367F0", "#28C76F", "#FF9F43", "#EA5455", "#00CFE8", "#FF78B8"],
|
||||
plotOptions: {
|
||||
pie: {
|
||||
donut: {
|
||||
size: "70%",
|
||||
labels: {
|
||||
show: true,
|
||||
total: {
|
||||
show: true,
|
||||
label: "Total",
|
||||
fontSize: "16px",
|
||||
formatter: () => `${total}`,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
const series = Object.values(expenses);
|
||||
|
||||
return (
|
||||
<div className="card shadow-sm" style={{ minHeight: "490px" }}>
|
||||
<div className="card-header text-start mt-3">
|
||||
<h5 className="mb-1 fw-bold">Expense Breakdown-3</h5>
|
||||
<p className="card-subtitle">Detailed project expenses</p>
|
||||
</div>
|
||||
|
||||
<div className="card-body">
|
||||
{/* Donut Chart */}
|
||||
<div className="d-flex justify-content-center mb-4">
|
||||
<Chart options={donutOptions} series={series} type="donut" width="320" />
|
||||
if (data?.report === 0) {
|
||||
return <div>
|
||||
No data found
|
||||
</div>
|
||||
}
|
||||
|
||||
{/* Custom Legend with Icons and Right-Aligned Amount */}
|
||||
<div className="mb-2 w-100" style={{ flex: "1 1 auto" }}>
|
||||
<div>
|
||||
{/* Food */}
|
||||
<div className="d-flex align-items-center justify-content-between mb-3">
|
||||
<div className="d-flex align-items-center">
|
||||
<div className="avatar me-2">
|
||||
<span className="avatar-initial rounded-2 bg-label-primary">
|
||||
<i className="bx bx-bowl-hot text-primary fs-4"></i>
|
||||
</span>
|
||||
return (
|
||||
<div className="card shadow-sm" style={{ minHeight: "500px" }}>
|
||||
<div className="card-header d-flex justify-content-between align-items-center mt-3">
|
||||
<div>
|
||||
<h5 className="mb-1 fw-bold">Expense Breakdown</h5>
|
||||
<p className="card-subtitle me-3">Detailed project expenses</p>
|
||||
</div>
|
||||
<div className="text-end">
|
||||
<DateRangePicker
|
||||
DateDifference="7"
|
||||
onRangeChange={setDateRange}
|
||||
endDateMode="today"
|
||||
/>
|
||||
</div>
|
||||
<small className="fw-bold">Food</small>
|
||||
</div>
|
||||
<span className="fw-bold">${expenses.food}</span>
|
||||
</div>
|
||||
|
||||
{/* Transport */}
|
||||
<div className="d-flex align-items-center justify-content-between mb-3">
|
||||
<div className="d-flex align-items-center">
|
||||
<div className="avatar me-2">
|
||||
<span className="avatar-initial rounded-2 bg-label-info">
|
||||
<i className="bx bx-car text-info fs-4"></i>
|
||||
</span>
|
||||
</div>
|
||||
<small className="fw-bold">Transport</small>
|
||||
</div>
|
||||
<span className="fw-bold">${expenses.transport}</span>
|
||||
</div>
|
||||
<div className="card-body">
|
||||
{report.length === 0 ? (
|
||||
<div className="text-center text-muted py-5">
|
||||
No data found
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
<div className="d-flex justify-content-center mb-8">
|
||||
<Chart
|
||||
options={donutOptions}
|
||||
series={report.map((item) => item.totalApprovedAmount || 0)}
|
||||
type="donut"
|
||||
width="320"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Shopping */}
|
||||
<div className="d-flex align-items-center justify-content-between mb-3">
|
||||
<div className="d-flex align-items-center">
|
||||
<div className="avatar me-2">
|
||||
<span className="avatar-initial rounded-2 bg-label-warning">
|
||||
<i className="bx bx-cart text-warning fs-4"></i>
|
||||
</span>
|
||||
</div>
|
||||
<small className="fw-bold">Shopping</small>
|
||||
</div>
|
||||
<span className="fw-bold">${expenses.shopping}</span>
|
||||
<div className="mb-2 w-100">
|
||||
<div className="row">
|
||||
{report.map((item, idx) => (
|
||||
<div
|
||||
className="col-6 d-flex justify-content-start align-items-start mb-2"
|
||||
key={idx}
|
||||
>
|
||||
<div className="avatar me-2">
|
||||
<span
|
||||
className="avatar-initial rounded-2"
|
||||
style={{ backgroundColor: donutOptions.colors[idx % donutOptions.colors.length] }}
|
||||
>
|
||||
<i className="bx bx-receipt fs-4"></i>
|
||||
</span>
|
||||
</div>
|
||||
<div className="d-flex flex-column gap-1 text-start">
|
||||
<small className="fw-bold fs-6">{item.projectName}</small>
|
||||
<span className="fw-bold text-muted ms-1">{item.totalApprovedAmount}</span>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{/* Bills */}
|
||||
<div className="d-flex align-items-center justify-content-between mb-3">
|
||||
<div className="d-flex align-items-center">
|
||||
<div className="avatar me-2">
|
||||
<span className="avatar-initial rounded-2 bg-label-danger">
|
||||
<i className="bx bx-receipt text-danger fs-4"></i>
|
||||
</span>
|
||||
</div>
|
||||
<small className="fw-bold">Bills</small>
|
||||
</div>
|
||||
<span className="fw-bold">${expenses.bills}</span>
|
||||
</div>
|
||||
|
||||
{/* Total */}
|
||||
<div className="d-flex align-items-center justify-content-between">
|
||||
<div className="d-flex align-items-center">
|
||||
<div className="avatar me-2">
|
||||
<span className="avatar-initial rounded-2 bg-label-success">
|
||||
<i className="bx bx-wallet text-success fs-4"></i>
|
||||
</span>
|
||||
</div>
|
||||
<small className="fw-bold">Total</small>
|
||||
</div>
|
||||
<span className="fw-bold">${total}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
);
|
||||
};
|
||||
|
||||
export default ExpenseChartDesign2;
|
||||
|
@ -200,35 +200,45 @@ export const useAttendanceOverviewData = (projectId, days) => {
|
||||
// })
|
||||
// }
|
||||
|
||||
export const useDashboard_AttendanceData = (date,projectId)=>{
|
||||
return useQuery({
|
||||
queryKey:["dashboardAttendances",date,projectId],
|
||||
queryFn:async()=> {
|
||||
|
||||
const resp = await await GlobalRepository.getDashboardAttendanceData(date, projectId)
|
||||
return resp.data;
|
||||
export const useDashboard_AttendanceData = (date, projectId) => {
|
||||
return useQuery({
|
||||
queryKey: ["dashboardAttendances", date, projectId],
|
||||
queryFn: async () => {
|
||||
|
||||
const resp = await await GlobalRepository.getDashboardAttendanceData(date, projectId)
|
||||
return resp.data;
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
export const useDashboardTeamsCardData =(projectId)=>{
|
||||
return useQuery({
|
||||
queryKey:["dashboardTeams",projectId],
|
||||
queryFn:async()=> {
|
||||
|
||||
const resp = await GlobalRepository.getDashboardTeamsCardData(projectId)
|
||||
return resp.data;
|
||||
export const useDashboard_ExpenseData = (projectId, startDate, endDate) => {
|
||||
return useQuery({
|
||||
queryKey: ["dashboardExpenses", projectId, startDate, endDate],
|
||||
queryFn: async () => {
|
||||
const resp = await GlobalRepository.getExpenseData(projectId, startDate, endDate);
|
||||
return resp.data; // this will return the "data" object from API response
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
export const useDashboardTeamsCardData = (projectId) => {
|
||||
return useQuery({
|
||||
queryKey: ["dashboardTeams", projectId],
|
||||
queryFn: async () => {
|
||||
|
||||
const resp = await GlobalRepository.getDashboardTeamsCardData(projectId)
|
||||
return resp.data;
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
export const useDashboardTasksCardData = (projectId) => {
|
||||
return useQuery({
|
||||
queryKey:["dashboardTasks",projectId],
|
||||
queryFn:async()=> {
|
||||
|
||||
const resp = await GlobalRepository.getDashboardTasksCardData(projectId)
|
||||
return resp.data;
|
||||
return useQuery({
|
||||
queryKey: ["dashboardTasks", projectId],
|
||||
queryFn: async () => {
|
||||
|
||||
const resp = await GlobalRepository.getDashboardTasksCardData(projectId)
|
||||
return resp.data;
|
||||
}
|
||||
})
|
||||
}
|
||||
@ -236,7 +246,7 @@ export const useDashboardTasksCardData = (projectId) => {
|
||||
// return useQuery({
|
||||
// queryKey:["dashboardAttendanceOverView",projectId],
|
||||
// queryFn:async()=> {
|
||||
|
||||
|
||||
// const resp = await GlobalRepository.getAttendanceOverview(projectId, days);
|
||||
// return resp.data;
|
||||
// }
|
||||
@ -244,12 +254,12 @@ export const useDashboardTasksCardData = (projectId) => {
|
||||
// }
|
||||
|
||||
export const useDashboardProjectsCardData = () => {
|
||||
return useQuery({
|
||||
queryKey:["dashboardProjects"],
|
||||
queryFn:async()=> {
|
||||
|
||||
const resp = await GlobalRepository.getDashboardProjectsCardData();
|
||||
return resp.data;
|
||||
return useQuery({
|
||||
queryKey: ["dashboardProjects"],
|
||||
queryFn: async () => {
|
||||
|
||||
const resp = await GlobalRepository.getDashboardProjectsCardData();
|
||||
return resp.data;
|
||||
}
|
||||
})
|
||||
}
|
@ -3,12 +3,12 @@ import { api } from "../utils/axiosClient";
|
||||
const GlobalRepository = {
|
||||
getDashboardProgressionData: ({ days = '', FromDate = '', projectId = '' }) => {
|
||||
let params;
|
||||
if(projectId == null){
|
||||
if (projectId == null) {
|
||||
params = new URLSearchParams({
|
||||
days: days.toString(),
|
||||
FromDate,
|
||||
});
|
||||
}else{
|
||||
} else {
|
||||
params = new URLSearchParams({
|
||||
days: days.toString(),
|
||||
FromDate,
|
||||
@ -19,30 +19,54 @@ const GlobalRepository = {
|
||||
return api.get(`/api/Dashboard/Progression?${params.toString()}`);
|
||||
},
|
||||
|
||||
getDashboardAttendanceData: ( date,projectId ) => {
|
||||
getDashboardAttendanceData: (date, projectId) => {
|
||||
|
||||
return api.get(`/api/Dashboard/project-attendance/${projectId}?date=${date}`);
|
||||
},
|
||||
return api.get(`/api/Dashboard/project-attendance/${projectId}?date=${date}`);
|
||||
},
|
||||
getDashboardProjectsCardData: () => {
|
||||
return api.get(`/api/Dashboard/projects`);
|
||||
},
|
||||
|
||||
|
||||
getDashboardTeamsCardData: (projectId) => {
|
||||
const url = projectId
|
||||
? `/api/Dashboard/teams?projectId=${projectId}`
|
||||
: `/api/Dashboard/teams`;
|
||||
return api.get(url);
|
||||
},
|
||||
const url = projectId
|
||||
? `/api/Dashboard/teams?projectId=${projectId}`
|
||||
: `/api/Dashboard/teams`;
|
||||
return api.get(url);
|
||||
},
|
||||
|
||||
getDashboardTasksCardData: (projectId) => {
|
||||
const url = projectId
|
||||
? `/api/Dashboard/tasks?projectId=${projectId}`
|
||||
: `/api/Dashboard/tasks`;
|
||||
return api.get(url);
|
||||
},
|
||||
const url = projectId
|
||||
? `/api/Dashboard/tasks?projectId=${projectId}`
|
||||
: `/api/Dashboard/tasks`;
|
||||
return api.get(url);
|
||||
},
|
||||
|
||||
getAttendanceOverview:(projectId,days)=>api.get(`/api/dashboard/attendance-overview/${projectId}?days=${days}`)
|
||||
getAttendanceOverview: (projectId, days) => api.get(`/api/dashboard/attendance-overview/${projectId}?days=${days}`),
|
||||
|
||||
|
||||
|
||||
getExpenseData: (projectId, startDate, endDate) => {
|
||||
let url = `api/Dashboard/expense/type`
|
||||
|
||||
const queryParams = [];
|
||||
|
||||
if (projectId) {
|
||||
queryParams.push(`projectId=${projectId}`);
|
||||
}
|
||||
|
||||
if (startDate) {
|
||||
queryParams.push(`startDate=${startDate}`);
|
||||
}
|
||||
if (endDate) {
|
||||
queryParams.push(`endDate=${endDate}`);
|
||||
}
|
||||
|
||||
if (queryParams.length > 0) {
|
||||
url += `?${queryParams.join("&")}`;
|
||||
}
|
||||
|
||||
return api.get(url );
|
||||
},
|
||||
};
|
||||
|
||||
export default GlobalRepository;
|
||||
|
Loading…
x
Reference in New Issue
Block a user