Просмотр исходного кода

report dinamico iscritti - feedback

ferrari 1 месяц назад
Родитель
Сommit
5b24a293f6
2 измененных файлов с 17 добавлено и 8 удалено
  1. 7 0
      public/css/chart-reports.css
  2. 10 8
      resources/views/livewire/dynamic_report.blade.php

+ 7 - 0
public/css/chart-reports.css

@@ -1003,4 +1003,11 @@ canvas[id^="courses-chart-"] {
     overflow: hidden;
     overflow: hidden;
     position: relative;
     position: relative;
     width: 100%;
     width: 100%;
+}
+
+.missing-filter-warning,
+.missing-filter-warning .chart-placeholder {
+    height: 100%;
+    margin: 0;
+    box-sizing: border-box;
 }
 }

+ 10 - 8
resources/views/livewire/dynamic_report.blade.php

@@ -1,13 +1,7 @@
 {{-- resources/views/livewire/dynamic_report.blade.php --}}
 {{-- resources/views/livewire/dynamic_report.blade.php --}}
 <div id="card--dashboard">
 <div id="card--dashboard">
     <div>
     <div>
-        <div class="row" id="filter_msg" wire:ignore>
-            <div class="col-12">
-                <div class="alert alert-info">Seleziona uno o più criteri per visualizzare il report</div>
-            </div>
-        </div>
-
-        <div class="chart-row">
+        <div class="chart-row mb-3">
             <div class="chart-card">
             <div class="chart-card">
                 <div class="chart-body" style="padding-block: 20px">
                 <div class="chart-body" style="padding-block: 20px">
                     <div class="row row-gap-3">
                     <div class="row row-gap-3">
@@ -79,7 +73,15 @@
         <div class="chart-row mb-0">
         <div class="chart-row mb-0">
             <div class="chart-card">
             <div class="chart-card">
                 <div class="chart-body" wire:ignore>
                 <div class="chart-body" wire:ignore>
-                    <div class="chart-wrapper" style="height: 600px">
+                    <div class="chart-wrapper" style="height: calc(100dvh - 450px)">
+                        <div class="missing-filter-warning" id="filter_msg" wire:ignore>
+                            <div class="chart-placeholder">
+                                <div style="text-align: center;">
+                                    <div style="font-size: 3rem; margin-bottom: 1rem; opacity: 0.3;">📊</div>
+                                    <p style="font-size: 1.25rem; font-weight: 600; margin: 0;">Seleziona uno o più criteri per visualizzare il report</p>
+                                </div>
+                            </div>
+                        </div>
                         <canvas id="dynamicReportChart"></canvas>
                         <canvas id="dynamicReportChart"></canvas>
                     </div>
                     </div>
                 </div>
                 </div>