|
|
@@ -1,540 +1,107 @@
|
|
|
<div class="dashboard-container">
|
|
|
- <style>
|
|
|
- .dashboard-container {
|
|
|
- background: #F6F7FF;
|
|
|
- min-height: 100vh;
|
|
|
- padding: 20px;
|
|
|
- font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
|
|
- }
|
|
|
-
|
|
|
- .dashboard-grid {
|
|
|
- display: grid;
|
|
|
- grid-template-columns: 1fr 1fr 1fr;
|
|
|
- gap: 20px;
|
|
|
- margin-bottom: 20px;
|
|
|
- }
|
|
|
-
|
|
|
- .dashboard-section {
|
|
|
- background: white;
|
|
|
- border-radius: 12px;
|
|
|
- padding: 20px;
|
|
|
- box-shadow: 0 2px 10px rgba(0,0,0,0.05);
|
|
|
- }
|
|
|
-
|
|
|
- .stat-card {
|
|
|
- background: white;
|
|
|
- border-radius: 12px;
|
|
|
- padding: 20px;
|
|
|
- box-shadow: 0 2px 10px rgba(0,0,0,0.05);
|
|
|
- position: relative;
|
|
|
- }
|
|
|
-
|
|
|
- .stat-card-header {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- margin-bottom: 10px;
|
|
|
- }
|
|
|
-
|
|
|
- .stat-card-title {
|
|
|
- font-size: 14px;
|
|
|
- color: #666;
|
|
|
- font-weight: 500;
|
|
|
- }
|
|
|
-
|
|
|
- .stat-card-value {
|
|
|
- font-size: 48px;
|
|
|
- font-weight: bold;
|
|
|
- color: #333;
|
|
|
- margin: 10px 0;
|
|
|
- }
|
|
|
-
|
|
|
- .stat-card-change {
|
|
|
- font-size: 12px;
|
|
|
- color: #666;
|
|
|
- }
|
|
|
-
|
|
|
- .stat-card-change.positive {
|
|
|
- color: #339E8E;
|
|
|
- }
|
|
|
-
|
|
|
- .stat-card-change.negative {
|
|
|
- color: #D6234F;
|
|
|
- }
|
|
|
-
|
|
|
- .stat-icon {
|
|
|
- width: 24px;
|
|
|
- height: 24px;
|
|
|
- border-radius: 4px;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- color: white;
|
|
|
- font-size: 12px;
|
|
|
- }
|
|
|
-
|
|
|
- .courses-list {
|
|
|
- max-height: 300px;
|
|
|
- overflow-y: auto;
|
|
|
- }
|
|
|
-
|
|
|
- .course-item {
|
|
|
- padding: 12px;
|
|
|
- border-left: 4px solid #7438FA;
|
|
|
- margin-bottom: 8px;
|
|
|
- background: #F6F7FF;
|
|
|
- border-radius: 0 8px 8px 0;
|
|
|
- }
|
|
|
-
|
|
|
- .course-time {
|
|
|
- font-weight: bold;
|
|
|
- color: #333;
|
|
|
- font-size: 14px;
|
|
|
- }
|
|
|
-
|
|
|
- .course-name {
|
|
|
- font-size: 13px;
|
|
|
- color: #7438FA;
|
|
|
- font-weight: 600;
|
|
|
- }
|
|
|
-
|
|
|
- .course-days {
|
|
|
- font-size: 12px;
|
|
|
- color: #666;
|
|
|
- }
|
|
|
-
|
|
|
- .fields-grid {
|
|
|
- display: grid;
|
|
|
- grid-template-columns: 1fr 1fr;
|
|
|
- gap: 10px;
|
|
|
- }
|
|
|
-
|
|
|
- .field-item {
|
|
|
- padding: 12px;
|
|
|
- border: 2px solid #339E8E;
|
|
|
- border-radius: 8px;
|
|
|
- text-align: center;
|
|
|
- background: white;
|
|
|
- }
|
|
|
-
|
|
|
- .field-item.occupied {
|
|
|
- border-color: #D6234F;
|
|
|
- background: #FFF5F7;
|
|
|
- }
|
|
|
-
|
|
|
- .field-name {
|
|
|
- font-weight: bold;
|
|
|
- color: #333;
|
|
|
- }
|
|
|
-
|
|
|
- .field-time {
|
|
|
- color: #666;
|
|
|
- font-size: 12px;
|
|
|
- }
|
|
|
-
|
|
|
- .notes-section {
|
|
|
- background: #F6F7FF;
|
|
|
- border-radius: 8px;
|
|
|
- padding: 15px;
|
|
|
- margin-top: 15px;
|
|
|
- }
|
|
|
-
|
|
|
- .notes-input {
|
|
|
- width: 100%;
|
|
|
- border: none;
|
|
|
- background: transparent;
|
|
|
- outline: none;
|
|
|
- font-size: 14px;
|
|
|
- min-height: 60px;
|
|
|
- resize: vertical;
|
|
|
- }
|
|
|
-
|
|
|
- .save-btn {
|
|
|
- background: #7438FA;
|
|
|
- color: white;
|
|
|
- border: none;
|
|
|
- padding: 8px 16px;
|
|
|
- border-radius: 6px;
|
|
|
- font-size: 12px;
|
|
|
- cursor: pointer;
|
|
|
- margin-top: 10px;
|
|
|
- }
|
|
|
-
|
|
|
- .save-btn:hover {
|
|
|
- background: #6028E0;
|
|
|
- }
|
|
|
-
|
|
|
- .notes-list {
|
|
|
- max-height: 200px;
|
|
|
- overflow-y: auto;
|
|
|
- margin-bottom: 15px;
|
|
|
- }
|
|
|
-
|
|
|
- .note-item {
|
|
|
- display: flex;
|
|
|
- align-items: flex-start;
|
|
|
- gap: 10px;
|
|
|
- padding: 10px;
|
|
|
- background: white;
|
|
|
- border-radius: 8px;
|
|
|
- margin-bottom: 8px;
|
|
|
- border-left: 3px solid #7438FA;
|
|
|
- }
|
|
|
-
|
|
|
- .note-checkbox {
|
|
|
- width: 18px;
|
|
|
- height: 18px;
|
|
|
- border: 2px solid #7438FA;
|
|
|
- border-radius: 4px;
|
|
|
- background: white;
|
|
|
- cursor: pointer;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- color: white;
|
|
|
- font-size: 12px;
|
|
|
- font-weight: bold;
|
|
|
- transition: all 0.2s ease;
|
|
|
- flex-shrink: 0;
|
|
|
- margin-top: 2px;
|
|
|
- }
|
|
|
-
|
|
|
- .note-checkbox:hover {
|
|
|
- background: #7438FA;
|
|
|
- transform: scale(1.1);
|
|
|
- }
|
|
|
-
|
|
|
- .note-content {
|
|
|
- flex: 1;
|
|
|
- }
|
|
|
-
|
|
|
- .note-text {
|
|
|
- color: #333;
|
|
|
- font-size: 14px;
|
|
|
- line-height: 1.4;
|
|
|
- margin-bottom: 5px;
|
|
|
- }
|
|
|
-
|
|
|
- .note-date {
|
|
|
- color: #666;
|
|
|
- font-size: 11px;
|
|
|
- }
|
|
|
-
|
|
|
- .empty-notes {
|
|
|
- text-align: center;
|
|
|
- color: #666;
|
|
|
- font-size: 13px;
|
|
|
- padding: 20px;
|
|
|
- font-style: italic;
|
|
|
- }
|
|
|
-
|
|
|
- .chart-container {
|
|
|
- background: white;
|
|
|
- border-radius: 12px;
|
|
|
- padding: 20px;
|
|
|
- box-shadow: 0 2px 10px rgba(0,0,0,0.05);
|
|
|
- grid-column: span 3;
|
|
|
- }
|
|
|
-
|
|
|
- .financial-cards {
|
|
|
- display: grid;
|
|
|
- grid-template-columns: 1fr 1fr;
|
|
|
- gap: 20px;
|
|
|
- margin-bottom: 20px;
|
|
|
- }
|
|
|
-
|
|
|
- .financial-card {
|
|
|
- background: white;
|
|
|
- border-radius: 12px;
|
|
|
- padding: 20px;
|
|
|
- box-shadow: 0 2px 10px rgba(0,0,0,0.05);
|
|
|
- text-align: center;
|
|
|
- }
|
|
|
-
|
|
|
- .financial-card.income {
|
|
|
- border-left: 4px solid #339E8E;
|
|
|
- }
|
|
|
-
|
|
|
- .financial-card.expense {
|
|
|
- border-left: 4px solid #D6234F;
|
|
|
- }
|
|
|
-
|
|
|
- .financial-amount {
|
|
|
- font-size: 36px;
|
|
|
- font-weight: bold;
|
|
|
- margin: 10px 0;
|
|
|
- }
|
|
|
-
|
|
|
- .financial-amount.income {
|
|
|
- color: #339E8E;
|
|
|
- }
|
|
|
-
|
|
|
- .financial-amount.expense {
|
|
|
- color: #D6234F;
|
|
|
- }
|
|
|
-
|
|
|
- .recent-users-table {
|
|
|
- width: 100%;
|
|
|
- border-collapse: collapse;
|
|
|
- }
|
|
|
-
|
|
|
- .recent-users-table th,
|
|
|
- .recent-users-table td {
|
|
|
- text-align: left;
|
|
|
- padding: 12px 8px;
|
|
|
- border-bottom: 1px solid #f0f0f0;
|
|
|
- }
|
|
|
-
|
|
|
- .recent-users-table th {
|
|
|
- background: #F6F7FF;
|
|
|
- font-weight: 600;
|
|
|
- color: #333;
|
|
|
- font-size: 12px;
|
|
|
- }
|
|
|
-
|
|
|
- .recent-users-table td {
|
|
|
- font-size: 14px;
|
|
|
- color: #333;
|
|
|
- }
|
|
|
-
|
|
|
- .transaction-list {
|
|
|
- max-height: 300px;
|
|
|
- overflow-y: auto;
|
|
|
- }
|
|
|
-
|
|
|
- .transaction-item {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- padding: 12px;
|
|
|
- border-bottom: 1px solid #f0f0f0;
|
|
|
- }
|
|
|
-
|
|
|
- .transaction-name {
|
|
|
- font-weight: 500;
|
|
|
- color: #333;
|
|
|
- }
|
|
|
-
|
|
|
- .transaction-amount {
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
-
|
|
|
- .transaction-type {
|
|
|
- font-size: 10px;
|
|
|
- padding: 4px 8px;
|
|
|
- border-radius: 12px;
|
|
|
- color: white;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
-
|
|
|
- .transaction-type.income {
|
|
|
- background: #339E8E;
|
|
|
- }
|
|
|
-
|
|
|
- .transaction-type.expense {
|
|
|
- background: #D6234F;
|
|
|
- }
|
|
|
-
|
|
|
- .participation-bar {
|
|
|
- height: 20px;
|
|
|
- background: #f0f0f0;
|
|
|
- border-radius: 10px;
|
|
|
- overflow: hidden;
|
|
|
- margin: 8px 0;
|
|
|
- }
|
|
|
|
|
|
- .participation-fill {
|
|
|
- height: 100%;
|
|
|
- transition: width 0.3s ease;
|
|
|
- }
|
|
|
-
|
|
|
- .participation-fill.padel {
|
|
|
- background: #FFD700;
|
|
|
- }
|
|
|
-
|
|
|
- .participation-fill.tennis {
|
|
|
- background: #8B4CF7;
|
|
|
- }
|
|
|
-
|
|
|
- .participation-fill.pallavolo {
|
|
|
- background: #FF6B35;
|
|
|
- }
|
|
|
-
|
|
|
- .participation-fill.yoga {
|
|
|
- background: #339E8E;
|
|
|
- }
|
|
|
-
|
|
|
- .section-title {
|
|
|
- font-size: 18px;
|
|
|
- font-weight: bold;
|
|
|
- color: #333;
|
|
|
- margin-bottom: 20px;
|
|
|
- }
|
|
|
-
|
|
|
- .chart-title {
|
|
|
- font-size: 16px;
|
|
|
- font-weight: 600;
|
|
|
- color: #333;
|
|
|
- margin-bottom: 15px;
|
|
|
- }
|
|
|
-
|
|
|
- .grid-4 {
|
|
|
- display: grid;
|
|
|
- grid-template-columns: repeat(4, 1fr);
|
|
|
- gap: 15px;
|
|
|
- margin-bottom: 20px;
|
|
|
- }
|
|
|
-
|
|
|
- .grid-3 {
|
|
|
- display: grid;
|
|
|
- grid-template-columns: repeat(3, 1fr);
|
|
|
- gap: 20px;
|
|
|
- margin-bottom: 20px;
|
|
|
- }
|
|
|
-
|
|
|
- .grid-2 {
|
|
|
- display: grid;
|
|
|
- grid-template-columns: repeat(2, 1fr);
|
|
|
- gap: 20px;
|
|
|
- margin-bottom: 20px;
|
|
|
- }
|
|
|
-
|
|
|
- .full-width {
|
|
|
- grid-column: span 3;
|
|
|
- }
|
|
|
-
|
|
|
- .half-width {
|
|
|
- grid-column: span 2;
|
|
|
- }
|
|
|
-
|
|
|
- .fade-out {
|
|
|
- opacity: 0;
|
|
|
- transform: translateX(100%);
|
|
|
- transition: all 0.3s ease;
|
|
|
- }
|
|
|
- </style>
|
|
|
-
|
|
|
- <!-- User Statistics Cards -->
|
|
|
- <div class="grid-4">
|
|
|
- <div class="stat-card">
|
|
|
- <div class="stat-card-header">
|
|
|
- <div class="stat-card-title">Utenti Totali</div>
|
|
|
- <div class="stat-icon">👥</div>
|
|
|
+ <div class="grid-2-1">
|
|
|
+ <div class="grid-4">
|
|
|
+ <div class="dashboard-card dashboard-stat">
|
|
|
+ <div class="dashboard-card-header">
|
|
|
+ <div class="dashboard-card-title">Utenti Totali</div>
|
|
|
+ <i class="dashboard-card-icon fa-solid fa-user"></i>
|
|
|
+ </div>
|
|
|
+ <div class="dashboard-card-value">{{$activeUsers}}</div>
|
|
|
+ <div class="dashboard-card-info"><span {{$activeUsers> 0 ? 'class=more' : 'class=less'}}>{{$activeUsers}}</span> dal mese scorso</div>
|
|
|
</div>
|
|
|
- <div class="stat-card-value">{{$activeUsers}}</div>
|
|
|
- </div>
|
|
|
|
|
|
- <div class="stat-card">
|
|
|
- <div class="stat-card-header">
|
|
|
- <div class="stat-card-title">Tesserati</div>
|
|
|
- <div class="stat-icon">📋</div>
|
|
|
+ <div class="dashboard-card dashboard-stat">
|
|
|
+ <div class="dashboard-card-header">
|
|
|
+ <div class="dashboard-card-title">Tesserati</div>
|
|
|
+ <i class="dashboard-card-icon fa-solid fa-address-card"></i>
|
|
|
+ </div>
|
|
|
+ <div class="dashboard-card-value">{{$registeredUsers}}</div>
|
|
|
+ <div class="dashboard-card-info"><span {{$registeredUsers> 0 ? 'class=more' : 'class=less'}}>{{$registeredUsers}}</span> dal mese scorso</div>
|
|
|
</div>
|
|
|
- <div class="stat-card-value">{{$registeredUsers}}</div>
|
|
|
- </div>
|
|
|
|
|
|
- <div class="stat-card">
|
|
|
- <div class="stat-card-header">
|
|
|
- <div class="stat-card-title">Certificati medici scaduti</div>
|
|
|
- <div class="stat-icon">📄</div>
|
|
|
+ <div class="dashboard-card dashboard-stat">
|
|
|
+ <div class="dashboard-card-header">
|
|
|
+ <div class="dashboard-card-title">Certificati scaduti</div>
|
|
|
+ <i class="dashboard-card-icon fa-solid fa-file-lines"></i>
|
|
|
+ </div>
|
|
|
+ <div class="dashboard-card-value">{{$expiredCertificates}}</div>
|
|
|
+ <div class="dashboard-card-info"><span {{$expiredCertificates> 0 ? 'class=more' : 'class=less'}}>{{$expiredCertificates}}</span> dal mese scorso</div>
|
|
|
</div>
|
|
|
- <div class="stat-card-value">{{$expiredCertificates}}</div>
|
|
|
- </div>
|
|
|
|
|
|
- <div class="stat-card">
|
|
|
- <div class="stat-card-header">
|
|
|
- <div class="stat-card-title">Abbonamenti sospesi</div>
|
|
|
- <div class="stat-icon">⏸️</div>
|
|
|
+ <div class="dashboard-card dashboard-stat">
|
|
|
+ <div class="dashboard-card-header">
|
|
|
+ <div class="dashboard-card-title">Abbonamenti sospesi</div>
|
|
|
+ <i class="dashboard-card-icon fa-solid fa-user-xmark"></i>
|
|
|
+ </div>
|
|
|
+ <div class="dashboard-card-value">{{$suspendedSubscriptions}}</div>
|
|
|
+ <div class="dashboard-card-info"><span {{$suspendedSubscriptions> 0 ? 'class=more' : 'class=less'}}>{{$suspendedSubscriptions}}</span> dal mese scorso</div>
|
|
|
</div>
|
|
|
- <div class="stat-card-value">{{$suspendedSubscriptions}}</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
|
|
|
- <div class="grid-3">
|
|
|
- <div class="dashboard-section">
|
|
|
- <div class="section-title">Ultimi utenti registrati</div>
|
|
|
- @if(count($recentUsers) > 0)
|
|
|
- <table class="recent-users-table">
|
|
|
- <thead>
|
|
|
- <tr>
|
|
|
- <th>Cognome</th>
|
|
|
- <th>Nome</th>
|
|
|
- <th>Telefono</th>
|
|
|
- <th>Email</th>
|
|
|
- </tr>
|
|
|
- </thead>
|
|
|
- <tbody>
|
|
|
- @foreach($recentUsers as $user)
|
|
|
- <tr>
|
|
|
- <td>{{$user['surname']}}</td>
|
|
|
- <td>{{$user['name']}}</td>
|
|
|
- <td>{{$user['phone']}}</td>
|
|
|
- <td>{{$user['email']}}</td>
|
|
|
- </tr>
|
|
|
- @endforeach
|
|
|
- </tbody>
|
|
|
- </table>
|
|
|
- @else
|
|
|
- <div style="text-align: center; color: #666; padding: 40px;">
|
|
|
- Nessun utente registrato di recente
|
|
|
- </div>
|
|
|
- @endif
|
|
|
- </div>
|
|
|
|
|
|
- <!-- Corsi Section -->
|
|
|
- <div class="dashboard-section">
|
|
|
- <div class="section-title">
|
|
|
- Corsi
|
|
|
- </div>
|
|
|
- @if(count($courses) > 0)
|
|
|
- <div class="courses-list">
|
|
|
- @foreach($courses as $course)
|
|
|
- <div class="course-item">
|
|
|
- <div class="course-time">{{$course['time']}}</div>
|
|
|
- <div class="course-name">{{$course['full_name'] ?? $course['course_name']}}</div>
|
|
|
- <div class="course-days">{{$course['days']}}</div>
|
|
|
- @if(!empty($course['level_name']) || !empty($course['frequency_name']))
|
|
|
- <div style="font-size: 11px; color: #888; margin-top: 4px;">
|
|
|
- @if(!empty($course['level_name']))
|
|
|
+ <!-- Corsi Section -->
|
|
|
+ <div class="dashboard-card">
|
|
|
+ <div class="dashboard-card-title">Corsi</div>
|
|
|
+ @if(count($courses) > 0)
|
|
|
+ <div class="courses-list">
|
|
|
+ @foreach($courses as $course)
|
|
|
+ <div class="course-item">
|
|
|
+ <div class="course-time">{{$course['time']}}</div>
|
|
|
+ <div class="course-name">{{$course['full_name'] ?? $course['course_name']}}</div>
|
|
|
+ <div class="course-days">{{$course['days']}}</div>
|
|
|
+ @if(!empty($course['level_name']) || !empty($course['frequency_name']))
|
|
|
+ <div style="font-size: 11px; color: #888; margin-top: 4px;">
|
|
|
+ @if(!empty($course['level_name']))
|
|
|
<span>{{$course['level_name']}}</span>
|
|
|
- @endif
|
|
|
- @if(!empty($course['level_name']) && !empty($course['frequency_name']))
|
|
|
+ @endif
|
|
|
+ @if(!empty($course['level_name']) && !empty($course['frequency_name']))
|
|
|
<span> • </span>
|
|
|
- @endif
|
|
|
- @if(!empty($course['frequency_name']))
|
|
|
+ @endif
|
|
|
+ @if(!empty($course['frequency_name']))
|
|
|
<span>{{$course['frequency_name']}}</span>
|
|
|
+ @endif
|
|
|
+ </div>
|
|
|
@endif
|
|
|
</div>
|
|
|
- @endif
|
|
|
+ @endforeach
|
|
|
</div>
|
|
|
- @endforeach
|
|
|
- </div>
|
|
|
- @else
|
|
|
- <div style="text-align: center; color: #666; padding: 40px;">
|
|
|
- Nessun corso programmato per oggi
|
|
|
- <div style="font-size: 12px; margin-top: 10px; color: #999;">
|
|
|
- Oggi è: <strong>{{$dayName ?? 'N/A'}}</strong>
|
|
|
+ @else
|
|
|
+ <div style="text-align: center; color: #666; padding: 40px;">
|
|
|
+ Nessun corso programmato per oggi
|
|
|
+ <div style="font-size: 12px; margin-top: 10px; color: #999;">
|
|
|
+ Oggi è: <strong>{{$dayName ?? 'N/A'}}</strong>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
+ @endif
|
|
|
</div>
|
|
|
- @endif
|
|
|
+
|
|
|
+ {{-- campi e sale --}}
|
|
|
+ <div class="dashboard-card">
|
|
|
+ <div class="dashboard-card-title">Campi e sale</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ {{-- grafico --}}
|
|
|
+ <div class="dashboard-card grid-w-2"></div>
|
|
|
</div>
|
|
|
|
|
|
+
|
|
|
<!-- To Do Section -->
|
|
|
- <div class="dashboard-section">
|
|
|
- <div class="section-title">To do</div>
|
|
|
- <div style="font-size: 14px; color: #666; margin-bottom: 10px;">{{date('d/m/Y')}}</div>
|
|
|
+ <div class="dashboard-card card-inverted">
|
|
|
+ <div class="dashboard-card-title">To do</div>
|
|
|
+ {{-- <div style="font-size: 14px; color: #666; margin-bottom: 10px;">{{date('d/m/Y')}}</div> --}}
|
|
|
|
|
|
<!-- Notes List -->
|
|
|
@if(count($savedNotes) > 0)
|
|
|
<div class="notes-list">
|
|
|
@foreach($savedNotes as $note)
|
|
|
<div class="note-item">
|
|
|
- <div class="note-checkbox" wire:click="completeNote('{{$note['id']}}')" title="Segna come completato">
|
|
|
- ✓
|
|
|
- </div>
|
|
|
<div class="note-content">
|
|
|
<div class="note-text">{{$note['text']}}</div>
|
|
|
<div class="note-date">{{$note['created_at']}}</div>
|
|
|
</div>
|
|
|
+ <div class="note-checkbox" wire:click="completeNote('{{$note['id']}}')" title="Segna come completato">
|
|
|
+ ✓
|
|
|
+ </div>
|
|
|
</div>
|
|
|
@endforeach
|
|
|
</div>
|
|
|
@@ -554,15 +121,15 @@
|
|
|
|
|
|
<div class="grid-2">
|
|
|
<!-- Courses Participation Section -->
|
|
|
- <div class="dashboard-section">
|
|
|
- <div class="section-title">Corsi con più partecipazioni</div>
|
|
|
+ <div class="dashboard-card">
|
|
|
+ <div class="dashboard-card-title">Corsi con più partecipazioni</div>
|
|
|
@if(count($coursesParticipation) > 0)
|
|
|
- <div style="padding: 10px 0;">
|
|
|
+ <div style="padding: 20px 0 0;">
|
|
|
@foreach($coursesParticipation as $course)
|
|
|
- <div style="margin-bottom: 20px;">
|
|
|
+ <div style="margin-bottom: 30px;">
|
|
|
<div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 5px;">
|
|
|
- <span style="font-weight: 600; color: #333; font-size: 14px;">{{$course['course_name']}}</span>
|
|
|
- <span style="font-size: 12px; color: #666;">{{$course['participants']}} partecipanti</span>
|
|
|
+ <span style="font-weight: bold; color: var(--color-text); font-size: 13px;">{{$course['course_name']}}</span>
|
|
|
+ {{-- <span style="font-size: 12px; color: #666;">{{$course['participants']}} partecipanti</span> --}}
|
|
|
</div>
|
|
|
<div class="participation-bar">
|
|
|
<div class="participation-fill {{$course['color']}}" style="width: {{$course['percentage']}}%"></div>
|
|
|
@@ -577,43 +144,82 @@
|
|
|
@endif
|
|
|
</div>
|
|
|
|
|
|
- <!-- Financial Cards moved here -->
|
|
|
- <div>
|
|
|
- <div class="financial-cards" style="margin-bottom: 0;">
|
|
|
- <div class="financial-card income">
|
|
|
- <div style="font-size: 14px; color: #666; margin-bottom: 10px;">Incassato mese corrente</div>
|
|
|
- <div class="financial-amount income">€ {{number_format($toReceive, 2)}}</div>
|
|
|
+ <!-- User Statistics Cards -->
|
|
|
+ <div class="dashboard-card">
|
|
|
+ <div class="dashboard-card-title">Ultimi utenti registrati</div>
|
|
|
+ @if(count($recentUsers) > 0)
|
|
|
+ <table class="recent-users-table">
|
|
|
+ <thead>
|
|
|
+ <tr>
|
|
|
+ <th>Cognome</th>
|
|
|
+ <th>Nome</th>
|
|
|
+ <th>Telefono</th>
|
|
|
+ <th>Email</th>
|
|
|
+ </tr>
|
|
|
+ </thead>
|
|
|
+ <tbody>
|
|
|
+ @foreach($recentUsers as $user)
|
|
|
+ <tr>
|
|
|
+ <td>{{$user['surname']}}</td>
|
|
|
+ <td>{{$user['name']}}</td>
|
|
|
+ <td>{{$user['phone']}}</td>
|
|
|
+ <td>{{$user['email']}}</td>
|
|
|
+ </tr>
|
|
|
+ @endforeach
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ @else
|
|
|
+ <div style="text-align: center; color: #666; padding: 40px;">
|
|
|
+ Nessun utente registrato di recente
|
|
|
+ </div>
|
|
|
+ @endif
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="grid-2">
|
|
|
+ <div class="grid-3">
|
|
|
+ <!-- Financial Cards moved here -->
|
|
|
+ <div class="dashboard-card dashboard-stat card-inverted card-income">
|
|
|
+ <div class="dashboard-card-header">
|
|
|
+ <div class="dashboard-card-title">Da incassare</div>
|
|
|
+ <i class="dashboard-card-icon fa-solid fa-money-bill-trend-up"></i>
|
|
|
</div>
|
|
|
+ <div class="dashboard-card-value">{{number_format($toReceive, 2, ",", ".")}}</div>
|
|
|
+ </div>
|
|
|
|
|
|
- <div class="financial-card expense">
|
|
|
- <div style="font-size: 14px; color: #666; margin-bottom: 10px;">Pagato mese corrente</div>
|
|
|
- <div class="financial-amount expense">€ {{number_format($toPay, 2)}}</div>
|
|
|
+ <div class="dashboard-card dashboard-stat card-inverted card-expense">
|
|
|
+ <div class="dashboard-card-header">
|
|
|
+ <div class="dashboard-card-title">Da pagare</div>
|
|
|
+ <i class="dashboard-card-icon fa-solid fa-money-bill-transfer"></i>
|
|
|
</div>
|
|
|
+ <div class="dashboard-card-value">{{number_format($toPay, 2, ",", ".")}}</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
|
|
|
- <div class="dashboard-section">
|
|
|
- <div class="section-title">Ultimi movimenti finanziari</div>
|
|
|
- @if(count($recentTransactions) > 0)
|
|
|
- <div class="transaction-list">
|
|
|
- @foreach($recentTransactions as $transaction)
|
|
|
- <div class="transaction-item">
|
|
|
- <div class="transaction-name">{{$transaction['name']}}</div>
|
|
|
- <div style="display: flex; align-items: center; gap: 10px;">
|
|
|
- <div class="transaction-amount">€ {{number_format($transaction['amount'], 2)}}</div>
|
|
|
- <div class="transaction-type {{$transaction['type'] == 'ENTRATA' ? 'income' : 'expense'}}">
|
|
|
- {{$transaction['type']}}
|
|
|
+ <div class="dashboard-card grid-w-3">
|
|
|
+ <div class="dashboard-card-title">Ultimi movimenti finanziari</div>
|
|
|
+ @if(count($recentTransactions) > 0)
|
|
|
+ <div class="transaction-list">
|
|
|
+ @foreach($recentTransactions as $transaction)
|
|
|
+ <div class="transaction-item">
|
|
|
+ <div class="transaction-name">{{$transaction['name']}}</div>
|
|
|
+ <div style="display: flex; align-items: center; gap: 10px;">
|
|
|
+ <div class="transaction-amount">€ {{number_format($transaction['amount'], 2)}}</div>
|
|
|
+ <div class="transaction-type {{$transaction['type'] == 'ENTRATA' ? 'income' : 'expense'}}">
|
|
|
+ {{$transaction['type']}}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
+ @endforeach
|
|
|
+ </div>
|
|
|
+ @else
|
|
|
+ <div style="text-align: center; color: #666; padding: 40px;">
|
|
|
+ Nessun movimento finanziario recente
|
|
|
</div>
|
|
|
+ @endif
|
|
|
</div>
|
|
|
- @endforeach
|
|
|
- </div>
|
|
|
- @else
|
|
|
- <div style="text-align: center; color: #666; padding: 40px;">
|
|
|
- Nessun movimento finanziario recente
|
|
|
</div>
|
|
|
- @endif
|
|
|
+
|
|
|
+ <div class="dashboard-card"></div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
@@ -654,4 +260,4 @@
|
|
|
}
|
|
|
});
|
|
|
</script>
|
|
|
-@endpush
|
|
|
+@endpush
|