simple details page
This commit is contained in:
parent
2a14bf1f41
commit
9d2d0d697c
5 changed files with 117 additions and 17 deletions
40
Pages/Documents/Details.cshtml
Normal file
40
Pages/Documents/Details.cshtml
Normal file
|
@ -0,0 +1,40 @@
|
|||
@page "{id:int}"
|
||||
@model Snootalogue.Pages.Documents.DetailsModel
|
||||
|
||||
@{
|
||||
ViewData["Title"] = "Details";
|
||||
}
|
||||
|
||||
<h1>Details</h1>
|
||||
|
||||
<dl class="document-details">
|
||||
<dt>@Html.DisplayNameFor(model => model.Document.Title)</dt>
|
||||
<dd>@Html.DisplayFor(model => model.Document.Title)</dd>
|
||||
<dt>@Html.DisplayNameFor(model => model.Document.ID)</dt>
|
||||
<dd>@Html.DisplayFor(model => model.Document.ID)</dd>
|
||||
<dt>@Html.DisplayNameFor(model => model.Document.Filename)</dt>
|
||||
<dd>@Html.DisplayFor(model => model.Document.Filename)</dd>
|
||||
<dt>@Html.DisplayNameFor(model => model.Document.Hash)</dt>
|
||||
<dd>@Html.DisplayFor(model => model.Document.Hash)</dd>
|
||||
<dt>@Html.DisplayNameFor(model => model.Document.Size)</dt>
|
||||
<dd>@Html.DisplayFor(model => model.Document.Size)</dd>
|
||||
<dt>@Html.DisplayNameFor(model => model.Document.Title)</dt>
|
||||
<dd>@Html.DisplayFor(model => model.Document.Title)</dd>
|
||||
<dt>@Html.DisplayNameFor(model => model.Document.Authors)</dt>
|
||||
<dd>@Html.DisplayFor(model => model.Document.Authors)</dd>
|
||||
<dt>@Html.DisplayNameFor(model => model.Document.Category)</dt>
|
||||
<dd>@Html.DisplayFor(model => model.Document.Category)</dd>
|
||||
<dt>@Html.DisplayNameFor(model => model.Document.DateAdded)</dt>
|
||||
<dd>@Html.DisplayFor(model => model.Document.DateAdded)</dd>
|
||||
<dt>@Html.DisplayNameFor(model => model.Document.Tags)</dt>
|
||||
<dd class="tags">@Html.DisplayFor(model => model.Document.Tags)</dd>
|
||||
<dt>@Html.DisplayNameFor(model => model.Document.Read)</dt>
|
||||
<dd>@Html.DisplayFor(model => model.Document.Read)</dd>
|
||||
</dl>
|
||||
|
||||
<div class="centred">
|
||||
<a class="button block" href='/'>Return to documents</a>
|
||||
<br>
|
||||
<a class="button block" href='#'>View as JSON</a>
|
||||
</div>
|
||||
|
34
Pages/Documents/Details.cshtml.cs
Normal file
34
Pages/Documents/Details.cshtml.cs
Normal file
|
@ -0,0 +1,34 @@
|
|||
using System;
|
||||
using System.Collections.Generic;
|
||||
using System.Linq;
|
||||
using System.Threading.Tasks;
|
||||
using Microsoft.AspNetCore.Mvc;
|
||||
using Microsoft.AspNetCore.Mvc.RazorPages;
|
||||
using Microsoft.EntityFrameworkCore;
|
||||
using Snootalogue.Data;
|
||||
using Snootalogue.Models;
|
||||
|
||||
namespace Snootalogue.Pages.Documents {
|
||||
public class DetailsModel : PageModel {
|
||||
private readonly SnootalogueContext _context;
|
||||
public Document Document { get; set; }
|
||||
|
||||
public DetailsModel(SnootalogueContext context) {
|
||||
_context = context;
|
||||
}
|
||||
|
||||
public async Task<IActionResult> OnGetAsync(int? id) {
|
||||
if (id == null) {
|
||||
return NotFound();
|
||||
}
|
||||
|
||||
Document = await _context.Document.FirstOrDefaultAsync(d => d.ID == id);
|
||||
|
||||
if (Document == null) {
|
||||
return NotFound();
|
||||
}
|
||||
|
||||
return Page();
|
||||
}
|
||||
}
|
||||
}
|
|
@ -1,5 +1,7 @@
|
|||
@page
|
||||
@model Snootalogue.Pages.IndexModel
|
||||
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers
|
||||
|
||||
@{
|
||||
ViewData["Title"] = "Home";
|
||||
}
|
||||
|
@ -21,7 +23,7 @@
|
|||
@* TODO: replace these with font awesome or something *@
|
||||
<div class="vertical-buttons">
|
||||
<a href="#" class="button simple">View</a>
|
||||
<a href="#" class="button simple">Details</a>
|
||||
<a asp-page="./Documents/Details" asp-route-id="@item.ID" class="button simple">Details</a>
|
||||
<a href="#" class="button simple">Edit</a>
|
||||
<a href="#" class="button simple">Delete</a>
|
||||
</div>
|
||||
|
|
|
@ -10,16 +10,16 @@ using Snootalogue.Data;
|
|||
|
||||
namespace Snootalogue.Pages {
|
||||
public class IndexModel : PageModel {
|
||||
private readonly SnootalogueContext context;
|
||||
private readonly SnootalogueContext _context;
|
||||
public IList<Document> Documents { get; set; }
|
||||
public string Search { get; set; }
|
||||
|
||||
public IndexModel(SnootalogueContext context) {
|
||||
this.context = context;
|
||||
_context = context;
|
||||
}
|
||||
|
||||
public async Task OnGetAsync() {
|
||||
Documents = await context.Document.ToListAsync();
|
||||
Documents = await _context.Document.ToListAsync();
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -5,29 +5,45 @@ body {
|
|||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
font-weight: 200;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
a.simple {
|
||||
.centred {
|
||||
margin: 0 auto;
|
||||
width: max-content;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a.button {
|
||||
color: #a66;
|
||||
background: white;
|
||||
border: thin #a66 solid;
|
||||
border-radius: 5px;
|
||||
padding: 5px;
|
||||
text-align: center;
|
||||
transition: 0.2s all;
|
||||
}
|
||||
a.button:hover {
|
||||
background: #a66;
|
||||
color: white;
|
||||
}
|
||||
a.button.block {
|
||||
display: inline-block;
|
||||
margin: 5px auto;
|
||||
}
|
||||
|
||||
.vertical-buttons {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.vertical-buttons a.button {
|
||||
flex: 1;
|
||||
color: #a66;
|
||||
background: white;
|
||||
border: thin #a66 solid;
|
||||
border-bottom: none;
|
||||
padding: 5px;
|
||||
text-align: center;
|
||||
transition: 0.2s all;
|
||||
}
|
||||
.vertical-buttons a.button:hover {
|
||||
background: #a66;
|
||||
color: white;
|
||||
border-radius: 0;
|
||||
}
|
||||
.vertical-buttons a.button:first-child {
|
||||
border-radius: 5px 5px 0 0;
|
||||
|
@ -85,16 +101,19 @@ main {
|
|||
margin: 3px 0;
|
||||
}
|
||||
.document-column .title {
|
||||
font-size: 1.2em;
|
||||
font-size: 1.4em;
|
||||
font-weight: 200;
|
||||
text-align: center;
|
||||
}
|
||||
.document-column .authors {
|
||||
text-align: center;
|
||||
font-style: italic;
|
||||
}
|
||||
.document-column .tags {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
.document-column .tags .list-empty::before {
|
||||
.document-column .tags .list-empty::before,
|
||||
.document-details .tags .list-empty::before {
|
||||
display: inline-block;
|
||||
content: "No tags";
|
||||
}
|
||||
|
@ -102,3 +121,8 @@ main {
|
|||
font-size: 0.8em;
|
||||
color: #888;
|
||||
}
|
||||
|
||||
.document-details {
|
||||
margin: 10px auto;
|
||||
width: min-content;
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue