From ed7f110577c5d4df2cbde9330275e11f60326476 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Johnny=20Marie=CC=81thoz?= <Johnny.Mariethoz@rero.ch>
Date: Wed, 8 Jan 2025 13:59:14 +0100
Subject: [PATCH] primeng: admin stat configurations
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-Authored-by: Johnny Mariéthoz <Johnny.Mariethoz@rero.ch>
Co-Authored-by: Bertrand Zuchuat <bertrand.zuchuat@rero.ch>
---
 .../statistics-cfg-brief-view-component.ts    | 22 +++----
 .../report-data/report-data.component.html    |  2 +-
 .../reports-list/reports-list.component.html  |  4 +-
 .../statistics-cfg-detail-view.component.html | 63 +++++++++----------
 4 files changed, 45 insertions(+), 46 deletions(-)

diff --git a/projects/admin/src/app/record/brief-view/statistics-cfg-brief-view-component.ts b/projects/admin/src/app/record/brief-view/statistics-cfg-brief-view-component.ts
index c42d9ba57..1241c29f6 100644
--- a/projects/admin/src/app/record/brief-view/statistics-cfg-brief-view-component.ts
+++ b/projects/admin/src/app/record/brief-view/statistics-cfg-brief-view-component.ts
@@ -21,23 +21,23 @@ import { ResultItem } from '@rero/ng-core';
 @Component({
   selector: 'admin-statistics-cfg-brief-view',
   template: `
-  <h5 class="mb-0 card-title">
+  <h5>
     <i
-      class="fa fa-circle mr-2"
+      class="fa fa-circle"
       [title]="activeLabel"
       [ngClass]="{'text-success': record.metadata.is_active, 'text-danger': !record.metadata.is_active}"
-    ></i>
-  <a [routerLink]="[detailUrl.link]">{{ record.metadata.name }}</a></h5>
-  <div class="card-text">
+    ></i>&nbsp;<a [routerLink]="[detailUrl.link]">{{ record.metadata.name }}</a></h5>
+  <div>
     @if (record.metadata.description) {
       <div [innerHTML]="record.metadata.description | truncateText: 30"></div>
     }
-    <div>
-      <b translate>Category</b>: {{ record.metadata.category.type | translate }}
-    </div>
-    <div>
-      <b translate>Indicator</b>: {{ record.metadata.category.indicator.type | translate }}
-    </div>
+    <dl class="metadata">
+      <dt translate>Category</dt>
+      <dd>{{ record.metadata.category.type | translate }}</dd>
+
+      <dt translate>Indicator</dt>
+      <dd>{{ record.metadata.category.indicator.type | translate }}</dd>
+    </dl>
   </div>
   `
   })
diff --git a/projects/admin/src/app/record/detail-view/statistics-cfg-detail-view/report-data/report-data.component.html b/projects/admin/src/app/record/detail-view/statistics-cfg-detail-view/report-data/report-data.component.html
index e94c9d0eb..5324a69cd 100644
--- a/projects/admin/src/app/record/detail-view/statistics-cfg-detail-view/report-data/report-data.component.html
+++ b/projects/admin/src/app/record/detail-view/statistics-cfg-detail-view/report-data/report-data.component.html
@@ -26,5 +26,5 @@
     </ng-template>
   </p-table>
 } @else {
-  <p class="m-0 px-4 py-2 text-muted" translate>No result</p>
+  <p class="m-0 px-4 py-2 text-color-secondary" translate>No result</p>
 }
diff --git a/projects/admin/src/app/record/detail-view/statistics-cfg-detail-view/reports-list/reports-list.component.html b/projects/admin/src/app/record/detail-view/statistics-cfg-detail-view/reports-list/reports-list.component.html
index 62651d4cd..837035e81 100644
--- a/projects/admin/src/app/record/detail-view/statistics-cfg-detail-view/reports-list/reports-list.component.html
+++ b/projects/admin/src/app/record/detail-view/statistics-cfg-detail-view/reports-list/reports-list.component.html
@@ -25,7 +25,7 @@
           </a>
         </td>
         <td class="text-right">
-          <a class="btn btn-link btn-outline-primary" [href]="getReportUrl(report.metadata.pid)+'?format=csv'">
+          <a pButton text [href]="getReportUrl(report.metadata.pid)+'?format=csv'">
             <i class="fa fa-download"></i>
           </a>
         </td>
@@ -33,5 +33,5 @@
     </ng-template>
   </p-table>
 } @else {
-  <p class="m-0 px-4 py-2 text-muted" translate>No result</p>
+  <p class="m-0 px-4 py-2 text-color-secondary" translate>No result</p>
 }
diff --git a/projects/admin/src/app/record/detail-view/statistics-cfg-detail-view/statistics-cfg-detail-view.component.html b/projects/admin/src/app/record/detail-view/statistics-cfg-detail-view/statistics-cfg-detail-view.component.html
index ec566fcd0..609958ac7 100644
--- a/projects/admin/src/app/record/detail-view/statistics-cfg-detail-view/statistics-cfg-detail-view.component.html
+++ b/projects/admin/src/app/record/detail-view/statistics-cfg-detail-view/statistics-cfg-detail-view.component.html
@@ -15,28 +15,28 @@
   along with this program.  If not, see <http://www.gnu.org/licenses/>.
 -->
 @if (record) {
-  <header class="mb-2">
+  <header>
     <h1>{{ record.metadata.name }}</h1>
     <span [innerHTML]="record.metadata.description | nl2br"></span>
   </header>
-  <section class="my-4">
-    <dl class="grid mb-0">
-      <dt class="col-3 label-title" translate>Library</dt>
-      <dd class="col-9">{{ record.metadata.library.$ref | getRecord: 'libraries' : 'field' : 'name' | async }}</dd>
+  <section>
+    <dl class="metadata">
+      <dt translate>Library</dt>
+      <dd>{{ record.metadata.library.$ref | getRecord: 'libraries' : 'field' : 'name' | async }}</dd>
 
-      <dt class="col-3 label-title" translate>Is active</dt>
-      <dd class="col-9">
+      <dt translate>Is active</dt>
+      <dd>
         <i
           class="fa fa-circle"
           [ngClass]="{'text-success': record.metadata.is_active, 'text-danger': !record.metadata.is_active}"
         ></i>
       </dd>
-      <dt class="col-3 label-title" translate>Frequency</dt>
-      <dd class="col-9">{{ record.metadata.frequency | translate }}</dd>
+      <dt translate>Frequency</dt>
+      <dd>{{ record.metadata.frequency | translate }}</dd>
       @if (record.metadata.filter_by_libraries?.length > 0) {
-        <dt class="col-3 label-title" translate>Filter numbers by libraries</dt>
-        <dd class="col-9">
-          <ul class="list-unstyled">
+        <dt translate>Filter numbers by libraries</dt>
+        <dd>
+          <ul class="list-none m-0 p-0">
             @for (lib of record.metadata.filter_by_libraries; track lib) {
               <li>
                 {{ lib.$ref| getRecord: 'libraries' : 'field' : 'name' | async }}
@@ -48,52 +48,51 @@ <h1>{{ record.metadata.name }}</h1>
     </dl>
 
     <p-fieldset styleClass="mt-3" [legend]="'Configuration'|translate">
-      <dl class="grid mb-0">
+      <dl class="metadata">
 
-        <dt class="col-3 label-title" translate>Category</dt>
-        <dd class="col-9">{{ record.metadata.category.type | translate }}</dd>
+        <dt translate>Category</dt>
+        <dd>{{ record.metadata.category.type | translate }}</dd>
 
-        <dt class="col-3 label-title" translate>Indicator</dt>
-        <dd class="col-9">{{ record.metadata.category.indicator.type | translate }}</dd>
+        <dt translate>Indicator</dt>
+        <dd>{{ record.metadata.category.indicator.type | translate }}</dd>
 
         @if (record.metadata.category.indicator.period) {
-          <dt class="col-3 label-title" translate>Period</dt>
-          <dd class="col-9">{{ record.metadata.category.indicator.period | translate }}</dd>
+          <dt translate>Period</dt>
+          <dd>{{ record.metadata.category.indicator.period | translate }}</dd>
         }
 
         @if (record.metadata.category.indicator.distributions) {
-          <dt class="col-3 label-title" translate>Distributions</dt>
-          <dd class="col-9">
-            <ul class="list-inline mb-0">
+          <dt translate>Distributions</dt>
+          <dd>
+            <ul class="list-none m-0 p-0">
               @for (dist of record.metadata.category.indicator.distributions; track dist; let last = $last) {
-                <li class="list-inline-item">{{ dist | translate }}{{ last ? '' : ' / ' }}</li>
+                <li class="inline">{{ dist | translate }}{{ last ? '' : ' / ' }}</li>
               }
             </ul>
           </dd>
         }
-
         @if (record.metadata.category.indicator.filter) {
-          <dt class="col-3 label-title" translate>Filter</dt>
-          <dd class="col-9">{{ record.metadata.category.indicator.filter }}</dd>
+          <dt translate>Filter</dt>
+          <dd>{{ record.metadata.category.indicator.filter }}</dd>
         }
         @if (record.created) {
-          <dt class="col-3 label-title" translate>Created at</dt>
-          <dd class="col-9">{{ record.created | dateTranslate: 'medium' }}</dd>
+          <dt translate>Created at</dt>
+          <dd>{{ record.created | dateTranslate: 'medium' }}</dd>
         }
         @if (record.updated) {
-          <dt class="col-3 label-title" translate>Updated at</dt>
-          <dd class="col-9">{{ record.updated | dateTranslate: 'medium' }}</dd>
+          <dt translate>Updated at</dt>
+          <dd>{{ record.updated | dateTranslate: 'medium' }}</dd>
         }
       </dl>
     </p-fieldset>
   </section>
   <p-tabView (onChange)="tabViewChange($event)">
     <p-tabPanel [header]="'Reports'|translate">
-      <admin-reports-list [pid]="record.metadata.pid"></admin-reports-list>
+      <admin-reports-list [pid]="record.metadata.pid" />
     </p-tabPanel>
     <p-tabPanel [header]="'Live Values'|translate">
       @if (liveData) {
-        <admin-report-data [data]="liveData"></admin-report-data>
+        <admin-report-data [data]="liveData" />
       }
       @if (liveDataError) {
         <p-messages