Skip to content

Commit 8c4b532

Browse files
committed
Add, edit e form colocados.
1 parent b2bf9a4 commit 8c4b532

13 files changed

+149
-176
lines changed

src/app/domain/User.ts

+5-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,10 @@
11
export class User {
2+
Id: Number;
23
Name: String;
34
Email: String;
45
Document: String;
5-
Birthdate: Date
6+
Birthdate: Date;
7+
Country: String;
8+
Profile: String;
9+
Active: Boolean;
610
}

src/app/modules/core/http-backend.interceptor.ts

+10-2
Original file line numberDiff line numberDiff line change
@@ -50,10 +50,14 @@ export class HttpBackendInterceptor implements HttpInterceptor {
5050
var data = new Date();
5151

5252
var user: User = {
53+
Id: 1,
5354
Name: 'Gabriel Lucena',
5455
5556
Document: '023.437.673-27',
56-
Birthdate: new Date('1991-04-28T12:00:00')
57+
Birthdate: new Date('1991-04-28T12:00:00'),
58+
Country: 'Brasil',
59+
Profile: 'Administrator',
60+
Active: true
5761
}
5862

5963
for (let i = 0; i < 10; i++) {
@@ -72,10 +76,14 @@ export class HttpBackendInterceptor implements HttpInterceptor {
7276

7377
if (req.url.includes('users/') && req.method === 'GET') {
7478
var user: User = {
79+
Id: 1,
7580
Name: 'Gabriel Lucena',
7681
7782
Document: '023.437.673-27',
78-
Birthdate: new Date('1991-04-28T12:00:00')
83+
Birthdate: new Date('1991-04-28T12:00:00'),
84+
Country: 'Brasil',
85+
Profile: 'Administrator',
86+
Active: true
7987
}
8088

8189
return of(new HttpResponse({ status: 200, body: user }));

src/app/modules/core/http-loader.interceptor.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ export class HttpLoaderInterceptor implements HttpInterceptor {
3131
private finishing() {
3232
this.requests--;
3333

34-
if (this.requests >= 0) {
34+
if (this.requests == 0) {
3535
this.loadingService.loading.next(false);
3636

3737
this.requests = 0;
Original file line numberDiff line numberDiff line change
@@ -1,136 +1,17 @@
1-
<div class="overlay">
2-
<div [@panel-transition]="visible" class="panel">
3-
<div class="row mb-2 mb-2">
4-
<div class="col-lg-12">
5-
<div class="card">
6-
<div class="card-body">
7-
<h4 class="header-title mb-3">add:</h4>
8-
9-
<users-form></users-form>
10-
</div>
11-
</div>
12-
</div>
13-
</div>
14-
<div class="row mb-2 mb-2">
15-
<div class="col-lg-12">
16-
<div class="card">
17-
<div class="card-body">
18-
<h4 class="header-title mb-3">Search for mine:</h4>
19-
20-
<users-form></users-form>
21-
</div>
22-
</div>
23-
</div>
24-
</div>
25-
<div class="row mb-2 mb-2">
26-
<div class="col-lg-12">
27-
<div class="card">
28-
<div class="card-body">
29-
<h4 class="header-title mb-3">Search for mine:</h4>
30-
31-
<users-form></users-form>
32-
</div>
33-
</div>
34-
</div>
35-
</div>
36-
<div class="row mb-2 mb-2">
37-
<div class="col-lg-12">
38-
<div class="card">
39-
<div class="card-body">
40-
<h4 class="header-title mb-3">Search for mine:</h4>
41-
42-
<users-form></users-form>
43-
</div>
44-
</div>
45-
</div>
46-
</div>
47-
<div class="row mb-2 mb-2">
48-
<div class="col-lg-12">
49-
<div class="card">
50-
<div class="card-body">
51-
<h4 class="header-title mb-3">Search for mine:</h4>
52-
53-
<users-form></users-form>
54-
</div>
55-
</div>
56-
</div>
57-
</div>
58-
<div class="row mb-2 mb-2">
59-
<div class="col-lg-12">
60-
<div class="card">
61-
<div class="card-body">
62-
<h4 class="header-title mb-3">Search for mine:</h4>
63-
64-
<users-form></users-form>
65-
</div>
66-
</div>
67-
</div>
68-
</div>
69-
<div class="row mb-2 mb-2">
70-
<div class="col-lg-12">
71-
<div class="card">
72-
<div class="card-body">
73-
<h4 class="header-title mb-3">Search for mine:</h4>
74-
75-
<users-form></users-form>
76-
</div>
77-
</div>
78-
</div>
79-
</div>
80-
<div class="row mb-2 mb-2">
81-
<div class="col-lg-12">
82-
<div class="card">
83-
<div class="card-body">
84-
<h4 class="header-title mb-3">Search for mine:</h4>
85-
86-
<users-form></users-form>
87-
</div>
88-
</div>
89-
</div>
90-
</div>
91-
<div class="row mb-2 mb-2">
92-
<div class="col-lg-12">
93-
<div class="card">
94-
<div class="card-body">
95-
<h4 class="header-title mb-3">Search for mine:</h4>
96-
97-
<users-form></users-form>
98-
</div>
99-
</div>
100-
</div>
101-
</div>
102-
<div class="row mb-2 mb-2">
103-
<div class="col-lg-12">
104-
<div class="card">
105-
<div class="card-body">
106-
<h4 class="header-title mb-3">Search for mine:</h4>
107-
108-
<users-form></users-form>
109-
</div>
110-
</div>
111-
</div>
112-
</div>
113-
<div class="row mb-2 mb-2">
114-
<div class="col-lg-12">
115-
<div class="card">
116-
<div class="card-body">
117-
<h4 class="header-title mb-3">Search for mine:</h4>
118-
119-
<users-form></users-form>
120-
</div>
121-
</div>
122-
</div>
123-
</div>
124-
<div class="row mb-2 mb-2">
125-
<div class="col-lg-12">
126-
<div class="card">
127-
<div class="card-body">
128-
<h4 class="header-title mb-3">Search for mine:</h4>
129-
130-
<users-form></users-form>
131-
</div>
132-
</div>
133-
</div>
134-
</div>
1+
<div [@overlay-transition]="(user | async) ? 'visible' : 'hidden'" class="overlay" (click)="close()"></div>
2+
3+
<div #panel [@panel-transition]="(user | async) ? 'visible' : 'hidden'" class="panel">
4+
<div class="float-left">
5+
<h2 class="mb-4">Create a new user</h2>
1356
</div>
7+
8+
<div class="float-right">
9+
<a (click)="close()" href="javascript:void(0);" class="panel-close">
10+
<fa-icon [icon]="faTimes"></fa-icon>
11+
</a>
12+
</div>
13+
14+
<div class="clearfix"></div>
15+
16+
<users-form></users-form>
13617
</div>
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,42 @@
1-
import { Component, ViewEncapsulation, Input } from '@angular/core';
1+
import { Component, ViewEncapsulation, Input, Renderer2, ViewChild, ElementRef } from '@angular/core';
22
import { PanelAnimation } from 'src/app/modules/animations/panel.animation';
33
import { BehaviorSubject } from 'rxjs';
44
import { User } from 'src/app/domain/user';
5+
import { Location } from '@angular/common';
6+
import { IconDefinition } from '@fortawesome/fontawesome-svg-core';
7+
import { faTimes } from '@fortawesome/free-solid-svg-icons';
8+
import { Router } from '@angular/router';
9+
import { OverlayAnimation } from 'src/app/modules/animations/overlay.animation';
510

611
@Component({
712
selector: 'users-add',
813
templateUrl: './users-add.component.html',
914
encapsulation: ViewEncapsulation.None,
10-
animations: [ PanelAnimation ],
15+
animations: [ PanelAnimation, OverlayAnimation ]
1116
})
1217
export class UsersAddComponent {
18+
@ViewChild('panel') panel: ElementRef;
19+
1320
public user = new BehaviorSubject<User>(null);
14-
15-
constructor() { }
21+
public faTimes: IconDefinition = faTimes;
22+
23+
constructor(private renderer: Renderer2,
24+
private location: Location,
25+
private router: Router) {
26+
27+
this.user.subscribe((user: User) => {
28+
if (user) {
29+
this.renderer.addClass(document.body, 'overflow');
30+
this.renderer.setProperty(this.panel.nativeElement, 'scrollTop', '0');
31+
this.location.go(this.router.url.split('/')[1] + '/new');
32+
} else {
33+
this.renderer.removeClass(document.body, 'overflow');
34+
this.location.go(this.router.url.split('/')[1]);
35+
}
36+
});
37+
}
38+
39+
close() {
40+
this.user.next(null);
41+
}
1642
}

src/app/routes/users/users-edit/users-edit.component.ts

+3-3
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ import { User } from 'src/app/domain/user';
1414
animations: [ PanelAnimation, OverlayAnimation ]
1515
})
1616
export class UsersEditComponent {
17-
@ViewChild('panel') panel: ElementRef;
17+
@ViewChild('panel') panel: ElementRef;
1818

1919
public user = new BehaviorSubject<User>(null);
2020
public faTimes: IconDefinition = faTimes;
@@ -27,10 +27,10 @@ export class UsersEditComponent {
2727
if (user) {
2828
this.renderer.addClass(document.body, 'overflow');
2929
this.renderer.setProperty(this.panel.nativeElement, 'scrollTop', '0');
30-
this.location.go(this.router.url + "/edit/");
30+
this.location.go(this.router.url.split('/')[1] + '/' + user.Id);
3131
} else {
3232
this.renderer.removeClass(document.body, 'overflow');
33-
this.location.go(this.router.url);
33+
this.location.go(this.router.url.split('/')[1]);
3434
}
3535
});
3636
}

src/app/routes/users/users-filter/users-filter.component.html

+9-5
Original file line numberDiff line numberDiff line change
@@ -10,13 +10,17 @@
1010
<label for="Email">Email</label>
1111
<input formControlName="Email" type="text" class="form-control" placeholder="User's email">
1212
</div>
13-
<div class="form-group col-md-3">
14-
<label for="Document">Document</label>
15-
<input formControlName="Document" type="text" class="form-control" id="Document" placeholder="User's document">
16-
</div>
1713
</div>
1814

19-
<button class="btn btn-primary" (click)="filter()">Search</button>
15+
<div class="float-left">
16+
<button class="btn btn" (click)="filter()">Search</button>
17+
</div>
18+
19+
<div class="float-right">
20+
<button class="btn btn-primary" (click)="add()">New</button>
21+
</div>
22+
23+
<div class="clearfix"></div>
2024
</form>
2125
</div>
2226
</div>

src/app/routes/users/users-filter/users-filter.component.ts

+6-7
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,11 @@ import { debounceTime } from 'rxjs/operators';
1010

1111
export class UsersFilterComponent {
1212
@Output() filterEvent: EventEmitter<FormGroup> = new EventEmitter<FormGroup>();
13+
@Output() addEvent: EventEmitter<void> = new EventEmitter<void>();
1314

1415
public filters = new FormGroup({
1516
Name: new FormControl(),
16-
Email: new FormControl(),
17-
Document: new FormControl()
17+
Email: new FormControl()
1818
});
1919

2020
constructor() {
@@ -27,14 +27,13 @@ export class UsersFilterComponent {
2727
debounceTime(500)).subscribe(() => {
2828
this.filter();
2929
});
30-
31-
this.filters.controls.Document.valueChanges.pipe(
32-
debounceTime(500)).subscribe(() => {
33-
this.filter();
34-
});
3530
}
3631

3732
filter(): void {
3833
this.filterEvent.emit(this.filters);
3934
}
35+
36+
add(): void {
37+
this.addEvent.emit();
38+
}
4039
}

0 commit comments

Comments
 (0)