Skip to content

Commit 8ac67b9

Browse files
author
JLRR2019
committed
Proxy, onInit y for de noticias
1 parent 740db47 commit 8ac67b9

File tree

7 files changed

+117
-102
lines changed

7 files changed

+117
-102
lines changed

‎frontend/proxy.conf.json‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"/api/*": {
3+
"target": "https://127.0.0.1:8443/",
4+
"secure": false,
5+
"logLevel": "debug",
6+
"changeOrigin": true
7+
}
8+
}

‎frontend/src/app/components/news/news.component.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ <h1 class="fw-bolder fs-5 mb-4">Noticias destacadas</h1>
2626
<section class="py-5">
2727
<div class="container px-5">
2828
<h2 class="fw-bolder fs-5 mb-4">Noticias que te pueden interesar.</h2>
29-
<div id="moreImages" class="row gx-5" *ngFor="let ns of news">
29+
<div id="moreImages" class="row gx-5" *ngFor="let ng of news">
3030
<newsTemplate></newsTemplate>
3131
</div>
3232
<div class="text-end mb-5 mb-xl-0">

‎frontend/src/app/components/news/news.component.ts‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -39,11 +39,11 @@ export class NewsComponent{
3939

4040
//esto es una prueba
4141
nextPage(){
42-
if(this.news){
43-
return this.router.navigate(['/news/1'])
44-
} else {
45-
return undefined;
46-
}
42+
if(this.news){
43+
return this.router.navigate(['/news/1'])
44+
} else {
45+
return undefined;
46+
}
4747
}
4848

4949
}

‎frontend/src/app/components/news/newsTemplate.component.html‎

Lines changed: 18 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,25 @@
1-
<div *ngIf="news">
2-
<!--llamamos a news de tipo News, cargamos el constructor-->
3-
<div class="col-lg-4 mb-5">
4-
<div class="card h-100 shadow border-0">
5-
<!--la imagen-->
6-
<img class="card-img-top" [src]="newsImage()" alt="..." />
7-
<div class="card-body p-4">
8-
<div class="badge bg-primary bg-gradient rounded-pill mb-2">{{news?.badge}}</div>
9-
<a class="text-decoration-none link-dark stretched-link" [routerLink]="['/showNews/{{news?.id}}']">
10-
<h5 class="card-title mb-3" style="color: black;">{{news?.title}}</h5>
11-
</a>
12-
<p class="card-text mb-0">{{news?.description}}</p>
13-
</div>
14-
<div class="card-footer p-4 pt-0 bg-transparent border-top-0">
15-
<div class="d-flex align-items-end justify-content-between">
16-
<div class="d-flex align-items-center">
17-
<div class="small">
18-
<div class="text-muted">{{news?.date}} &middot; <p>{{news?.readTime}}</p>
19-
</div>
1+
<!--llamamos a news de tipo News, cargamos el constructor-->
2+
<div class="col-lg-4 mb-5">
3+
<div class="card h-100 shadow border-0">
4+
<!--la imagen-->
5+
<img class="card-img-top" [src]="newsImage()" alt="..." />
6+
<div class="card-body p-4">
7+
<div class="badge bg-primary bg-gradient rounded-pill mb-2">{{news?.badge}}</div>
8+
<a class="text-decoration-none link-dark stretched-link" (click)="goToNew()">
9+
<h5 class="card-title mb-3" style="color: black;">{{news?.title}}</h5>
10+
</a>
11+
<p class="card-text mb-0">{{news?.description}}</p>
12+
</div>
13+
<div class="card-footer p-4 pt-0 bg-transparent border-top-0">
14+
<div class="d-flex align-items-end justify-content-between">
15+
<div class="d-flex align-items-center">
16+
<div class="small">
17+
<div class="text-muted">{{news?.date}} &middot; <p>{{news?.readTime}}</p>
2018
</div>
2119
</div>
2220
</div>
2321
</div>
2422
</div>
2523
</div>
2624
</div>
25+

‎frontend/src/app/components/news/newsTemplate.component.ts‎

Lines changed: 17 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Component } from '@angular/core';
1+
import { Component, Input } from '@angular/core';
22
import { Router, ActivatedRoute } from '@angular/router';
33

44
import { News } from 'src/app/models/news.model';
@@ -10,21 +10,24 @@ import { NewsService } from 'src/app/services/news.service';
1010
templateUrl: './newsTemplate.component.html'
1111
})
1212

13-
13+
//const id = activatedRoute.snapshot.params['id'];
1414
export class NewsTemplateComponent{
1515

16-
news!: News;
17-
18-
constructor(public newsService: NewsService, activatedRoute: ActivatedRoute){
16+
@Input()id!: number;
17+
news!: News;
1918

20-
const id = activatedRoute.snapshot.params['id'];
21-
this.newsService.getNew(id).subscribe(
22-
(news) => this.news = news as News,
23-
(error: any) => console.error(error)
19+
constructor(public newsService: NewsService, activatedRoute: ActivatedRoute, private router: Router){
2420

25-
);
2621
}
2722

23+
ngOnInit(){
24+
this.newsService.getNew(this.id).subscribe(
25+
(news) => this.news = news as News,
26+
(error: any) => console.error(error)
27+
28+
);
29+
30+
}
2831

2932

3033

@@ -36,6 +39,10 @@ export class NewsTemplateComponent{
3639
}
3740
}
3841

42+
goToNew() {
43+
this.router.navigate(['/showNews/'+this.news.id]);
44+
}
45+
3946
/*getNewsBadge(){
4047
if(this.news){
4148
return this.news?.badge

‎frontend/src/app/components/user/userProfile.component.html‎

Lines changed: 66 additions & 65 deletions
Original file line numberDiff line numberDiff line change
@@ -1,77 +1,78 @@
1+
<div *ngIf="user" class="container rounded bg-white mt-5 mb-5">
2+
<div class="row">
3+
<div class="col-md-3 border-right">
4+
<div class="d-flex flex-column align-items-center text-center p-3 py-5"><img class="rounded-circle mt-5"
5+
width="150px" [src]="userImage()"><span class="font-weight-bold">"{{user.nick}}"</span><span
6+
class="text-black-50">"{{user.email}}"</span><span>
7+
</span>
8+
<button (click)="save()">Save</button>
9+
<button (click)="cancel()">Cancel</button>
10+
</div>
11+
</div>
112

2-
<div *ngIf="user" class="container rounded bg-white mt-5 mb-5">
3-
<div class="row">
4-
<div class="col-md-3 border-right">
5-
<div class="d-flex flex-column align-items-center text-center p-3 py-5"><img
6-
class="rounded-circle mt-5" width="150px" [src]="userImage()"><span
7-
class="font-weight-bold">"{{user.nick}}"</span><span class="text-black-50">"{{user.email}}"</span><span>
8-
</span>
9-
<button (click)="save()">Save</button>
10-
<button (click)="cancel()">Cancel</button>
11-
</div>
12-
</div>
13+
<div class="col-md-5 border-right">
14+
<div class="p-3 py-5">
15+
<form *ngIf="user">
16+
<div class="d-flex justify-content-between align-items-center mb-3">
17+
<h4 class="text-right">Mi perfil: "{{user.nick}}"</h4>
18+
</div>
19+
<div class="row mt-2">
20+
<div class="col-md-6"><label class="labels">Nombre</label>
21+
<h3>"{{user.name}}"</h3>
22+
</div>
23+
<div class="col-md-6"><label class="labels">Apellido(s)</label>
24+
<h3>"{{user.lastName}}"</h3>
25+
</div>
26+
</div>
27+
<div class="row mt-3">
1328

14-
<div class="col-md-5 border-right">
15-
<div class="p-3 py-5">
16-
<form *ngIf="user">
17-
<div class="d-flex justify-content-between align-items-center mb-3">
18-
<h4 class="text-right">Mi perfil: "{{user.nick}}"</h4>
19-
</div>
20-
<div class="row mt-2">
21-
<div class="col-md-6"><label class="labels">Nombre</label>
22-
<h3>"{{user.name}}"</h3>
23-
</div>
24-
<div class="col-md-6"><label class="labels">Apellido(s)</label>
25-
<h3>"{{user.lastName}}"</h3>
26-
</div>
27-
</div>
28-
<div class="row mt-3">
29+
<div class="col-md-12"><label class="labels">Nombre de usuario</label>
30+
<input name="nick" type="text" class="form-control" placeholder="RodPerez" [(ngModel)]="user.nick">
31+
</div>
2932

30-
<div class="col-md-12"><label class="labels">Nombre de usuario</label>
31-
<input name="nick" type="text" class="form-control" placeholder="RodPerez" [(ngModel)]="user.nick">
32-
</div>
33+
<div class="col-md-12"><label class="labels">Email</label>
34+
<input name="email" type="email" class="form-control" placeholder="[email protected]"
35+
[(ngModel)]="user.email">
36+
</div>
3337

34-
<div class="col-md-12"><label class="labels">Email</label>
35-
<input name="email" type="email" class="form-control" placeholder="[email protected]" [(ngModel)]="user.email">
36-
</div>
3738

39+
<div class="col-md-12"><label class="labels">Número de tarjeta</label>
40+
<input *ngIf="user.creditCard" name="creditCard" type="text" class="form-control" placeholder="123456789A"
41+
[(ngModel)]="user.creditCard">
42+
</div>
3843

39-
<div class="col-md-12"><label class="labels">Número de tarjeta</label>
40-
<input *ngIf="user.creditCard" name="creditCard" type="text" class="form-control" placeholder="123456789A" [(ngModel)]="user.creditCard">
41-
</div>
44+
<div class="col-md-12">
45+
<p>Imagen de perfil</p>
46+
<input #file type='file' name='imageField' accept=".jpg, .jpeg, .png, .svg" />
47+
</div>
4248

43-
<div class="col-md-12">
44-
<p>Imagen de perfil</p>
45-
<input #file type='file' name='imageField' accept=".jpg, .jpeg, .png, .svg" />
46-
</div>
49+
</div>
50+
</form>
51+
</div>
4752

48-
</div>
49-
</form>
50-
</div>
53+
<div class="mt-5 text-center">
54+
</div>
55+
</div>
5156

52-
<div class="mt-5 text-center">
53-
</div>
57+
</div>
58+
<div class="col-md-4">
59+
<div class="p-3 py-5">
60+
<h4 *ngIf="videogame" class="text-right">Mis compras:</h4>
61+
<div *ngFor="let vg of videogame" class="d-flex justify-content-between align-items-center mb-3">
62+
<ul>
63+
<li>
64+
<div class="row">
65+
<div class="col-md-4">
66+
<img class="img-fluid rounded-3 my-5" [src]="videogameImage(vg)" />
5467
</div>
55-
56-
</div>
57-
<div class="col-md-4">
58-
<div class="p-3 py-5">
59-
<h4 *ngIf="videogame" class="text-right">Mis compras:</h4>
60-
<div *ngFor="let vg of videogame" class="d-flex justify-content-between align-items-center mb-3">
61-
<ul>
62-
<li>
63-
<div class="row">
64-
<div class="col-md-4">
65-
<img class="img-fluid rounded-3 my-5" [src]="videogameImage(vg)"/>
66-
</div>
67-
<div class="col-md-8 align-self-center">
68-
<p>"{{vg.title}}"</p>
69-
</div>
70-
</div>
71-
</li>
72-
</ul>
73-
</div>
68+
<div class="col-md-8 align-self-center">
69+
<p>"{{vg.title}}"</p>
7470
</div>
75-
</div>
71+
</div>
72+
</li>
73+
</ul>
7674
</div>
77-
<button class="btn btn-primary profile-button m-3" (click)="logOut()" type="button">Log Out</button>
75+
</div>
76+
</div>
77+
</div>
78+
<button class="btn btn-primary profile-button m-3" (click)="logOut()" type="button">Log Out</button>

‎frontend/src/app/services/news.service.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,10 +24,10 @@ export class NewsService {
2424
)
2525
}
2626

27-
getNew(id: number) {
27+
getNew(id: number): Observable<any> {
2828
return this.httpClient.get(URL + id).pipe(
2929
catchError((error: any) => this.handleError(error))
30-
)
30+
) as Observable<any>
3131
}
3232

3333
createNew(news: News) {

0 commit comments

Comments
 (0)