feat: add ticket order form validation

TicketOffice/Pages/Routes/Index.cshtml

@@ -1,5 +1,6 @@
 @page
 @using System.Globalization
+@using TicketOffice.Models
 @model TicketOffice.Pages.Routes.IndexModel
 @{
     Layout = "~/Pages/Shared/_Layout.cshtml";
@@ -10,6 +11,7 @@
 
 
 <link rel="stylesheet" href="~/css/Routes.css"/>
+<link rel="stylesheet" href="~/css/Popup.css"/>
 
 <div class="wrapper">
     
@@ -279,7 +281,9 @@
 {
     foreach (var route in Model.Routes)
     {
-        <div class="popup-container" id="popup-ticket-@route.Id">
+        <div class="popup-container" id="popup-ticket-@route.Id" style='display:@(Model.Ticket is not null && Model.Ticket.RouteId == route
+        .Id 
+        ? "inherit" : "none")'>
             <div class="ticket">
                 <div class="ticket-header">
                     Купити квиток
@@ -296,6 +300,8 @@
                                 {
                                     <input class="ticket-input-lastname" type="text" placeholder="Прізвище" readonly/>
                                 }
+                                <div 
+                                class="ticket-validation-error"><span>@(Model.Ticket is not null && Model.Ticket.RouteId == route.Id ? Model.PassengerLastNameValidationError : "")</span></div>
                             </div>
                             <div class="ticket-input-item" style="margin-left: 0.5rem; margin-right: 0.5rem">
                                 @if (HttpContext.Session.GetInt32("UserId").HasValue)
@@ -306,6 +312,8 @@
                                 {
                                     <input class="ticket-input-firstname" type="text" placeholder="Ім'я" readonly/>
                                 }
+                                <div 
+                                class="ticket-validation-error"><span>@(Model.Ticket is not null && Model.Ticket.RouteId == route.Id ? Model.PassengerFirstNameValidationError : "")</span></div>
                             </div>
                             <div class="ticket-input-item" style="margin-left: 0.5rem">
                                 <select class="ticket-place-select" required asp-for="Ticket.PassengerPlace">
@@ -322,6 +330,8 @@
                                         }
                                     }
                                 </select>
+                                <div 
+                                class="ticket-validation-error"><span>@(Model.Ticket is not null && Model.Ticket.RouteId == route.Id ? Model.PassengerPlaceValidationError : "")</span></div>
                             </div>
                             <input type="number" value="@route.Id" style="display: none;" asp-for="Ticket.RouteId"/>
                             <input type="number" value="@HttpContext.Session.GetInt32("UserId")" style="display: none;" asp-for="Ticket.UserId"/>

TicketOffice/Pages/Routes/Index.cshtml.cs

@@ -12,6 +12,10 @@ public class IndexModel : PageModel
     [BindProperty] public List<Route> Routes { get; set; }
     [BindProperty] public Ticket Ticket { get; set; }
 
+    public string PassengerLastNameValidationError;
+    public string PassengerFirstNameValidationError;
+    public string PassengerPlaceValidationError;
+    
     [BindProperty(SupportsGet = true)] public string From { get; set; }
     [BindProperty(SupportsGet = true)] public string To { get; set; }
     [BindProperty(SupportsGet = true)] public DateTime Date { get; set; } = new DateTime(2022, 03, 28, 0, 0, 0).Date;
@@ -19,12 +23,12 @@ public class IndexModel : PageModel
 
     private readonly TicketOfficeContext _context;
 
-    public IndexModel(TicketOfficeContext context)
+    public IndexModel(TicketOfficeContext context, ILogger<IndexModel> logger)
     {
         _context = context;
     }
 
-    public void OnGet()
+    public ActionResult OnGet()
     {
         if (!string.IsNullOrWhiteSpace(From) || !string.IsNullOrWhiteSpace(To))
         {
@@ -45,24 +49,26 @@ public class IndexModel : PageModel
         {
             FilterRoutesByDate();
         }
+
+        return Page();
     }
 
     public ActionResult OnPost()
     {
-        Ticket.User = _context.User.Where(u => u.Id == Ticket.UserId).ToList()[0];
+        if (!PassengerNameValidation(Ticket.PassengerLastName, out PassengerLastNameValidationError) | !PassengerNameValidation(Ticket.PassengerFirstName, out PassengerFirstNameValidationError) | !PassengerPlaceValidation(Ticket.PassengerPlace, out PassengerPlaceValidationError))
-        Ticket.Route = _context.Route.Where(r => r.Id == Ticket.RouteId).ToList()[0];
+            return OnGet();
         
         _context.Ticket.Add(Ticket);
-        _context.SaveChangesAsync();
+        _context.SaveChanges();
         
-        return RedirectToPage("/Account/Index");
+        return RedirectToPage("/Auth/Account");
     }
     
     public void OnGetSortByNumber()
     {
         OnGet();
 
-        if (SortString == "increasingNumber")
+        if (SortString == "increasingNumber dependencies")
         {
             Routes.Sort((x, y) => Math.Clamp(x.Number - y.Number, -1, 1));
         }
@@ -169,4 +175,28 @@ public class IndexModel : PageModel
     {
         Routes.RemoveAll(r => r.Cities.First().DepartureTime.Value.DayOfYear != Date.DayOfYear);
     }
+
+    private bool PassengerNameValidation(string? name, out string validationError)
+    {
+        if (String.IsNullOrEmpty(name))
+        {
+            validationError = "Поле має бути заповненим";
+            return false;
+        }
+
+        validationError = String.Empty;
+        return true;
+    }
+
+    private bool PassengerPlaceValidation(int place, out string validationError)
+    {
+        if (place == 0)
+        {
+            validationError = "Поле має бути заповненим";
+            return false;
+        }
+        
+        validationError = String.Empty;
+        return true;
+    }
 }

TicketOffice/wwwroot/css/Routes.css

@@ -206,112 +206,6 @@ td.time, td.duration {
     line-height: 3rem;
 }
 
-/* ~~~~~~ route city list popup ~~~~~~ */
-
-.popup-container {
-    position: fixed;
-    top: 0;
-    left: 0;
-    z-index: 100;
-    width: 100%;
-    height: 100%;
-    background: rgba(0, 0, 0, 0.25);
-    display: none;
-}
-
-.popup {
-    width: 40rem;
-    height: 30rem;
-    background: #eaeef1;
-    position: fixed;
-    top: calc(50% - 15rem);
-    left: calc(50% - 20rem);
-    border-radius: 0.5rem;
-    box-shadow: 0 10px 15px 5px #6c6e6f;
-}
-
-.popup-header {
-    border-radius: 0.5rem 0.5rem 0 0;
-    height: 3rem;
-    background: #a1b0b9;
-    color: white;
-    font-weight: 700;
-    font-size: 1.1rem;
-    text-align: center;
-    line-height: 3rem;
-}
-
-.popup-body {
-    width: calc(100% - 2rem);
-    height: calc(100% - 5rem);
-    padding: 1rem 1rem;
-}
-
-.popup-body-main {
-    height: calc(100% - 4rem);
-    overflow-y: auto;
-    overflow-x: hidden;
-}
-
-tr.tr-intermediate {
-    font-weight: 500;
-}
-
-th.th-route, td.td-route {
-    height: 4rem;
-    line-height: 1.25rem;
-    text-align: center;
-    padding: 0 0.5rem;
-}
-
-td.address {
-    font-size: 0.8rem;
-    text-align: justify;
-    line-height: 1rem;
-}
-
-tr.tr-departure, tr.tr-arrival {
-    font-weight: 700;
-}
-
-.popup-body-footer {
-    text-align: center;
-    margin-top: 1rem;
-}
-
-.popup-footer-link-button {
-    line-height: 2.5rem;
-    padding: 0 1rem;
-    margin: 0 0.5rem;
-    display: inline-block;
-    color: #1d4965;
-    font-weight: 500;
-    background: linear-gradient(0deg,#79b6db,#b3dbf2);
-    border: none;
-    border-radius: .3rem;
-    cursor: pointer;
-    text-decoration: none;
-}
-
-.popup-footer-button {
-    line-height: 2.5rem;
-    padding: 0 1rem;
-    margin: 0 0.5rem;
-    display: inline-block;
-    color: #1d4965;
-    font-weight: 700;
-    font-size: 1rem;
-    background: linear-gradient(0deg,#79b6db,#b3dbf2);
-    border: none;
-    border-radius: .3rem;
-    cursor: pointer;
-    text-decoration: none;
-}
-
-.popup-footer-button:hover, .popup-footer-link-button:hover {
-    opacity: 0.8;
-}
-
 /* ~~~~~~ ticket ordering popup ~~~~~~ */
 
 .ticket {