simple project details export

Author: Laoujin

backend/src/controllers/projects.ts

@@ -66,3 +66,20 @@ export const deleteProject = async (req: ConfacRequest, res: Response) => {
   emitEntityEvent(req, SocketEventTypes.EntityDeleted, CollectionNames.PROJECTS, id, null);
   return res.send(id);
 };
+
+
+
+const PROJECTS_EXCEL_HEADERS = [
+  'Consultant', 'Consultant Type', 'Start datum', 'Eind datum', 'Onderaannemer',
+  'Uurtarief', 'Dagtarief', 'Klant', 'Klant uurtarief', 'Klant dagtarief',
+  'Margin', 'Margin %', 'Eindklant', 'Raamcontract', 'Contract werkopdracht',
+];
+
+/** Create simple CSV output of the project._ids passed in the body */
+export const generateExcelForProjectsController = async (req: Request, res: Response) => {
+  const separator = ';';
+  const excelHeader = `${PROJECTS_EXCEL_HEADERS.join(separator)}\r\n`;
+  const excelBody = req.body.map((record: any) => record.join(separator)).join('\r\n');
+  const excel = `${excelHeader}${excelBody}`;
+  return res.send(excel);
+};

backend/src/routes/projects.ts

@@ -1,5 +1,5 @@
 import {Router} from 'express';
-import {deleteProject, getProjects, saveProject} from '../controllers/projects';
+import {deleteProject, getProjects, saveProject, generateExcelForProjectsController} from '../controllers/projects';
 import {
   getProjectsPerMonthController, createProjectsMonthController,
   patchProjectsMonthController, getProjectsPerMonthOverviewController,
@@ -11,6 +11,7 @@ const projectsRouter = Router();
 projectsRouter.get('/', getProjects);
 projectsRouter.post('/', saveProject as any);
 projectsRouter.delete('/', deleteProject as any);
+projectsRouter.post('/excel', generateExcelForProjectsController);
 
 projectsRouter.get('/month', getProjectsPerMonthController);
 projectsRouter.get('/month/overview', getProjectsPerMonthOverviewController);

frontend/src/actions/downloadActions.ts

@@ -77,6 +77,20 @@ export function downloadInvoicesExcel(ids: string[]) {
   };
 }
 
+export function downloadProjectsExcel(ids: any[]) {
+  return dispatch => {
+    request.post(buildUrl('/projects/excel'))
+      .responseType('blob')
+      .set('Authorization', authService.getBearer())
+      .send(ids)
+      .then(res => {
+        console.log('downloaded', res); // eslint-disable-line
+        const fileName = `projects-${moment().format('YYYY-MM-DD')}.csv`;
+        downloadAttachment(fileName, res.body);
+      });
+  };
+}
+
 
 export function downloadInvoicesZip(ids: string[]) {
   return dispatch => {

frontend/src/components/project/ProjectsList.tsx

@@ -1,14 +1,18 @@
 import {useDispatch, useSelector} from 'react-redux';
 import {useNavigate} from 'react-router-dom';
 import {ConfacState} from '../../reducers/app-state';
-import {saveProject, updateAppFilters} from '../../actions';
+import {downloadProjectsExcel, saveProject, updateAppFilters} from '../../actions';
 import {ListPage} from '../controls/table/ListPage';
 import {projectFeature, ProjectFeatureBuilderConfig} from './models/getProjectFeature';
 import {LinkToButton} from '../controls/form-controls/button/LinkToButton';
 import {useDocumentTitle} from '../hooks/useDocumentTitle';
 import {Claim} from '../users/models/UserModel';
 import {useProjects} from '../hooks/useProjects';
 import {Features} from '../controls/feature/feature-models';
+import {t} from '../utils';
+import {Button} from '../controls/form-controls/Button';
+import {getProjectMarkup} from './utils/getProjectMarkup';
+import {getFullTariffs} from './utils/getTariffs';
 
 
 import './ProjectsList.scss';
@@ -29,8 +33,44 @@ export const ProjectsList = () => {
     setFilters: f => dispatch(updateAppFilters(Features.projects, f)),
   };
 
+  const downloadExcel = () => {
+    const projectDetails = projects.map(proj => {
+      const markup = getProjectMarkup(proj.details);
+      const partnerTariff = getFullTariffs(proj, 'partner');
+      const clientTariff = getFullTariffs(proj, 'client');
+      return {
+        consultant: proj.consultantName,
+        consultantType: proj.consultant.type,
+        startDate: proj.details.startDate.format('YYYY-MM-DD'),
+        endDate: proj.details.endDate && proj.details.endDate.format('YYYY-MM-DD'),
+        partner: proj.partner?.name,
+        partnerHourly: partnerTariff?.hourlyRate,
+        partnerDaily: partnerTariff?.dailyRate,
+        client: proj.client.name,
+        clientHourly: clientTariff?.hourlyRate,
+        clientDaily: clientTariff?.dailyRate,
+        margin: markup.amount,
+        marginPercentage: markup.percentage.toFixed(0) + '%',
+        endCustomer: proj.endCustomer?.name,
+        contractFramework: proj.client.frameworkAgreement?.status,
+        contractProject: proj.details.contract?.status,
+      };
+    });
+    console.log('details', projectDetails);
+    const mappedData = projectDetails.map(Object.values);
+    console.log('mapped', mappedData);
+    dispatch(downloadProjectsExcel(mappedData) as any);
+  };
+
   const TopToolbar = (
     <>
+      <Button
+        variant="light"
+        onClick={downloadExcel}
+        title={t('project.listDownloadExcel')}
+        icon="fa fa-file-excel"
+        className="tst-download-excel"
+      />
       <LinkToButton claim={Claim.ViewConsultants} to="/consultants/projects" label="project.contractCheck" />
       <LinkToButton claim={Claim.ViewConsultants} to="/consultants" label="consultant.title" />
     </>

frontend/src/components/project/utils/getTariffs.ts

@@ -1,5 +1,6 @@
 import {EditProjectRateType} from '../../../models';
 import {DefaultHoursInDay} from '../../client/models/getNewClient';
+import {FullProjectModel} from '../models/FullProjectModel';
 import {ProjectClientModel} from '../models/IProjectModel';
 
 
@@ -9,6 +10,26 @@ export type ProjectClientTariff = {
   rateType: EditProjectRateType;
 }
 
+export function getFullTariffs(project: FullProjectModel, type: 'client' | 'partner') {
+  const projectClient = type === 'client' ? project.details.client : project.details.partner;
+  if (!projectClient?.clientId) {
+    return undefined;
+  }
+
+  const client = type === 'client' ? project.client : project.partner!;
+  const tariff = getTariffs(projectClient);
+  if (tariff.rateType === 'daily') {
+    return {
+      dailyRate: tariff.tariff,
+      hourlyRate: tariff.tariff / client.hoursInDay,
+    };
+  }
+  return {
+    dailyRate: tariff.tariff * client.hoursInDay,
+    hourlyRate: tariff.tariff,
+  };
+}
+
 
 export function getTariffs(projectClient: ProjectClientModel): ProjectClientTariff {
   return {

frontend/src/trans.en.ts

@@ -480,6 +480,7 @@ export const trans = {
     endDate: 'End date',
     forEndCustomer: 'Project is at end customer',
     comments: 'Comments',
+    listDownloadExcel: 'Download clients as Excel',
     deleteConfirm: {
       title: 'Delete project',
       content: 'Project will be permanently deleted.',

frontend/src/trans.nl.ts

@@ -480,6 +480,7 @@ export const trans = {
     endDate: 'Eind datum',
     forEndCustomer: 'Project is bij eindklant',
     comments: 'Commentaar',
+    listDownloadExcel: 'Download klanten als Excel',
     deleteConfirm: {
       title: 'Project verwijderen',
       content: 'Project wordt definitief verwijderd.',