#21 Création d'un ArtisteFactory qui génère des titres et deux albums par artiste. Le viewmodèle est passé dans la vue par le controleur.

Webzine.WebApplication/Views/Artiste/Index.cshtml

@@ -0,0 +1,70 @@
+@model Webzine.WebApplication.ViewModels.ArtisteModel
+
+@{
+    ViewData["Title"] = "Artiste";
+}
+
+
+<div class="container">
+    <h1>@Model.Artiste.Nom</h1>
+    
+    <hr class="mb-5" />
+
+    <p class="lead">@Model.Artiste.Biographie</p>
+
+    <h2 class="mt-5 mb-4">Albums</h2>
+    <hr class="mb-5" />
+
+    @* On groupe les titres par nom d'album *@
+    @{
+        var albumsGroupes = Model.Titres
+                .OrderBy(t => t.Libelle)  // Trie les titres par ordre alphabétique au sein de chaque groupe futur
+                .GroupBy(t => t.Album)    // Groupe par nom d'album
+                .OrderBy(g => g.Key);     // Trie les albums par ordre alphabétique (la clé du groupe)    
+    }
+
+    @foreach (var groupe in albumsGroupes)
+    {
+        // On récupère le premier titre du groupe pour afficher l'image de l'album
+        var premierTitre = groupe.First();
+
+        <div class="row mb-5 align-items-start">
+            <div class="col-md-3 mb-3">
+                <img src="@premierTitre.UrlJaquette"
+                     class="img-fluid shadow-sm rounded border"
+                     alt="Pochette de @groupe.Key" />
+            </div>
+
+            <div class="col-md-9">
+                <h3 class="h4 pb-2">@groupe.Key</h3>
+
+                <table class="table table-hover table-sm mt-3">
+                    <thead class="text-muted">
+                        <tr>
+                            <th style="width: 80px">Durée</th>
+                            <th>Titre</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        @foreach (var titre in groupe)
+                        {
+                            // Conversion des secondes en format MM:SS
+                            var minutes = titre.Duree / 60;
+                            var secondes = titre.Duree % 60;
+                            var dureeFormatee = $"{minutes}:{secondes:D2}";
+
+                            <tr>
+                                <td class="text-secondary font-monospace">@dureeFormatee</td>
+                                <td>
+                                    <span class="text-primary fw-bold" style="cursor:pointer">
+                                        @titre.Libelle
+                                    </span>
+                                </td>
+                            </tr>
+                        }
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    }
+</div>