MTAS/mtas-tv-frontend
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

* basic validation and error display added to slide editor and team editor

Browse Source
This commit is contained in:
Dávid Danyi 2018-09-06 17:08:33 +02:00
parent a15cb298a0
commit aa995e845a
4 changed files with 19 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/app/admin/slide-editor/slide-editor.component.html
View File

@ -46,9 +46,10 @@
<label for="slide_data">Slide data</label> <label for="slide_data">Slide data</label>
<textarea id="slide_data" rows="30" name="slide_data" [(ngModel)]="slide.slideData"></textarea> <textarea id="slide_data" rows="30" name="slide_data" [(ngModel)]="slide.slideData"></textarea>
</div> </div>
<div class="field" *ngIf="isIframe"> <div class="field" *ngIf="isIframe" [class.error]="checkError(slideUrl)">
<label for="slide_url">Slide url</label> <label for="slide_url">Slide url</label>
<input id="slide_url" type="text" name="slide_data" [(ngModel)]="slide.slideUrl"> <input id="slide_url" type="url" name="slide_url"
[(ngModel)]="slide.slideUrl" #slideUrl="ngModel">
</div> </div>
<div class="five wide field"> <div class="five wide field">

5
src/app/admin/slide-editor/slide-editor.component.ts
View File

@ -6,6 +6,7 @@ import * as marked from 'marked';
import {Slide, SlideType, SlideVisibility} from '../../shared/slide'; import {Slide, SlideType, SlideVisibility} from '../../shared/slide';
import {SlideService} from '../../shared/service/slide.service'; import {SlideService} from '../../shared/service/slide.service';
import {Team} from '../../shared/team'; import {Team} from '../../shared/team';
import {NgModel} from '@angular/forms';
@Component({ @Component({
selector: 'app-slide-editor', selector: 'app-slide-editor',
@ -76,4 +77,8 @@ export class SlideEditorComponent implements OnInit {
get isIframe(): boolean { get isIframe(): boolean {
return this.slide.type === SlideType.IFrame; return this.slide.type === SlideType.IFrame;
} }
public checkError(fieldModel: NgModel): boolean {
return fieldModel.invalid && (fieldModel.dirty || fieldModel.touched);
}
} }

10
src/app/admin/team-editor/team-editor.component.html
View File

@ -2,13 +2,15 @@
<h1 class="ui dividing header">Team editor</h1> <h1 class="ui dividing header">Team editor</h1>
<form class="ui form" #teamEditorForm (ngSubmit)="saveTeam()"> <form class="ui form" #teamEditorForm (ngSubmit)="saveTeam()">
<div class="two fields"> <div class="two fields">
<div class="six wide field"> <div class="six wide field" [class.error]="checkError(teamName)">
<label for="team_name">Team name</label> <label for="team_name">Team name</label>
<input id="team_name" type="text" name="team_name" [(ngModel)]="team.name"> <input id="team_name" type="text" name="team_name"
required [(ngModel)]="team.name" #teamName="ngModel">
</div> </div>
<div class="six wide field"> <div class="six wide field" [class.error]="checkError(filterId)">
<label for="filter_id">Jira filter id</label> <label for="filter_id">Jira filter id</label>
<input id="filter_id" type="number" name="filter_id" [(ngModel)]="team.filterId"> <input id="filter_id" type="number" name="filter_id"
required minlength="4" min="1" [(ngModel)]="team.filterId" #filterId="ngModel">
</div> </div>
</div> </div>
<div class="six wide field"> <div class="six wide field">

5
src/app/admin/team-editor/team-editor.component.ts
View File

@ -6,6 +6,7 @@ import { TeamService } from '../../shared/service/team.service';
import { Team } from '../../shared/team'; import { Team } from '../../shared/team';
import { Member } from '../../shared/member'; import { Member } from '../../shared/member';
import { Label } from '../../shared/label'; import { Label } from '../../shared/label';
import {NgModel} from '@angular/forms';
@Component({ @Component({
selector: 'app-team-editor', selector: 'app-team-editor',
@ -129,4 +130,8 @@ export class TeamEditorComponent implements OnInit {
); );
} }
} }
public checkError(fieldModel: NgModel): boolean {
return fieldModel.invalid && (fieldModel.dirty || fieldModel.touched);
}
} }