Skip to content
GitLab
Projects
Groups
Snippets
Help
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Wendys Racing Horses
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Analytics
Analytics
Repository
Value Stream
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Commits
Open sidebar
tu-wien
Wendys Racing Horses
Commits
3cc36466
Commit
3cc36466
authored
Mar 28, 2020
by
Ivaylo Ivanov
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
US10: Show a list of the owned horses on the owner view page
parent
89e5f798
Changes
4
Hide whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
57 additions
and
12 deletions
+57
-12
frontend/wendys-friends/src/app/component/list-owners/list-owners.component.html
.../src/app/component/list-owners/list-owners.component.html
+1
-0
frontend/wendys-friends/src/app/component/owner/owner.component.html
...ndys-friends/src/app/component/owner/owner.component.html
+24
-10
frontend/wendys-friends/src/app/component/owner/owner.component.ts
...wendys-friends/src/app/component/owner/owner.component.ts
+22
-2
frontend/wendys-friends/src/app/service/owner.service.ts
frontend/wendys-friends/src/app/service/owner.service.ts
+10
-0
No files found.
frontend/wendys-friends/src/app/component/list-owners/list-owners.component.html
View file @
3cc36466
...
...
@@ -29,6 +29,7 @@
<td>
{{ id + 1 }}
</td>
<td>
{{ owner.name }}
</td>
<td>
<a
class=
"btn btn-primary"
href=
"owner/{{ owner.id }}"
><i
class=
"fas fa-external-link-alt"
></i></a>
<a
class=
"btn btn-success"
href=
"owner/{{ owner.id }}/edit"
><i
class=
"fas fa-edit"
></i></a>
<button
class=
"btn btn-danger"
(click)=
"deleteOwner(owner.id, owner.name)"
><i
class=
"fas fa-trash"
></i></button>
</td>
...
...
frontend/wendys-friends/src/app/component/owner/owner.component.html
View file @
3cc36466
...
...
@@ -6,14 +6,28 @@
</div>
<div
class=
"container mt-3"
*ngIf=
"owner"
>
<div
class=
"alert alert-success"
role=
"alert"
>
<h4
class=
"alert-heading"
>
Well done!
</h4>
<p>
Your application is up and running
</p>
<hr>
<p>
This is the name of the owner with id 1 from your backend system:
<span
class=
"font-weight-bold"
>
{{owner.name}}
</span>
</p>
</div>
<h1>
Owner Info for {{ owner.name }}
</h1>
<hr>
<h4>
Horses:
</h4>
<table
class=
"table"
*ngIf=
"horses; else noHorses"
>
<thead>
<tr>
<th
scope=
"col"
>
#
</th>
<th
scope=
"col"
>
Name
</th>
<th
scope=
"col"
>
Actions
</th>
</tr>
</thead>
<tbody>
<tr
*ngFor=
"let horse of horses; let id = index"
>
<td>
{{ id + 1 }}
</td>
<td>
{{ horse.name }}
</td>
<td>
<a
class=
"btn btn-primary"
href=
"horse/{{ horse.id }}"
><i
class=
"fas fa-external-link-alt"
></i></a>
</td>
</tr>
</tbody>
</table>
<ng-template
#noHorses
>
<p>
Owner has no horses assigned.
</p>
</ng-template>
</div>
frontend/wendys-friends/src/app/component/owner/owner.component.ts
View file @
3cc36466
import
{
Component
,
OnInit
}
from
'
@angular/core
'
;
import
{
OwnerService
}
from
'
../../service/owner.service
'
;
import
{
Owner
}
from
'
../../dto/owner
'
;
import
{
ActivatedRoute
}
from
'
@angular/router
'
;
import
{
Horse
}
from
'
src/app/dto/horse
'
;
@
Component
({
selector
:
'
app-owner
'
,
...
...
@@ -12,12 +14,15 @@ export class OwnerComponent implements OnInit {
error
=
false
;
errorMessage
=
''
;
owner
:
Owner
;
horses
:
Array
<
Horse
>
constructor
(
private
ownerService
:
OwnerService
)
{
constructor
(
private
ownerService
:
OwnerService
,
private
route
:
ActivatedRoute
)
{
}
ngOnInit
()
{
this
.
loadOwner
(
1
);
const
ownerId
:
string
=
this
.
route
.
snapshot
.
paramMap
.
get
(
'
id
'
);
this
.
loadOwner
(
parseInt
(
ownerId
));
this
.
loadOwnerHorses
(
parseInt
(
ownerId
));
}
/**
...
...
@@ -42,6 +47,21 @@ export class OwnerComponent implements OnInit {
);
}
/**
* Load the horses of the owner
* @param id of the owner
*/
private
loadOwnerHorses
(
id
:
number
)
{
this
.
ownerService
.
getOwnerHorses
(
id
).
subscribe
(
(
horses
:
Array
<
Horse
>
)
=>
{
this
.
horses
=
horses
;
},
error
=>
{
console
.
log
(
error
);
}
);
}
private
defaultServiceErrorHandling
(
error
:
any
)
{
console
.
log
(
error
);
this
.
error
=
true
;
...
...
frontend/wendys-friends/src/app/service/owner.service.ts
View file @
3cc36466
...
...
@@ -3,6 +3,7 @@ import {HttpClient, HttpParams} from '@angular/common/http';
import
{
Globals
}
from
'
../global/globals
'
;
import
{
Observable
}
from
'
rxjs
'
;
import
{
Owner
}
from
'
../dto/owner
'
;
import
{
Horse
}
from
'
../dto/horse
'
;
@
Injectable
({
providedIn
:
'
root
'
...
...
@@ -40,6 +41,15 @@ export class OwnerService {
return
this
.
httpClient
.
get
<
Array
<
Owner
>>
(
this
.
messageBaseUri
,
{
params
:
filter
});
}
/**
* Load all horses, owned by the specified owner, from the backend
* @param id
*/
getOwnerHorses
(
id
:
number
):
Observable
<
Array
<
Horse
>>
{
console
.
log
(
'
Load all horses for owner
'
+
id
);
return
this
.
httpClient
.
get
<
Array
<
Horse
>>
(
this
.
messageBaseUri
+
'
/
'
+
id
+
'
/horses
'
);
}
/**
* Adds a specific owner to the backend and loads it if successful
* @param owner
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment