Browse Source

update dashboard

tags/Baseline_30082024_FRONTEND_UAT
Mac\David 1 year ago
parent
commit
cf2460d31b
5 changed files with 68 additions and 11 deletions
  1. +1
    -1
      src/app/api/teamprojects/actions.ts
  2. +2
    -2
      src/components/ProgressByTeam/ProgressByTeam.tsx
  3. +3
    -2
      src/components/ProjectCashFlow/ProjectCashFlow.tsx
  4. +3
    -1
      src/components/ProjectFinancialSummary/ProjectFinancialCard.tsx
  5. +59
    -5
      src/components/ProjectResourceConsumptionRanking/ProjectResourceConsumptionRanking.tsx

+ 1
- 1
src/app/api/teamprojects/actions.ts View File

@@ -55,7 +55,7 @@ export const fetchAllTeamConsumption = cache(async (teamIdList: number[],tableSo
if (teamIdList.length !== 0) {
const queryParams = new URLSearchParams();
queryParams.append('teamIdList', teamIdList.join(','));
return serverFetchJson<TeamConsumptionResult[]>(`${BASE_API_URL}/dashboard/searchTeamConsumption?${queryParams.toString()}&tableSorting=${tableSorting}`);
return serverFetchJson<ClientSubsidiaryProjectResult[]>(`${BASE_API_URL}/dashboard/searchTeamConsumption?${queryParams.toString()}&tableSorting=${tableSorting}`);
} else {
return [];
}


+ 2
- 2
src/components/ProgressByTeam/ProgressByTeam.tsx View File

@@ -367,7 +367,7 @@ const ProgressByTeam: React.FC = () => {
field: "alert",
headerName: "Alert",
renderCell: (params: any) => {
if (params.row.alert === true) {
if (params.row.alert === 1) {
return (
<span className="text-red-300 text-center">
<ReportProblemIcon />
@@ -492,7 +492,7 @@ const ProgressByTeam: React.FC = () => {
const spentManhours = currentPageProjectSpentManhourList[dataPointIndex];
const value = series[seriesIndex][dataPointIndex];
const tooltipContent = `
<div style="width: 250px;">
<div style="width: 100%;">
<span style="font-weight: bold;">${projectCode} - ${projectName}</span>
<br>
Budget Manhours: ${budgetManhours} hours


+ 3
- 2
src/components/ProjectCashFlow/ProjectCashFlow.tsx View File

@@ -570,7 +570,7 @@ const ProjectCashFlow: React.FC = () => {
stroke: {
lineCap: "round",
},
labels: ["Accounts Receivable","Account Invoiced"],
labels: ["Received Amount","Invoiced Amount"],
};

const expenditureOptions: ApexOptions = {
@@ -620,7 +620,7 @@ const ProjectCashFlow: React.FC = () => {
stroke: {
lineCap: "round",
},
labels: ["Accounts Expenditure"],
labels: ["Expenditure"],
};

const rows = [
@@ -848,6 +848,7 @@ const ProjectCashFlow: React.FC = () => {
>
${totalFee.toLocaleString(undefined, { minimumFractionDigits: 2, maximumFractionDigits: 2 })}
</div>
<hr />
<div
className="text-sm font-medium ml-5 mt-2"
style={{ color: "#898d8d" }}


+ 3
- 1
src/components/ProjectFinancialSummary/ProjectFinancialCard.tsx View File

@@ -165,6 +165,7 @@ const ProjectFinancialCard: React.FC<Props> = ({
>
{CostPerformanceIndex}
</div>
<hr />
</>
)}
{Number(CostPerformanceIndex) >= 1 && (
@@ -175,6 +176,7 @@ const ProjectFinancialCard: React.FC<Props> = ({
>
{CostPerformanceIndex}
</div>
<hr />
</>
)}
<div className="text-sm font-medium ml-5" style={{ color: "#898d8d" }}>
@@ -197,7 +199,7 @@ const ProjectFinancialCard: React.FC<Props> = ({
className="text-lg font-medium ml-5"
style={{ color: "#71d19e" }}
>
{CashFlowStatus}
{ProjectedCashFlowStatus}
</div>
<hr />
</>


+ 59
- 5
src/components/ProjectResourceConsumptionRanking/ProjectResourceConsumptionRanking.tsx View File

@@ -55,6 +55,7 @@ const ProjectResourceConsumptionRanking: React.FC = () => {
const [receiptFromDate, setReceiptFromDate] = useState(null);
const [receiptToDate, setReceiptToDate] = useState(null);
const [selectedRows, setSelectedRows] = useState([]);
const [chartProjectColor, setChartProjectColor]:any[] = useState([]);
const [chartProjectName, setChartProjectName]:any[] = useState([]);
const [chartProjectDisplayName, setChartProjectDisplayName]:any[] = useState([]);
const [chartProjectBudgetedHour, setChartProjectBudgetedHour]:any[] = useState([]);
@@ -131,15 +132,29 @@ const ProjectResourceConsumptionRanking: React.FC = () => {
const projectBudgetedManHour = []
const projectSpentManHour = []
const manhourConsumptionPercentage = []
const chartColor = []
let c = 0
for (let i = 0; i < teamProjectResult.length; i++){
teamProjectResult[i].color = color[i]
console.log(teamProjectResult[i])
projectNo.push(teamProjectResult[i].team + "(" + teamProjectResult[i].teamLead + ")")
projectNo.push(teamProjectResult[i].projectCode + "(" + teamProjectResult[i].team + ")")
projectName.push(teamProjectResult[i].projectName)
projectBudgetedManHour.push(teamProjectResult[i].budgetedManhour)
projectSpentManHour.push(teamProjectResult[i].spentManhour)
manhourConsumptionPercentage.push(teamProjectResult[i].manhourConsumptionPercentage)
if (i === 0) {
chartColor.push(color[c])
teamProjectResult[i].color = color[c]
} else if (teamProjectResult[i].team !== teamProjectResult[i - 1].team) {
c = c + 1
chartColor.push(color[c])
teamProjectResult[i].color = color[c]
} else if (teamProjectResult[i].team === teamProjectResult[i - 1].team){
chartColor.push(color[c])
teamProjectResult[i].color = color[c]
}
}
setChartProjectColor(chartColor)
setChartProjectName(projectNo)
setChartProjectDisplayName(projectName)
setChartProjectBudgetedHour(projectBudgetedManHour)
@@ -319,6 +334,18 @@ const ProjectResourceConsumptionRanking: React.FC = () => {
},
flex: 0.1,
},
{
id: "projectCode",
field: "projectCode",
headerName: "Project No",
minWidth:100
},
{
id: "projectName",
field: "projectName",
headerName: "Project",
minWidth:300
},
{
id: "team",
field: "team",
@@ -331,6 +358,27 @@ const ProjectResourceConsumptionRanking: React.FC = () => {
headerName: "Team Leader",
minWidth: 70
},
{
id: "expectedStage",
field: "expectedStage",
headerName: "Expected Stage",
minWidth: 300,
renderCell: (params: any) => {
if (params.row.expectedStage != null){
const expectedStage = params.row.expectedStage;
const lines = expectedStage.split(",").map((line:any, index:any) => (
<React.Fragment key={index}>
{line.trim()}
<br />
</React.Fragment>
));
return <div>{lines}</div>;
} else {
return <div>-</div>;
}
},
},
{
id: "budgetedManhour",
field: "budgetedManhour",
@@ -370,12 +418,18 @@ const ProjectResourceConsumptionRanking: React.FC = () => {
},
minWidth: 70
},
{
id: "comingPaymentMilestone",
field: "comingPaymentMilestone",
headerName: "Coming Payment Milestone",
minWidth: 100
},
{
id: "alert",
field: "alert",
headerName: "Alert",
renderCell: (params: any) => {
if (params.row.alert === true) {
if (params.row.alert === 1) {
return (
<span className="text-red-300 text-center">
<ReportProblemIcon />
@@ -587,7 +641,7 @@ const ProjectResourceConsumptionRanking: React.FC = () => {
if (i === selectedRowsData.length && i > 0) {
projectArray.push("Remained");
} else if (selectedRowsData.length > 0) {
projectArray.push(selectedRowsData[i].team);
projectArray.push(selectedRowsData[i].projectName);
totalBudgetManhour += Number(selectedRowsData[i].budgetedManhour);
totalSpent += Number(selectedRowsData[i].spentManhour);
pieChartColorArray.push(selectedRowsData[i].color);
@@ -639,7 +693,7 @@ const ProjectResourceConsumptionRanking: React.FC = () => {
const currentPageProjectBudgetedManhour = chartProjectBudgetedHour.slice(startIndex, endIndex)
const currentPageProjectSpentManhour = chartProjectSpentHour.slice(startIndex, endIndex)
const currentPageData = chartManhourConsumptionPercentage.slice(startIndex, endIndex);
const colorArray = color.slice(startIndex, endIndex);
const colorArray = chartProjectColor.slice(startIndex, endIndex);
console.log(currentPage)
console.log(Math.ceil(chartManhourConsumptionPercentage.length / recordsPerPage))
setCurrentPageProjectList(currentPageProjectData)


Loading…
Cancel
Save