Avancement sur le formulaire d'ajout de sauts
This commit is contained in:
@@ -1,51 +1,51 @@
|
|||||||
<div class="example-container">
|
<form class="example-container" (ngSubmit)="onFormSubmit()" [ngModelOptions]="{standalone: true}">
|
||||||
<mat-form-field>
|
<mat-form-field>
|
||||||
<mat-label>Choose the jump type</mat-label>
|
<mat-label>Choose the jump type</mat-label>
|
||||||
<mat-select>
|
<mat-select [(value)]="selectedJumpType">
|
||||||
<mat-option value="option1">Option 1</mat-option>
|
<mat-option value="1">Option 1</mat-option>
|
||||||
<mat-option value="option2" disabled>Option 2 (disabled)</mat-option>
|
<mat-option value="2" disabled>Option 2 (disabled)</mat-option>
|
||||||
<mat-option value="option3">Option 3</mat-option>
|
<mat-option value="3">Option 3</mat-option>
|
||||||
</mat-select>
|
</mat-select>
|
||||||
</mat-form-field>
|
</mat-form-field>
|
||||||
|
|
||||||
<mat-form-field>
|
<mat-form-field>
|
||||||
<mat-label>Choose the aircraft</mat-label>
|
<mat-label>Choose the aircraft</mat-label>
|
||||||
<mat-select>
|
<mat-select [(value)]="selectedAircraft">
|
||||||
<mat-option value="option1">Option 1</mat-option>
|
<mat-option value="4">Option 1</mat-option>
|
||||||
<mat-option value="option2">Option 2</mat-option>
|
<mat-option value="5">Option 2</mat-option>
|
||||||
</mat-select>
|
</mat-select>
|
||||||
</mat-form-field>
|
</mat-form-field>
|
||||||
|
|
||||||
<mat-form-field>
|
<mat-form-field>
|
||||||
<mat-label>Choose the DZ</mat-label>
|
<mat-label>Choose the DZ</mat-label>
|
||||||
<mat-select>
|
<mat-select [(value)]="selectedDz">
|
||||||
<mat-option value="option1">Option 1</mat-option>
|
<mat-option value="6">Option 1</mat-option>
|
||||||
<mat-option value="option2">Option 2</mat-option>
|
<mat-option value="7">Option 2</mat-option>
|
||||||
</mat-select>
|
</mat-select>
|
||||||
</mat-form-field>
|
</mat-form-field>
|
||||||
|
|
||||||
<mat-checkbox>With a cutaway ?</mat-checkbox>
|
<mat-checkbox [(checked)]="withCutaway">With a cutaway ?</mat-checkbox>
|
||||||
|
|
||||||
<mat-form-field>
|
<mat-form-field>
|
||||||
<input matInput [matDatepicker]="beginDate" [value]="date.value" disabled>
|
<input matInput [matDatepicker]="beginDateDp" [value]="beginDate.value" disabled>
|
||||||
<mat-datepicker-toggle matSuffix [for]="beginDate"></mat-datepicker-toggle>
|
<mat-datepicker-toggle matSuffix [for]="beginDateDp"></mat-datepicker-toggle>
|
||||||
<mat-datepicker #beginDate disabled="false"></mat-datepicker>
|
<mat-datepicker #beginDateDp disabled="false"></mat-datepicker>
|
||||||
</mat-form-field>
|
</mat-form-field>
|
||||||
<mat-form-field>
|
<mat-form-field>
|
||||||
<input matInput [matDatepicker]="endDate" [value]="date.value" disabled>
|
<input matInput [matDatepicker]="endDateDp" [value]="endDate.value" disabled>
|
||||||
<mat-datepicker-toggle matSuffix [for]="endDate"></mat-datepicker-toggle>
|
<mat-datepicker-toggle matSuffix [for]="endDateDp"></mat-datepicker-toggle>
|
||||||
<mat-datepicker #endDate disabled="false"></mat-datepicker>
|
<mat-datepicker #endDateDp disabled="false"></mat-datepicker>
|
||||||
</mat-form-field>
|
</mat-form-field>
|
||||||
|
|
||||||
<mat-form-field>
|
<mat-form-field>
|
||||||
<input matInput placeholder="Exit altitude" [(ngModel)]="defaultExitAltitude">
|
<input matInput placeholder="Exit altitude" [(value)]="defaultExitAltitude">
|
||||||
<button mat-button *ngIf="defaultExitAltitude" matSuffix mat-icon-button aria-label="Clear"
|
<button mat-button *ngIf="defaultExitAltitude" matSuffix mat-icon-button aria-label="Clear"
|
||||||
(click)="defaultExitAltitude=''">
|
(click)="defaultExitAltitude=''">
|
||||||
<mat-icon>close</mat-icon>
|
<mat-icon>close</mat-icon>
|
||||||
</button>
|
</button>
|
||||||
</mat-form-field>
|
</mat-form-field>
|
||||||
<mat-form-field>
|
<mat-form-field>
|
||||||
<input matInput placeholder="Deploy altitude" [(ngModel)]="defaultDeployAltitude">
|
<input matInput placeholder="Deploy altitude" [(value)]="defaultDeployAltitude">
|
||||||
<button mat-button *ngIf="defaultDeployAltitude" matSuffix mat-icon-button aria-label="Clear"
|
<button mat-button *ngIf="defaultDeployAltitude" matSuffix mat-icon-button aria-label="Clear"
|
||||||
(click)="defaultDeployAltitude=''">
|
(click)="defaultDeployAltitude=''">
|
||||||
<mat-icon>close</mat-icon>
|
<mat-icon>close</mat-icon>
|
||||||
@@ -60,4 +60,6 @@
|
|||||||
</button>
|
</button>
|
||||||
</mat-form-field>
|
</mat-form-field>
|
||||||
|
|
||||||
</div>
|
<br />
|
||||||
|
<button class="btn btn-primary">Submit</button>
|
||||||
|
</form>
|
||||||
|
|||||||
@@ -10,13 +10,20 @@ import { ServiceComm } from '../../services/serviceComm';
|
|||||||
styleUrls: ['./new-jump.component.css']
|
styleUrls: ['./new-jump.component.css']
|
||||||
})
|
})
|
||||||
export class NewJumpComponent implements OnInit {
|
export class NewJumpComponent implements OnInit {
|
||||||
date: FormControl;
|
beginDate: Date;
|
||||||
|
endDate: Date;
|
||||||
defaultExitAltitude: number;
|
defaultExitAltitude: number;
|
||||||
defaultDeployAltitude: number;
|
defaultDeployAltitude: number;
|
||||||
countOfJumps: number;
|
countOfJumps: number;
|
||||||
|
selectedDz: number;
|
||||||
|
selectedAircraft: number;
|
||||||
|
selectedJumpType: number;
|
||||||
|
withCutaway: boolean;
|
||||||
|
|
||||||
constructor(private serviceComm: ServiceComm) {
|
constructor(private serviceComm: ServiceComm) {
|
||||||
this.date = new FormControl(new Date());
|
this.beginDate = new Date();
|
||||||
|
this.endDate = new Date();
|
||||||
|
|
||||||
this.defaultExitAltitude = 4000;
|
this.defaultExitAltitude = 4000;
|
||||||
this.defaultDeployAltitude = 1000;
|
this.defaultDeployAltitude = 1000;
|
||||||
this.countOfJumps = 0;
|
this.countOfJumps = 0;
|
||||||
@@ -25,4 +32,16 @@ export class NewJumpComponent implements OnInit {
|
|||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
this.serviceComm.updatedComponentTitle('Add a new jump');
|
this.serviceComm.updatedComponentTitle('Add a new jump');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
onFormSubmit() {
|
||||||
|
console.log(this.selectedJumpType);
|
||||||
|
console.log(this.selectedAircraft);
|
||||||
|
console.log(this.selectedDz);
|
||||||
|
console.log(this.withCutaway);
|
||||||
|
console.log(this.beginDate);
|
||||||
|
console.log(this.endDate);
|
||||||
|
console.log(this.defaultExitAltitude);
|
||||||
|
console.log(this.defaultDeployAltitude);
|
||||||
|
console.log(this.countOfJumps);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -3,7 +3,7 @@ import { BehaviorSubject } from 'rxjs';
|
|||||||
|
|
||||||
@Injectable()
|
@Injectable()
|
||||||
export class ServiceComm {
|
export class ServiceComm {
|
||||||
private componentTitleSource = new BehaviorSubject<string>("");
|
private componentTitleSource = new BehaviorSubject<string>('');
|
||||||
componentTitle = this.componentTitleSource.asObservable();
|
componentTitle = this.componentTitleSource.asObservable();
|
||||||
|
|
||||||
constructor() { }
|
constructor() { }
|
||||||
|
|||||||
Reference in New Issue
Block a user