Notes

import { Component, Output } from '@angular/core';
import { ServiceService } from '../service.service';
import { Router } from '@angular/router';
import { NgForm } from '@angular/forms';

@Component({
selector: 'app-login',
templateUrl: './login.component.html',
styleUrls: ['./login.component.css']
})
export class LoginComponent {
username: string = '';
password: string = '';
loginResult: string = '';
isLoggedIn: boolean = false;

constructor(private Service: ServiceService, private router: Router) {}
// @Output() pop = new EventEmitter<string>();
login(loginForm: NgForm): void {
if (loginForm.invalid) {

return;
}

this.Service.userlogin(this.username, this.password).subscribe(
result => {
this.loginResult = result;
this.isLoggedIn = true;
console.log(this.username + ' has logged in');
// isloggedin:true;
this.router.navigate(['/app-view']);
},
error => {
console.error('Login failed', error);
this.loginResult = 'Login failed. Please check your credentials.';
}
);
}
}
import { Component } from '@angular/core';

@Component({
selector: 'app-navbar',
templateUrl: './navbar.component.html',
styleUrls: ['./navbar.component.css']
})
export class NavbarComponent {


}
<nav class="navbar navbar-expand-sm bg-primary navbar">
<ul class="navbar-nav">
<li class="nav-item">
<a routerLink="app-home" routerLinkActive="active" class="nav-link">Home</a>
</li>
<li class="nav-item" >
<a routerLink="app-view" routerLinkActive="active" class="nav-link">View</a>
</li>
<li class="nav-item" >
<a routerLink="app-registering" routerLinkActive="active" class="nav-link">Register</a>
</li>
<li class="nav-item" >
<a routerLink="app-add-dep" routerLinkActive="active" class="nav-link">Add Dep</a>
</li>
<li class="nav-item" >
<a routerLink="app-details" routerLinkActive="active" class="nav-link">Details</a>
</li>
</ul>
</nav>
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Observable } from 'rxjs';
import { Details, Employee, Department, updatex } from './model';

@Injectable({
providedIn: 'root'
})
export class ServiceService {
private username: string = '';
private password: string = '';


private baseUrl = 'http://localhost:8080';

constructor(private http: HttpClient) { }

getAllEmployees(): Observable<Details[]> {
const url = `${this.baseUrl}/data/getEmployee`;
const headers = new HttpHeaders({ Authorization: 'Basic ' + btoa(this.username + ":" + this.password) });
return this.http.get<Details[]>(url, { headers });
// return this.http.get<Details[]>(url);
}

saveEmployee(employee: Employee): Observable<Employee> {
const url = `${this.baseUrl}/data/saveEmployee`;
const headers = new HttpHeaders({ Authorization: 'Basic ' + btoa(this.username + ":" + this.password) });

return this.http.post<Employee>(url, employee ,{ headers });
}

getDepartments(): Observable<Department[]> {
const url = `${this.baseUrl}/department/dep`;
const headers = new HttpHeaders({ Authorization: 'Basic ' + btoa(this.username + ":" + this.password) });

return this.http.get<Department[]>(url,{ headers });
}

getEmployeesByName(name: string): Observable<any[]> {
const url = `${this.baseUrl}/data/employee/search?name=${name}`;
const headers = new HttpHeaders({ Authorization: 'Basic ' + btoa(this.username + ":" + this.password) });
return this.http.get<any[]>(url,{headers});
}

getEmployeeById(id: number): Observable<Employee> {
const url = `${this.baseUrl}/data/employee/${id}`;
const headers = new HttpHeaders({ Authorization: 'Basic ' + btoa(this.username + ":" + this.password) });
return this.http.get<Employee>(url,{headers});
}

updateEmployee(id: number, stud: updatex): Observable<updatex> {
const url = `${this.baseUrl}/data/employee/update/${id}`;
const headers = new HttpHeaders({ Authorization: 'Basic ' + btoa(this.username + ":" + this.password) });

return this.http.put<updatex>(url, stud,{headers});
}

deleteEmployee(id: number): Observable<object> {
const url = `${this.baseUrl}/data/delete/${id}`;
const headers = new HttpHeaders({ Authorization: 'Basic ' + btoa(this.username + ":" + this.password) });

return this.http.delete(url,{headers});

}


public userlogin(username: string, password: string): Observable<string> {
this.username = username;
this.password = password;
const headers = new HttpHeaders({ Authorization: 'Basic ' + btoa(username + ":" + password) });
return this.http.get<string>("http://localhost:8080/data/employeelogin?query=" + username, { headers, responseType: 'text' as 'json' });
}

getAllDepartments(): Observable<Department[]> {
const url = `${this.baseUrl}/department/dep`;
return this.http.get<Department[]>(url);
}

getDepartmentById(id: number): Observable<Department> {
const url = `${this.baseUrl}/department/dep/${id}`;
return this.http.get<Department>(url);
}

saveDepartment(department: Department): Observable<Department> {
const url = `${this.baseUrl}/department/saveDep`;
const headers = new HttpHeaders({ Authorization: 'Basic ' + btoa(this.username + ":" + this.password) });

return this.http.post<Department>(url, department,{headers});
}



}
[i need like routes except home all shld be visible only when user logged in ]