UPDATE!

frontend/main/src/app/app.module.ts

@@ -21,6 +21,7 @@ import { ShipQtComponent } from './ship-qt/ship-qt.component';
 import { RctQtComponent } from './rct-qt/rct-qt.component';
 import { EditComponent } from './edit/edit.component';
 import { AboutComponent } from './about/about.component';
+import { HttpClientModule } from "@angular/common/http";
 
 @NgModule({
   declarations: [
@@ -46,7 +47,8 @@ import { AboutComponent } from './about/about.component';
   imports: [
     BrowserModule,
     AppRoutingModule,
-    FormsModule
+    FormsModule,
+    HttpClientModule
   ],
   providers: [],
   bootstrap: [AppComponent]

frontend/main/src/app/body/body.component.html

@@ -224,6 +224,6 @@ <h3 class="dropdown-item-title">
   </div>
   <div style="padding-left: 20px;">
     <div class="small">Logged in as:</div>
-    <span>{{name}}<br><a routerLink="" (click)="sair()" class="small" style="color: red;">Sair</a>&nbsp;&nbsp;&nbsp;&nbsp;<a routerLink="edit" class="small">Edit</a> </span>
+    <span>{{loginService.user}}<br><a routerLink="" (click)="sair()" class="small" style="color: red;">Sair</a>&nbsp;&nbsp;&nbsp;&nbsp;<a routerLink="edit" class="small">Edit</a> </span>
   </div>
 </aside>

frontend/main/src/app/body/body.component.ts

@@ -1,4 +1,5 @@
 import { Component, OnInit } from '@angular/core';
+import { LoginComponent } from '../login/login.component';
 import { LoginserviceService } from '../loginservice.service';
 
 @Component({
@@ -8,16 +9,14 @@ import { LoginserviceService } from '../loginservice.service';
 })
 export class BodyComponent implements OnInit {
 
-  name:string = "Admin"
-
-  constructor(private login:LoginserviceService) { }
+  constructor(public loginService:LoginserviceService) { }
 
   ngOnInit(): void {
   }
 
   sair(){
 
-    this.login.succeed = false;
+    this.loginService.succeed = false;
 
   }
 

frontend/main/src/app/login/login.component.html

@@ -1 +1,3 @@
+<input type="text" [(ngModel)]="user" placeholder="User"><br>
+<input type="text" [(ngModel)]="password" placeholder="Password"><br>
 <button class="btn btn-outline-primary" (click)="submit()">Entrar!</button>

frontend/main/src/app/login/login.component.ts

@@ -1,5 +1,6 @@
 import { Component, OnInit } from '@angular/core';
 import { Router } from '@angular/router';
+import { catchError, of } from 'rxjs';
 import { LoginserviceService } from '../loginservice.service';
 
 @Component({
@@ -9,15 +10,27 @@ import { LoginserviceService } from '../loginservice.service';
 })
 export class LoginComponent implements OnInit {
 
-  constructor(private router:Router, private login:LoginserviceService) { }
+  user!:string
+  password!:string
+
+  constructor(private router:Router, private loginService:LoginserviceService) { }
 
   ngOnInit(): void {
-    this.login.succeed = false
+    this.loginService.succeed = false
   }
 
   submit():void{
-    this.login.succeed = true
+    this.loginService.succeed = true
     this.router.navigateByUrl('home');
+    this.loginService.logging(this.user, this.password)
+    .pipe(
+      catchError((error)=>{
+        return of(['Deu erro parcero é isso', 'tu não vai encontrar detalhe aqui','pode sair já...', error, 'só pq sou teu amigo vou deixar esse error ai'])
+      })
+    )
+    .subscribe((response)=>{
+      console.log('Running...', response);
+    });
   }
 
 }

frontend/main/src/app/loginservice.service.ts

@@ -1,3 +1,4 @@
+import { HttpClient } from '@angular/common/http';
 import { Injectable } from '@angular/core';
 import { ActivatedRouteSnapshot, CanActivate, Router, RouterStateSnapshot, UrlTree } from '@angular/router';
 import { Observable } from 'rxjs';
@@ -7,9 +8,16 @@ import { Observable } from 'rxjs';
 })
 export class LoginserviceService implements CanActivate {
 
+  user!:string
+  TMSLoginAPI:string = "https://imagina-uma-api-bem-daora-aqui.com"
   succeed!:boolean
 
-  constructor(private router:Router) {}
+  constructor(private router:Router, private http:HttpClient) {}
+
+  logging(user:string, password:string){
+    this.user = user
+    return this.http.get<any>(this.TMSLoginAPI+user+password)
+  }
 
   canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean | UrlTree | Observable<boolean | UrlTree> | Promise<boolean | UrlTree> {