feat: mensagem de nenhuma informação encontrada na listagem de unidad…

…es implementada
gustavoestevesr · Jul 17, 2024 · 1514e41 · 1514e41
1 parent 046161b
commit 1514e41
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 16 deletions.
diff --git a/src/app/app.component.html b/src/app/app.component.html
@@ -1,9 +1,19 @@
-<div class="app-container">
-  <app-header></app-header>
-  <app-form (submitEvent)="onSubmitEvent()" (clearEvent)="onClearEvent()"></app-form>
-  <app-legend></app-legend>
-  <ng-container *ngIf="showList$ | async">
-    <app-list-units [listOfUnits]="listOfUnits"></app-list-units>
-  </ng-container>
-  <app-footer></app-footer>
-</div>
+<div class="app-container">
+  <app-header></app-header>
+  <app-form
+    (submitEvent)="onSubmitEvent()"
+    (clearEvent)="onClearEvent()"
+  ></app-form>
+  <app-legend></app-legend>
+  <ng-container *ngIf="showList$ | async">
+    <ng-container *ngIf="listOfUnits.length; else noUnits">
+      <app-list-units [listOfUnits]="listOfUnits"></app-list-units>
+    </ng-container>
+    <ng-template #noUnits>
+      <span class="text-center">
+        Nenhuma informação encontrada...</span
+      ></ng-template
+    >
+  </ng-container>
+  <app-footer></app-footer>
+</div>
diff --git a/src/app/app.component.scss b/src/app/app.component.scss
@@ -1,7 +1,11 @@
-.app-container {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  gap: 32px;
-}
+.app-container {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+}
+
+.text-center {
+  text-align: center;
+}