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

Display the texts (status) when the cd_ref and the location of the observation match the texts. Resolve #1492.
PnX-SI · Feb 24, 2022 · ec06a52 · ec06a52
1 parent 0455dfb
commit ec06a52
Show file tree

Hide file tree

Showing 3 changed files with 60 additions and 9 deletions.
diff --git a/frontend/src/app/GN2CommonModule/form/data-form.service.ts b/frontend/src/app/GN2CommonModule/form/data-form.service.ts
@@ -144,8 +144,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
@@ -279,6 +279,52 @@ <h5 class="underlined underlined-sm main-color">Réglementation</h5>
         </td>
       </tr>
     </table>
+
+    <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.label }} </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 }}
+                  </strong>
+                  {{ value.value.label }}
+                  {{ 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">
@@ -458,4 +504,4 @@ <h5>Aire de répartition des observations valides</h5>
         </ng-template>
       </div>
   </mat-tab>
-  <mat-tab-group>
+  <mat-tab-group>
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
@@ -59,11 +59,10 @@ export class SyntheseInfoObsComponent implements OnInit, OnChanges {
 
   ngOnInit() {
     this.loadAllInfo(this.idSynthese);
-
   }
 
   ngOnChanges(changes: SimpleChanges): void {
-      if(changes.idSynthese && changes.idSynthese.currentValue) {
+      if (changes.idSynthese && changes.idSynthese.currentValue) {
         this.loadAllInfo(changes.idSynthese.currentValue)
       }
   }
@@ -72,7 +71,7 @@ export class SyntheseInfoObsComponent implements OnInit, OnChanges {
   // HACK to display a second map on validation tab
   setValidationTab(event) {
     this.showValidation = true;
-    if(this._mapService.map){
+    if (this._mapService.map){
       setTimeout(() => {
         this._mapService.map.invalidateSize();
       }, 100);
@@ -125,12 +124,13 @@ export class SyntheseInfoObsComponent implements OnInit, OnChanges {
           });
 
         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_status'];
+        this._gnDataService.getTaxonInfo(cdNom, areasStatus).subscribe(taxInfo => {
           this.selectedObsTaxonDetail = taxInfo;
           if (this.selectedObs.cor_observers) {
             this.email = this.selectedObs.cor_observers.map(el => el.email).join();
             this.mailto = this.formatMailContent(this.email);
-
           }
 
           this._gnDataService.getProfile(taxInfo.cd_ref).subscribe(profile => {
@@ -208,7 +208,6 @@ export class SyntheseInfoObsComponent implements OnInit, OnChanges {
       mailto = encodeURI(mailto);
       mailto = mailto.replace(/,/g, '%2c');
     }
-
     return mailto;
   }