Skip to content

Commit 0b14b76

Browse files
jsfrochajsfrocha
committed
Navigate to ContentPage with QueryParams acting as Filters;
1 parent 10b4da3 commit 0b14b76

File tree

6 files changed

+48
-37
lines changed

6 files changed

+48
-37
lines changed

‎src/app/screens/content/content.component.html

Lines changed: 6 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -8,21 +8,21 @@
88
<t4e-filters
99
title="Providers"
1010
[fields]="providerFields$"
11-
[selectedIndexes]="[]"
11+
[initialFilters]="selectedProviders$.getValue()"
1212
(onSelectFields)="selectedProviders$.next($event)"
1313
></t4e-filters>
1414

1515
<t4e-filters
1616
title="Stakeholders"
1717
[fields]="stakeholderFields$"
18-
[selectedIndexes]="[]"
18+
[initialFilters]="selectedStakeholders$.getValue()"
1919
(onSelectFields)="selectedStakeholders$.next($event)"
2020
></t4e-filters>
2121

2222
<t4e-filters
2323
title="Tags"
2424
[fields]="tagFields$"
25-
[selectedIndexes]="[]"
25+
[initialFilters]="selectedTags$.getValue()"
2626
(onSelectFields)="selectedTags$.next($event)"
2727
></t4e-filters>
2828

@@ -66,28 +66,21 @@
6666
<t4e-filters
6767
title="Providers"
6868
[fields]="providerFields$"
69-
[selectedIndexes]="[]"
69+
[initialFilters]="selectedProviders$.getValue()"
7070
(onSelectFields)="selectedProviders$.next($event)"
7171
></t4e-filters>
7272

7373
<t4e-filters
7474
title="Stakeholders"
7575
[fields]="stakeholderFields$"
76-
[selectedIndexes]="[]"
76+
[initialFilters]="selectedStakeholders$.getValue()"
7777
(onSelectFields)="selectedStakeholders$.next($event)"
7878
></t4e-filters>
7979

8080
<t4e-filters
8181
title="Tags"
8282
[fields]="tagFields$"
83-
[selectedIndexes]="[]"
84-
(onSelectFields)="selectedTags$.next($event)"
85-
></t4e-filters>
86-
87-
<t4e-filters
88-
title="Tags"
89-
[fields]="tagFields$"
90-
[selectedIndexes]="[]"
83+
[initialFilters]="selectedTags$.getValue()"
9184
(onSelectFields)="selectedTags$.next($event)"
9285
></t4e-filters>
9386

‎src/app/screens/content/content.component.ts

Lines changed: 20 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,12 @@
1-
import {Component, OnDestroy, OnInit} from '@angular/core';
1+
import {Component, OnInit} from '@angular/core';
22
import gql from 'graphql-tag';
33
import {AppService} from '../../app.service';
4-
import {BehaviorSubject, combineLatest, Observable, Subscription} from 'rxjs';
5-
import {IProvider} from '../../interfaces/provider.interface';
6-
import {IStakeholder} from '../../interfaces/stakeholder.interface';
7-
import {ITag} from '../../interfaces/tag.interface';
8-
import {filter, map} from 'rxjs/operators';
9-
import {IFilterField, IFilters} from '../../shared/filters/interfaces/filters.interface';
4+
import {BehaviorSubject, combineLatest, Observable} from 'rxjs';
5+
import {map} from 'rxjs/operators';
6+
import {IFilters} from '../../shared/filters/interfaces/filters.interface';
107
import {Apollo, QueryRef} from 'apollo-angular';
118
import {IContentItem} from '../../interfaces/content-item.interface';
9+
import {ActivatedRoute} from '@angular/router';
1210

1311
const GET_CONTENT_ITEMS = gql`
1412
query GetContentItems(
@@ -70,10 +68,13 @@ export class ContentComponent implements OnInit {
7068

7169
constructor(
7270
private appService: AppService,
73-
private apollo: Apollo
71+
private apollo: Apollo,
72+
private activatedRoute: ActivatedRoute
7473
) { }
7574

7675
ngOnInit(): void {
76+
window.scroll(0,0);
77+
7778
this.providerFields$ = this.appService.getProviderFilterFields()
7879
this.stakeholderFields$ = this.appService.getStakeholderFilterFields();
7980
this.tagFields$ = this.appService.getTagFilterFields();
@@ -84,11 +85,21 @@ export class ContentComponent implements OnInit {
8485

8586
this.contentItemsQueryRef.valueChanges.subscribe(({data, loading, errors}) => {
8687
if (!loading) {
87-
console.log('content items', data.contentItems);
8888
this.contentItems = data.contentItems;
8989
}
9090
});
9191

92+
this.activatedRoute.queryParams.subscribe((result) => {
93+
console.log('params', result)
94+
if (result.provider) {
95+
this.selectedProviders$.next([result.provider])
96+
}
97+
98+
if (result.stakeholder) {
99+
this.selectedStakeholders$.next([result.stakeholder])
100+
}
101+
})
102+
92103
combineLatest(
93104
this.selectedProviders$,
94105
this.selectedStakeholders$,

‎src/app/screens/home/home.component.html

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -9,19 +9,19 @@ <h1>Tools4Edu</h1>
99
</div>
1010
</div>
1111
<div class="t4e-cta-container mobile">
12-
<div class="cta-item cta-item__professor">
12+
<div class="cta-item cta-item__professor" routerLink="/conteudo" [queryParams]="{stakeholder: '5e7cdd531c9d44000054f369'}">
1313
<img class="img" src="../../../assets/card/cta-professor.png" alt="">
1414
<img class="img mobile" src="../../../assets/card/cta-mobile-professor.png" alt="">
1515
<h3>SOU PROFESSOR</h3>
1616
<button>SABER MAIS →</button>
1717
</div>
18-
<div class="cta-item cta-item__aluno">
18+
<div class="cta-item cta-item__aluno" routerLink="/conteudo" [queryParams]="{stakeholder: '5e7cdd031c9d44000054f368'}">
1919
<img class="img" src="../../../assets/card/cta-aluno.png" alt="">
2020
<img class="img mobile" src="../../../assets/card/cta-mobile-aluno.png" alt="">
2121
<h3>SOU ALUNO</h3>
2222
<button>SABER MAIS →</button>
2323
</div>
24-
<div class="cta-item cta-item__ee">
24+
<div class="cta-item cta-item__ee" routerLink="/conteudo" [queryParams]="{stakeholder: '5e7cdd721c9d44000054f36a'}">
2525
<img class="img" src="../../../assets/card/cta-ee.png" alt="">
2626
<img class="img mobile" src="../../../assets/card/cta-mobile-ee.png" alt="">
2727
<h3>SOU ENCARREGADO(A) DE EDUCAÇÃO</h3>
@@ -30,19 +30,19 @@ <h3>SOU ENCARREGADO(A) DE EDUCAÇÃO</h3>
3030
</div>
3131
</div>
3232
<div class="t4e-cta-container desktop">
33-
<div class="cta-item cta-item__professor">
33+
<div class="cta-item cta-item__professor" routerLink="/conteudo" [queryParams]="{stakeholder: '5e7cdd531c9d44000054f369'}">
3434
<img class="img" src="../../../assets/card/cta-professor.png" alt="">
3535
<img class="img mobile" src="../../../assets/card/cta-mobile-professor.png" alt="">
3636
<h3>SOU PROFESSOR</h3>
3737
<button>SABER MAIS →</button>
3838
</div>
39-
<div class="cta-item cta-item__aluno">
39+
<div class="cta-item cta-item__aluno" routerLink="/conteudo" [queryParams]="{stakeholder: '5e7cdd031c9d44000054f368'}">
4040
<img class="img" src="../../../assets/card/cta-aluno.png" alt="">
4141
<img class="img mobile" src="../../../assets/card/cta-mobile-aluno.png" alt="">
4242
<h3>SOU ALUNO</h3>
4343
<button>SABER MAIS →</button>
4444
</div>
45-
<div class="cta-item cta-item__ee">
45+
<div class="cta-item cta-item__ee" routerLink="/conteudo" [queryParams]="{stakeholder: '5e7cdd721c9d44000054f36a'}">
4646
<img class="img" src="../../../assets/card/cta-ee.png" alt="">
4747
<img class="img mobile" src="../../../assets/card/cta-mobile-ee.png" alt="">
4848
<h3>SOU ENCARREGADO(A) DE EDUCAÇÃO</h3>
@@ -99,10 +99,10 @@ <h2 class="t4e-section__title">BLOG</h2>
9999
<section class="t4e-section t4e-section-platforms">
100100
<h2 class="t4e-section__title">PLATAFORMAS</h2>
101101
<div class="platforms-wrapper">
102-
<div class="platform-item">
102+
<div class="platform-item" routerLink="/conteudo" [queryParams]="{provider: '5e7cdc4c1c9d44000054f367'}">
103103
<img src="../../../assets/pages/home/platforms-zoom.png" alt="Zoom">
104104
</div>
105-
<div class="platform-item">
105+
<div class="platform-item" routerLink="/conteudo" [queryParams]="{provider: '5e8baf38d6c91771a843097e'}">
106106
<img src="../../../assets/pages/home/platforms-teams.png" alt="Teams">
107107
</div>
108108
<div class="platform-item empty">

‎src/app/shared/filters/filters.component.ts

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ export class FiltersComponent implements OnInit {
1212

1313
@Input() title: string;
1414
@Input() fields: Observable<IFilters>;
15-
@Input() selectedIndexes: number[] = [];
15+
@Input() initialFilters: string[] = [];
1616
@Output() onSelectFields: EventEmitter<string[]> = new EventEmitter<string[]>();
1717

1818
filterForm: FormGroup
@@ -34,7 +34,9 @@ export class FiltersComponent implements OnInit {
3434

3535
result.filterFields.forEach((field, index) => {
3636
let state = '';
37-
if (this.selectedIndexes.length > 0 && this.selectedIndexes.includes(index)) {
37+
console.log('initial filters', this.initialFilters)
38+
console.log('field value', field.value)
39+
if (this.initialFilters.length > 0 && this.initialFilters.includes(field.value)) {
3840
state = field.value;
3941
}
4042
(this.filterForm.controls.filters as FormArray).push(

‎src/app/shared/navbar/navbar.component.html

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -35,19 +35,19 @@
3535
</a>
3636
<ul class="navbar__nav-items navbar--mobile__nav-items">
3737
<li class="nav-item nav-item--home">
38-
<a routerLink="/" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }">Inicio</a>
38+
<a routerLink="/" (click)="navigateOut()" routerLinkActive="active" [routerLinkActiveOptions]="{ exact: true }">Inicio</a>
3939
</li>
4040
<li class="nav-item nav-item--content">
41-
<a routerLink="/conteudo" routerLinkActive="active">Conteúdos</a>
41+
<a routerLink="/conteudo" (click)="navigateOut()" routerLinkActive="active">Conteúdos</a>
4242
</li>
4343
<li class="nav-item nav-item--blog">
44-
<a routerLink="/blog" routerLinkActive="active">Blog</a>
44+
<a routerLink="/blog" (click)="navigateOut()" routerLinkActive="active">Blog</a>
4545
</li>
4646
<li class="nav-item nav-item--faqs">
47-
<a routerLink="/faqs" routerLinkActive="active">Ajuda</a>
47+
<a routerLink="/faqs" (click)="navigateOut()" routerLinkActive="active">Ajuda</a>
4848
</li>
4949
<li class="nav-item nav-item--about">
50-
<a routerLink="/sobre" routerLinkActive="active">Sobre Nós</a>
50+
<a routerLink="/sobre" (click)="navigateOut()" routerLinkActive="active">Sobre Nós</a>
5151
</li>
5252
</ul>
5353

‎src/app/shared/navbar/navbar.component.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,4 +25,9 @@ export class NavbarComponent implements OnInit {
2525
}
2626
}
2727

28+
navigateOut() {
29+
this.drawerOpened = false;
30+
this.renderer.removeClass(document.body, 't4e-scroll-lock');
31+
}
32+
2833
}

0 commit comments

Comments
 (0)