* button label changed to "select" to reflect that no upload is actually happening at that point
46 lines
2.3 KiB
HTML
46 lines
2.3 KiB
HTML
<form class="awardee-form" (ngSubmit)="saveAwardee()">
|
|
<mat-form-field class="full-width">
|
|
<input name="name" type="text" matInput placeholder="Display name" [(ngModel)]="awardee.name">
|
|
</mat-form-field>
|
|
<div class="image-preview-zone">
|
|
<img [src]="profileImage" class="profile-image mat-elevation-z10" [class.tobe-replaced]="rawProfileImage"
|
|
*ngIf="awardee.hasProfileImage" [matTooltip]="existingProfileTooltip">
|
|
<img [src]="rawProfileImage" class="profile-image mat-elevation-z10 clickable" *ngIf="rawProfileImage"
|
|
(click)="undoImageSelect(profileImageUpload)" matTooltip="Cancel this change">
|
|
</div>
|
|
<input #profileImageUpload id="profileImageUpload" type="file" accept="image/*" hidden (change)="profileImageSelectionChange()">
|
|
<label for="profileImageUpload" class="mat-raised-button">
|
|
<i class="far fa-image"></i> Select profile image
|
|
</label>
|
|
|
|
<mat-divider></mat-divider>
|
|
<mat-form-field class="full-width">
|
|
<mat-select name="year" placeholder="Year" [(ngModel)]="awardee.year">
|
|
<mat-option *ngFor="let year of years" [value]="year">{{ year }}</mat-option>
|
|
</mat-select>
|
|
</mat-form-field>
|
|
|
|
<mat-form-field class="full-width">
|
|
<textarea name="text" matInput placeholder="Article text" rows="10" [(ngModel)]="awardee.text"></textarea>
|
|
</mat-form-field>
|
|
<div class="image-preview-zone">
|
|
<img [src]="awardImage" class="award-image mat-elevation-z10" [class.tobe-replaced]="rawAwardImage"
|
|
*ngIf="awardee.hasAwardImage" [matTooltip]="existingAwardTooltip">
|
|
<img [src]="rawAwardImage" class="award-image mat-elevation-z10 clickable" *ngIf="rawAwardImage"
|
|
(click)="undoImageSelect(awardImageUpload)" matTooltip="Cancel this change">
|
|
</div>
|
|
<input #awardImageUpload id="awardImageUpload" type="file" accept="image/*" hidden (change)="awardImageSelectionChange()">
|
|
<label for="awardImageUpload" class="mat-raised-button">
|
|
<i class="far fa-image"></i> Select article image
|
|
</label>
|
|
<mat-divider></mat-divider>
|
|
|
|
<mat-form-field class="full-width">
|
|
<input name="imageLabel" type="text" matInput placeholder="Image label" [(ngModel)]="awardee.imageLabel">
|
|
</mat-form-field>
|
|
|
|
<button type="submit" mat-raised-button color="accent" [disabled]="!canSave">
|
|
<i class="fas fa-save"></i> Save
|
|
</button>
|
|
</form>
|