opt-cc/static/src/app/army/army-member/army-member.component.html

60 lines
2.6 KiB
HTML

<div class="army-member-view">
<div class="army-member-view-container">
<div class="return-button">
<button mat-raised-button (click)="backToOverview()">
<mat-icon svgIcon="chevron-left"></mat-icon>
{{'public.army.member.button.back' | translate}}
</button>
</div>
<h3 class="text-center" style="font-weight: 600"
[style.color]="user.squadId?.fraction === 'BLUFOR' ? fraction.COLOR_BLUFOR : fraction.COLOR_OPFOR">
{{'public.army.member.headline' | translate:{name: user.username} }}
</h3>
<div class="text-center">
<img src="{{signatureUrl}}">
</div>
<div class="input-group" style="width: 662px; margin: auto;">
<input type="text" style="background: white;" class="form-control" [(ngModel)]="signatureUrl" readonly>
<span class="input-group-btn">
<button class="btn btn-default" [class.btn-success]="isCopied" type="button"
ngxClipboard [cbContent]="signatureUrl" (cbOnSuccess)="isCopied = true">
{{'public.army.member.button.copy' | translate}}
</button>
</span>
</div>
<div class="pull-left" class="table-container">
<mat-table [dataSource]="awards" class="mat-elevation-z8">
<ng-container matColumnDef="award-graphics">
<mat-header-cell *matHeaderCellDef></mat-header-cell>
<mat-cell *matCellDef="let element">
<img src="resource/decoration/{{element.decorationId._id}}.png">
</mat-cell>
</ng-container>
<ng-container matColumnDef="title">
<mat-header-cell *matHeaderCellDef>{{'public.army.member.awards.title' | translate}}</mat-header-cell>
<mat-cell *matCellDef="let element">{{element.decorationId.name}}</mat-cell>
</ng-container>
<ng-container matColumnDef="reason">
<mat-header-cell *matHeaderCellDef>{{'public.army.member.awards.reason' | translate}}</mat-header-cell>
<mat-cell *matCellDef="let element">{{element.reason}}</mat-cell>
</ng-container>
<ng-container matColumnDef="date">
<mat-header-cell *matHeaderCellDef>{{'public.army.member.awards.date' | translate}}</mat-header-cell>
<mat-cell *matCellDef="let element">
<span class="small text-nowrap">{{element.date | date: 'dd.MM.yyyy'}}</span>
</mat-cell>
</ng-container>
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
<mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
</mat-table>
</div>
</div>
</div>