Commit 0112af7b authored by Smejky338's avatar Smejky338
Browse files

Merge remote-tracking branch 'origin/main' into feat/assignment-create-confirmation

parents 64a24b2c ac18420f
......@@ -9,10 +9,14 @@ import { MatDividerModule } from '@angular/material/divider';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input';
import { MatListModule } from '@angular/material/list';
import { MatSelectModule } from '@angular/material/select';
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatTableModule } from '@angular/material/table';
import { MatToolbarModule } from '@angular/material/toolbar';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { AgentDetailComponent } from './agent/agent-detail.component';
import { AgentListComponent } from './agent/agent-list.component';
import { EditAgentComponent } from './agent/edit-agent.component';
......@@ -64,8 +68,11 @@ import {AssignmentListComponent} from "./assignment/assignment-list.component";
MatFormFieldModule,
MatIconModule,
MatInputModule,
MatListModule,
MatSelectModule,
MatSidenavModule,
MatTableModule,
MatToolbarModule,
ReactiveFormsModule,
FormsModule,
MatSelectModule,
......@@ -79,4 +86,4 @@ import {AssignmentListComponent} from "./assignment/assignment-list.component";
providers: [],
bootstrap: [AppComponent],
})
export class AppModule {}
export class AppModule { }
<div class="w-full bg-black h-20 text-white shadow-xl flex mb-4">
<button mat-icon-button routerLink="/auth">
<mat-icon>home</mat-icon>
</button>
<div>Secret archive</div>
<button mat-icon-button routerLink="/" (click)="logOut()">
<mat-icon>logout</mat-icon>
</button>
</div>
<router-outlet></router-outlet>
<mat-drawer-container class="h-full" autosize>
<mat-drawer #drawer mode="over">
<div class="w-72 h-48 flex flex-col justify-end">
<h2 class="px-4">Secret archive</h2>
</div>
<mat-divider></mat-divider>
<mat-action-list>
<mat-list-item mat-button routerLink="/auth">
<mat-icon matListIcon>home</mat-icon>
Home
</mat-list-item>
<mat-list-item mat-button>
<mat-icon matListIcon>settings</mat-icon>
Settings
</mat-list-item>
<mat-list-item mat-button>
<mat-icon matListIcon>support</mat-icon>
<span>Help</span>
</mat-list-item>
<mat-list-item mat-button>
<mat-icon matListIcon>info</mat-icon>
<span>About</span>
</mat-list-item>
<mat-divider></mat-divider>
<mat-list-item mat-button routerLink="/" (click)="logOut()">
<mat-icon matListIcon>logout</mat-icon>
Logout
</mat-list-item>
</mat-action-list>
</mat-drawer>
<mat-toolbar color="primary" class="sticky inset-x-0 top-0 w-full bg-black h-20 text-white shadow-lg flex">
<div class="example-sidenav-content">
<button type="button" mat-icon-button (click)="drawer.toggle()">
<mat-icon>menu</mat-icon>
</button>
</div>
<span>Secret archive</span>
<span class="flex-1"></span>
</mat-toolbar>
<router-outlet></router-outlet>
<mat-toolbar color="primary" class="fixed inset-x-0 bottom-0 flex flex-row justify-around">
<button color="primary" mat-flat-button routerLink="/auth/missions" routerLinkActive="!font-bold">
<mat-icon class="material-icons">check_circle</mat-icon>
<span class="block leading-tight">Missions</span>
</button>
<button color="primary" mat-flat-button routerLink="/auth/agents" routerLinkActive="!font-bold">
<mat-icon class="material-icons">face</mat-icon>
<span class="block leading-tight">Agents</span>
</button>
<button color="primary" mat-flat-button routerLink="/auth/countries" routerLinkActive="!font-bold">
<mat-icon class="material-icons">flag</mat-icon>
<span class="block leading-tight !text-grey-400">Countries</span>
</button>
</mat-toolbar>
</mat-drawer-container>
<div *ngIf="state === requestState.ERROR">
Error occured: {{ errorMessage }}
</div>
<div *ngIf="country && state === requestState.SUCCESS">
<div>Special agent record</div>
<mat-form-field appearance="fill">
<mat-label>Name</mat-label>
<input matInput [disabled]="!editing" [(ngModel)]="country.name" />
</mat-form-field>
<mat-form-field class="example-full-width" appearance="fill">
<mat-label>Geography:</mat-label>
<textarea
matInput
[(ngModel)]="country.geography"
[disabled]="!editing"
></textarea>
</mat-form-field>
<mat-form-field class="example-full-width" appearance="fill">
<mat-label>Code:</mat-label>
<textarea
matInput
[(ngModel)]="country.code"
[disabled]="!editing"
></textarea>
</mat-form-field>
<mat-form-field class="example-full-width" appearance="fill">
<mat-label>Demographics:</mat-label>
<textarea
matInput
[(ngModel)]="country.demographics"
[disabled]="!editing"
></textarea>
</mat-form-field>
<mat-form-field class="example-full-width" appearance="fill">
<mat-label>Geography:</mat-label>
<textarea
matInput
[(ngModel)]="country.geography"
[disabled]="!editing"
></textarea>
</mat-form-field>
<mat-form-field class="example-full-width" appearance="fill">
<mat-label>Communications:</mat-label>
<textarea
matInput
[(ngModel)]="country.communications"
[disabled]="!editing"
></textarea>
</mat-form-field>
<mat-form-field class="example-full-width" appearance="fill">
<mat-label>Government:</mat-label>
<textarea
matInput
[(ngModel)]="country.government"
[disabled]="!editing"
></textarea>
</mat-form-field>
<mat-form-field class="example-full-width" appearance="fill">
<mat-label>Economy:</mat-label>
<textarea
matInput
[(ngModel)]="country.economy"
[disabled]="!editing"
></textarea>
</mat-form-field>
<mat-form-field class="example-full-width" appearance="fill">
<mat-label>Military:</mat-label>
<textarea
matInput
[(ngModel)]="country.military"
[disabled]="!editing"
></textarea>
</mat-form-field>
<!-- code: string;
code: string;
name: string;
demographics: string;
geography: string;
communications: string;
government: string;
economy: string;
military: string; -->
<!-- <div>
<table mat-table [dataSource]="agent.skills" class="mat-elevation-z8">
<ng-container matColumnDef="skill">
<th mat-header-cell *matHeaderCellDef>Skills</th>
<td mat-cell *matCellDef="let skill">{{ skill }}</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedSkillColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedSkillColumns"></tr>
</table>
<div *ngIf="country && state === requestState.SUCCESS" class="flex flex-col max-w-xl m-auto p-4">
<div *ngIf="!editing">
<h1>{{ country.name}}</h1>
<h3 class="!m-0">Code</h3>
<p>{{ country.code}}</p>
<h3 class="!m-0">Demographics</h3>
<p>{{ country.demographics}}</p>
<h3 class="!m-0">Geography</h3>
<p>{{ country.geography}}</p>
<h3 class="!m-0">Communications</h3>
<p>{{ country.communications}}</p>
<h3 class="!m-0">Economy</h3>
<p>{{ country.economy}}</p>
<h3 class="!m-0">Military</h3>
<p>{{ country.military}}</p>
</div>
<div>
<table mat-table [dataSource]="agent.codenames" class="mat-elevation-z8">
<ng-container matColumnDef="codename">
<th mat-header-cell *matHeaderCellDef>Codenames</th>
<td mat-cell *matCellDef="let codename">{{ codename }}</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedCodeNameColumns"></tr>
<tr mat-row *matRowDef="let row; columns: displayedCodeNameColumns"></tr>
</table>
</div> -->
</div>
<div>
<button mat-button *ngIf="!editing" (click)="setEditing(true)">Edit</button>
<button mat-button *ngIf="editing" (click)="setEditing(false)">Save</button>
<div *ngIf="editing" class="flex flex-col">
<mat-form-field>
<mat-label>Name</mat-label>
<input matInput [(ngModel)]="country.name" />
</mat-form-field>
<mat-form-field>
<mat-label>Code</mat-label>
<textarea matInput [(ngModel)]="country.code"></textarea>
</mat-form-field>
<mat-form-field>
<mat-label>Geography</mat-label>
<textarea matInput [(ngModel)]="country.geography"></textarea>
</mat-form-field>
<mat-form-field>
<mat-label>Demographics</mat-label>
<textarea matInput [(ngModel)]="country.demographics"></textarea>
</mat-form-field>
<mat-form-field>
<mat-label>Geography</mat-label>
<textarea matInput [(ngModel)]="country.geography"></textarea>
</mat-form-field>
<mat-form-field>
<mat-label>Communications</mat-label>
<textarea matInput [(ngModel)]="country.communications"></textarea>
</mat-form-field>
<mat-form-field>
<mat-label>Government</mat-label>
<textarea matInput [(ngModel)]="country.government"></textarea>
</mat-form-field>
<mat-form-field>
<mat-label>Economy</mat-label>
<textarea matInput [(ngModel)]="country.economy"></textarea>
</mat-form-field>
<mat-form-field>
<mat-label>Military</mat-label>
<textarea matInput [(ngModel)]="country.military"></textarea>
</mat-form-field>
</div>
<button color="accent" *ngIf="!editing" mat-fab (click)="setEditing(true)" class="!fixed right-8 bottom-20"
aria-label="Example icon button with a delete icon">
<mat-icon>edit</mat-icon>
</button>
<button color="accent" *ngIf="editing" mat-fab (click)="setEditing(false)" class="!fixed right-8 bottom-20"
aria-label="Example icon button with a delete icon">
<mat-icon>done</mat-icon>
</button>
</div>
<div *ngIf="state === requestState.ERROR">
Error occured: {{ errorMessage }}
</div>
<div *ngIf="state === requestState.SUCCESS" class="w-full">
<table mat-table [dataSource]="countries" class="mat-elevation-z8">
<ng-container matColumnDef="name">
<th mat-header-cell *matHeaderCellDef>Name</th>
<td mat-cell *matCellDef="let agent">{{ agent.name }}</td>
</ng-container>
<div *ngIf="state === requestState.SUCCESS" class="max-w-xl m-auto">
<mat-action-list>
<mat-list-item *ngFor="let country of countries" [routerLink]="['/auth/country/', country.id]">
<p matLine class="!text-xs !tracking-widest capitalize"> {{country.code}} </p>
<p matLine> {{country.name}} </p>
<mat-divider></mat-divider>
</mat-list-item>
</mat-action-list>
<ng-container matColumnDef="detail">
<th mat-header-cell *matHeaderCellDef>Detail</th>
<td mat-cell *matCellDef="let country">
<a [routerLink]="['/country', country.id]"
><mat-icon aria-label="Detail">info</mat-icon></a
>
</td>
</ng-container>
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
<tr
mat-row
routerLink="../country/{{ 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>
......@@ -8,6 +8,7 @@ import { Country } from './country.interface';
interface CountryTableItem {
id: string;
name: string;
code: string;
}
@Component({
......
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