Skip to content

Commit 12e6626

Browse files
enriquezreneenriquezrene
committed
fix: #249 display activities as table
1 parent 724e91d commit 12e6626

File tree

6 files changed

+62
-74
lines changed

6 files changed

+62
-74
lines changed

‎src/app/modules/activities-management/components/activity-list/activity-list.component.html

Lines changed: 20 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,21 @@
1-
<div class="card-body pt-0 mt-4">
2-
<div class="scroll">
3-
<div class="accordion" id="accordionActivities">
4-
<div *ngIf="activities?.length > 0; else notShow">
5-
<div class="card" *ngFor="let activity of activities; let rowIndex = index">
6-
<div class="card-header style-list-project">
7-
<h2 class="mb-0">
8-
<a type="button" data-toggle="collapse" [attr.data-target]="'#row' + rowIndex">
9-
{{ activity.name }}
10-
</a>
11-
<div class="btn-group float-right" role="group">
12-
<i class="far fa-edit btn btn-link text-white" (click)="updateActivity(activity.id)"></i>
13-
<i (click)="deleteActivity(activity.id)" class="far fa-trash-alt btn btn-link text-white"></i>
14-
</div>
15-
</h2>
16-
</div>
17-
18-
<div [id]="'row' + rowIndex" class="collapse" data-parent="#accordionActivities">
19-
<div class="card-body">
20-
<h5>Description:</h5>
21-
<p>{{ activity.description }}</p>
22-
</div>
23-
</div>
24-
</div>
25-
</div>
26-
<ng-template #notShow>
27-
<app-empty-state></app-empty-state>
28-
</ng-template>
29-
</div>
30-
</div>
1+
<div class="activity-list">
2+
<table class="table table-sm table-bordered table-striped">
3+
<thead class="thead-orange">
4+
<tr class="d-flex">
5+
<th class="col-9">Activity</th>
6+
<th class="col-3 text-center"></th>
7+
</tr>
8+
</thead>
9+
<tbody>
10+
<tr class="d-flex" *ngFor="let activity of activities">
11+
<td class="col-sm-9">{{ activity.name }}</td>
12+
<td class="col-sm-3 text-center">
13+
<button type="button" class="btn btn-sm btn-primary" (click)="updateActivity(activity.id)"><i
14+
class="fa fa-pencil fa-xs"></i></button>
15+
<button type="button" class="btn btn-sm btn-danger ml-2" (click)="deleteActivity(activity.id)"><i
16+
class="fas fa-trash-alt fa-xs"></i></button>
17+
</td>
18+
</tr>
19+
</tbody>
20+
</table>
3121
</div>

‎src/app/modules/activities-management/components/activity-list/activity-list.component.scss

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,5 @@
11
@import '../../../../../styles/colors.scss';
22

3-
.style-list-project {
4-
background-color: $primary;
5-
color: white;
6-
}
7-
8-
.scroll {
9-
max-height: 400px;
10-
overflow-y: auto;
3+
.activity-list {
4+
max-height: 400px; overflow: auto; display:inline-block; width: 60%;
115
}

‎src/app/modules/activities-management/components/create-activity/create-activity.component.html

Lines changed: 21 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,31 @@
1-
<div class="card mt-4">
2-
<form class="card-body" [formGroup]="activityForm" (ngSubmit)="onSubmit(activityForm.value)">
3-
<h1 class="card-title">Activity</h1>
4-
<div class="form-group">
5-
<label for="name">Name:</label>
6-
<input
7-
class="form-control"
8-
id="name"
9-
type="text"
10-
formControlName="name"
11-
[class.is-invalid]="name.invalid && name.touched"
12-
required
13-
/>
1+
<h4>Activities</h4>
2+
<hr/>
3+
<div style="width: 60%;">
4+
5+
<form [formGroup]="activityForm" (ngSubmit)="onSubmit(activityForm.value)">
6+
<div class="input-group input-group-sm mb-3">
7+
<div class="input-group-prepend">
8+
<span class="input-group-text span-width">Name</span>
9+
</div>
10+
<input class="form-control" id="name" type="text" formControlName="name"
11+
[class.is-invalid]="name.invalid && name.touched" required />
1412
<div class="text-danger" *ngIf="(name.dirty || name.touched) && name.invalid && name.errors.required">
1513
Activity name is required.
1614
</div>
1715
</div>
1816

19-
<div class="form-group">
20-
<label for="details">Description:</label>
21-
<textarea class="form-control" rows="3" id="description" type="text" formControlName="description"></textarea>
17+
<div class="input-group input-group-sm mb-3">
18+
<div class="input-group-prepend">
19+
<span class="input-group-text span-width">Description</span>
20+
</div>
21+
<textarea class="form-control" rows="2" id="description" type="text" formControlName="description"></textarea>
2222
</div>
2323

24-
<div class="btn-toolbar" role="toolbar">
25-
<div class="btn-group mr-2" role="group">
26-
<button class="btn btn-primary mb-2" type="submit" [disabled]="!activityForm.valid">Save</button>
27-
</div>
28-
<div class="btn-group mr-2" role="group">
29-
<button class="btn btn-secondary mb-2" type="reset" [hidden]="!activityToEdit" (click)="cancelButton()">
30-
Cancel
31-
</button>
32-
</div>
24+
<div class="form-group" style="text-align: right;">
25+
<button class="btn btn-primary" type="submit" [disabled]="!activityForm.valid">Save</button>
26+
<button class="btn btn-secondary mb-2 ml-2 mt-2" type="reset" [hidden]="!activityToEdit" (click)="cancelButton()">
27+
Cancel
28+
</button>
3329
</div>
3430
</form>
3531
</div>

‎src/app/modules/activities-management/components/create-activity/create-activity.component.scss

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1 +1,11 @@
11
@import '../../../../../styles/colors.scss';
2+
3+
.span-width {
4+
width: 6rem;
5+
background-color: $primary;
6+
color: white;
7+
}
8+
9+
.hidden {
10+
display: none;
11+
}

‎src/app/modules/activities-management/pages/activities-management.component.html

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,4 @@
11
<div class="container">
2-
<div class="row">
3-
<div class="col">
4-
<app-create-activity></app-create-activity>
5-
</div>
6-
<div class="col">
7-
<app-activity-list></app-activity-list>
8-
</div>
9-
</div>
2+
<app-create-activity></app-create-activity>
3+
<app-activity-list></app-activity-list>
104
</div>

‎src/app/modules/time-clock/components/entry-fields/entry-fields.component.html

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -19,14 +19,18 @@
1919
[selectedTechnologies]="selectedTechnologies">
2020
</app-technologies>
2121

22-
<div class="form-group text-left">
23-
<label for="NotesTextarea">Description</label>
22+
23+
<div class="input-group input-group-sm mb-3">
24+
<div class="input-group-prepend">
25+
<span class="input-group-text span-width">Description</span>
26+
</div>
2427
<textarea
2528
(blur)="onSubmit()"
2629
formControlName="description"
2730
class="form-control"
2831
id="NotesTextarea"
29-
rows="3">
32+
rows="2">
3033
</textarea>
3134
</div>
35+
3236
</form>

0 commit comments

Comments
 (0)