Skip to content

Commit 66e9a6e

Browse files
renemadsenrenemadsen
committed
Code cleanup and adding the ability to download excel for a given period.
1 parent d96aafd commit 66e9a6e

11 files changed

Lines changed: 237 additions & 95 deletions

File tree

‎eform-client/src/app/plugins/modules/time-planning-pn/components/index.ts‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,2 @@
11
export * from './settings/time-planning-settings/time-planning-settings.component';
2-
export * from './plannings/time-plannings-container/time-plannings-container.component';
3-
export * from './plannings/time-plannings-header/time-plannings-header.component';
4-
export * from './plannings/time-plannings-table/time-plannings-table.component';
2+
export * from './plannings'

‎eform-client/src/app/plugins/modules/time-planning-pn/components/plannings/index.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,3 +4,4 @@ export * from './time-plannings-table/time-plannings-table.component';
44
export * from './time-planning-actions/assigned-site/assigned-site-dialog.component';
55
export * from './time-planning-actions/workday-entity/workday-entity-dialog.component';
66
//export * from './time-planning-table-row/time-planning-table-row.component';
7+
export * from './time-planning-actions/download-excel/download-excel-dialog.component';

‎eform-client/src/app/plugins/modules/time-planning-pn/components/plannings/time-planning-actions/assigned-site/assigned-site-dialog.component.ts‎

Lines changed: 4 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,54 +1,17 @@
11
import {Component, DoCheck, Inject, OnInit} from '@angular/core';
22
import {
3-
MAT_DIALOG_DATA,
4-
MatDialogActions,
5-
MatDialogClose,
6-
MatDialogContent,
7-
MatDialogTitle
3+
MAT_DIALOG_DATA
84
} from '@angular/material/dialog';
95
import {AssignedSiteModel, GlobalAutoBreakSettingsModel} from '../../../../models';
10-
import {MatButton, MatIconButton} from '@angular/material/button';
11-
import {FormsModule} from '@angular/forms';
12-
import {MatFormField, MatHint, MatLabel} from '@angular/material/form-field';
13-
import {MatInput} from '@angular/material/input';
14-
import {TranslatePipe} from '@ngx-translate/core';
15-
import {selectAuthIsAdmin, selectCurrentUserIsAdmin, selectCurrentUserIsFirstUser} from 'src/app/state';
6+
import {selectCurrentUserIsAdmin, selectCurrentUserIsFirstUser} from 'src/app/state';
167
import {Store} from '@ngrx/store';
17-
import {AsyncPipe, NgForOf, NgIf} from '@angular/common';
18-
import {MatTab, MatTabGroup} from '@angular/material/tabs';
19-
import {NgxMaskDirective} from 'ngx-mask';
20-
import {MatCheckbox} from '@angular/material/checkbox';
218
import {TimePlanningPnSettingsService} from 'src/app/plugins/modules/time-planning-pn/services';
22-
import {NgxMaterialTimepickerModule} from 'ngx-material-timepicker';
23-
import {MatIcon} from '@angular/material/icon';
249

2510
@Component({
2611
selector: 'app-assigned-site-dialog',
2712
templateUrl: './assigned-site-dialog.component.html',
28-
imports: [
29-
MatDialogTitle,
30-
MatDialogContent,
31-
MatDialogActions,
32-
MatButton,
33-
MatDialogClose,
34-
FormsModule,
35-
MatFormField,
36-
MatInput,
37-
MatLabel,
38-
TranslatePipe,
39-
AsyncPipe,
40-
NgIf,
41-
MatTab,
42-
MatTabGroup,
43-
NgForOf,
44-
NgxMaskDirective,
45-
MatCheckbox,
46-
NgxMaterialTimepickerModule,
47-
MatIcon,
48-
MatIconButton,
49-
MatHint,
50-
],
51-
styleUrls: ['./assigned-site-dialog.component.scss']
13+
styleUrls: ['./assigned-site-dialog.component.scss'],
14+
standalone: false
5215
})
5316
export class AssignedSiteDialogComponent implements DoCheck, OnInit {
5417
public selectCurrentUserIsAdmin$ = this.store.select(selectCurrentUserIsAdmin);

‎eform-client/src/app/plugins/modules/time-planning-pn/components/plannings/time-planning-actions/download-excel/download-excel-dialog.component.html‎

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
<div mat-dialog-title>{{ 'Download excel' | translate }}</div>
2+
<div mat-dialog-content>
3+
<div class="d-flex flex-column mr-2 ml-2">
4+
<mat-form-field id="workingHoursRange">
5+
<mat-label>{{ 'Date range' | translate }}</mat-label>
6+
<mat-datepicker-toggle matPrefix [for]="picker"></mat-datepicker-toggle>
7+
<mat-date-range-input [rangePicker]="picker" (click)="picker.open()">
8+
<input [value]="dateFrom" (dateChange)="updateDateFrom($event)" (dateInput)="updateDateFrom($event)" matStartDate class="workingHoursRange">
9+
<input [value]="dateTo" (dateChange)="updateDateTo($event)" (dateInput)="updateDateTo($event)" matEndDate class="workingHoursRange">
10+
</mat-date-range-input>
11+
<mat-date-range-picker #picker></mat-date-range-picker>
12+
</mat-form-field>
13+
</div>
14+
<div class="d-flex flex-column mr-2 ml-2" style="min-width: 25em">
15+
<mat-form-field>
16+
<mat-label>{{ 'Worker' | translate }}</mat-label>
17+
<mtx-select
18+
[items]="availableSites"
19+
bindLabel="siteName"
20+
bindValue="siteId"
21+
[ngModel]="siteId"
22+
(ngModelChange)="onSiteChanged($event)"
23+
id="workingHoursSite">
24+
</mtx-select>
25+
</mat-form-field>
26+
</div>
27+
</div>
28+
<div mat-dialog-actions class="d-flex flex-row justify-content-end">
29+
30+
<div class="d-flex align-items-center mr-2 ml-2" *ngIf="siteId && dateFrom && dateTo">
31+
<button
32+
mat-raised-button
33+
id="workingHoursExcel"
34+
(click)="onDownloadExcelReport()"
35+
color="accent"
36+
[matTooltip]="'Download Excel' | translate">
37+
{{ 'Download Excel' | translate }}
38+
</button>
39+
</div>
40+
41+
<div class="d-flex align-items-center mr-2 ml-2" *ngIf="!siteId && dateFrom && dateTo">
42+
<button
43+
mat-raised-button
44+
id="workingHoursExcelAllWorkers"
45+
(click)="onDownloadExcelReportAllWorkers()"
46+
color="accent"
47+
[matTooltip]="'Download Excel (all workers)' | translate">
48+
{{ 'Download Excel (all workers)' | translate }}
49+
</button>
50+
</div>
51+
<div class="d-flex align-items-center mr-2 ml-2">
52+
<button mat-raised-button mat-dialog-close
53+
id="cancelButton">
54+
{{ 'Cancel' | translate }}
55+
</button>
56+
</div>
57+
</div>

‎eform-client/src/app/plugins/modules/time-planning-pn/components/plannings/time-planning-actions/download-excel/download-excel-dialog.component.scss‎

Whitespace-only changes.

‎eform-client/src/app/plugins/modules/time-planning-pn/components/plannings/time-planning-actions/download-excel/download-excel-dialog.component.ts‎

Lines changed: 100 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
import {Component, Inject, Input, OnDestroy, OnInit} from '@angular/core';
2+
import {Subscription} from 'rxjs';
3+
import {MatDatepickerInputEvent} from '@angular/material/datepicker';
4+
import {SiteDto} from 'src/app/common/models';
5+
import {
6+
AssignedSiteModel,
7+
TimePlanningsReportAllWorkersDownloadRequestModel,
8+
WorkingHourRequestModel
9+
} from 'src/app/plugins/modules/time-planning-pn/models';
10+
import {format} from 'date-fns';
11+
import {catchError} from 'rxjs/operators';
12+
import {saveAs} from 'file-saver';
13+
import {TimePlanningPnWorkingHoursService} from 'src/app/plugins/modules/time-planning-pn/services';
14+
import {ToastrService} from 'ngx-toastr';
15+
import {MAT_DIALOG_DATA} from '@angular/material/dialog';
16+
17+
@Component({
18+
selector: 'app-download-excel-dialog',
19+
templateUrl: './download-excel-dialog.component.html',
20+
styleUrls: ['./download-excel-dialog.component.scss'],
21+
standalone: false,
22+
})
23+
export class DownloadExcelDialogComponent implements OnInit, OnDestroy {
24+
siteId: number;
25+
26+
dateFrom: Date = null;
27+
dateTo: Date = null;
28+
downloadReportSub$: Subscription;
29+
30+
constructor(
31+
@Inject(MAT_DIALOG_DATA) public availableSites: SiteDto[] = [],
32+
private toastrService: ToastrService,
33+
private workingHoursService: TimePlanningPnWorkingHoursService,
34+
) {
35+
}
36+
37+
ngOnInit(): void {
38+
// this.getAvailableSites();
39+
// this.store.dispatch(new PlanningActions.GetPlanning(this.planningId));
40+
}
41+
42+
ngOnDestroy(): void {
43+
// this.store.dispatch(new PlanningActions.ResetPlanning());
44+
}
45+
46+
onSiteChanged(siteId: number) {
47+
this.siteId = siteId;
48+
}
49+
50+
updateDateFrom(dateFrom: MatDatepickerInputEvent<any, any>) {
51+
this.dateFrom = dateFrom.value;
52+
}
53+
54+
updateDateTo(dateTo: MatDatepickerInputEvent<any, any>) {
55+
this.dateTo = dateTo.value;
56+
}
57+
58+
onDownloadExcelReport() {
59+
const model: WorkingHourRequestModel = {
60+
dateFrom: format(this.dateFrom, 'yyyy-MM-dd'),
61+
dateTo: format(this.dateTo, 'yyyy-MM-dd'),
62+
siteId: this.siteId,
63+
};
64+
this.downloadReportSub$ = this.workingHoursService
65+
.downloadReport(model)
66+
.pipe(catchError(
67+
(error, caught) => {
68+
this.toastrService.error('Error downloading report');
69+
return caught;
70+
}))
71+
.subscribe(
72+
(data) => {
73+
saveAs(data, model.dateFrom + '_' + model.dateTo + '_report.xlsx');
74+
},
75+
);
76+
}
77+
78+
onDownloadExcelReportAllWorkers() {
79+
const model: TimePlanningsReportAllWorkersDownloadRequestModel = {
80+
dateFrom: format(this.dateFrom, 'yyyy-MM-dd'),
81+
dateTo: format(this.dateTo, 'yyyy-MM-dd'),
82+
};
83+
this.downloadReportSub$ = this.workingHoursService
84+
.downloadReportAllWorkers(model)
85+
.pipe(catchError(
86+
(caught) => {
87+
this.toastrService.error('Error downloading report');
88+
return caught;
89+
}))
90+
.subscribe(
91+
(data) => {
92+
saveAs(data, model.dateFrom + '_' + model.dateTo + '_AllWorkersReport.xlsx');
93+
},
94+
);
95+
}
96+
97+
onCancel() {
98+
99+
}
100+
}

‎eform-client/src/app/plugins/modules/time-planning-pn/components/plannings/time-planning-actions/index.ts‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
export * from './assigned-site/assigned-site-dialog.component';
2+
export * from './workday-entity/workday-entity-dialog.component';
3+
export * from './download-excel/download-excel-dialog.component';

‎eform-client/src/app/plugins/modules/time-planning-pn/components/plannings/time-planning-actions/workday-entity/workday-entity-dialog.component.ts‎

Lines changed: 6 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -1,51 +1,22 @@
11
import {Component, Inject, OnInit, TemplateRef, ViewChild} from '@angular/core';
22
import {
3-
MAT_DIALOG_DATA,
4-
MatDialogActions,
5-
MatDialogClose,
6-
MatDialogContent,
7-
MatDialogTitle
3+
MAT_DIALOG_DATA
84
} from '@angular/material/dialog';
9-
import {MatButton, MatIconButton} from '@angular/material/button';
10-
import {TranslatePipe, TranslateService} from '@ngx-translate/core';
11-
import {DatePipe, NgForOf, NgIf} from '@angular/common';
12-
import {MatCheckbox} from '@angular/material/checkbox';
13-
import {FormsModule} from '@angular/forms';
5+
import {TranslateService} from '@ngx-translate/core';
6+
import {DatePipe} from '@angular/common';
147
import {TimePlanningMessagesEnum} from '../../../../enums';
158
import {
169
AssignedSiteModel,
1710
PlanningPrDayModel,
1811
} from '../../../../models';
19-
import {MtxGrid, MtxGridColumn} from '@ng-matero/extensions/grid';
12+
import {MtxGridColumn} from '@ng-matero/extensions/grid';
2013
import {TimePlanningPnPlanningsService} from '../../../../services';
21-
import {MatFormField, MatLabel} from '@angular/material/form-field';
22-
import {MatInput} from '@angular/material/input';
23-
import {NgxMaterialTimepickerModule} from 'ngx-material-timepicker';
24-
import {MatIcon} from '@angular/material/icon';
2514

2615
@Component({
2716
selector: 'app-workday-entity-dialog',
2817
templateUrl: './workday-entity-dialog.component.html',
29-
imports: [
30-
MatButton,
31-
MatDialogActions,
32-
MatDialogClose,
33-
TranslatePipe,
34-
MatDialogTitle,
35-
MatDialogContent,
36-
MatCheckbox,
37-
FormsModule,
38-
NgForOf,
39-
NgIf,
40-
MtxGrid,
41-
MatFormField,
42-
MatInput,
43-
MatLabel,
44-
NgxMaterialTimepickerModule,
45-
MatIconButton,
46-
MatIcon
47-
],
48-
styleUrls: ['./workday-entity-dialog.component.scss']
18+
styleUrls: ['./workday-entity-dialog.component.scss'],
19+
standalone: false
4920
})
5021
export class WorkdayEntityDialogComponent implements OnInit {
5122
TimePlanningMessagesEnum = TimePlanningMessagesEnum;

‎eform-client/src/app/plugins/modules/time-planning-pn/components/plannings/time-plannings-container/time-plannings-container.component.html‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,11 @@
88
<!-- <mat-datepicker touchUi #picker></mat-datepicker>-->
99
<!-- </mat-form-field>-->
1010
<button id="forwards" mat-raised-button color="primary" (click)="goForward()">{{ 'Forward' | translate }}</button>
11+
12+
<button id="backwards" mat-raised-button color="primary" (click)="openDownloadExcelDialog()">{{ 'Download Excel' | translate }}</button>
13+
</div>
14+
<div>
15+
1116
</div>
1217
<br>
1318
<!--<div class="container-fluid">-->

‎eform-client/src/app/plugins/modules/time-planning-pn/components/plannings/time-plannings-container/time-plannings-container.component.ts‎

Lines changed: 23 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,8 @@ import {startOfWeek, endOfWeek, format} from 'date-fns';
1111
import {PARSING_DATE_FORMAT} from 'src/app/common/const';
1212
import {Store} from '@ngrx/store';
1313
import {selectCurrentUserLocale} from 'src/app/state';
14+
import {MatDialog} from "@angular/material/dialog";
15+
import {DownloadExcelDialogComponent} from "src/app/plugins/modules/time-planning-pn/components";
1416

1517
@AutoUnsubscribe()
1618
@Component({
@@ -36,7 +38,8 @@ export class TimePlanningsContainerComponent implements OnInit, OnDestroy {
3638
constructor(
3739
private store: Store,
3840
private planningsService: TimePlanningPnPlanningsService,
39-
private settingsService: TimePlanningPnSettingsService
41+
private settingsService: TimePlanningPnSettingsService,
42+
private dialog: MatDialog,
4043
) {}
4144

4245
ngOnInit(): void {
@@ -78,6 +81,25 @@ export class TimePlanningsContainerComponent implements OnInit, OnDestroy {
7881
this.getPlannings();
7982
}
8083

84+
openDownloadExcelDialog() {
85+
this.settingsService
86+
.getAvailableSites()
87+
.subscribe((data) => {
88+
if (data && data.success) {
89+
this.availableSites = data.model;
90+
const dialogRef = this.dialog.open(DownloadExcelDialogComponent, {
91+
width: '600px',
92+
data: this.availableSites,
93+
});
94+
dialogRef.afterClosed().subscribe((result) => {
95+
// if (result) {
96+
// this.getPlannings();
97+
// }
98+
});
99+
}
100+
});
101+
}
102+
81103
goForward() {
82104
this.dateFrom = new Date(this.dateFrom.setDate(this.dateFrom.getDate() + 7));
83105
this.dateTo = new Date(this.dateTo.setDate(this.dateTo.getDate() + 7));

0 commit comments

Comments
 (0)