Feat frontend/synthese: add BDC status text infos to observation modal

Resolve #1492.
PnX-SI · Nov 29, 2022 · 357028a · 357028a
1 parent fae4c55
commit 357028a
Show file tree

Hide file tree

Showing 3 changed files with 57 additions and 11 deletions.
diff --git a/frontend/src/app/GN2CommonModule/form/data-form.service.ts b/frontend/src/app/GN2CommonModule/form/data-form.service.ts
@@ -145,8 +145,14 @@ export class DataFormService {
     });
   }
 
-  getTaxonInfo(cd_nom: number) {
-    return this._http.get<Taxon>(`${AppConfig.API_TAXHUB}/taxref/${cd_nom}`);
+  getTaxonInfo(cd_nom: number, areasStatus?: Array<string>) {
+    let query_string = new HttpParams();
+    if (areasStatus) {
+      query_string = query_string.append('areas_status', areasStatus.join(','));
+    }
+    return this._http.get<Taxon>(`${AppConfig.API_TAXHUB}/taxref/${cd_nom}`, {
+      params: query_string
+    });
   }
 
   getTaxonAttributsAndMedia(cd_nom: number, id_attributs?: Array<number>) {

diff --git a/...nd/src/app/shared/syntheseSharedModule/synthese-info-obs/synthese-info-obs.component.html b/...nd/src/app/shared/syntheseSharedModule/synthese-info-obs/synthese-info-obs.component.html
@@ -389,16 +389,54 @@ <h5 class="underlined underlined-sm main-color">Attribut(s) Taxonomique(s) locau
       </tr>
     </table>
 
-    <h5 class="underlined underlined-sm main-color">Réglementation</h5>
-    <table class="font-xs table table-striped table-sm">
-      <tr *ngFor="let arrete of selectedObsTaxonDetail?.statuts_protection">
-        <td>
-          <a [href]="arrete.url"> {{ arrete.intitule }} </a>
-        </td>
-      </tr>
+
+    <h5 class="underlined underlined-sm main-color">Statuts</h5>
+    <table
+      class="font-xs table table-sm"
+      *ngIf="selectedObsTaxonDetail?.status; else noStatus"
+    >
+      <ng-container *ngFor="let status of selectedObsTaxonDetail?.status | keyvalue">
+        <tr class="table-primary">
+          <th> {{ status.value.display }} </th>
+        </tr>
+        <tr *ngFor="let text of status.value.text | keyvalue">
+          <td>
+            <ul class="list-unstyled mt-2">
+              <li *ngIf="text.value.full_citation" class="d-flex w-100 justify-content-between">
+                <span class="flex-shrink-1 w-75">
+                  <strong [innerHtml]="text.value.full_citation | safeHTML"></strong>
+                  <br />
+                  ({{ text.value.lb_adm_tr }} - {{ text.value.cd_sig }})
+                </span>
+                <a
+                  *ngIf="text.value.doc_url"
+                  class="btn align-self-start"
+                  href="{{ text.value.doc_url }}"
+                  mat-stroked-button
+                  color="primary"
+                  target="_blank"
+                >
+                  Voir / Télécharger
+                  <mat-icon aria-hidden="true">launch</mat-icon>
+                </a>
+              </li>
+              <li>
+                <span *ngFor="let value of text.value.values | keyvalue">
+                  <strong *ngIf="value.value.code != 'true'">
+                    {{ value.value.code_statut }}
+                  </strong>
+                  {{ value.value.label_statut }}
+                  {{ value.value.rq_statut }}
+                </span>
+              </li>
+            </ul>
+          </td>
+        </tr>
+      </ng-container>
+
     </table>
+    <ng-template #noStatus><p >Aucun</p></ng-template>
   </mat-tab>
-
   <ng-container *ngIf="selectedObs?.medias?.length">
     <mat-tab label="Médias">
       <h5 class="underlined underlined-sm main-color">Médias</h5>

diff --git a/...tend/src/app/shared/syntheseSharedModule/synthese-info-obs/synthese-info-obs.component.ts b/...tend/src/app/shared/syntheseSharedModule/synthese-info-obs/synthese-info-obs.component.ts
@@ -147,7 +147,9 @@ export class SyntheseInfoObsComponent implements OnInit, OnChanges {
         if (this.selectedObs['unique_id_sinp']) {
           this.loadValidationHistory(this.selectedObs['unique_id_sinp']);
         }
-        this._gnDataService.getTaxonInfo(this.selectedObs['cd_nom']).subscribe((taxInfo) => {
+        let cdNom = this.selectedObs['cd_nom'];
+        let areasStatus = this.selectedObs['areas'].map(area => area.id_area);
+        this._gnDataService.getTaxonInfo(cdNom, areasStatus).subscribe(taxInfo => {
           this.selectedObsTaxonDetail = taxInfo;
           if (this.selectedObs.cor_observers) {
             this.email = this.selectedObs.cor_observers