Skip to content

Commit 2b66a70

Browse files
committed
Libraries modified
- multiple select (bootstrap select) Spinners added in views service with generic request
1 parent 6bedc74 commit 2b66a70

File tree

12 files changed

+158
-32
lines changed

12 files changed

+158
-32
lines changed

package-lock.json

Lines changed: 14 additions & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,7 @@
1919
"@angular/platform-browser": "~8.1.0",
2020
"@angular/platform-browser-dynamic": "~8.1.0",
2121
"@angular/router": "~8.1.0",
22+
"@types/jquery": "^3.3.31",
2223
"rxjs": "~6.4.0",
2324
"tslib": "^1.9.0",
2425
"zone.js": "~0.9.1"

src/app/components/authors/authors.component.html

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,8 +43,11 @@ <h5 class="card-title">{{card.title}}</h5>
4343
</div>
4444

4545

46+
<div class="spinner-border text-primary" role="status" *ngIf="!isLoaded">
47+
<span class="sr-only">Loading...</span>
48+
</div>
4649

47-
<div class="col-lg-12">
50+
<div class="col-lg-12" *ngIf="isLoaded">
4851
<table class="table">
4952
<thead>
5053
<tr>

src/app/components/authors/authors.component.ts

Lines changed: 25 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,8 @@ export class AuthorsComponent implements OnInit {
2222
title: ''
2323
};
2424

25+
isLoaded = false;
26+
2527
constructor(protected service: DataService, protected fb: FormBuilder) {
2628

2729
this.authorForm = this.fb.group({
@@ -38,7 +40,9 @@ export class AuthorsComponent implements OnInit {
3840
this.authors = data as Author[];
3941
}, (error) => {
4042
this.msgText = error.message;
41-
} );
43+
}, () => {
44+
this.isLoaded = true;
45+
});
4246

4347
}
4448

@@ -77,13 +81,31 @@ export class AuthorsComponent implements OnInit {
7781
() => {this.reloadData()});
7882
}
7983

80-
8184
this.option = 'Send';
8285
}
8386

8487
reloadData(){
88+
this.resetItems();
89+
this.service.getAuthors().subscribe((data) => {
90+
this.authors = data as Author[]
91+
}, (error) => {
92+
this.msgText = error.message;
93+
}, () => {
94+
this.isLoaded = true;
95+
});
96+
}
97+
98+
resetItems(){
8599
this.authors = [];
86-
this.service.getAuthors().subscribe((data) => {this.authors = data as Author[]}, (error) => {this.msgText = error.message;});
100+
this.isLoaded = false;
101+
this.card = {
102+
title: ''
103+
};
104+
105+
this.authorForm = this.fb.group({
106+
id: null,
107+
name: ''
108+
});
87109
}
88110

89111
}

src/app/components/books/books.component.html

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -64,8 +64,11 @@ <h5 class="card-title">{{card.title}}</h5>
6464
</div>
6565

6666

67+
<div class="spinner-border text-primary" role="status" *ngIf="!isLoaded">
68+
<span class="sr-only">Loading...</span>
69+
</div>
6770

68-
<div class="col-lg-12">
71+
<div class="col-lg-12" *ngIf="isLoaded">
6972
<table class="table">
7073
<thead>
7174
<tr>

src/app/components/books/books.component.ts

Lines changed: 26 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ export class BooksComponent implements OnInit {
2424
desc: '',
2525
};
2626

27+
isLoaded = false;
2728

2829
constructor(protected service: DataService, protected fb: FormBuilder) {
2930

@@ -42,7 +43,9 @@ export class BooksComponent implements OnInit {
4243
this.books = data as Book[];
4344
}, (error) => {
4445
this.msgText = error.message;
45-
} );
46+
}, () =>{
47+
this.isLoaded = true;
48+
});
4649
this.service.getAuthors().subscribe((data) => {
4750
this.authors = data as Author[];
4851
});
@@ -90,8 +93,29 @@ export class BooksComponent implements OnInit {
9093
}
9194

9295
reloadData(){
96+
this.resetItems();
97+
this.service.getBooks().subscribe((data) => {
98+
this.books = data as Book[]
99+
}, (error) => {
100+
this.msgText = error.message;
101+
}, () => {
102+
this.isLoaded = true;
103+
});
104+
}
105+
106+
resetItems(){
93107
this.books = [];
94-
this.service.getBooks().subscribe((data) => {this.books = data as Book[]}, (error) => {this.msgText = error.message;});
108+
this.isLoaded = false;
109+
this.card = {
110+
title: '',
111+
desc: '',
112+
};
113+
114+
this.bookForm = this.fb.group({
115+
id: null,
116+
title: '',
117+
author: null
118+
});
95119
}
96120

97121
}

src/app/components/libraries/libraries.component.html

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -31,14 +31,14 @@ <h1>Libraries</h1>
3131
</div>
3232
</div>
3333

34-
<!--
3534
<div class="form-group row">
36-
<label for="inputAuthor3" class="col-sm-2 col-form-label">Author</label>
37-
<div class="col-sm-8">
38-
<input type="text" class="form-control" id="inputAuthor3" formControlName="author" placeholder="Author Id">
35+
<label for="inputBooks" class="col-sm-2 col-form-label">Books</label>
36+
<div class="col-sm-8" >
37+
<select id="inputBooks" class="form-control selectpicker" multiple formControlName="books">
38+
<option *ngFor="let book of books">{{book.title}}</option>
39+
</select>
3940
</div>
4041
</div>
41-
-->
4242

4343
<div class="form-group row">
4444
<div class="col-sm-12">
@@ -58,9 +58,11 @@ <h5 class="card-title">{{card.title}}</h5>
5858

5959
</div>
6060

61+
<div class="spinner-border text-primary" role="status" *ngIf="!isLoaded">
62+
<span class="sr-only">Loading...</span>
63+
</div>
6164

62-
63-
<div class="col-lg-12">
65+
<div class="col-lg-12" *ngIf="isLoaded">
6466
<table class="table">
6567
<thead>
6668
<tr>

src/app/components/libraries/libraries.component.ts

Lines changed: 47 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { Component, OnInit } from '@angular/core';
22
import {FormBuilder, FormGroup} from '@angular/forms';
33
import {DataService} from '../../services/data.service';
4-
import {Library} from '../../models/models.model';
4+
import {Book, Library} from '../../models/models.model';
55

66
@Component({
77
selector: 'app-libraries',
@@ -13,6 +13,7 @@ export class LibrariesComponent implements OnInit {
1313
msgText: string;
1414

1515
libraries: object = [];
16+
books: object = [];
1617

1718
libraryForm: FormGroup;
1819

@@ -23,6 +24,7 @@ export class LibrariesComponent implements OnInit {
2324
desc: '',
2425
};
2526

27+
isLoaded = false;
2628

2729
constructor(protected service: DataService, protected fb: FormBuilder) {
2830

@@ -37,12 +39,32 @@ export class LibrariesComponent implements OnInit {
3739

3840
ngOnInit() {
3941

42+
this.service.getBooks().subscribe((data) => {
43+
console.log(data);
44+
this.books = data as Book[];
45+
}, (error) => {
46+
this.msgText = error.message;
47+
}, () => {
48+
setTimeout(() => {
49+
// @ts-ignore
50+
$('.selectpicker').selectpicker('refresh');
51+
});
52+
});
53+
4054
this.service.getLibraries().subscribe((data) => {
4155
console.log(data);
4256
this.libraries = data as Library[];
4357
}, (error) => {
4458
this.msgText = error.message;
45-
} );
59+
}, () => {
60+
this.isLoaded = true;
61+
});
62+
63+
}
64+
65+
refreshSelect() {
66+
// @ts-ignore
67+
$('.selectpicker').selectpicker('refresh');
4668
}
4769

4870
showLibrary(library){
@@ -88,8 +110,30 @@ export class LibrariesComponent implements OnInit {
88110
}
89111

90112
reloadData(){
113+
this.resetItems();
114+
this.service.getLibraries().subscribe((data) => {
115+
this.libraries = data as Library[]
116+
}, (error) => {
117+
this.msgText = error.message;
118+
}, () => {
119+
this.isLoaded = true;
120+
});
121+
}
122+
123+
resetItems(){
91124
this.libraries = [];
92-
this.service.getLibraries().subscribe((data) => {this.libraries = data as Library[]}, (error) => {this.msgText = error.message;});
125+
this.isLoaded = false;
126+
this.card = {
127+
title: '',
128+
desc: '',
129+
};
130+
131+
this.libraryForm = this.fb.group({
132+
id: null,
133+
name: '',
134+
address: '',
135+
books: []
136+
});
93137
}
94138

95139
}
Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +0,0 @@
1-
.msg{
2-
background-color: #e74c3c;
3-
color: white;
4-
}
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11

2-
<div class="msg">
2+
<div class="alert alert-secondary" role="alert" *ngIf="msgText">
33
<h1>{{msgText}}</h1>
44
</div>
55

0 commit comments

Comments
 (0)