ajout categ dans formulaire creation restau
This commit is contained in:
parent
b7d5ef1043
commit
500ba0811a
|
@ -9,15 +9,28 @@
|
|||
'is-invalid': signupForm.controls['nomFc'].touched && !signupForm.controls['nomFc'].valid}">
|
||||
<label for="floatingInputNom">Nom **</label>
|
||||
</div>
|
||||
|
||||
<!-- <div class="form-floating">
|
||||
<select type="number" class="form-control" id="floatingInputCategories" placeholder="" name="categories"
|
||||
formControlName="typerestausFc">
|
||||
<option value=null></option>
|
||||
<option *ngFor="let category of listCategories" value={{category.id}}>{{category.libelle}}</option>
|
||||
|
||||
</select>
|
||||
<label for="floatingInputlastName">Categorie</label>
|
||||
</div> -->
|
||||
<ul>
|
||||
<div class="form-floating">
|
||||
<li *ngFor="let category of listCategories$ | async ">
|
||||
<input type="checkbox" (change)="onCheckChange($event)" [value]="category.id"> {{
|
||||
category.libelle }}
|
||||
</li>
|
||||
</div>
|
||||
</ul>
|
||||
<!-- <div class="form-group form-check" *ngFor="let category of listCategories$ | async">
|
||||
<input type="checkbox" formControlName="typerestausFc" id="acceptTerms" class="form-check-input" />
|
||||
<label for="acceptTerms" class="form-check-label">{{ category.libelle }}</label>
|
||||
</div> -->
|
||||
|
||||
<div class="form-floating">
|
||||
<input type="text" class="form-control" id="floatingInputAdresse" placeholder="" name="adresse"
|
||||
formControlName="adresseFc"
|
||||
|
|
|
@ -15,41 +15,33 @@ export class AddRestauComponent implements OnInit {
|
|||
|
||||
|
||||
public signupForm: FormGroup;
|
||||
public errorMessage ?: string;
|
||||
public listCategories : any[];
|
||||
public errorMessage?: string;
|
||||
public listCategories$: Observable<any[]>;
|
||||
public expanded = false;
|
||||
|
||||
constructor( private router: Router, private apiBackService : ApiBackService) {
|
||||
constructor(private router: Router, private apiBackService: ApiBackService) {
|
||||
this.signupForm = new FormGroup({});
|
||||
this.listCategories = [];
|
||||
this.listCategories$ = this.getCategories();
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
|
||||
this.getCategories();
|
||||
|
||||
this.signupForm = new FormGroup({
|
||||
nomFc : new FormControl('', [Validators.required]),
|
||||
prixFc : new FormControl(''),
|
||||
longitudeFc : new FormControl('', [Validators.required,]), // chercher une meilleure regex
|
||||
latitudeFc : new FormControl('', [Validators.required]),
|
||||
adresseFc : new FormControl('', [Validators.required]),
|
||||
telephoneFc : new FormControl(''),
|
||||
websiteFc : new FormControl('',[Validators.pattern("/^(http[s]?:\/\/){0,1}(www\.){0,1}[a-zA-Z0-9\.\-]+\.[a-zA-Z]{2,5}[\.]{0,1}/")]),
|
||||
surPlaceFc : new FormControl(''),
|
||||
aEmporterFc : new FormControl(''),
|
||||
accesPMRFc : new FormControl(''),
|
||||
// typerestausFc : new FormControl('')
|
||||
nomFc: new FormControl('', [Validators.required]),
|
||||
prixFc: new FormControl(''),
|
||||
longitudeFc: new FormControl('', [Validators.required,]), // chercher une meilleure regex
|
||||
latitudeFc: new FormControl('', [Validators.required]),
|
||||
adresseFc: new FormControl('', [Validators.required]),
|
||||
telephoneFc: new FormControl(''),
|
||||
websiteFc: new FormControl('', [Validators.pattern("/^(http[s]?:\/\/){0,1}(www\.){0,1}[a-zA-Z0-9\.\-]+\.[a-zA-Z]{2,5}[\.]{0,1}/")]),
|
||||
surPlaceFc: new FormControl(''),
|
||||
aEmporterFc: new FormControl(''),
|
||||
accesPMRFc: new FormControl(''),
|
||||
typerestausFc: new FormArray([])
|
||||
})
|
||||
}
|
||||
|
||||
public getCategories() : void{
|
||||
this.apiBackService.getCategories().subscribe((listCategories: any[]) => {
|
||||
// console.log(listCategories);
|
||||
|
||||
this.listCategories = listCategories;
|
||||
|
||||
});
|
||||
public getCategories(): Observable<any[]> {
|
||||
return this.apiBackService.getCategories();
|
||||
|
||||
}
|
||||
|
||||
|
@ -66,37 +58,64 @@ export class AddRestauComponent implements OnInit {
|
|||
const surPlaceFc = this.signupForm.value['surPlaceFc'];
|
||||
const aEmporterFc = this.signupForm.value['aEmporterFc'];
|
||||
const accesPMRFc = this.signupForm.value['accesPMRFc'];
|
||||
// const typerestausFc = this.signupForm.value['typerestausFc'];
|
||||
const typerestausFc = this.signupForm.value['typerestausFc'];
|
||||
|
||||
console.log(typerestausFc);
|
||||
|
||||
|
||||
const restaurant: Restaurant = {
|
||||
latitude: latitudeFc,
|
||||
longitude: longitudeFc,
|
||||
nom : nomFc,
|
||||
nom: nomFc,
|
||||
prix: prixFc,
|
||||
adresse : adresseFc,
|
||||
telephone : telephoneFc,
|
||||
website : websiteFc,
|
||||
surPlace : surPlaceFc,
|
||||
aEmporter : aEmporterFc,
|
||||
accesPMR : accesPMRFc,
|
||||
// typerestaus : typerestausFc
|
||||
adresse: adresseFc,
|
||||
telephone: telephoneFc,
|
||||
website: websiteFc,
|
||||
surPlace: surPlaceFc,
|
||||
aEmporter: aEmporterFc,
|
||||
accesPMR: accesPMRFc,
|
||||
typerestaus: typerestausFc
|
||||
}
|
||||
|
||||
if( restaurant.latitude !== '' &&
|
||||
restaurant.longitude !== '' &&
|
||||
restaurant.nom !== '' &&
|
||||
restaurant.adresse !== '' ) {
|
||||
this.apiBackService.addRestaurant(restaurant).subscribe(
|
||||
resp=>
|
||||
|
||||
if (restaurant.latitude !== '' &&
|
||||
restaurant.longitude !== '' &&
|
||||
restaurant.nom !== '' &&
|
||||
restaurant.adresse !== '') {
|
||||
this.apiBackService.addRestaurant(restaurant).subscribe(
|
||||
resp =>
|
||||
|
||||
this.router.navigate(['restaurants'])
|
||||
);
|
||||
}else{
|
||||
|
||||
);
|
||||
} else {
|
||||
|
||||
this.errorMessage = "Renseigner les champs obligatoires **";
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
onCheckChange(event : any) {
|
||||
const formArray: FormArray = this.signupForm.get('typerestausFc') as FormArray;
|
||||
console.log(FormArray);
|
||||
|
||||
if (event.target.checked) {
|
||||
|
||||
formArray.push(new FormControl({id : event.target.value}));
|
||||
|
||||
}else {
|
||||
let i: number = 0;
|
||||
|
||||
formArray.controls.forEach((ctrl) => {
|
||||
|
||||
if (ctrl.value['id'] == event.target.value) {
|
||||
formArray.removeAt(i);
|
||||
return;
|
||||
}
|
||||
|
||||
i++;
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
|
|
@ -8,5 +8,8 @@
|
|||
<div>
|
||||
<button class="btn btn-danger" type="button" (click)="deleteRestau(restau.id)"><i class="bi bi-trash"></i></button>
|
||||
</div>
|
||||
<div>
|
||||
<button class="btn btn-warn" type="button" (click)="modifRestau(restau.id)"><i class="bi bi-gear"></i></button>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
|
@ -1,4 +1,4 @@
|
|||
import { Component, Input, OnInit } from '@angular/core';
|
||||
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
|
||||
import { Restaurant } from 'src/app/pages/models/restaurant';
|
||||
import { ApiBackService } from 'src/app/services/api-back.service';
|
||||
|
||||
|
@ -10,6 +10,7 @@ import { ApiBackService } from 'src/app/services/api-back.service';
|
|||
export class UpdateDelRestauComponent implements OnInit {
|
||||
|
||||
restauList : Restaurant[];
|
||||
@Output() idRestauAModif = new EventEmitter<number>();
|
||||
|
||||
constructor(private apiBackService : ApiBackService) {
|
||||
this.restauList = [];
|
||||
|
@ -35,4 +36,8 @@ export class UpdateDelRestauComponent implements OnInit {
|
|||
});
|
||||
}
|
||||
|
||||
modifRestau(idRestau : number | undefined){
|
||||
this.idRestauAModif.emit(idRestau);
|
||||
}
|
||||
|
||||
}
|
|
@ -1,9 +1,9 @@
|
|||
<div class="container">
|
||||
<div class="d-flex flex-row justify-content-around"><div>
|
||||
<app-add-restau></app-add-restau>
|
||||
<app-add-restau ></app-add-restau>
|
||||
</div>
|
||||
<div class="search-bar">
|
||||
<app-update-del-restau></app-update-del-restau>
|
||||
<app-update-del-restau ></app-update-del-restau>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
|
@ -10,5 +10,5 @@ export interface Restaurant {
|
|||
aEmporter?: boolean;
|
||||
accesPMR?: boolean;
|
||||
surPlace?: boolean;
|
||||
typerestaus ?: any[];
|
||||
typerestaus ?: [{id : number}];
|
||||
}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
export interface User {
|
||||
id?:number;
|
||||
prenom: string;
|
||||
lastName: string;
|
||||
nom: string;
|
||||
email: string;
|
||||
password?: string;
|
||||
preference ?: object;
|
||||
|
|
Loading…
Reference in New Issue