Merge branch 'dev' of https://github.com/RomainVgr/simpleat into dev

src/app/admin-component/add-restau/add-restau.component.html

@@ -0,0 +1,195 @@
+<div class="signup-form text-center">
+    <main class="form-signup">
+        <form (ngSubmit)="onSubmit()" [formGroup]="signupForm">
+            <h1>Enregistrer un restaurant</h1>
+            <div class="form-floating">
+                <input type="text" 
+                        class="form-control" 
+                        id="floatingInputNom" 
+                        placeholder="" 
+                        name="nom" 
+                        formControlName="nomFc"
+                        [ngClass]="{'is-valid' : signupForm.controls['nomFc'].touched && signupForm.controls['nomFc'].valid, 
+                                    'is-invalid':  signupForm.controls['nomFc'].touched && !signupForm.controls['nomFc'].valid}">
+                <label for="floatingInputNom">Nom **</label>
+            </div>
+            <div class="form-floating">
+                <input type="text" 
+                        class="form-control" 
+                        id="floatingInputAdresse" 
+                        placeholder="" 
+                        name="adresse" 
+                        formControlName="adresseFc"
+                        [ngClass]="{'is-valid' : signupForm.controls['adresseFc'].touched && signupForm.controls['adresseFc'].valid, 
+                                    'is-invalid':  signupForm.controls['adresseFc'].touched && !signupForm.controls['adresseFc'].valid}">
+                <label for="floatingInputAdresse">Adresse **</label>
+            </div>
+            <div class="form-floating">
+                <select type="number" 
+                        class="form-control" 
+                        id="floatingInputPrice" 
+                        placeholder="" 
+                        name="prix" 
+                        formControlName="prixFc">
+                    <option value=1>€ 1€ à 10€</option>
+                    <option value=2>€€ 11€ à 20€</option>
+                    <option value=3>€€€ 21€ à 30€</option>
+                    <option value=4>€€€€ 31€ à 40€</option>
+                </select>
+                <label for="floatingInputlastName">Prix</label>
+            </div>
+            <div class="form-floating">
+                <input type="text" 
+                        class="form-control" 
+                        id="floatingInputLat" 
+                        placeholder="" 
+                        name="latitude" 
+                        formControlName="latitudeFc"
+                        [ngClass]="{'is-valid' : signupForm.controls['latitudeFc'].touched && signupForm.controls['latitudeFc'].valid, 
+                                    'is-invalid':  signupForm.controls['latitudeFc'].touched && !signupForm.controls['latitudeFc'].valid}">
+                <label for="floatingInputLat">Latitude **</label>
+            </div>
+            <div class="form-floating">
+                <input type="text" 
+                        class="form-control" 
+                        id="floatingInputLong" 
+                        placeholder="" 
+                        name="longitude" 
+                        formControlName="longitudeFc"
+                        [ngClass]="{'is-valid' : signupForm.controls['longitudeFc'].touched && signupForm.controls['longitudeFc'].valid, 
+                                    'is-invalid':  signupForm.controls['longitudeFc'].touched && !signupForm.controls['longitudeFc'].valid}">
+                <label for="floatingInputLong">Longitude **</label>
+            </div>
+            <div class="form-floating">
+                <input type="text" 
+                        class="form-control" 
+                        id="floatingInputTel" 
+                        placeholder="" 
+                        name="telephone" 
+                        formControlName="telephoneFc">
+                <label for="floatingInputTel">Téléphone</label>
+            </div>
+            <div class="form-floating">
+                <input type="text" 
+                        class="form-control" 
+                        id="floatingInputWebsite" 
+                        placeholder="" 
+                        name="website"
+                        formControlName="websiteFc"
+                        [ngClass]="{'is-valid' : signupForm.controls['websiteFc'].touched && signupForm.controls['websiteFc'].valid, 
+                                    'is-invalid':  signupForm.controls['websiteFc'].touched && !signupForm.controls['websiteFc'].valid}">
+                <label for="floatingInputWebsite">Site Web</label>
+            </div>
+
+            <div class="form-control">
+                <p class="text-left"> Sur Place :</p>
+                <div class="form-check form-check-inline">
+                    <input 
+                    type="radio"
+                    class="form-check-input"
+                    id="checkboxSurPlaceTrue"
+                    name="surPlaceFc" 
+                    value=true
+                    formControlName="surPlaceFc">
+                    <label class="form-check-label" for="checkboxSurPlaceTrue">Oui</label>
+                </div>
+                <div class="form-check form-check-inline">
+                    <input 
+                    type="radio"
+                    class="form-check-input"
+                    id="checkboxSurPlaceFalse"
+                    name="surPlaceFc" 
+                    value=false
+                    formControlName="surPlaceFc">
+                    <label class="form-check-label" for="checkboxSurPlaceFalse">Non</label>
+                </div>
+                <div class="form-check form-check-inline">
+                    <input 
+                    type="radio"
+                    class="form-check-input"
+                    id="checkboxSurPlaceNull"
+                    name="surPlaceFc" 
+                    value=null
+                    formControlName="surPlaceFc">
+                    <label class="form-check-label" for="checkboxSurPlaceNull">Pas d'infos</label>
+                </div>
+            </div>
+            
+            <div class="form-control">
+                <p class="text-left"> A Emporter :</p>
+                <div class="form-check form-check-inline">
+                    <input 
+                    type="radio"
+                    class="form-check-input"
+                    id="checkboxAEmporterTrue"
+                    name="aEmporterFc" 
+                    value=true
+                    formControlName="aEmporterFc">
+                    <label class="form-check-label" for="checkboxAEmporterTrue">Oui</label>
+                </div>
+                <div class="form-check form-check-inline">
+                    <input 
+                    type="radio"
+                    class="form-check-input"
+                    id="checkboxAEmporterFalse"
+                    name="aEmporterFc" 
+                    value=false
+                    formControlName="aEmporterFc">
+                    <label class="form-check-label" for="checkboxAEmporterFalse">Non</label>
+                </div>
+                <div class="form-check form-check-inline">
+                    <input 
+                    type="radio"
+                    class="form-check-input"
+                    id="checkboxAEmporterNull"
+                    name="aEmporterFc" 
+                    value=null
+                    formControlName="aEmporterFc">
+                    <label class="form-check-label" for="checkboxAEmporterNull">Pas d'infos</label>
+                </div>
+            </div>
+
+            <div class="form-control">
+                <p class="text-left"> Accès PMR :</p>
+                <div class="form-check form-check-inline">
+                    <input 
+                    type="radio"
+                    class="form-check-input"
+                    id="checkboxAccesPMRTrue"
+                    name="accesPMRFc" 
+                    value=true
+                    formControlName="accesPMRFc">
+                    <label class="form-check-label" for="checkboxAccesPMRTrue">Oui</label>
+                </div>
+                <div class="form-check form-check-inline">
+                    <input 
+                    type="radio"
+                    class="form-check-input"
+                    id="checkboxAccesPMRFalse"
+                    name="accesPMRFc" 
+                    value=false
+                    formControlName="accesPMRFc">
+                    <label class="form-check-label" for="checkboxAccesPMRFalse">Non</label>
+                </div>
+                <div class="form-check form-check-inline">
+                    <input 
+                    type="radio"
+                    class="form-check-input"
+                    id="checkboxAccesPMRNull"
+                    name="accesPMRFc" 
+                    value=null
+                    formControlName="accesPMRFc">
+                    <label class="form-check-label" for="checkboxAccesPMRNull">Pas d'infos</label>
+                </div>
+            </div>
+                
+            <div *ngIf="errorMessage" class="alert alert-danger">
+                <p class="alert-link">{{errorMessage}}</p>
+            </div>
+
+            <button class="w-100 btn btn-lg btn-success" 
+                    type="submit">Enregistrer</button>
+
+        </form>
+    </main>
+</div>

src/app/admin-component/add-restau/add-restau.component.scss

@@ -0,0 +1,36 @@
+.login-form {
+    height: 100vh;
+    padding-top: 40px;
+    background-color: #f5f5f5;
+}
+
+.form-signup {
+    width: 100%;
+    max-width: 350px;
+    padding: 15px;
+    margin: auto;
+}
+
+.form-signup .checkbox {
+    font-weight: 400;
+}
+
+.form-signup .form-floating:focus-within {
+    z-index: 2;
+}
+
+.form-signup input[type="email"] {
+    margin-bottom: -1px;
+    border-bottom-right-radius: 0;
+    border-bottom-left-radius: 0;
+}
+
+.form-signup input[type="password"] {
+    margin-bottom: 10px;
+    border-top-left-radius: 0;
+    border-top-right-radius: 0;
+}
+
+.text-left{
+    text-align: left;
+}

src/app/admin-component/add-restau/add-restau.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AddRestauComponent } from './add-restau.component';
+
+describe('AddRestauComponent', () => {
+  let component: AddRestauComponent;
+  let fixture: ComponentFixture<AddRestauComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ AddRestauComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AddRestauComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/admin-component/add-restau/add-restau.component.ts

@@ -0,0 +1,81 @@
+
+import { Component, OnInit } from '@angular/core';
+import { FormControl, FormGroup, Validators } from '@angular/forms';
+import { Router } from '@angular/router';
+import { Restaurant } from 'src/app/pages/models/restaurant';
+import { ApiBackService } from 'src/app/services/api-back.service';
+
+@Component({
+  selector: 'app-add-restau',
+  templateUrl: './add-restau.component.html',
+  styleUrls: ['./add-restau.component.scss']
+})
+export class AddRestauComponent implements OnInit {
+
+
+  public signupForm: FormGroup;
+  public errorMessage ?: string;
+
+  constructor( private router: Router, private apiBackService : ApiBackService) {
+    this.signupForm = new FormGroup({});
+  }
+
+  ngOnInit(): void {
+    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('')
+    })
+  }
+
+  public onSubmit(): void {
+    console.log("value : ", this.signupForm.value);
+    console.log("form : ", this.signupForm);
+    const nomFc = this.signupForm.value['nomFc'];
+    const prixFc = this.signupForm.value['prixFc'];
+    const longitudeFc = this.signupForm.value['longitudeFc'];
+    const latitudeFc = this.signupForm.value['latitudeFc'];
+    const adresseFc = this.signupForm.value['adresseFc'];
+    const telephoneFc = this.signupForm.value['telephoneFc'];
+    const websiteFc = this.signupForm.value['websiteFc'];
+    const surPlaceFc = this.signupForm.value['surPlaceFc'];
+    const aEmporterFc = this.signupForm.value['aEmporterFc'];
+    const accesPMRFc = this.signupForm.value['accesPMRFc'];
+    
+    const restaurant: Restaurant = {
+      latitude: latitudeFc,
+      longitude: longitudeFc,
+      nom : nomFc,
+      prix: prixFc,
+      adresse : adresseFc,    
+      telephone : telephoneFc,
+      website : websiteFc,
+      surPlace : surPlaceFc,
+      aEmporter : aEmporterFc,
+      accesPMR : accesPMRFc
+    }
+    if( restaurant.latitude   !== '' && 
+        restaurant.longitude  !== '' &&
+        restaurant.nom        !== '' &&
+        restaurant.adresse    !== ''  ) {
+        this.apiBackService.addRestaurant(restaurant).subscribe(
+          resp=>
+          
+          this.router.navigate(['restaurants'])
+        );
+    }else{
+      
+      this.errorMessage = "Renseigner les champs obligatoires **";
+    }
+  
+  }
+
+}
+

src/app/app-routing.module.ts

@@ -7,6 +7,7 @@ import { RestoPageComponent } from './pages/resto-page/resto-page.component';
 import { PageNotFoundComponent } from './pages/page-not-found/page-not-found.component';
 import { FiltersPageComponent } from './pages/filters-page/filters-page.component';
 import { SigninComponent } from './pages/signin/signin.component';
+import { AdminPageComponent } from './pages/admin-page/admin-page.component';
 
 const routes: Routes = [
     { path: '', redirectTo: 'home', pathMatch: 'full' },
@@ -18,6 +19,7 @@ const routes: Routes = [
     {path: 'restaurants',component: RestoPageComponent},
     {path: 'page-not-found',component: PageNotFoundComponent},
     {path: 'signin', component: SigninComponent},
+    {path: 'admin', component: AdminPageComponent},
     {path: '**', redirectTo: 'page-not-found' }
 ];
 

src/app/app.module.ts

@@ -1,6 +1,6 @@
 import { NgModule } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
-import { FormsModule } from '@angular/forms';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
 import { NavBarComponent } from './header/components/nav-bar/nav-bar.component';
@@ -18,6 +18,8 @@ import { FiltersPageComponent } from './pages/filters-page/filters-page.componen
 import { AvisBarComponent } from './filters/avis-bar/avis-bar.component';
 import { IconComponent } from './filters/icon/icon.component';
 import { TemplatePageComponent } from './components/template-page/template-page.component';
+import { AdminPageComponent } from './pages/admin-page/admin-page.component';
+import { AddRestauComponent } from './admin-component/add-restau/add-restau.component';
 
 @NgModule({
   declarations: [
@@ -35,13 +37,16 @@ import { TemplatePageComponent } from './components/template-page/template-page.
     AvisBarComponent,
     IconComponent,
     SigninComponent,
-    TemplatePageComponent
+    TemplatePageComponent,
+    AdminPageComponent,
+    AddRestauComponent
   ],
   imports: [
     BrowserModule,
     AppRoutingModule,
     HttpClientModule,
     FormsModule,
+    ReactiveFormsModule
   ],
   providers: [],
   bootstrap: [AppComponent]

src/app/card-resto/card-resto.component.html

@@ -39,14 +39,20 @@
               <i class="fas fa-walking ps-2 pe-2" style="color:#a8a8a8"></i>
               <span class="categorie pe-2" style="font-weight: bold;">{{distance}}m</span>
 
+              <!-- <div class="d-inline-flex" *ngIf="restaurant.prix != null; else noPrice"> -->
+                <i class="fas fa-euro-sign ps-2 pe-2" style="color:#a8a8a8"></i>
+                <span class="prix" style="font-weight: bold;">{{ priceRef[restaurant.prix] }}</span>
+              <!-- </div> -->
 
-              <i class="fas fa-euro-sign ps-2 pe-2" style="color:#a8a8a8"></i>
-              <span class="prix" style="font-weight: bold;">5-10€</span>
+              <!-- <ng-template #noPrice>
+                <div class="d-inline-flex">
+                  <p class="description pt-3 ps-3 pe-1 " style="font-size:1.9vh ;color:#545454">{{ priceRef[0] }} </p>
+                </div>
+              </ng-template> -->
            
             <div class="d-inline-flex" *ngIf="restaurant.website; else noWebsite">
               <p class="description pt-3 ps-2 pe-1"><i class="bi bi-globe2 ps-2 pe-2" style="color:#a8a8a8"></i>
                 <a href="{{restaurant.website}}" class="description text-decoration-none pe-1" style="font-style: italic;font-weight: bold; color:#545454">Site Web</a>
-
               </p>
             </div>
             <!-- le else de notre *ngIf plus haut-->
@@ -60,30 +66,54 @@
 
 
           <div class="trait-rouge pt-2 pb-0"></div>
-          <div class="critere ps-1 pt-3">
-            <span class="sur-place pe-3" style="color:#545454">Sur place :</span>
-            <app-icon
-              [iconName]="restaurant.surPlace ? 'bi bi-check-square-fill' : 'bi bi-x-square-fill ps-2 pt-1 '"
-              [iconColor]="restaurant.surPlace ? '#4ECB71' : '#ED2F2F'"
-            ></app-icon>
-            <span class="a-emporter pe-2 ps-4 " style="color:#545454">A emporter :</span>
-            <app-icon
-              [iconName]="restaurant.aEmporter ? 'bi bi-check-square-fill' : 'bi bi-x-square-fill ps-2 pt-1'"
-              [iconColor]="restaurant.aEmporter ? '#4ECB71' : '#ED2F2F'"
-            ></app-icon>
-          </div>
+            <div class="critere ps-1 pt-3">
+                
+              <div class="d-inline-flex " *ngIf="restaurant.surPlace else noInfosSurPlace">
+                  <span class="sur-place pe-3" style="color:#545454">Sur place :</span>            
+                  <app-icon 
+                    [iconName]="restaurant.surPlace ? 'bi bi-check-square-fill' : 'bi bi-x-square-fill ps-2 pt-1 '"
+                    [iconColor]="restaurant.surPlace ? '#4ECB71' : '#ED2F2F'"
+                  ></app-icon>
+                </div>
+                <ng-template #noInfosSurPlace>
+                  <span class="d-flex" style="color:#545454">Sur place :</span> 
+                  <p style="font-size:1.9vh ;color:#545454">Infos non disponible.</p>
+                </ng-template>
+                
+                <div class="d-inline-flex " *ngIf="restaurant.aEmporter != null else noInfosAEmporter">
+                  <span class="a-emporter pe-2 ps-4 " style="color:#545454">A emporter :</span>  
+                  <app-icon 
+                    [iconName]="restaurant.aEmporter ? 'bi bi-check-square-fill' : 'bi bi-x-square-fill ps-2 pt-1'"
+                    [iconColor]="restaurant.aEmporter ? '#4ECB71' : '#ED2F2F'"
+                  ></app-icon>
+                </div>
+                <ng-template #noInfosAEmporter>
+                  <span class="d-flex a-emporter pt-2 " style="color:#545454">A emporter :</span> 
+                  <p style="font-size:1.9vh ;color:#545454">Infos non disponible.</p>
+                </ng-template>
+            </div>
           <div class="trait-rouge pt-3"></div>
           <div class="critere d-flex justify-content-center ps-1 pt-3 pb-3">
             <span class="acces-pmr pe-1" style="color:#545454">Accès PMR :</span>
 
-            <app-icon
-            [iconName]="restaurant.accesPMR ? 'bi bi-check-square-fill' : 'bi bi-x-square-fill ps-1 pt-1'"
-            [iconColor]="restaurant.accesPMR ? '#4ECB71' : '#ED2F2F'"
-          ></app-icon>
+            <div class="d-inline-flex " *ngIf="restaurant.accesPMR else noAccesPMR">
+              <app-icon 
+              [iconName]="restaurant.accesPMR ? 'bi bi-check-square-fill' : 'bi bi-x-square-fill ps-1 pt-1'"
+              [iconColor]="restaurant.accesPMR ? '#4ECB71' : '#ED2F2F'"
+              ></app-icon>
+            </div>
+            <!-- le else de notre *ngIf plus haut-->
+            <ng-template #noAccesPMR>
+             <p class=" ps-2"style="font-size:1.9vh ;color:#545454">Infos non disponible.</p>
+            </ng-template>
+            <!--  ------------------------------------  -->
           </div>
           <div class="reserver pt-2">
             <button type="button" class="button">Réserver</button>
           </div>
         </div>
+
       </div>
+
+    
 </div>

src/app/card-resto/card-resto.component.ts

@@ -13,15 +13,15 @@ export class CardRestoComponent implements OnInit {
   @Input() likeResto: any; 
   @Output() clickLike = new EventEmitter<boolean>();
   isLiked : boolean = false;
+  priceRef = ["Info indisponible","1-10€ ","11-20€","21-30€","31-40€"];
   
   constructor(private apiBackService : ApiBackService) {
     this.distance = 0 ;
+  
    }
 
   ngOnInit(): void {
 
-    console.log(this.restaurant);
-
     this.distance = Math.round(
       this.apiBackService.setDistance(
       48.86201110271593 , //latitude Simplon
@@ -30,9 +30,6 @@ export class CardRestoComponent implements OnInit {
       this.restaurant.longitude)
       );
  
-    console.log(this.distance);
-      
-    
   }
   onClickLike() {
     console.log('click');

src/app/pages/admin-page/admin-page.component.html

@@ -0,0 +1 @@
+<app-add-restau></app-add-restau>

src/app/pages/admin-page/admin-page.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { AdminPageComponent } from './admin-page.component';
+
+describe('AdminPageComponent', () => {
+  let component: AdminPageComponent;
+  let fixture: ComponentFixture<AdminPageComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ AdminPageComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(AdminPageComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/pages/admin-page/admin-page.component.ts

@@ -0,0 +1,23 @@
+import { Component, OnInit } from '@angular/core';
+import { FormControl, FormGroup, Validators } from '@angular/forms';
+import { Router } from '@angular/router';
+import { ApiBackService } from 'src/app/services/api-back.service';
+import { Restaurant } from '../models/restaurant';
+
+@Component({
+  selector: 'app-admin-page',
+  templateUrl: './admin-page.component.html',
+  styleUrls: ['./admin-page.component.scss']
+})
+export class AdminPageComponent implements OnInit {
+
+
+  constructor( ) {
+   
+  }
+
+  ngOnInit(): void {
+  }
+
+
+}

src/app/pages/models/restaurant.ts

@@ -0,0 +1,13 @@
+export interface Restaurant {
+    id?:number;
+    nom: string;
+    adresse: string;
+    prix?: number;
+    latitude: string;
+    longitude: string;
+    telephone ?: string;
+    website ?: string;
+    aEmporter?: boolean;
+    accesPMR?: boolean;
+    surPlace?: boolean;
+}

src/app/pages/resto-page/resto-page.component.ts

@@ -31,6 +31,9 @@ export class RestoPageComponent implements OnInit {
 
     })
     }
+  console.log(this.apiBackService);
+  
+    
     
 
     

src/app/services/api-back.service.ts

@@ -2,6 +2,7 @@ import { Injectable, Input } from '@angular/core';
 import { Observable, of, Subject } from 'rxjs';
 import { HttpClient } from '@angular/common/http';
 import { environment } from 'src/environments/environment';
+import { Restaurant } from '../pages/models/restaurant';
 
 @Injectable({
   providedIn: 'root'
@@ -57,7 +58,10 @@ export class ApiBackService {
       deg2rad(deg : number) {
         return deg * (Math.PI/180)
       }
-    }
     
+  addRestaurant( newRestau : Restaurant) : Observable<any>{
+    return this.httpClient.post<any[]>(`${environment.apiUrl}/add-restaurant`, newRestau);
     
+  }
 
+}