diff --git a/ui/config/development.json b/ui/config/development.json index f939da9c..b3539b91 100644 --- a/ui/config/development.json +++ b/ui/config/development.json @@ -1,6 +1,6 @@ { "api": { - "baseUrl": "http://41.38.83.137:8080/" + "baseUrl": "http://41.65.11.55:8080/" }, diff --git a/ui/src/app/Pages/employee/employee.component.html b/ui/src/app/Pages/employee/employee.component.html index b9a4e66d..ebe8e0ba 100644 --- a/ui/src/app/Pages/employee/employee.component.html +++ b/ui/src/app/Pages/employee/employee.component.html @@ -1,78 +1,127 @@
-
+
+

All Employees

+
+ + + + + -

All Employees -

-
-
No.{{ i + 1 }}
- - - - - - - - - + + + + + + + + + + + + + + +
No. Name Name{{ element.name }} + edit + + person_remove +
+
+
+ +
+
+
+

- - - -
-
- -
- +

-

- -
-
-
-
-
-
-
- Employee Info -
-
- - Employee Name - - - Please enter a Employee Name - - - Employee Name is required - - -
- - - -
- - Choose Company - - Side - Over - Push - - - -
- - - -
- -
-
- -
+
+
+
+ + +
+ Employee Info +
+
+ + Employee Name + + + Please enter a Employee Name + + + Employee Name is required + + +
- -
+
+ + Choose Company + + + {{companyData.name}} + + + +
+
+ +
+ +
+
+
+ + +
diff --git a/ui/src/app/Pages/employee/employee.component.ts b/ui/src/app/Pages/employee/employee.component.ts index 1460e0f9..1d1a4c90 100644 --- a/ui/src/app/Pages/employee/employee.component.ts +++ b/ui/src/app/Pages/employee/employee.component.ts @@ -1,29 +1,110 @@ import { Component, OnInit } from '@angular/core'; import { FormBuilder, FormGroup, Validators } from '@angular/forms'; +import { MessageService } from 'src/app/core/services/config/message.service'; +import { Company } from 'src/app/domain/company/models/company'; +import { EmployeeRepository } from 'src/app/domain/employee/employee.repository'; +import { Emplyee } from 'src/app/domain/employee/models/emplyee'; +import { CompanyRepository } from 'src/app/domain/company/company.repository'; @Component({ selector: 'app-employee', - templateUrl: './employee.component.html' + templateUrl: './employee.component.html', }) export class EmployeeComponent implements OnInit { - employeeForm!:FormGroup; - displayedColumns: string[] = ['Question', 'description']; - isVisible:boolean = false; - constructor(private formBuilder:FormBuilder) { } + employeeForm!: FormGroup; + displayedColumns: string[] = ['id','name','delete','update']; + isVisible: boolean = false; + page: number = 0; + size: number = 10; + totalItems: number = 0; + allEmployees: Emplyee[] = []; + company:Company[]=[]; + isRestButtonAppear: boolean; + + + constructor( + private formBuilder: FormBuilder, + private employeeRepository: EmployeeRepository, + private message: MessageService , + private companyRepositiory:CompanyRepository ) {} ngOnInit(): void { this.employForm(); + this.getAllEmplyees(); + this.getCompany(); + } + employForm() { + this.employeeForm = this.formBuilder.group({ + id: [''], + name: ['', [Validators.required]], + company: ['', [Validators.required]], + }); + } + SaveData(){ + if(this.employeeForm.valid){ + this.employeeForm.controls['id'].value? this.updateEmployee():this.addEmployee(); + this.employeeForm.reset(); + } } - employForm(){ - this.employeeForm=this.formBuilder.group({ - id:[''], - name:['', [Validators.required]], - companyId:['', [Validators.required]] + addEmployee(){ + + this.employeeRepository.add(this.employeeForm.value).subscribe(()=>{ + this.getAllEmplyees();this.changeVisibility(); + }) } - onSubmit(){ + getAllEmplyees(): void { + this.employeeRepository + .getList({ + page: this.page, + size: this.size, + }) + .subscribe((result) => { + this.allEmployees = result.data; + this.totalItems = result.pagination.itemCount; + }); + } + getCompany(): void { + this.companyRepositiory + .getList() + .subscribe((result) => { + this.company = result.data; + + console.log(this.company) + }); + } + fetchData(employeeData:Emplyee):void{ + this.employeeForm.reset(); + this.isVisible=true; + + this.employeeForm.patchValue({ + id:employeeData.id, + name:employeeData.name + + }) } - changeVisibility(){ - this.isVisible = !this.isVisible + updateEmployee(){ + this.employeeRepository.update(this.employeeForm.value).subscribe(()=>{ + this.getAllEmplyees(); + this.changeVisibility(); + }) + } + deleteEmployee(employeeData:Emplyee){ + this.message.deleteConfirmation('','Are you sure want to delete this employee ? ').subscribe(res =>{ + if(res.success) + this.employeeRepository.delete(employeeData.id).subscribe(()=>{ + this.getAllEmplyees(); + }) + }) + } + changeVisibility() { + this.isVisible = !this.isVisible; } + appearRest() { + this.isRestButtonAppear = true; + } + resetTheForm(){ + this.employeeForm.reset(); + } + } diff --git a/ui/src/app/core/services/config/message.service.ts b/ui/src/app/core/services/config/message.service.ts index 7d5813ef..fc0d4c59 100644 --- a/ui/src/app/core/services/config/message.service.ts +++ b/ui/src/app/core/services/config/message.service.ts @@ -5,11 +5,11 @@ import { ConfirmBoxEvokeService } from '@costlydeveloper/ngx-awesome-popup'; import { Observable } from 'rxjs'; @Injectable({ - providedIn: 'root' + providedIn: 'root', }) export class MessageService { errorMessage = (errorText: string): void => { - this.toast.error(errorText) + this.toast.error(errorText); }; warnMessage = (errorText: string): void => { @@ -21,7 +21,12 @@ export class MessageService { }; deleteConfirmation = (header: string, body: string): Observable => { - return this.confirmBoxEvokeService.warning(header, body, 'Confirm', 'Cancel'); + return this.confirmBoxEvokeService.warning( + header, + body, + 'Confirm', + 'Cancel' + ); }; constructor( diff --git a/ui/src/app/domain/company/models/company.ts b/ui/src/app/domain/company/models/company.ts index 96cb1a72..883c75f2 100644 --- a/ui/src/app/domain/company/models/company.ts +++ b/ui/src/app/domain/company/models/company.ts @@ -2,4 +2,6 @@ export interface Company{ id:number; name:string; description:string; + + } diff --git a/ui/src/app/domain/employee/employee.repository.ts b/ui/src/app/domain/employee/employee.repository.ts new file mode 100644 index 00000000..d6b71057 --- /dev/null +++ b/ui/src/app/domain/employee/employee.repository.ts @@ -0,0 +1,15 @@ +import { HttpClient } from "@angular/common/http"; +import { Injectable } from "@angular/core"; +import { ResourceService } from "src/app/core/services/config/resource.service"; +import { Emplyee } from "./models/emplyee"; +@Injectable({ + providedIn: 'root' + }) + +export class EmployeeRepository extends ResourceService{ + constructor(httpClient: HttpClient) { + super(httpClient); + } + getResourceUrl(): string { + return 'employee'; + }} \ No newline at end of file diff --git a/ui/src/app/domain/employee/models/emplyee.ts b/ui/src/app/domain/employee/models/emplyee.ts new file mode 100644 index 00000000..0dc1a7b3 --- /dev/null +++ b/ui/src/app/domain/employee/models/emplyee.ts @@ -0,0 +1,9 @@ +import { Company } from "../../company/models/company"; + +export interface Emplyee{ + id:number; + name:string; + company:Company; + + } + \ No newline at end of file diff --git a/ui/src/main.ts b/ui/src/main.ts index c7b673cf..22d6e1fd 100644 --- a/ui/src/main.ts +++ b/ui/src/main.ts @@ -1,6 +1,5 @@ import { enableProdMode } from '@angular/core'; import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; - import { AppModule } from './app/app.module'; import { environment } from './environments/environment'; @@ -10,3 +9,4 @@ if (environment.production) { platformBrowserDynamic().bootstrapModule(AppModule) .catch(err => console.error(err)); +