Done contact links management pages

MyWebsite/MyWebsite/Areas/Admin/Controllers/ContactsController.cs

@@ -1,8 +1,4 @@
-using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Threading.Tasks;
-using Microsoft.AspNetCore.Authorization;
+using Microsoft.AspNetCore.Authorization;
 using Microsoft.AspNetCore.Mvc;
 using MyWebsite.Models;
 
@@ -30,5 +26,37 @@ namespace MyWebsite.Areas.Admin.Controllers
 
             return RedirectToAction("Index");
         }
+
+        [HttpGet]
+        public IActionResult Delete(string id) =>
+            View(Startup.Database.Links.Find(id));
+
+        [HttpPost]
+        public IActionResult Delete(Link link)
+        {
+            Startup.Database.Links.Remove(link);
+            Startup.Database.SaveChanges();
+
+            return RedirectToAction("Index");
+        }
+
+        [HttpGet]
+        public IActionResult Create() =>
+            View();
+
+        [HttpPost]
+        public IActionResult Create(Link link)
+        {
+            if (!ModelState.IsValid)
+            {
+                ModelState.AddModelError("Authorization error", "Invalid data");
+                return View(link);
+            }
+
+            Startup.Database.Links.Add(link);
+            Startup.Database.SaveChanges();
+
+            return RedirectToAction("Index");
+        }
     }
 }

MyWebsite/MyWebsite/Areas/Admin/Views/Contacts/Create.cshtml

@@ -0,0 +1,51 @@
+@model MyWebsite.Models.Link
+
+@{
+    ViewData["Title"] = "Create link";
+}
+
+<header>
+    <p>&#xE760; <a asp-action="Index">Back to the list</a></p>
+    <h1>Create link</h1>
+</header>
+
+<article>
+    <form asp-action="Create">
+        <div asp-validation-summary="ModelOnly" class="text-danger"></div>
+        <div>
+            <label asp-for="Name"></label>
+            <input asp-for="Name" type="text"/>
+            <span asp-validation-for="Name" class="text-danger"></span>
+        </div>
+        <div>
+            <label asp-for="Order"></label>
+            <input asp-for="Order" type="number" />
+            <span asp-validation-for="Order" class="text-danger"></span>
+        </div>
+        <div>
+            <label asp-for="Title"></label>
+            <input asp-for="Title" type="text" />
+            <span asp-validation-for="Title" class="text-danger"></span>
+        </div>
+        <div>
+            <label asp-for="Username"></label>
+            <input asp-for="Username" type="text" />
+            <span asp-validation-for="Username" class="text-danger"></span>
+        </div>
+        <div>
+            <label asp-for="Url"></label>
+            <input asp-for="Url" type="text" />
+            <span asp-validation-for="Url" class="text-danger"></span>
+        </div>
+        <label>
+            <input type="checkbox" class="checkbox" asp-for="CanContactMe" /> @Html.DisplayNameFor(model => model.CanContactMe)
+        </label>
+        <label>
+            <input type="checkbox" class="checkbox" asp-for="DisplayInFooter" /> @Html.DisplayNameFor(model => model.DisplayInFooter)
+        </label>
+
+        <input type="submit" value="Create" class="btn" />
+    </form>
+</article>
+
+<link type="text/css" rel="stylesheet" href="~/css/Admin.css" />

MyWebsite/MyWebsite/Areas/Admin/Views/Contacts/Delete.cshtml

@@ -0,0 +1,30 @@
+@model MyWebsite.Models.Link
+
+@{
+    ViewData["Title"] = "Delete link";
+}
+
+<header>
+    <p>&#xE760; <a asp-action="Index">Back to the list</a></p>
+    <h1>Delete link</h1>
+    <h3>Are you sure you want to delete this?</h3>
+</header>
+
+<article>
+    <p class="form-group">
+        <b>@Html.DisplayNameFor(model => model.Name):</b> @Html.DisplayFor(model => model.Name)<br />
+        <b>@Html.DisplayNameFor(model => model.Order):</b> @Html.DisplayFor(model => model.Order)<br />
+        <b>@Html.DisplayNameFor(model => model.Title):</b> @Html.DisplayFor(model => model.Title)<br />
+        <b>@Html.DisplayNameFor(model => model.Username):</b> @Html.DisplayFor(model => model.Username)<br />
+        <b>@Html.DisplayNameFor(model => model.Url):</b> @Html.DisplayFor(model => model.Url)<br />
+        <b>@Html.DisplayNameFor(model => model.CanContactMe):</b> @Html.DisplayFor(model => model.CanContactMe)<br />
+        <b>@Html.DisplayNameFor(model => model.DisplayInFooter):</b> @Html.DisplayFor(model => model.DisplayInFooter)
+    </p>
+
+    <form asp-action="Delete">
+        <input hidden asp-for="Name" />
+        <input type="submit" value="Delete" class="btn-danger" />
+    </form>
+</article>
+
+<link type="text/css" rel="stylesheet" href="~/css/Admin.css" />

MyWebsite/MyWebsite/Areas/Admin/Views/Contacts/Edit.cshtml

@@ -0,0 +1,51 @@
+@model MyWebsite.Models.Link
+
+@{
+    ViewData["Title"] = "Edit link";
+}
+
+<header>
+    <p>&#xE760; <a asp-action="Index">Back to the list</a></p>
+    <h1>Edit link</h1>
+</header>
+
+<article>
+    <form asp-action="Edit">
+        <div asp-validation-summary="ModelOnly" class="text-danger"></div>
+        <div>
+            <label asp-for="Name"></label>
+            <input asp-for="Name" type="text" class="readonly" readonly />
+            <span asp-validation-for="Name" class="text-danger"></span>
+        </div>
+        <div>
+            <label asp-for="Order"></label>
+            <input asp-for="Order" type="number" />
+            <span asp-validation-for="Order" class="text-danger"></span>
+        </div>
+        <div>
+            <label asp-for="Title"></label>
+            <input asp-for="Title" type="text" />
+            <span asp-validation-for="Title" class="text-danger"></span>
+        </div>
+        <div>
+            <label asp-for="Username"></label>
+            <input asp-for="Username" type="text" />
+            <span asp-validation-for="Username" class="text-danger"></span>
+        </div>
+        <div>
+            <label asp-for="Url"></label>
+            <input asp-for="Url" type="text" />
+            <span asp-validation-for="Url" class="text-danger"></span>
+        </div>
+        <label>
+            <input type="checkbox" class="checkbox" asp-for="CanContactMe" /> @Html.DisplayNameFor(model => model.CanContactMe)
+        </label>
+        <label>
+            <input type="checkbox" class="checkbox" asp-for="DisplayInFooter" /> @Html.DisplayNameFor(model => model.DisplayInFooter)
+        </label>
+
+        <input type="submit" value="Save" class="btn" />
+    </form>
+</article>
+
+<link type="text/css" rel="stylesheet" href="~/css/Admin.css" />

MyWebsite/MyWebsite/Areas/Admin/Views/Contacts/Index.cshtml

@@ -1,11 +1,12 @@
 @model IEnumerable<MyWebsite.Models.Link>
 
 @{
-    ViewData["Title"] = "Index";
+    ViewData["Title"] = "Links list";
 }
 
 <header>
-    <h1>Index</h1>
+    <p>&#xE760; <a asp-action="Index" asp-controller="Admin" asp-area="">Back to main menu</a></p>
+    <h1>Links list</h1>
     <p>
         <a asp-action="Create" class="comment">// + Create New</a>
     </p>
@@ -16,7 +17,7 @@
         <thead>
             <tr>
                 <th>
-                    @Html.DisplayNameFor(model => model.Id)
+                    @Html.DisplayNameFor(model => model.Order)
                 </th>
                 <th>
                     @Html.DisplayNameFor(model => model.Name)
@@ -40,11 +41,11 @@
             </tr>
         </thead>
         <tbody>
-            @foreach (var item in Model)
+            @foreach (var item in Model.OrderBy(i => i.Order))
             {
                 <tr>
                     <td>
-                        @Html.DisplayFor(modelItem => item.Id)
+                        @Html.DisplayFor(modelItem => item.Order)
                     </td>
                     <td>
                         @Html.DisplayFor(modelItem => item.Name)
@@ -65,8 +66,8 @@
                         @Html.DisplayFor(modelItem => item.DisplayInFooter)
                     </td>
                     <td>
-                        @Html.ActionLink("Edit", "Edit", new { /* id=item.PrimaryKey */ }) |
-                        @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
+                        @Html.ActionLink("Edit", "Edit", new { id=item.Name }) |
+                        @Html.ActionLink("Delete", "Delete", new { id=item.Name })
                     </td>
                 </tr>
             }

MyWebsite/MyWebsite/Models/Link.cs

@@ -1,4 +1,5 @@
-using System.ComponentModel.DataAnnotations;
+using System.ComponentModel;
+using System.ComponentModel.DataAnnotations;
 using System.ComponentModel.DataAnnotations.Schema;
 
 namespace MyWebsite.Models
@@ -6,22 +7,30 @@ namespace MyWebsite.Models
     public class Link
     {
         [Key]
-        public int Id { get; set; }
         [Required]
         [Column(TypeName = "varchar(20)")]
+        [DisplayName("Name")]
         public string Name { get; set; }
         [Required]
+        [DisplayName("Order")]
+        public int Order { get; set; }
+        [Required]
         [Column(TypeName = "varchar(20)")]
+        [DisplayName("Title")]
         public string Title { get; set; }
         [Required]
         [Column(TypeName = "varchar(50)")]
+        [DisplayName("Username")]
         public string Username { get; set; }
         [Required]
         [Column(TypeName = "varchar(255)")]
+        [DisplayName("URL")]
         public string Url { get; set; }
         [Required]
+        [DisplayName("May contact")]
         public bool CanContactMe { get; set; } = false;
         [Required]
+        [DisplayName("Footer")]
         public bool DisplayInFooter { get; set; } = false;
     }
 }

MyWebsite/MyWebsite/Views/Admin/Login.cshtml

@@ -20,7 +20,7 @@
             <input type="password" asp-for="Password" />
             <span asp-validation-for="Password"></span>
         </div>
-        <input style="margin-top:10px" type="submit" value="Login" />
+        <input class="btn" style="margin-top:10px" type="submit" value="Login" />
     </form>
 </article>
 

MyWebsite/MyWebsite/Views/Shared/Contacts.cshtml

@@ -8,13 +8,13 @@
 
 <article>
     <p>
-        @foreach (Link link in Startup.Database.Links.Where(i => i.CanContactMe).OrderBy(i => i.Id))
+        @foreach (Link link in Startup.Database.Links.Where(i => i.CanContactMe).OrderBy(i => i.Order))
         {
             <a class="socicon-@(link.Name)"></a> @(link.Title) <a href="@(link.Url)" target="_blank">@(link.Username)</a><br />
         }
     </p>
     <p>
-        @foreach (Link link in Startup.Database.Links.Where(i => !i.CanContactMe).OrderBy(i => i.Id))
+        @foreach (Link link in Startup.Database.Links.Where(i => !i.CanContactMe).OrderBy(i => i.Order))
         {
             <a class="socicon-@(link.Name)"></a> @(link.Title) <a href="@(link.Url)" target="_blank">@(link.Username)</a><br />
         }

MyWebsite/MyWebsite/Views/Shared/ContactsBlock.cshtml

@@ -1,6 +1,6 @@
 @{
     Link email = Startup.Database.Links.FirstOrDefault(i => i.Name == "outlook");
-    List<Link> links = Startup.Database.Links.Where(i => new string[] { "linkedin", "github", "twitter", "vkontakte" }.Contains(i.Name)).OrderBy(i => i.Id).ToList();
+    List<Link> links = Startup.Database.Links.Where(i => new string[] { "linkedin", "github", "twitter", "vkontakte" }.Contains(i.Name)).OrderBy(i => i.Order).ToList();
 }
 
 <div class="contact-me">

MyWebsite/MyWebsite/Views/Shared/_Layout.cshtml

@@ -46,10 +46,12 @@
     <footer>
         <span class="comment">// Copyright &copy;@(DateTime.Today.Year) Michael "XFox" Gordeev</span>
 
-        @foreach (Link link in Startup.Database.Links.Where(i => i.DisplayInFooter).OrderBy(i => i.Id))
-        {
-            <a class="socicon-@(link.Name)" href="@(link.Url)" target="_blank" title="@(link.Title)"></a>
-        }
+        <div>
+            @foreach (Link link in Startup.Database.Links.Where(i => i.DisplayInFooter).OrderBy(i => i.Order))
+            {
+                <a class="socicon-@(link.Name)" href="@(link.Url)" target="_blank" title="@(link.Title)"></a>
+            }
+        </div>
     </footer>
 </body>
 </html>

MyWebsite/MyWebsite/wwwroot/css/Admin.css

@@ -76,6 +76,10 @@ table {
     width: 100%;
 }
 
+.form-group input {
+    width: auto;
+}
+
 @media only screen and (max-width: 700px) {
     form  {
         max-width: initial;

MyWebsite/MyWebsite/wwwroot/css/Style.css

@@ -60,7 +60,7 @@ footer {
     padding: 10px;
     display: grid;
     align-items: center;
-    grid-template-columns: 1fr auto auto auto;
+    grid-template-columns: 1fr auto;
     grid-column-gap: 10px;
 }
 footer a {
@@ -104,6 +104,24 @@ article a:visited, article a:link {
     color: blue;
 }
 
+.btn {
+    background-color: #343434;
+    color: white;
+}
+
+.btn-danger {
+    background-color: red;
+    color: white;
+}
+
+.checkbox {
+    width: auto;
+}
+
+.readonly {
+    background-color: lightgray;
+}
+
 .comment, .comment:visited {
     color: #57a64a !important;
 }