From 9ffaa62e0ff0f1e143dc4ea45bd69497ee90a65b Mon Sep 17 00:00:00 2001
From: HarmandI <isabelle44.74@gmail.com>
Date: Mon, 21 Mar 2022 13:04:19 +0100
Subject: [PATCH] composant plantForm + model

---
 .../formulaire/formulaire.component.html      | 127 +++++++++++++++++-
 .../formulaire/formulaire.component.ts        |  12 +-
 src/app/modules/admin/models/category.spec.ts |   7 +
 src/app/modules/admin/models/category.ts      |   3 +
 src/app/modules/admin/models/plant.spec.ts    |   7 +
 src/app/modules/admin/models/plant.ts         |  14 ++
 6 files changed, 164 insertions(+), 6 deletions(-)
 create mode 100644 src/app/modules/admin/models/category.spec.ts
 create mode 100644 src/app/modules/admin/models/category.ts
 create mode 100644 src/app/modules/admin/models/plant.spec.ts
 create mode 100644 src/app/modules/admin/models/plant.ts

diff --git a/src/app/modules/admin/components/formulaire/formulaire.component.html b/src/app/modules/admin/components/formulaire/formulaire.component.html
index a68eae0..0b8b45e 100644
--- a/src/app/modules/admin/components/formulaire/formulaire.component.html
+++ b/src/app/modules/admin/components/formulaire/formulaire.component.html
@@ -1 +1,126 @@
-<p>formulaire works!</p>
+<form (ngSubmit)="onSubmit()" [formGroup]="plantForm">
+  <div class="form-floating">
+    <input
+      type="text"
+      class="form-control"
+      id="floatingInputName"
+      placeholder=""
+      name="name"
+      formControlName="nameFc"
+      [ngClass]="{
+        'is-valid':
+          plantForm.controls['nameFc'].touched &&
+          plantForm.controls['nameFc'].valid,
+        'is-invalid':
+          plantForm.controls['nameFc'].touched &&
+          !plantForm.controls['nameFc'].valid
+      }"
+    />
+    <label for="floatingInputName">Nom</label>
+  </div>
+  <div class="form-floating">
+    <input
+      type="text"
+      class="form-control"
+      id="floatingInputPrice"
+      placeholder=""
+      name="price"
+      formControlName="priceFc"
+      [ngClass]="{
+        'is-valid':
+          plantForm.controls['priceFc'].touched &&
+          plantForm.controls['priceFc'].valid,
+        'is-invalid':
+          plantForm.controls['priceFc'].touched &&
+          !plantForm.controls['priceFc'].valid
+      }"
+    />
+    <label for="floatingInputPrice">Prix</label>
+  </div>
+  <div class="form-floating">
+    <input
+      type="number"
+      class="form-control"
+      id="floatingInputQuantity"
+      placeholder=""
+      name="quantity"
+      formControlName="quantityFc"
+      [ngClass]="{
+        'is-valid':
+          plantForm.controls['quantityFc'].touched &&
+          plantForm.controls['quantityFc'].valid,
+        'is-invalid':
+          plantForm.controls['quantityFc'].touched &&
+          !plantForm.controls['quantityFc'].valid
+      }"
+    />
+    <label for="floatingInputQuantity">Quantité</label>
+  </div>
+  <div class="form-floating">
+    <input
+      type="text"
+      class="form-control"
+      id="floatingCategory"
+      placeholder=""
+      name="category"
+      formControlName="categoryFc"
+      [ngClass]="{
+        'is-valid':
+          plantForm.controls['categoryFc'].touched &&
+          plantForm.controls['categoryFc'].valid,
+        'is-invalid':
+          plantForm.controls['categoryFc'].touched &&
+          !plantForm.controls['categoryFc'].valid
+      }"
+    />
+    <label for="floatingInputCategory">Catégorie</label>
+  </div>
+  <div class="form-floating">
+    <input
+      type="number"
+      class="form-control"
+      id="floatingRating"
+      placeholder=""
+      name="rating"
+      formControlName="ratingFc"
+      [ngClass]="{
+        'is-valid':
+          plantForm.controls['ratingFc'].touched &&
+          plantForm.controls['ratingFc'].valid,
+        'is-invalid':
+          plantForm.controls['ratingFc'].touched &&
+          !plantForm.controls['ratingFc'].valid
+      }"
+    />
+    <label for="floatingRating">Note</label>
+  </div>
+  <div class="form-floating select">
+    <select
+      class="form-control"
+      id="floatingInputInStock"
+      placeholder=""
+      name="inStock"
+      formControlName="inStockFc"
+    >
+      <option value="disponible">Disponible</option>
+      <option value="partiellement disponible">Partiellement disponible</option>
+      <option value="non disponible">Non disponible</option>
+    </select>
+    <label value="disponible">Sélectionnez disponibilité</label>
+  </div>
+
+  <button
+    class="w-100 btn btn-lg btn-outline-success"
+    type="submit"
+    [disabled]="plantForm.invalid"
+  >
+    Créer une plante
+  </button>
+  <button
+    class="w-100 btn btn-lg btn-outline-success"
+    type="submit"
+    [disabled]="plantForm.invalid"
+  >
+    Modifier une plante
+  </button>
+</form>
diff --git a/src/app/modules/admin/components/formulaire/formulaire.component.ts b/src/app/modules/admin/components/formulaire/formulaire.component.ts
index 034de40..d3730f6 100644
--- a/src/app/modules/admin/components/formulaire/formulaire.component.ts
+++ b/src/app/modules/admin/components/formulaire/formulaire.component.ts
@@ -1,15 +1,17 @@
 import { Component, OnInit } from '@angular/core';
+import { FormGroup } from '@angular/forms';
 
 @Component({
   selector: 'app-formulaire',
   templateUrl: './formulaire.component.html',
-  styleUrls: ['./formulaire.component.scss']
+  styleUrls: ['./formulaire.component.scss'],
 })
 export class FormulaireComponent implements OnInit {
+  plantForm!: FormGroup;
+  constructor() {}
 
-  constructor() { }
-
-  ngOnInit(): void {
-  }
+  ngOnInit(): void {}
 
+  onSubmit(){}
 }
+
diff --git a/src/app/modules/admin/models/category.spec.ts b/src/app/modules/admin/models/category.spec.ts
new file mode 100644
index 0000000..484f29f
--- /dev/null
+++ b/src/app/modules/admin/models/category.spec.ts
@@ -0,0 +1,7 @@
+import { Category } from './category';
+
+describe('Category', () => {
+  it('should create an instance', () => {
+    expect(new Category()).toBeTruthy();
+  });
+});
diff --git a/src/app/modules/admin/models/category.ts b/src/app/modules/admin/models/category.ts
new file mode 100644
index 0000000..29df5ac
--- /dev/null
+++ b/src/app/modules/admin/models/category.ts
@@ -0,0 +1,3 @@
+export class Category {
+  name: string[]=['plantes vertes'];
+}
diff --git a/src/app/modules/admin/models/plant.spec.ts b/src/app/modules/admin/models/plant.spec.ts
new file mode 100644
index 0000000..37ee9d8
--- /dev/null
+++ b/src/app/modules/admin/models/plant.spec.ts
@@ -0,0 +1,7 @@
+import { Plant } from './plant';
+
+describe('Plant', () => {
+  it('should create an instance', () => {
+    expect(new Plant()).toBeTruthy();
+  });
+});
diff --git a/src/app/modules/admin/models/plant.ts b/src/app/modules/admin/models/plant.ts
new file mode 100644
index 0000000..e334571
--- /dev/null
+++ b/src/app/modules/admin/models/plant.ts
@@ -0,0 +1,14 @@
+import { Category } from "./category";
+
+export class Plant {
+  constructor(
+    public name: string='',
+    public price: number =1,
+    public quantity: number= 0,
+    public instock: boolean= true,
+    public category:Category,
+    public urlPicture: string = "https//picsum.photos/id/18/200/300",
+    public rating: number = 0,
+    public id?: number
+  ){}
+}