Commit 3fbd78ef authored by Juraj Fiala's avatar Juraj Fiala
Browse files

feat: Use list for missions

parent fdbae058
<div *ngIf="state === requestState.ERROR">
Error occured: {{ errorMessage }}
</div>
<div *ngIf="state === requestState.SUCCESS">
<table mat-table [dataSource]="missions" class="w-full">
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef>Name</th>
<td mat-cell *matCellDef="let mission">
{{ mission.name }}
</td>
</ng-container>
<div *ngIf="state === requestState.SUCCESS" class="main-container">
<mat-action-list>
<mat-list-item *ngFor="let mission of missions" [routerLink]="['/auth/mission/', mission.id]">
<p matLine class="!text-xs !tracking-widest uppercase"> {{mission.country.name}} </p>
<p matLine> {{mission.name}} </p>
<mat-divider></mat-divider>
</mat-list-item>
</mat-action-list>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr
mat-row
class="hover:bg-gray-200"
routerLink="../mission/{{ row.id }}"
*matRowDef="let row; columns: displayedColumns"
></tr>
</table>
<button mat-fab color="accent" class="!fixed right-8 bottom-20" aria-label="Example icon button with a delete icon">
<mat-icon>add</mat-icon>
</button>
</div>
......@@ -6,11 +6,6 @@ import { environment } from '../../environments/environment';
import { RequestState } from '../request-state.enum';
import { Mission } from './mission.interface';
interface MissionTableItem {
id: string;
name: string;
}
@Component({
selector: 'mission-list',
templateUrl: 'mission-list.component.html',
......@@ -19,7 +14,7 @@ export class MissionListComponent implements OnInit {
requestState = RequestState;
state: RequestState = this.requestState.PENDING;
errorMessage = '';
missions: MissionTableItem[] = [];
missions: Mission[] = [];
displayedColumns: string[] = ['name'];
constructor(private httpClient: HttpClient, private router: Router) {}
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment