YaeBlog/YaeBlog.Theme.FluentUI/Pages/Home.razor

172 lines
6.9 KiB
Plaintext
Raw Normal View History

2024-01-20 17:10:32 +08:00
@page "/"
2024-01-21 19:57:14 +08:00
@using YaeBlog.Core.Models
2024-01-23 12:27:25 +08:00
@using YaeBlog.Core.Services
2024-01-21 19:57:14 +08:00
@inject BlogOptions BlogOptionsInstance
2024-01-23 12:27:25 +08:00
@inject EssayContentService EssayContentInstance
@inject NavigationManager NavigationManagerInstance
2024-01-21 19:57:14 +08:00
<div style="height: 100%">
<div class="banner" style="background-image: url('@BlogOptionsInstance.BannerImage')">
<div class="blog-title">
<FluentLabel Typo="@Typography.H1" Style="color: white">
@(BlogOptionsInstance.Author)'s Blog
</FluentLabel>
</div>
<div class="scroll-down">
<i class="scroll-down-tag"></i>
</div>
</div>
2024-01-23 12:27:25 +08:00
<div style="height: 2rem" id="blog-content"></div>
<div style="margin: 0 8% 0 8%">
<FluentGrid>
<FluentGridItem xs="12" sm="12" md="8" lg="8">
<div>
@foreach (KeyValuePair<string, BlogEssay> essay in _essays)
{
<FluentCard Style="margin: 2rem 0 2rem 0">
<div>
2024-01-23 17:55:34 +08:00
<a href="essays/@(essay.Key)" target="_blank">
2024-01-23 12:27:25 +08:00
<FluentLabel Typo="@Typography.H4">
2024-01-24 20:53:41 +08:00
@(essay.Value.Title)
2024-01-23 12:27:25 +08:00
</FluentLabel>
</a>
2024-01-24 20:53:41 +08:00
<div style="margin: 0.5rem 0 0.5rem 0">
<a href="essays/@(essay.Key)" target="_blank" style="color: #718096;">
<div class="essay-description">
@(essay.Value.Description)
</div>
</a>
</div>
2024-01-23 12:27:25 +08:00
<FluentStack VerticalAlignment="@VerticalAlignment.Center"
Style="margin: 1rem 0 1rem 0"
HorizontalGap="4">
<FluentIcon Value="@(new Icons.Regular.Size16.Calendar())"/>
<span style="margin: auto 0 auto 0">
@(essay.Value.PublishTime.ToString("yyyy-MM-dd HH:mm:ss"))
</span>
@if (essay.Value.Tags.Count != 0)
{
<FluentIcon Value="@(new Icons.Regular.Size16.TagMultiple())"/>
@foreach (string tag in essay.Value.Tags)
{
<span style="margin: auto 0 auto 0">
@tag
</span>
}
}
</FluentStack>
</div>
</FluentCard>
}
<div class="pagination">
<FluentStack HorizontalAlignment="@HorizontalAlignment.Center"
HorizontalGap="20">
@if (Page != 1)
{
<a href="/?page=@(Page - 1)#blog-content" class="pagination-item">
<i class="chevron-left"></i>
</a>
}
@if (Page == 1)
{
<a href="/?page=1#blog-content" class="pagination-item">
<span>1</span>
</a>
<a href="/?page=2#blog-content" class="pagination-item">
<span>2</span>
</a>
<a href="/?page=3#blog-content" class="pagination-item">
<span>3</span>
</a>
}
else if (Page == _pageCount)
{
<a href="/?page=@(_pageCount - 2)#blog-content" class="pagination-item">
<span>@(_pageCount - 2)</span>
</a>
<a href="/?page=@(_pageCount - 1)#blog-content" class="pagination-item">
<span>@(_pageCount - 1)</span>
</a>
<a href="/?page=@(_pageCount)#blog-content" class="pagination-item">
<span>@(_pageCount)</span>
</a>
}
else
{
<a href="/?page=@(Page - 1)#blog-content" class="pagination-item">
<span>@(Page - 1)</span>
</a>
<a href="/?page=@(Page)#blog-content" class="pagination-item">
<span>@(Page)</span>
</a>
<a href="/?page=@(Page + 1)#blog-content" class="pagination-item">
<span>@(Page + 1)</span>
</a>
}
@if (Page != _pageCount)
{
<a href="/?page=@(Page + 1)#blog-content" class="pagination-item">
<i class="chevron-right"></i>
</a>
}
</FluentStack>
</div>
</div>
</FluentGridItem>
<FluentGridItem xs="12" sm="12" md="4" lg="4">
</FluentGridItem>
</FluentGrid>
2024-01-21 19:57:14 +08:00
</div>
2024-01-21 22:46:12 +08:00
<BlogFooter/>
2024-01-21 19:57:14 +08:00
</div>
2024-01-20 17:10:32 +08:00
@code {
2024-01-23 12:27:25 +08:00
[SupplyParameterFromQuery] private int? Page { get; set; }
private readonly List<KeyValuePair<string, BlogEssay>> _essays = [];
private int _pageCount;
protected override void OnInitialized()
{
Page ??= 1;
IEnumerable<KeyValuePair<string, BlogEssay>[]> chunks =
EssayContentInstance.Essays
.OrderByDescending(pair => pair.Value.PublishTime)
.Chunk(10);
var count = 1;
var flag = false;
foreach (KeyValuePair<string, BlogEssay>[] chunk in chunks)
{
if (Page == count)
{
flag = true;
_essays.AddRange(chunk);
}
count += 1;
}
_pageCount = count - 1;
if (flag is false)
{
NavigationManagerInstance.NavigateTo("NotFount");
}
}
2024-01-20 17:10:32 +08:00
}