Style des formulaires d'ajout

This commit is contained in:
Sébastien André
2020-03-31 13:30:51 +02:00
parent 2b7926d99b
commit 84b2947175
12 changed files with 148 additions and 102 deletions

View File

@@ -7,6 +7,7 @@ import { AircraftResp } from "../../models/aircraft";
import { AircraftService } from "../../services/aircraft.service"; import { AircraftService } from "../../services/aircraft.service";
import { ServiceComm } from "../../services/service-comm.service"; import { ServiceComm } from "../../services/service-comm.service";
import { NewAircraftComponent } from "../new-aircraft/new-aircraft.component"; import { NewAircraftComponent } from "../new-aircraft/new-aircraft.component";
import { AddAction } from "../../models/add-action.enum";
@Component({ @Component({
selector: "app-list-of-aircrafts", selector: "app-list-of-aircrafts",
@@ -26,6 +27,11 @@ export class ListOfAircraftsComponent implements OnInit {
) {} ) {}
ngOnInit() { ngOnInit() {
this.serviceComm.refreshRequest.subscribe(action => {
if (action === AddAction.Gear) {
this.getListOfAircrafts();
}
});
this.serviceComm.UpdatedComponentTitle("List of aircrafts"); this.serviceComm.UpdatedComponentTitle("List of aircrafts");
this.getListOfAircrafts(); this.getListOfAircrafts();
} }

View File

@@ -3,6 +3,7 @@ import { MatPaginator } from "@angular/material/paginator";
import { MatTableDataSource } from "@angular/material/table"; import { MatTableDataSource } from "@angular/material/table";
import { MatDialog } from "@angular/material/dialog"; import { MatDialog } from "@angular/material/dialog";
import { AddAction } from "../../models/add-action.enum";
import { DropZoneResp } from "../../models/dropzone"; import { DropZoneResp } from "../../models/dropzone";
import { DropzoneService } from "../../services/dropzone.service"; import { DropzoneService } from "../../services/dropzone.service";
import { ServiceComm } from "../../services/service-comm.service"; import { ServiceComm } from "../../services/service-comm.service";
@@ -35,6 +36,11 @@ export class ListOfDzsComponent implements OnInit {
) {} ) {}
ngOnInit() { ngOnInit() {
this.serviceComm.refreshRequest.subscribe(action => {
if (action === AddAction.Gear) {
this.getListOfDropZones();
}
});
this.serviceComm.UpdatedComponentTitle("List of DZs"); this.serviceComm.UpdatedComponentTitle("List of DZs");
this.getListOfDropZones(); this.getListOfDropZones();
} }

View File

@@ -41,7 +41,6 @@ export class ListOfGearsComponent implements OnInit {
} }
}); });
this.serviceComm.UpdatedComponentTitle("List of gears"); this.serviceComm.UpdatedComponentTitle("List of gears");
this.getListOfGears(); this.getListOfGears();
} }

View File

@@ -3,6 +3,7 @@ import { MatPaginator } from "@angular/material/paginator";
import { MatTableDataSource } from "@angular/material/table"; import { MatTableDataSource } from "@angular/material/table";
import { MatDialog } from "@angular/material/dialog"; import { MatDialog } from "@angular/material/dialog";
import { AddAction } from "../../models/add-action.enum";
import { JumpTypeResp } from "../../models/jumpType"; import { JumpTypeResp } from "../../models/jumpType";
import { JumpTypeService } from "../../services/jump-type.service"; import { JumpTypeService } from "../../services/jump-type.service";
import { ServiceComm } from "../../services/service-comm.service"; import { ServiceComm } from "../../services/service-comm.service";
@@ -26,6 +27,11 @@ export class ListOfJumpTypesComponent implements OnInit {
) {} ) {}
ngOnInit() { ngOnInit() {
this.serviceComm.refreshRequest.subscribe(action => {
if (action === AddAction.Gear) {
this.getListOfJumpTypes();
}
});
this.serviceComm.UpdatedComponentTitle("List of jump types"); this.serviceComm.UpdatedComponentTitle("List of jump types");
this.getListOfJumpTypes(); this.getListOfJumpTypes();
} }

View File

@@ -1,7 +1,7 @@
<form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)"> <form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)">
<div> <p class="form-group">
<label for="aircraftName">Aircraft name</label> <label for="aircraftName">Aircraft name</label>
<input id="aircraftName" type="text" formControlName="aircraftName"> <input id="aircraftName" type="text" formControlName="aircraftName" class="form-control">
</div> </p>
<button class="button" type="submit" class="btn btn-primary">Add</button> <button class="button" type="submit" class="btn btn-primary">Add</button>
</form> </form>

View File

@@ -1,32 +1,33 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from "@angular/core";
import { FormControl, FormGroup, Validators } from '@angular/forms'; import { FormControl, FormGroup, Validators } from "@angular/forms";
import { AircraftService } from '../../services/aircraft.service'; import { AircraftService } from "../../services/aircraft.service";
import { ServiceComm } from '../../services/service-comm.service'; import { ServiceComm } from "../../services/service-comm.service";
import { AddAction } from '../../models/add-action.enum'; import { AddAction } from "../../models/add-action.enum";
@Component({ @Component({
selector: 'app-new-aircraft', selector: "app-new-aircraft",
templateUrl: './new-aircraft.component.html', templateUrl: "./new-aircraft.component.html",
styleUrls: ['./new-aircraft.component.css'] styleUrls: ["./new-aircraft.component.css"]
}) })
export class NewAircraftComponent implements OnInit { export class NewAircraftComponent implements OnInit {
public addForm: FormGroup; public addForm: FormGroup;
constructor(private serviceComm: ServiceComm, constructor(
private serviceApi: AircraftService) { private serviceComm: ServiceComm,
private serviceApi: AircraftService
) {
this.addForm = new FormGroup({ this.addForm = new FormGroup({
aircraftName: new FormControl('', Validators.required) aircraftName: new FormControl("", Validators.required)
}); });
} }
ngOnInit() { ngOnInit() {}
}
onSubmit(formData) { onSubmit(formData) {
this.serviceApi.AddAircraft(formData.value.aircraftName); this.serviceApi.AddAircraft(formData.value.aircraftName);
this.serviceComm.RefreshData(AddAction.Aircraft); this.serviceComm.RefreshData(AddAction.Aircraft);
this.serviceComm.RefreshData(AddAction.Aircraft);
this.addForm.reset(); this.addForm.reset();
} }
} }

View File

@@ -1,23 +1,27 @@
<form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)"> <form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)">
<div> <p class="form-group">
<label for="dzName">Dropzone name</label> <label for="dzName">Dropzone name</label>
<input id="dzName" type="text" formControlName="dzName"> <input id="dzName" type="text" formControlName="dzName" class="form-control">
</div> </p>
<div> <p class="form-group">
<label for="gps">GPS</label> <label for="gps">GPS</label>
<input id="gps" type="text" formControlName="gps"> <input id="gps" type="text" formControlName="gps" class="form-control">
</div> </p>
<div> <p class="form-group">
<label for="address">Address</label> <label for="address">Address</label>
<textarea id="address" formControlName="address" placeholder="Address of the DZ"></textarea> <textarea id="address" formControlName="address" placeholder="Address of the DZ" class="form-control"></textarea>
</div> </p>
<div> <p class="form-group">
<label for="contactMail">Mail of contact</label> <label for="contactMail">Mail of contact</label>
<input id="contactMail" type="email" formControlName="contactMail"> <input id="contactMail" type="text" formControlName="contactMail" class="form-control">
</div> </p>
<div> <p class="form-group">
<label for="type">DZ or/and tunnel</label> <label for="isDz">Is a dropzone</label>
<input id="type" type="text" formControlName="type"> <input id="isDz" type="checkbox" formControlName="isDz" class="form-control">
</div> </p>
<p class="form-group">
<label for="isTunnel">Is a tunnel</label>
<input id="isTunnel" type="checkbox" formControlName="isTunnel" class="form-control">
</p>
<button class="button" type="submit" class="btn btn-primary">Add</button> <button class="button" type="submit" class="btn btn-primary">Add</button>
</form> </form>

View File

@@ -1,31 +1,37 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from "@angular/core";
import { FormControl, FormGroup, Validators } from '@angular/forms'; import { FormControl, FormGroup, Validators } from "@angular/forms";
import { AddAction } from "../../models/add-action.enum";
import { ServiceComm } from "../../services/service-comm.service";
@Component({ @Component({
selector: 'app-new-drop-zone', selector: "app-new-drop-zone",
templateUrl: './new-drop-zone.component.html', templateUrl: "./new-drop-zone.component.html",
styleUrls: ['./new-drop-zone.component.css'] styleUrls: ["./new-drop-zone.component.css"]
}) })
export class NewDropZoneComponent implements OnInit { export class NewDropZoneComponent implements OnInit {
public addForm: FormGroup; public addForm: FormGroup;
constructor() { constructor(private serviceComm: ServiceComm) {
this.addForm = new FormGroup({ this.addForm = new FormGroup({
dzName: new FormControl('', Validators.required), dzName: new FormControl("", Validators.required),
gps: new FormControl('x.x,y.y', Validators.required), gps: new FormControl("x.x,y.y", [
address: new FormControl('', Validators.required), Validators.required,
contactMail: new FormControl('tot@toto.fr', [Validators.required, Validators.pattern('\\w+@\\w+\.\\w+')]), Validators.pattern("d+.d+,d+.d+")
type: new FormControl('dz, tunel', Validators.required) ]),
address: new FormControl("", Validators.required),
contactMail: new FormControl("", [Validators.required, Validators.email]),
isDz: new FormControl(true),
isTunnel: new FormControl(false)
}); });
} }
ngOnInit() { ngOnInit() {}
}
onSubmit(formData) { onSubmit(formData) {
console.log(formData.status); console.log(formData.status);
console.warn('New data : ', formData); console.warn("New data : ", formData);
this.serviceComm.RefreshData(AddAction.Gear);
this.addForm.reset(); this.addForm.reset();
} }
} }

View File

@@ -1,32 +1,32 @@
<form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)"> <form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)">
<div> <p class="form-group">
<label for="name">Name of gear</label> <label for="name">Name of gear</label>
<input id="name" type="text" formControlName="name"> <input id="name" type="text" formControlName="name" class="form-control">
</div> </p>
<div> <p class="form-group">
<label for="manufacturer">Manufacturer</label> <label for="manufacturer">Manufacturer</label>
<input id="manufacturer" type="text" formControlName="manufacturer"> <input id="manufacturer" type="text" formControlName="manufacturer" class="form-control">
</div> </p>
<div> <p class="form-group">
<label for="minSize">Min size of canopy</label> <label for="minSize">Min size of canopy</label>
<input id="minSize" type="text" formControlName="minSize"> <input id="minSize" type="text" formControlName="minSize" class="form-control">
</div> </p>
<div> <p class="form-group">
<label for="maxSize">Max size of canopy</label> <label for="maxSize">Max size of canopy</label>
<input id="maxSize" type="text" formControlName="maxSize"> <input id="maxSize" type="text" formControlName="maxSize" class="form-control">
</div> </p>
<div> <p class="form-group">
<label for="aad">AAD system</label> <label for="aad">AAD system</label>
<input id="aad" type="text" formControlName="aad"> <input id="aad" type="text" formControlName="aad" class="form-control">
</div> </p>
<div> <p class="form-group">
<label for="mainCanopy">Main Canopy</label> <label for="mainCanopy">Main Canopy</label>
<input id="mainCanopy" type="text" formControlName="mainCanopy"> <input id="mainCanopy" type="text" formControlName="mainCanopy" class="form-control">
</div> </p>
<div> <p class="form-group">
<label for="reserveCanopy">Reserve canopy</label> <label for="reserveCanopy">Reserve canopy</label>
<input id="reserveCanopy" type="text" formControlName="reserveCanopy"> <input id="reserveCanopy" type="text" formControlName="reserveCanopy" class="form-control">
</div> </p>
<button class="button" type="submit" class="btn btn-primary">Add</button> <button class="button" type="submit" class="btn btn-primary">Add</button>
</form> </form>

View File

@@ -1,33 +1,50 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from "@angular/core";
import { FormControl, FormGroup, Validators } from '@angular/forms'; import { FormControl, FormGroup, Validators } from "@angular/forms";
import { ServiceComm } from '../../services/service-comm.service';
import { GearService } from '../../services/gear.service';
import { AddAction } from '../../models/add-action.enum';
import { ServiceComm } from "../../services/service-comm.service";
import { GearService } from "../../services/gear.service";
import { AddAction } from "../../models/add-action.enum";
@Component({ @Component({
selector: 'app-new-gear', selector: "app-new-gear",
templateUrl: './new-gear.component.html', templateUrl: "./new-gear.component.html",
styleUrls: ['./new-gear.component.css'] styleUrls: ["./new-gear.component.css"]
}) })
export class NewGearComponent implements OnInit { export class NewGearComponent implements OnInit {
public addForm: FormGroup; public addForm: FormGroup;
constructor(private serviceComm: ServiceComm, private serviceApi: GearService) { constructor(
private serviceComm: ServiceComm,
private serviceApi: GearService
) {
this.addForm = new FormGroup({ this.addForm = new FormGroup({
name: new FormControl('', Validators.required), name: new FormControl("", Validators.required),
manufacturer: new FormControl('', Validators.required), manufacturer: new FormControl("", Validators.required),
minSize: new FormControl('', Validators.required), minSize: new FormControl("", [
maxSize: new FormControl('', Validators.required), Validators.required,
aad: new FormControl('', Validators.required), Validators.min(60),
mainCanopy: new FormControl('', Validators.required), Validators.max(320)
reserveCanopy: new FormControl('', Validators.required), ]),
maxSize: new FormControl("", [
Validators.required,
Validators.min(60),
Validators.max(320)
]),
aad: new FormControl("", Validators.required),
mainCanopy: new FormControl("", [
Validators.required,
Validators.min(60),
Validators.max(320)
]),
reserveCanopy: new FormControl("", [
Validators.required,
Validators.min(60),
Validators.max(320)
])
}); });
} }
ngOnInit() { ngOnInit() {}
}
onSubmit(formData) { onSubmit(formData) {
this.serviceApi.AddGear( this.serviceApi.AddGear(
@@ -41,7 +58,6 @@ export class NewGearComponent implements OnInit {
); );
this.serviceComm.RefreshData(AddAction.Gear); this.serviceComm.RefreshData(AddAction.Gear);
this.addForm.reset(); this.addForm.reset();
} }
} }

View File

@@ -1,7 +1,7 @@
<form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)"> <form [formGroup]="addForm" (ngSubmit)="onSubmit(addForm.value)">
<div> <p class="form-group">
<label for="jumptypeName">Jump type name</label> <label for="jumptypeName">Jump type name</label>
<input id="jumptypeName" type="text" formControlName="jumptypeName"> <input id="jumptypeName" type="text" formControlName="jumptypeName" class="form-control">
</div> </p>
<button class="button" type="submit" class="btn btn-primary">Add</button> <button class="button" type="submit" class="btn btn-primary">Add</button>
</form> </form>

View File

@@ -1,27 +1,29 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from "@angular/core";
import { FormControl, FormGroup, Validators } from '@angular/forms'; import { FormControl, FormGroup, Validators } from "@angular/forms";
import { AddAction } from "../../models/add-action.enum";
import { ServiceComm } from "../../services/service-comm.service";
@Component({ @Component({
selector: 'app-new-jump-type', selector: "app-new-jump-type",
templateUrl: './new-jump-type.component.html', templateUrl: "./new-jump-type.component.html",
styleUrls: ['./new-jump-type.component.css'] styleUrls: ["./new-jump-type.component.css"]
}) })
export class NewJumpTypeComponent implements OnInit { export class NewJumpTypeComponent implements OnInit {
public addForm: FormGroup; public addForm: FormGroup;
constructor() { constructor(private serviceComm: ServiceComm) {
this.addForm = new FormGroup({ this.addForm = new FormGroup({
jumptypeName: new FormControl('', Validators.required) jumptypeName: new FormControl("", Validators.required)
}); });
} }
ngOnInit() { ngOnInit() {}
}
onSubmit(formData) { onSubmit(formData) {
console.log(formData.status); console.log(formData.status);
console.warn('New data : ', formData); console.warn("New data : ", formData);
this.serviceComm.RefreshData(AddAction.Gear);
this.addForm.reset(); this.addForm.reset();
} }
} }