Skip to content

Commit a4ee02b

Browse files
yzlucasyzlucas
authored
api hook up part-1 (#390)
1 parent 90902f6 commit a4ee02b

File tree

11 files changed

+406
-140
lines changed

11 files changed

+406
-140
lines changed

‎client/wfprev-war/src/main/angular/src/app/components/create-new-project-dialog/create-new-project-dialog.component.ts‎

Lines changed: 130 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,13 @@
11
import { CommonModule } from '@angular/common';
2-
import { Component } from '@angular/core';
2+
import { Component, OnInit } from '@angular/core';
33
import { FormBuilder, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
44
import { MatDialog , MatDialogRef } from '@angular/material/dialog';
55
import { ConfirmationDialogComponent } from 'src/app/components/confirmation-dialog/confirmation-dialog.component';
66
import { MatSnackBar } from '@angular/material/snack-bar';
77
import { Messages } from 'src/app/utils/messages';
8+
import { ProjectService } from 'src/app/services/project-services';
9+
import { CodeTableServices } from 'src/app/services/code-table-services';
10+
import { Project } from 'src/app/components/models';
811
@Component({
912
selector: 'app-create-new-project-dialog',
1013
standalone: true,
@@ -15,7 +18,7 @@ import { Messages } from 'src/app/utils/messages';
1518
templateUrl: './create-new-project-dialog.component.html',
1619
styleUrls: ['./create-new-project-dialog.component.scss']
1720
})
18-
export class CreateNewProjectDialogComponent {
21+
export class CreateNewProjectDialogComponent implements OnInit {
1922
projectForm: FormGroup;
2023
messages = Messages;
2124
// Regions and sections mapping
@@ -27,9 +30,9 @@ export class CreateNewProjectDialogComponent {
2730
'West Coast': ['Central Coast/North Island', 'Haida Gwaii/South Island']
2831
};
2932

30-
businessAreas = ['Area 1', 'Area 2', 'Area 3']; // Example data
31-
forestRegions = ['Region 1', 'Region 2', 'Region 3']; // Example data
32-
forestDistricts = ['District 1', 'District 2', 'District 3']; // Example data
33+
businessAreas = [4, 5, 7]; // Example data
34+
forestRegions = [1, 3, 5]; // Example data
35+
forestDistricts = [4, 66, 4442]; // Example data
3336
bcParksRegions = Object.keys(this.regionToSections);
3437
bcParksSections: string[] = []; // Dynamically updated based on the selected region
3538

@@ -38,6 +41,8 @@ export class CreateNewProjectDialogComponent {
3841
private readonly dialog: MatDialog,
3942
private readonly dialogRef: MatDialogRef<CreateNewProjectDialogComponent>,
4043
private readonly snackbarService: MatSnackBar,
44+
private projectService: ProjectService,
45+
private codeTableService: CodeTableServices
4146

4247
) {
4348
this.projectForm = this.fb.group({
@@ -66,7 +71,65 @@ export class CreateNewProjectDialogComponent {
6671
}
6772
});
6873
}
74+
ngOnInit(): void {
75+
// Fetch code tables
76+
77+
this.codeTableService.fetchCodeTable('programAreaCodes').subscribe({
78+
next: (data) => {
79+
this.forestDistricts = data;
80+
},
81+
error: (err) => {
82+
console.error(err);
83+
this.snackbarService.open(
84+
'Failed to load business area codes. Please try again later.',
85+
'OK',
86+
{ duration: 5000, panelClass: 'snackbar-error' }
87+
);
88+
},
89+
});
6990

91+
this.codeTableService.fetchCodeTable('forestRegionCodes').subscribe({
92+
next: (data) => {
93+
this.forestRegions = data; // Assign data to the component property
94+
},
95+
error: (err) => {
96+
console.error(err);
97+
this.snackbarService.open(
98+
'Failed to load forest region codes. Please try again later.',
99+
'OK',
100+
{ duration: 5000, panelClass: 'snackbar-error' }
101+
);
102+
},
103+
});
104+
105+
this.codeTableService.fetchCodeTable('forestDistrictCodes').subscribe({
106+
next: (data) => {
107+
this.forestDistricts = data;
108+
},
109+
error: (err) => {
110+
console.error(err);
111+
this.snackbarService.open(
112+
'Failed to load forest districts codes. Please try again later.',
113+
'OK',
114+
{ duration: 5000, panelClass: 'snackbar-error' }
115+
);
116+
},
117+
});
118+
119+
this.codeTableService.fetchCodeTable('bcParksRegionCodes').subscribe({
120+
next: (data) => {
121+
this.forestDistricts = data;
122+
},
123+
error: (err) => {
124+
console.error(err);
125+
this.snackbarService.open(
126+
'Failed to load bc parks region codes. Please try again later.',
127+
'OK',
128+
{ duration: 5000, panelClass: 'snackbar-error' }
129+
);
130+
},
131+
});
132+
}
70133
getErrorMessage(controlName: string): string | null {
71134
const control = this.projectForm.get(controlName);
72135
if (!control || !control.errors) return null;
@@ -87,24 +150,68 @@ export class CreateNewProjectDialogComponent {
87150
onCreate(): void {
88151
if (this.projectForm.valid) {
89152
console.log(this.projectForm.value);
90-
//call POST endpoint,
91-
// if return 500 error with duplicate project name error message,
92-
93-
// this.dialog.open(ConfirmationDialogComponent, {
94-
// data: {
95-
// indicator: 'duplicate-project',
96-
// projectName: '',
97-
// },
98-
// width: '500px',
99-
// });
100-
101-
//OK will return the user to the Modal and allow further editing. just close the Modal for now
102-
this.snackbarService.open(
103-
this.messages.projectCreatedSuccess,
104-
'OK',
105-
{ duration: 100000, panelClass: 'snackbar-success' },
106-
)
107-
this.dialogRef.close(this.projectForm.value);
153+
const newProject: Project = {
154+
projectName: this.projectForm.get('projectName')?.value ?? '',
155+
programAreaGuid: '27602cd9-4b6e-9be0-e063-690a0a0afb50', // change this to form value once codeTable returns value;
156+
forestRegionOrgUnitId: 11, // change this to form value once codeTable returns value;
157+
forestDistrictOrgUnitId: 4442, // change this to form value once codeTable returns value;
158+
bcParksRegionOrgUnitId: 0, // change this to form value once codeTable returns value;
159+
bcParksSectionOrgUnitId: 10, // change this to form value once codeTable returns value;
160+
projectLead: this.projectForm.get('projectLead')?.value ?? '',
161+
projectLeadEmailAddress: this.projectForm.get('projectLeadEmail')?.value ?? '',
162+
siteUnitName: "Vancouver Forest Unit", // change this to form value once codeTable returns value;
163+
closestCommunityName: this.projectForm.get('closestCommunity')?.value ?? '',
164+
fireCentreOrgUnitId: this.projectForm.get('fireCentre')?.value ?? 0,
165+
forestAreaCode: {
166+
forestAreaCode: "WEST" // change this to form value once codeTable returns value;
167+
},
168+
generalScopeCode: {
169+
generalScopeCode: "SL_ACT" // change this to form value once codeTable returns value;
170+
},
171+
projectTypeCode: {
172+
projectTypeCode: "FUEL_MGMT" // change this to form value once codeTable returns value;
173+
},
174+
projectDescription: this.projectForm.get('projectDescription')?.value ?? '',
175+
projectNumber: this.projectForm.get('projectNumber')?.value ?? 0,
176+
totalFundingRequestAmount:
177+
this.projectForm.get('totalFundingRequestAmount')?.value ?? 0,
178+
totalAllocatedAmount: this.projectForm.get('totalAllocatedAmount')?.value ?? 0,
179+
totalPlannedProjectSizeHa:
180+
this.projectForm.get('totalPlannedProjectSizeHa')?.value ?? 0,
181+
totalPlannedCostPerHectare:
182+
this.projectForm.get('totalPlannedCostPerHectare')?.value ?? 0,
183+
totalActualAmount: this.projectForm.get('totalActualAmount')?.value ?? 0,
184+
isMultiFiscalYearProj: false,
185+
};
186+
187+
this.projectService.createProject(newProject).subscribe({
188+
next: (response) => {
189+
this.snackbarService.open(
190+
this.messages.projectCreatedSuccess,
191+
'OK',
192+
{ duration: 100000, panelClass: 'snackbar-success' },
193+
);
194+
this.dialogRef.close(this.projectForm.value);
195+
},
196+
error: (err) =>{
197+
if (err.status === 500 && err.error.message.includes('duplicate')) {
198+
this.dialog.open(ConfirmationDialogComponent, {
199+
data: {
200+
indicator: 'duplicate-project',
201+
projectName: '',
202+
},
203+
width: '500px',
204+
});
205+
}
206+
else{
207+
this.snackbarService.open(
208+
"Create project failed",
209+
'OK',
210+
{ duration: 5000, panelClass: 'snackbar-error' }
211+
);
212+
}
213+
}
214+
})
108215
}
109216
}
110217

‎client/wfprev-war/src/main/angular/src/app/components/list-panel/projects-list/projects-list.component.html‎

Lines changed: 2 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -9,21 +9,9 @@
99
</select>
1010
</div>
1111

12-
<!-- Sync Toggle -->
13-
<div class="sync-toggle">
14-
<div class="label-container">
15-
<label>Sync with Map</label>
16-
</div>
17-
<div class="toggle-container">
18-
<mat-slide-toggle color="primary" (change)="onSyncMapToggleChange($event)">
19-
<span>Off/On</span>
20-
</mat-slide-toggle>
21-
</div>
22-
</div>
23-
2412
<!-- Result Count -->
2513
<div class="result-count">
26-
<span>{{ resultCount }} Results</span>
14+
<span>{{ projectList.length }} Results</span>
2715
</div>
2816
</div>
2917

@@ -66,7 +54,7 @@
6654
<span>{{ project.forestRegionOrgUnitId }}</span>
6755
</div>
6856
<div class="detail">
69-
<span>Total Project Hectares</span>
57+
<span>Total Hectares</span>
7058
<span>{{ project.totalPlannedProjectSizeHa }} Ha</span>
7159
</div>
7260
<div class="detail">

‎client/wfprev-war/src/main/angular/src/app/components/list-panel/projects-list/projects-list.component.scss‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
11
.list-header {
22
display: flex;
33
align-items: center;
4-
justify-content: space-between;
4+
justify-content: flex-start;
55
padding: 14px;
66
border-bottom: 1px solid #ccc;
77
font-family: var(--wf-font-family-main);
88
font-size: 14px;
9+
gap: 12px;
910
}
1011

1112
.sort-dropdown {
@@ -112,6 +113,7 @@
112113
}
113114

114115
.list-contents {
116+
height: calc(100vh - 330px);
115117
mat-expansion-panel {
116118
border-bottom: 1px solid #C6C8CB;
117119
margin: 0px !important;

‎client/wfprev-war/src/main/angular/src/app/components/list-panel/projects-list/projects-list.component.ts‎

Lines changed: 16 additions & 98 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
11
import { CommonModule } from '@angular/common';
2-
import { Component } from '@angular/core';
2+
import { Component, OnInit } from '@angular/core';
33
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
44
import { MatExpansionModule } from '@angular/material/expansion';
55
import { ActivatedRoute, Router } from '@angular/router';
66
import { ResourcesRoutes } from 'src/app/utils';
7+
import { ProjectService } from 'src/app/services/project-services';
78

89
@Component({
910
selector: 'app-projects-list',
@@ -12,12 +13,24 @@ import { ResourcesRoutes } from 'src/app/utils';
1213
templateUrl: './projects-list.component.html',
1314
styleUrls: ['./projects-list.component.scss'], // Corrected to 'styleUrls'
1415
})
15-
export class ProjectsListComponent {
16-
16+
export class ProjectsListComponent implements OnInit {
17+
projectList : any[] = [];
1718
constructor(
1819
private router: Router,
20+
private projectService: ProjectService
1921
) {
2022
}
23+
ngOnInit(): void {
24+
this.projectService.fetchProjects().subscribe({
25+
next: (data) => {
26+
console.log('Projects fetched successfully:', data);
27+
this.projectList = data._embedded?.project;
28+
},
29+
error: (err) => {
30+
console.error('Error fetching projects:', err);
31+
}
32+
});
33+
}
2134

2235
sortOptions = [
2336
{ label: 'Name (A-Z)', value: 'ascending' },
@@ -27,101 +40,6 @@ export class ProjectsListComponent {
2740
selectedSort = '';
2841
syncWithMap = false;
2942
resultCount = 3;
30-
31-
32-
// MOCK UP DATA TO MACTCH UP THE REAL DATA MODEL
33-
projectList = [
34-
{
35-
projectTypeCode: {
36-
projectTypeCode: "FUEL_MGMT",
37-
},
38-
projectNumber: 12345,
39-
siteUnitName: "Vancouver Forest Unit",
40-
forestAreaCode: {
41-
forestAreaCode: "WEST",
42-
},
43-
generalScopeCode: {
44-
generalScopeCode: "SL_ACT",
45-
},
46-
programAreaGuid: "27602cd9-4b6e-9be0-e063-690a0a0afb50",
47-
projectName: "Sample Forest Management Project",
48-
projectLead: "Jane Smith",
49-
projectLeadEmailAddress: "jane.smith@example.com",
50-
projectDescription: "This is a comprehensive forest management project focusing on sustainable practices",
51-
closestCommunityName: "Vancouver",
52-
totalFundingRequestAmount: 100000.0,
53-
totalAllocatedAmount: 95000.0,
54-
totalPlannedProjectSizeHa: 500.0,
55-
totalPlannedCostPerHectare: 200.0,
56-
totalActualAmount: 0.0,
57-
isMultiFiscalYearProj: false,
58-
forestRegionOrgUnitId: 1001,
59-
forestDistrictOrgUnitId: 2001,
60-
fireCentreOrgUnitId: 3001,
61-
bcParksRegionOrgUnitId: 4001,
62-
bcParksSectionOrgUnitId: 5001,
63-
},
64-
{
65-
projectTypeCode: {
66-
projectTypeCode: "WLD_MGMT",
67-
},
68-
projectNumber: 67890,
69-
siteUnitName: "Kelowna Wildlife Zone",
70-
forestAreaCode: {
71-
forestAreaCode: "EAST",
72-
},
73-
generalScopeCode: {
74-
generalScopeCode: "WL_ACT",
75-
},
76-
programAreaGuid: "58672bcd-3e7f-8cd1-e053-680a0a0afc40",
77-
projectName: "Sustainable Fuel Management Initiative",
78-
projectLead: "John Doe",
79-
projectLeadEmailAddress: "john.doe@example.com",
80-
projectDescription: "An initiative to promote sustainable wildlife and fuel management practices",
81-
closestCommunityName: "Kelowna",
82-
totalFundingRequestAmount: 75000.0,
83-
totalAllocatedAmount: 70000.0,
84-
totalPlannedProjectSizeHa: 300.0,
85-
totalPlannedCostPerHectare: 250.0,
86-
totalActualAmount: 0.0,
87-
isMultiFiscalYearProj: true,
88-
forestRegionOrgUnitId: 1101,
89-
forestDistrictOrgUnitId: 2101,
90-
fireCentreOrgUnitId: 3101,
91-
bcParksRegionOrgUnitId: 4101,
92-
bcParksSectionOrgUnitId: 5101,
93-
},
94-
{
95-
projectTypeCode: {
96-
projectTypeCode: "URB_FOREST",
97-
},
98-
projectNumber: 11223,
99-
siteUnitName: "Prince George Forest Sector",
100-
forestAreaCode: {
101-
forestAreaCode: "NORTH",
102-
},
103-
generalScopeCode: {
104-
generalScopeCode: "UF_REV",
105-
},
106-
programAreaGuid: "19762acd-7d8a-4fe2-e043-680a0b0afc11",
107-
projectName: "Urban Forest Revitalization Program",
108-
projectLead: "Alice Brown",
109-
projectLeadEmailAddress: "alice.brown@example.com",
110-
projectDescription: "A program aimed at revitalizing urban forests in northern regions",
111-
closestCommunityName: "Prince George",
112-
totalFundingRequestAmount: 120000.0,
113-
totalAllocatedAmount: 115000.0,
114-
totalPlannedProjectSizeHa: 750.0,
115-
totalPlannedCostPerHectare: 160.0,
116-
totalActualAmount: 0.0,
117-
isMultiFiscalYearProj: true,
118-
forestRegionOrgUnitId: 1201,
119-
forestDistrictOrgUnitId: 2201,
120-
fireCentreOrgUnitId: 3201,
121-
bcParksRegionOrgUnitId: 4201,
122-
bcParksSectionOrgUnitId: 5201,
123-
},
124-
];
12543

12644
fiscalYearActivityTypes = ['Clearing','Burning','Pruning']
12745

0 commit comments

Comments
 (0)