Skip to content

Commit df146aa

Browse files
Seção 10: Angular - Registrando Eventos pat02-02
1 parent f6ef873 commit df146aa

7 files changed

Lines changed: 113 additions & 48 deletions

File tree

Back/src/BrnEventos.API/Controllers/EventosController.cs

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -110,9 +110,9 @@ public async Task<IActionResult> Delete(int id)
110110
var evento = await _eventoService.GetEventoByIdAsync(id, true);
111111
if (evento == null) return NoContent();
112112

113-
return await _eventoService.DeleteEvento(id) ?
114-
Ok("Deletado") :
115-
throw new Exception("Ocorreu um erro não específico ao tentar deletar o Evento");
113+
return await _eventoService.DeleteEvento(id)
114+
? Ok(new { menssage = "Deletado"})
115+
: throw new Exception("Ocorreu um erro não específico ao tentar deletar o Evento");
116116
}
117117
catch (Exception ex)
118118
{

Front/BrnEventos-App/src/app/components/eventos/evento-detalhe/evento-detalhe.component.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -98,7 +98,7 @@
9898
<button class="btn btn-outline-secondary me-auto border-2" (click)="resetForm()">
9999
Cancelar Alteração
100100
</button>
101-
<button class="btn btn-success" [disabled]="!form.valid">
101+
<button class="btn btn-success" [disabled]="!form.valid" (click)="salvarAlteracao()">
102102
<!-- <span class="spinner-border spinner-border-sm me-1"></span> -->
103103
Salvar Evento
104104
</button>

Front/BrnEventos-App/src/app/components/eventos/evento-detalhe/evento-detalhe.component.ts

Lines changed: 34 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ export class EventoDetalheComponent implements OnInit {
1818

1919
evento = {} as Evento;
2020
form!: FormGroup;
21+
estadoSalvar = 'post';
2122

2223
get f(): any {
2324
return this.form.controls;
@@ -34,32 +35,32 @@ export class EventoDetalheComponent implements OnInit {
3435
}
3536

3637
constructor(private fb: FormBuilder,
37-
private localeService: BsLocaleService,
38-
private router: ActivatedRoute,
39-
private eventoService: EventoService,
40-
private spinner: NgxSpinnerService,
41-
private toastr: ToastrService)
42-
{
38+
private localeService: BsLocaleService,
39+
private router: ActivatedRoute,
40+
private eventoService: EventoService,
41+
private spinner: NgxSpinnerService,
42+
private toastr: ToastrService) {
4343
this.localeService.use('pt-br')
4444
}
4545

46-
public carregarEvento(){
46+
public carregarEvento() {
4747
const eventoIdParam = this.router.snapshot.paramMap.get('id');
4848

49-
if ( eventoIdParam != null ){
49+
if (eventoIdParam != null) {
5050
this.spinner.show();
51+
52+
this.estadoSalvar = 'put';
53+
5154
this.eventoService.getEventoById(+eventoIdParam).subscribe({
5255
next: (evento: Evento) => {
53-
this.evento = {...evento};
56+
this.evento = { ...evento };
5457
this.form.patchValue(this.evento);
5558
},
5659
error: (error: any) => {
57-
this.spinner.hide();
5860
this.toastr.error('Error ao tentar carregar Evento, Error!');
5961
console.error(error);
6062
},
61-
complete: () => this.spinner.hide(),
62-
});
63+
}).add(() => this.spinner.hide());
6364
}
6465
}
6566

@@ -80,11 +81,30 @@ export class EventoDetalheComponent implements OnInit {
8081
});
8182
}
8283

83-
public cssValidator(campoForm: FormControl): any {
84-
return {'is-invalid': campoForm.errors && campoForm.touched};
84+
public cssValidator(campoForm: FormControl): any {
85+
return { 'is-invalid': campoForm.errors && campoForm.touched };
8586
}
8687

8788
public resetForm(): void {
8889
this.form.reset();
8990
}
91+
92+
public salvarAlteracao(): void {
93+
this.spinner.show();
94+
if (this.form.valid) {
95+
96+
this.evento = (this.estadoSalvar == 'post')
97+
? { ...this.form.value }
98+
: { id: this.evento.id, ...this.form.value };
99+
100+
this.eventoService[this.estadoSalvar](this.evento).subscribe(
101+
() => this.toastr.success('Evento salvo com sucesso', 'Sucesso!'),
102+
(error: any) => {
103+
console.error(error);
104+
this.toastr.error('Error ao salvar evento', 'Error!');
105+
},
106+
).add(() => this.spinner.hide());
107+
}
108+
}
109+
90110
}

Front/BrnEventos-App/src/app/components/eventos/evento-lista/evento-lista.component.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@
5252
<td class="d-none d-md-table-cell">{{evento.lotes[0]?.nome | uppercase }}</td>
5353
<td>
5454
<button type="button" data-toggle="tooltip" title="Excluir" class="btn btn-danger btn-lg"
55-
(click)="openModal(template)">
55+
(click)="openModal($event, template, evento.id)">
5656
<i class="fa fa-trash"></i>
5757
</button>
5858
</td>
@@ -73,7 +73,7 @@ <h3>Nenhum Evento Encontrado!</h3>
7373

7474
<ng-template #template>
7575
<div class="modal-body text-center">
76-
<h4>Tem certeza que deseja deletar este Evento?</h4>
76+
<h4>Tem certeza que deseja deletar o Evento de Código {{this.eventoId}}?</h4>
7777
<button type="button" class="btn btn-default me-2" (click)="confirm()">Sim</button>
7878
<button type="button" class="btn btn-primary" (click)="decline()">Não</button>
7979
</div>

Front/BrnEventos-App/src/app/components/eventos/evento-lista/evento-lista.component.ts

Lines changed: 34 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
1-
import { Router } from '@angular/router';
21
import { Component, OnInit, TemplateRef } from '@angular/core';
2+
import { Router } from '@angular/router';
3+
34
import { BsModalRef, BsModalService } from 'ngx-bootstrap/modal';
4-
import { NgxSpinnerService } from 'ngx-spinner';
55
import { ToastrService } from 'ngx-toastr';
6-
import { Evento } from '@app/models/Evento';
6+
import { NgxSpinnerService } from 'ngx-spinner';
7+
78
import { EventoService } from '@app/services/evento.service';
9+
import { Evento } from '@app/models/Evento';
810

911
@Component({
1012
selector: 'app-evento-lista',
@@ -16,6 +18,7 @@ export class EventoListaComponent implements OnInit {
1618
modalRef?: BsModalRef;
1719
public eventos: Evento[] = [];
1820
public eventosFiltrados: Evento[] = [];
21+
public eventoId = 0;
1922

2023
public widthImg = 160;
2124
public heightimg = 100;
@@ -29,14 +32,16 @@ export class EventoListaComponent implements OnInit {
2932

3033
public set filtroLista(value: string) {
3134
this.filtroListado = value;
32-
this.eventosFiltrados = this.filtroLista ? this.filtrarEventos(this.filtroLista) : this.eventos
35+
this.eventosFiltrados = this.filtroLista
36+
? this.filtrarEventos(this.filtroLista)
37+
: this.eventos
3338
}
3439

3540
public filtrarEventos(filtrarPor: string): Evento[] {
3641
filtrarPor = filtrarPor.toLocaleLowerCase();
3742
return this.eventos.filter(
3843
(evento: { tema: string; local: string }) => evento.tema.toLocaleLowerCase().indexOf(filtrarPor) !== -1 ||
39-
evento.local.toLocaleLowerCase().indexOf(filtrarPor) !== -1
44+
evento.local.toLocaleLowerCase().indexOf(filtrarPor) !== -1
4045
);
4146
}
4247

@@ -46,45 +51,59 @@ export class EventoListaComponent implements OnInit {
4651
private toastr: ToastrService,
4752
private spinner: NgxSpinnerService,
4853
private router: Router,
49-
) { }
54+
) { }
5055

5156
public ngOnInit(): void {
5257
this.spinner.show();
53-
this.getEventos();
58+
this.carregarEventos();
5459
}
5560

5661
public alterarImagem(): void {
5762
this.showimg = !this.showimg;
5863
}
5964

60-
public getEventos(): void {
65+
public carregarEventos(): void {
6166
this.eventoService.getEventos().subscribe({
6267
next: (eventos: Evento[]) => {
6368
this.eventos = eventos;
6469
this.eventosFiltrados = this.eventos;
6570
},
6671
error: (error: any) => {
67-
this.spinner.hide();
6872
this.toastr.error('Erro ao Carregar os Eventos', 'Erro!');
6973
},
70-
complete: () => this.spinner.hide()
71-
});
74+
}).add(() => this.spinner.hide());
7275
}
7376

74-
openModal(template: TemplateRef<any>): void {
75-
this.modalRef = this.modalService.show(template, {class: 'modal-sm'});
77+
openModal(event: any, template: TemplateRef<any>, eventoId: number) {
78+
event.stopPropagation();
79+
this.eventoId = eventoId;
80+
this.modalRef = this.modalService.show(template, { class: 'modal-sm' });
7681
}
7782

7883
confirm(): void {
7984
this.modalRef?.hide();
80-
this.toastr.success('Evento deletado com Sucesso!', 'Deletado!');
85+
this.spinner.show();
86+
87+
this.eventoService.deleteEvento(this.eventoId).subscribe({
88+
next: (result: any) => {
89+
console.log(result);
90+
this.toastr.success('Evento deletado com Sucesso!', 'Deletado!');
91+
this.carregarEventos();
92+
93+
},
94+
error: (error: any) => {
95+
console.error(error);
96+
this.toastr.error(`Error ao tentar deletar o Evento ${this.eventoId}`, 'Error!');
97+
},
98+
}).add(() => this.spinner.hide());
99+
81100
}
82101

83102
decline(): void {
84103
this.modalRef?.hide();
85104
}
86105

87-
detalheEvento (id: number): void{
106+
detalheEvento(id: number): void {
88107
this.router.navigate([`eventos/detalhe/${id}`]);
89108
}
90109

Lines changed: 38 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,51 @@
1+
import { Evento } from './../models/Evento';
12
import { HttpClient } from '@angular/common/http';
23
import { Injectable } from '@angular/core';
3-
import { Observable } from 'rxjs';
4-
import { Evento } from '../models/Evento';
4+
import { Observable, take } from 'rxjs';
55

66
@Injectable(
77
// Declarado em (app.module.ts)
88
//{providedIn: 'root'} <-----Implementa o service na raiz do app para todos os components
9-
)
9+
)
1010
export class EventoService {
1111
baseURL = 'https://localhost:5001/api/eventos'
1212

13-
constructor(private http: HttpClient) { }
13+
constructor(private http: HttpClient) { }
1414

15-
public getEventos(): Observable<Evento[]> {
16-
return this.http.get<Evento[]>(this.baseURL)
17-
}
15+
public getEventos(): Observable<Evento[]> {
16+
return this.http
17+
.get<Evento[]>(this.baseURL)
18+
.pipe(take(1));
19+
}
1820

19-
public getEventosByTema(tema: string): Observable<Evento[]> {
20-
return this.http.get<Evento[]>(`${this.baseURL}/${tema}/tema`)
21-
}
21+
public getEventosByTema(tema: string): Observable<Evento[]> {
22+
return this.http
23+
.get<Evento[]>(`${this.baseURL}/${tema}/tema`)
24+
.pipe(take(1));
25+
}
26+
27+
public getEventoById(id: number): Observable<Evento> {
28+
return this.http
29+
.get<Evento>(`${this.baseURL}/${id}`)
30+
.pipe(take(1));
31+
}
32+
33+
public post(evento: Evento): Observable<Evento> {
34+
return this.http
35+
.post<Evento>(this.baseURL, evento)
36+
.pipe(take(1));
37+
}
38+
39+
public put(evento: Evento): Observable<Evento> {
40+
return this.http
41+
.put<Evento>(`${this.baseURL}/${evento.id}`, evento)
42+
.pipe(take(1));
43+
}
44+
45+
public deleteEvento(id: number): Observable<any> {
46+
return this.http
47+
.delete(`${this.baseURL}/${id}`)
48+
.pipe(take(1));
49+
}
2250

23-
public getEventoById(id: number): Observable<Evento> {
24-
return this.http.get<Evento>(`${this.baseURL}/${id}`)
25-
}
2651
}

Front/BrnEventos-App/tsconfig.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
"noImplicitOverride": true,
1010
"noPropertyAccessFromIndexSignature": true,
1111
"noImplicitReturns": true,
12+
"noImplicitAny": false,
1213
"noFallthroughCasesInSwitch": true,
1314
"sourceMap": true,
1415
"declaration": false,

0 commit comments

Comments
 (0)