opt-cc/static/src/app/manage/decorations/edit-decoration/edit-decoration.component.html

82 lines
3.6 KiB
HTML

<form #form="ngForm" (keydown.enter)="$event.preventDefault()" class="overview">
<h3 *ngIf="decoration._id">{{'decorations.submit.headline.edit' | translate}}</h3>
<h3 *ngIf="!decoration._id">{{'decorations.submit.headline.new' | translate}}</h3>
<div class="form-group">
<label for="title">{{'decorations.submit.field.name' | translate}}</label>
<input type="text" class="form-control"
[(ngModel)]="decoration.name"
name="title"
id="title"
required maxlength="50"/>
<show-error displayName="{{'decorations.submit.field.name' | translate}}" controlPath="title"></show-error>
</div>
<div class="form-group">
<label for="fraction">{{'decorations.submit.field.fraction' | translate}}</label>
<select id="fraction" name="fraction" class="form-control btn dropdown-toggle"
required
[(ngModel)]="decoration.fraction">
<option value="{{fraction.ARF}}">{{fraction.ARF}}</option>
<option value="{{fraction.SWORD}}">{{fraction.SWORD}}</option>
<option value="OPFOR">{{fraction.OPFOR}}</option>
<option value="BLUFOR">{{fraction.BLUFOR}}</option>
<option value="GLOBAL">{{'decorations.submit.field.fraction.global' | translate}}</option>
</select>
<show-error displayName="{{'decorations.submit.field.fraction' | translate}}" controlPath="fraction"></show-error>
</div>
<div class="form-group">
<label for="type">{{'decorations.submit.field.type' | translate}}</label>
<select id="type" name="type" class="form-control btn dropdown-toggle"
required
[(ngModel)]="decoration.isMedal">
<option value="true">{{'decorations.submit.field.type.medal' | translate}}</option>
<option value="false">{{'decorations.submit.field.type.ribbon' | translate}}</option>
</select>
<show-error displayName="{{'decorations.submit.field.type' | translate}}" controlPath="type"></show-error>
</div>
<div class="form-group">
<label for="sort">{{'decorations.submit.field.sort' | translate}}</label>
<input id="sort" name="sort" type="number" class="form-control btn dropdown-toggle"
[(ngModel)]="decoration.sortingNumber">
<show-error displayName="{{'decorations.submit.field.sort' | translate}}" controlPath="sort"></show-error>
</div>
<div class="form-group">
<label for="description">{{'decorations.submit.field.description' | translate}}</label>
<textarea id="description" name="description" class="form-control" rows="5"
required
[(ngModel)]="decoration.description"></textarea>
<show-error displayName="{{'decorations.submit.field.description' | translate}}" controlPath="description"></show-error>
</div>
<div class="form-group">
<label for="graphic">{{'decorations.submit.field.image' | translate}}</label>
<input id="graphic" name="graphic" class="ui-button form-control" type="file"
#fileInput
accept="image/png"
(change)="fileChange($event)">
<span class="label label-bg label-danger center-block" style="font-size:small" *ngIf="showImageError">
{{'decorations.submit.field.image.error.type' | translate}}
</span>
<img class="preview-image" src="{{imagePreviewSrc}}">
</div>
<button id="cancel"
(click)="cancel()"
class="btn btn-default">
{{'decorations.submit,button.cancel' | translate}}
</button>
<button id="save"
type="submit"
(click)="saveDecoration(fileInput)"
class="btn btn-default"
[disabled]="!form.valid">
{{'decorations.submit,button.submit' | translate}}
</button>
</form>