feat(api): Mise en place d'une solution mock

angular.json

@@ -74,7 +74,8 @@
         "serve": {
           "builder": "@angular-devkit/build-angular:dev-server",
           "options": {
-            "browserTarget": "pamn:build"
+            "browserTarget": "pamn:build",
+            "proxyConfig": "proxy.conf.json"
           },
           "configurations": {
             "production": {

api/db.json

+{
+  "structure": [
+    {
+      "id": "26-28",
+      "created_on": "22/09/2020 16:01",
+      "last_modif": "22/09/2020 16:01",
+      "owner": "-",
+      "status": "Un établissement principal (siège social)",
+      "nom": "Labit",
+      "type_structure": "MDM",
+      "description": "Ouvert à toute heure",
+      "num": "12",
+      "voie": "27838 Avenue Lacassagne",
+      "telephone": "0134257645",
+      "courriel": "coop.labit@gmail.com",
+      "site_web": "",
+      "facebook": "",
+      "twitter": "",
+      "instagram": "",
+      "civilite_contact": "Madame",
+      "nom_contact": "Labit",
+      "prenom_contact": "Valentine",
+      "email_contact": "coop.labit@gmail.com",
+      "fonction_contact": "Président de l'association",
+      "pmr": true,
+      "je_fais_a_la_place_de_lusager": true,
+      "accompagnement_aux_demarches": ["Pôle Emploi", "CPAM", "Impôts", "Logement"],
+      "wifi": true
+    },
+    {
+      "id": "26-10",
+      "created_on": "03/09/2020 14:14",
+      "last_modif": "03/09/2020 14:15",
+      "owner": "Marlène Simondant",
+      "status": "Un établissement principal (siège social)",
+      "nom": "fgh",
+      "type_structure": "Bibliothèque",
+      "description": "",
+      "num": "",
+      "voie": "26061 13ème Rue Cité Berliet",
+      "telephone": "0659856235",
+      "courriel": "test@test.te",
+      "site_web": "",
+      "facebook": "",
+      "twitter": "",
+      "instagram": "",
+      "civilite_contact": "",
+      "nom_contact": "dh",
+      "prenom_contact": "fxh",
+      "email_contact": "test@test.te",
+      "fonction_contact": "Bénévole",
+      "pmr": false,
+      "je_fais_a_la_place_de_lusager": false,
+      "accompagnement_aux_demarches": ["CPAM"],
+      "wifi": false
+    }
+  ]
+}

api/routes.json

+{
+  "/api/*": "/$1"
+}

package.json

@@ -10,7 +10,8 @@
     "lint": "ng lint",
     "e2e": "ng e2e",
     "release": "standard-version",
-    "translate": "ng xi18n --output-path src/locale --out-file messages.en.xlf"
+    "translate": "ng xi18n --output-path src/locale --out-file messages.en.xlf",
+    "api": "json-server api/db.json --routes api/routes.json --no-cors=true"
   },
   "private": true,
   "dependencies": {
@@ -24,6 +25,7 @@
     "@angular/platform-browser": "~10.1.3",
     "@angular/platform-browser-dynamic": "~10.1.3",
     "@angular/router": "~10.1.3",
+    "json-server": "^0.16.2",
     "rxjs": "~6.6.0",
     "tslib": "^2.0.0",
     "zone.js": "~0.10.2"

proxy.conf.json

+{
+  "/api": {
+    "target": "http://localhost:3000"
+  }
+}

src/app/structure/components/card/card.component.html

-<p>card wsdorks!</p>
+<span class="divider"></span>
+<span class="nbStructuresLabel">140 structures</span>
+
+<div class="structure">
+  <span class="typeStructure">Bibliothèque</span>
+  <div class="headerStructure" fxLayout="row" fxLayoutAlign="space-between center">
+    <span class="nomStructure">Nom de la structure</span>
+    <div class="distanceStructure">
+      <span>|-----| 63 m</span>
+    </div>
+  </div>
+  <br />
+  <div class="statusStructure" fxLayout="row" fxLayoutAlign="start center" fxLayoutGap="1vw">
+    <span class="dot"></span>
+    <span>Ouvert actuellement</span>
+  </div>
+</div>

src/app/structure/components/card/card.component.scss

+.nbStructuresLabel {
+  color: #828282;
+  padding: 10px;
+  font-size: 14px;
+}
+.structure {
+  padding: 12px 0 12px 0;
+  border-bottom: 1px dashed #bdbdbd;
+  .typeStructure {
+    color: #828282;
+  }
+  .headerStructure {
+    .nomStructure {
+      font-weight: bold;
+      color: #594d59;
+      font-size: 22px;
+    }
+  }
+  &:last-child {
+    border-bottom: none;
+  }
+}

src/app/structure/components/card/card.component.ts

 import { Component, OnInit } from '@angular/core';
+import { Structure } from '../../models/structure.model';
 
 @Component({
   selector: 'app-card',
   templateUrl: './card.component.html',
-  styleUrls: ['./card.component.scss']
+  styleUrls: ['./card.component.scss'],
 })
 export class CardComponent implements OnInit {
+  structure: Structure[] = [];
+  servicesProposes: any = [
+    { val: 'CAF', text: 'Droits à la CAF' },
+    { val: 'Pôle Emploi', text: 'Droits à Pôle Emploi' },
+    { val: 'Impôts', text: 'Droits aux Impots' },
+    { val: 'CPAM', text: 'Droits à la CPAM (AMELI)' },
+  ];
+  constructor() {}
 
-  constructor() { }
-
-  ngOnInit(): void {
-  }
-
+  ngOnInit(): void {}
 }

src/app/structure/models/structure.model.ts

+export class Structure {
+  id: string;
+  created_on: string;
+  last_modif: string;
+  owner: string;
+  status: string;
+  nom: string;
+  type_structure: string;
+  description: string;
+  num: string;
+  voie: string;
+  telephone: string;
+  courriel: string;
+  site_web: string;
+  facebook: string;
+  twitter: string;
+  instagram: string;
+  civilite_contact: string;
+  nom_contact: string;
+  prenom_contact: string;
+  email_contact: string;
+  fonction_contact: string;
+  pmr: boolean;
+  je_fais_a_la_place_de_lusager: boolean;
+  accompagnement_aux_demarches: string[];
+  wifi: boolean;
+}

src/app/structure/structure.component.html

-<app-card></app-card>
 <app-recherche></app-recherche>
+<app-card></app-card>

src/app/structure/structure.module.ts

@@ -3,10 +3,11 @@ import { CommonModule } from '@angular/common';
 import { StructureComponent } from './structure.component';
 import { CardComponent } from './components/card/card.component';
 import { RechercheComponent } from './components/recherche/recherche.component';
+import { HttpClientModule } from '@angular/common/http';
 
 @NgModule({
   declarations: [StructureComponent, CardComponent, RechercheComponent],
-  imports: [CommonModule],
+  imports: [CommonModule, HttpClientModule],
   exports: [StructureComponent],
 })
 export class StructureModule {}