bo/worklenz
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(reporting): add total time utilization component and enhance localization

Browse Source 
- Introduced a new TotalTimeUtilization component to display total time logged, expected capacity, and team utilization metrics.
- Updated existing time-report localization files to include new keys for total time logged, expected capacity, and utilization states across multiple languages.
- Refactored MembersTimeReports to integrate the new TotalTimeUtilization component, improving the reporting interface.
- Enhanced the overall structure and organization of the reporting components for better maintainability.
This commit is contained in:
chamikaJ
2025-07-24 11:41:04 +05:30
parent 20ce0c9687
commit 67a75685a9
11 changed files with 525 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
worklenz-frontend/src/pages/reporting/timeReports/members-time-reports.tsx
View File

@@ -1,17 +1,21 @@
import { Card, Flex } from '@/shared/antd-imports';
import TimeReportPageHeader from '@/components/reporting/time-reports/page-header/TimeReportPageHeader';
import MembersTimeSheet, {
MembersTimeSheetRef,
} from '@/pages/reporting/time-reports/members-time-sheet/members-time-sheet';
import TimeReportingRightHeader from '@/components/reporting/time-reports/right-header/TimeReportingRightHeader';
import { Card, Flex } from 'antd';
import MembersTimeSheet, { MembersTimeSheetRef } from '@/pages/reporting/time-reports/members-time-sheet/members-time-sheet';
import { useTranslation } from 'react-i18next';
import { useDocumentTitle } from '@/hooks/useDoumentTItle';
import { useRef } from 'react';
import { useRef, useState } from 'react';
import { IRPTTimeTotals } from '@/types/reporting/reporting.types';
import TimeReportingRightHeader from '@/components/reporting/time-reports/right-header/TimeReportingRightHeader';
import TimeReportPageHeader from '@/components/reporting/time-reports/page-header/TimeReportPageHeader';
import TotalTimeUtilization from '@/components/reporting/time-reports/total-time-utilization/total-time-utilization';
const MembersTimeReports = () => {
const { t } = useTranslation('time-report');
const chartRef = useRef<MembersTimeSheetRef>(null);
const [totals, setTotals] = useState<IRPTTimeTotals>({
total_time_logs: "0",
total_estimated_hours: "0",
total_utilization: "0",
});
useDocumentTitle('Reporting - Allocation');
const handleExport = (type: string) => {
@@ -20,24 +24,18 @@ const MembersTimeReports = () => {
}
};
const handleTotalsUpdate = (totals: {
total_time_logs: string;
total_estimated_hours: string;
total_utilization: string;
}) => {
// Handle totals update if needed
// This could be used to display totals in the UI or pass to parent components
console.log('Totals updated:', totals);
const handleTotalsUpdate = (newTotals: IRPTTimeTotals) => {
setTotals(newTotals);
};
return (
<Flex vertical>
<TimeReportingRightHeader
title={t('membersTimeSheet')}
title={t('Members Time Sheet')}
exportType={[{ key: 'png', label: 'PNG' }]}
export={handleExport}
/>
<TotalTimeUtilization totals={totals} />
<Card
style={{ borderRadius: '4px' }}
title={
@@ -53,7 +51,7 @@ const MembersTimeReports = () => {
},
}}
>
<MembersTimeSheet ref={chartRef} onTotalsUpdate={handleTotalsUpdate} />
<MembersTimeSheet onTotalsUpdate={handleTotalsUpdate} ref={chartRef} />
</Card>
</Flex>
);