feat(halloffame): implement image upload and enhance module functionality
- Added image upload system (JPG/PNG, max 5MB) with live preview and removal option - Fixed Concurrency Exception during deletion (split transactions for reports and entries) - Optimized card layout: consistent height and height-based truncation for descriptions - Added sort direction toggle (Ascending/Descending) with arrow icons for Date, Name, and Year - Refactored HallOfFameService to use streams for Server/Wasm compatibility - Improved error handling and UI feedback for upload and delete operations
This commit is contained in:
Adam Gaiswinkler
@@ -0,0 +1,305 @@
|
||||
@using SZUAbsolventenverein.Module.HallOfFame.Services
|
||||
@using SZUAbsolventenverein.Module.HallOfFame.Models
|
||||
@using Oqtane.Security
|
||||
@using Oqtane.Shared
|
||||
|
||||
@namespace SZUAbsolventenverein.Module.HallOfFame
|
||||
@inherits ModuleBase
|
||||
@inject IHallOfFameService HallOfFameService
|
||||
@inject NavigationManager NavigationManager
|
||||
|
||||
@if (_item == null)
|
||||
{
|
||||
<p><em>Loading...</em></p>
|
||||
}
|
||||
else
|
||||
{
|
||||
<div class="hall-of-fame-details container mt-4">
|
||||
<div class="card shadow-lg border-0 overflow-hidden" style="border-radius: 20px;">
|
||||
<div class="row g-0">
|
||||
<div class="col-lg-5 position-relative bg-light d-flex align-items-center justify-content-center p-4" style="min-height: 400px; background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);">
|
||||
@if (!string.IsNullOrEmpty(_item.Image))
|
||||
{
|
||||
<div class="detail-image-bg" style="background-image: url('@_item.Image');"></div>
|
||||
<img src="@_item.Image" class="img-fluid rounded-3 shadow position-relative" style="max-height: 450px; z-index: 1; border: 8px solid white; object-fit: cover;" alt="@_item.Name">
|
||||
}
|
||||
else
|
||||
{
|
||||
<div class="text-muted position-relative" style="z-index: 1;"><i class="oi oi-person" style="font-size: 8rem; opacity: 0.2;"></i></div>
|
||||
}
|
||||
</div>
|
||||
<div class="col-lg-7">
|
||||
<div class="card-body p-4 p-md-5">
|
||||
<div class="mb-4">
|
||||
<nav aria-label="breadcrumb">
|
||||
<ol class="breadcrumb mb-2">
|
||||
<li class="breadcrumb-item"><a href="@NavigateUrl()">Hall of Fame</a></li>
|
||||
<li class="breadcrumb-item active" aria-current="page">Details</li>
|
||||
</ol>
|
||||
</nav>
|
||||
<h1 class="display-4 fw-bold text-dark mb-0">@_item.Name</h1>
|
||||
<h3 class="text-primary fw-light">Absolvent des Jahrgangs @_item.Year</h3>
|
||||
</div>
|
||||
|
||||
<hr class="my-4" style="width: 100px; height: 3px; background-color: var(--primary); opacity: 1;">
|
||||
|
||||
<div class="description-section mb-5">
|
||||
<h5 class="text-uppercase fw-bold text-muted mb-3" style="letter-spacing: 1px; font-size: 0.9rem;">Werdegang & Erfolge</h5>
|
||||
@if (_item.IsReported && UserSecurity.IsAuthorized(PageState.User, RoleNames.Admin + ";" + RoleNames.Host))
|
||||
{
|
||||
<div class="alert alert-danger mb-3 p-3">
|
||||
<h6 class="mb-2"><i class="oi oi-warning me-2"></i><strong>Meldungen:</strong></h6>
|
||||
@if (_reports != null && _reports.Any())
|
||||
{
|
||||
<ul class="list-group list-group-flush bg-transparent">
|
||||
@foreach (var report in _reports)
|
||||
{
|
||||
<li class="list-group-item bg-transparent d-flex justify-content-between align-items-center border-0 border-bottom">
|
||||
<div>
|
||||
<strong>@report.CreatedBy (@report.CreatedOn.ToShortDateString()):</strong><br />
|
||||
<span>@report.Reason</span>
|
||||
</div>
|
||||
<button class="btn btn-sm btn-outline-danger" @onclick="() => DeleteReport(report.HallOfFameReportId)" title="Meldung löschen">
|
||||
<i class="oi oi-trash"></i>
|
||||
</button>
|
||||
</li>
|
||||
}
|
||||
</ul>
|
||||
}
|
||||
else
|
||||
{
|
||||
<p class="mb-0">Keine detaillierten Meldungen gefunden.</p>
|
||||
}
|
||||
</div>
|
||||
}
|
||||
<div class="lead text-dark mb-4" style="line-height: 1.7; font-size: 1.1rem;">
|
||||
@foreach (var line in (_item.Description?.Replace("\t", " ").Split('\n') ?? Array.Empty<string>()))
|
||||
{
|
||||
<div class="hof-description-line">@line</div>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="d-flex flex-wrap gap-3 mt-5 no-print">
|
||||
<button type="button" class="btn btn-primary btn-lg px-4 shadow-sm" @onclick="PrintPage">
|
||||
<i class="oi oi-print me-2"></i> Als PDF speichern
|
||||
</button>
|
||||
|
||||
@if (!string.IsNullOrEmpty(_item.Link))
|
||||
{
|
||||
<a href="@_item.Link" target="_blank" class="btn btn-secondary btn-lg px-4 shadow-sm">
|
||||
<i class="oi oi-external-link me-2"></i> Webseite besuchen
|
||||
</a>
|
||||
}
|
||||
|
||||
<NavLink class="btn btn-outline-secondary btn-lg px-4" href="@NavigateUrl()">
|
||||
<i class="oi oi-arrow-left me-2"></i> Zurück
|
||||
</NavLink>
|
||||
|
||||
<div class="ms-auto d-flex gap-2">
|
||||
@if (UserSecurity.IsAuthorized(PageState.User, RoleNames.Admin + ";" + RoleNames.Host))
|
||||
{
|
||||
<button class="btn btn-danger btn-lg px-4" @onclick="DeleteEntry">
|
||||
<i class="oi oi-trash me-2"></i> Löschen
|
||||
</button>
|
||||
}
|
||||
<button class="btn btn-warning btn-lg px-4" @onclick="ShowReportModal">
|
||||
<i class="oi oi-warning me-2"></i> Melden
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@if (_showReportModal)
|
||||
{
|
||||
<div class="modal fade show" style="display: block; background: rgba(0,0,0,0.5); z-index: 1050;" tabindex="-1">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title">Eintrag melden</h5>
|
||||
<button type="button" class="btn-close" @onclick="CloseReportModal"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
<p>Warum möchtest du diesen Eintrag von <strong>@_item?.Name</strong> melden?</p>
|
||||
<textarea class="form-control" @bind="_reportReason" rows="3" placeholder="Grund für die Meldung..."></textarea>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" @onclick="CloseReportModal">Abbrechen</button>
|
||||
<button type="button" class="btn btn-danger" @onclick="ReportEntry">Melden</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
|
||||
<style>
|
||||
.detail-image-bg {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
filter: blur(30px) brightness(1.1);
|
||||
opacity: 0.15;
|
||||
z-index: 0;
|
||||
}
|
||||
.hall-of-fame-details .card {
|
||||
background: #ffffff;
|
||||
}
|
||||
.hall-of-fame-details .breadcrumb-item a {
|
||||
text-decoration: none;
|
||||
color: var(--primary);
|
||||
}
|
||||
|
||||
@@media print {
|
||||
.no-print, header, footer, nav, .app-sidebar, .breadcrumb, .btn-link, .app-navbar {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
/* Reset containers for printing */
|
||||
html, body, .app-viewport, .app-main, .app-container, main, .hall-of-fame-details, .container {
|
||||
height: auto !important;
|
||||
min-height: auto !important;
|
||||
overflow: visible !important;
|
||||
position: static !important;
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: white !important;
|
||||
}
|
||||
|
||||
.card {
|
||||
box-shadow: none !important;
|
||||
border: none !important;
|
||||
position: relative !important;
|
||||
display: block !important; /* Force block instead of flex for better printing */
|
||||
}
|
||||
|
||||
.row {
|
||||
display: block !important; /* Stack columns vertically for print if needed, or keeping it but ensuring it doesn't clip */
|
||||
}
|
||||
|
||||
.col-lg-5, .col-lg-7 {
|
||||
width: 100% !important;
|
||||
display: block !important;
|
||||
float: none !important;
|
||||
}
|
||||
|
||||
.hall-of-fame-details {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100% !important;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@code {
|
||||
public override string Actions => "Details";
|
||||
|
||||
private HallOfFame _item;
|
||||
private int _id;
|
||||
private List<HallOfFameReport> _reports;
|
||||
|
||||
private bool _showReportModal = false;
|
||||
private string _reportReason = "";
|
||||
|
||||
protected override async Task OnInitializedAsync()
|
||||
{
|
||||
await LoadData();
|
||||
}
|
||||
|
||||
private async Task LoadData()
|
||||
{
|
||||
try
|
||||
{
|
||||
_id = Int32.Parse(PageState.QueryString["id"]);
|
||||
_item = await HallOfFameService.GetHallOfFameAsync(_id, ModuleState.ModuleId);
|
||||
|
||||
if (_item != null && _item.IsReported && UserSecurity.IsAuthorized(PageState.User, RoleNames.Admin + ";" + RoleNames.Host))
|
||||
{
|
||||
_reports = await HallOfFameService.GetHallOfFameReportsAsync(_id, ModuleState.ModuleId);
|
||||
}
|
||||
}
|
||||
catch (Exception ex)
|
||||
{
|
||||
await logger.LogError(ex, "Error Loading HallOfFame {HallOfFameId} {Error}", _id, ex.Message);
|
||||
AddModuleMessage("Fehler beim Laden der Details.", MessageType.Error);
|
||||
}
|
||||
}
|
||||
|
||||
private async Task PrintPage()
|
||||
{
|
||||
await JSRuntime.InvokeVoidAsync("window.print");
|
||||
}
|
||||
|
||||
private void ShowReportModal()
|
||||
{
|
||||
_reportReason = "";
|
||||
_showReportModal = true;
|
||||
}
|
||||
|
||||
private void CloseReportModal()
|
||||
{
|
||||
_showReportModal = false;
|
||||
}
|
||||
|
||||
private async Task ReportEntry()
|
||||
{
|
||||
if (!string.IsNullOrEmpty(_reportReason))
|
||||
{
|
||||
try
|
||||
{
|
||||
await HallOfFameService.ReportAsync(_item.HallOfFameId, ModuleState.ModuleId, _reportReason);
|
||||
AddModuleMessage("Eintrag wurde erfolgreich gemeldet.", MessageType.Success);
|
||||
_showReportModal = false;
|
||||
await LoadData();
|
||||
}
|
||||
catch (Exception ex)
|
||||
{
|
||||
await logger.LogError(ex, "Error Reporting HallOfFame {Error}", ex.Message);
|
||||
AddModuleMessage("Fehler beim Melden des Eintrags.", MessageType.Error);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private async Task DeleteEntry()
|
||||
{
|
||||
try
|
||||
{
|
||||
await HallOfFameService.DeleteHallOfFameAsync(_item.HallOfFameId, ModuleState.ModuleId);
|
||||
NavigationManager.NavigateTo(NavigateUrl());
|
||||
}
|
||||
catch (Exception ex)
|
||||
{
|
||||
await logger.LogError(ex, "Error Deleting HallOfFame {Error}", ex.Message);
|
||||
AddModuleMessage("Fehler beim Löschen des Eintrags.", MessageType.Error);
|
||||
}
|
||||
}
|
||||
|
||||
private async Task DeleteReport(int reportId)
|
||||
{
|
||||
try
|
||||
{
|
||||
await HallOfFameService.DeleteHallOfFameReportAsync(reportId, ModuleState.ModuleId);
|
||||
AddModuleMessage("Meldung gelöscht.", MessageType.Success);
|
||||
await LoadData();
|
||||
}
|
||||
catch (Exception ex)
|
||||
{
|
||||
await logger.LogError(ex, "Error Deleting Report {Error}", ex.Message);
|
||||
AddModuleMessage("Fehler beim Löschen der Meldung.", MessageType.Error);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,6 +1,7 @@
|
||||
@using Oqtane.Modules.Controls
|
||||
@using SZUAbsolventenverein.Module.HallOfFame.Services
|
||||
@using SZUAbsolventenverein.Module.HallOfFame.Models
|
||||
@using Microsoft.AspNetCore.Components.Forms
|
||||
|
||||
@namespace SZUAbsolventenverein.Module.HallOfFame
|
||||
@inherits ModuleBase
|
||||
@@ -20,21 +21,47 @@
|
||||
<div class="row mb-3 align-items-center">
|
||||
<Label Class="col-sm-3 col-form-label" For="year" HelpText="Jahrgang (z.B. 2020)" ResourceKey="Year">Jahrgang: </Label>
|
||||
<div class="col-sm-9">
|
||||
<input id="year" type="number" class="form-control" @bind="@_year" required min="1990" max="2100" />
|
||||
<input id="year" type="number" class="form-control" @bind="@_year" required min="1900" max="@Int32.MaxValue" />
|
||||
<div class="invalid-feedback">Bitte gib einen gültigen Jahrgang ein.</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mb-3 align-items-center">
|
||||
<Label Class="col-sm-3 col-form-label" For="description" HelpText="Kurzbeschreibung / Werdegang" ResourceKey="Description">Beschreibung: </Label>
|
||||
<div class="col-sm-9">
|
||||
<textarea id="description" class="form-control" @bind="@_description" required rows="5" maxlength="1500"></textarea>
|
||||
<textarea id="description" class="form-control" @bind="@_description" required rows="5" maxlength="500"></textarea>
|
||||
<div class="text-muted small">@(_description?.Length ?? 0) / 500 Zeichen</div>
|
||||
<div class="invalid-feedback">Bitte gib eine Beschreibung ein.</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mb-3 align-items-center">
|
||||
<Label Class="col-sm-3 col-form-label" For="image" HelpText="Bild URL (optional)" ResourceKey="Image">Bild URL: </Label>
|
||||
<div class="row mb-3">
|
||||
<Label Class="col-sm-3 col-form-label" For="image" HelpText="Porträtfoto hochladen (JPG/PNG)" ResourceKey="Image">Foto: </Label>
|
||||
<div class="col-sm-9">
|
||||
<input id="image" class="form-control" @bind="@_image" />
|
||||
<div class="mb-2">
|
||||
@if (!string.IsNullOrEmpty(_image))
|
||||
{
|
||||
<div class="position-relative d-inline-block">
|
||||
<img src="@_image" style="max-height: 150px; border-radius: 8px; margin-bottom: 10px; border: 1px solid #ddd;" alt="Vorschau" />
|
||||
<button type="button" class="btn btn-sm btn-danger" style="position: absolute; top: 5px; right: 5px;" @onclick="RemoveImage" title="Bild entfernen">
|
||||
<i class="oi oi-x"></i>
|
||||
</button>
|
||||
</div>
|
||||
}
|
||||
else
|
||||
{
|
||||
<div class="bg-light d-flex align-items-center justify-content-center text-muted" style="height: 150px; width: 150px; border: 2px dashed #ddd; border-radius: 8px;">
|
||||
Kein Bild
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
<InputFile OnChange="HandleFileSelected" class="form-control" accept=".jpg,.jpeg,.png" />
|
||||
<div class="text-muted small mt-1">Nur JPG oder PNG, max. 5 MB.</div>
|
||||
@if (_uploading)
|
||||
{
|
||||
<div class="spinner-border spinner-border-sm text-primary mt-2" role="status">
|
||||
<span class="visually-hidden">Wird hochgeladen...</span>
|
||||
</div>
|
||||
<span class="small text-primary ms-1">Wird hochgeladen...</span>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
<div class="row mb-3 align-items-center">
|
||||
@@ -53,8 +80,8 @@
|
||||
</div>
|
||||
|
||||
<div class="mt-4">
|
||||
<button type="button" class="btn btn-secondary me-2" @onclick="@(() => Save("Draft"))">Als Entwurf speichern</button>
|
||||
<button type="button" class="btn btn-primary" @onclick="@(() => Save("Published"))">Veröffentlichen</button>
|
||||
<button type="button" class="btn btn-secondary me-2" @onclick="@(() => Save("Draft"))" disabled="@_uploading">Als Entwurf speichern</button>
|
||||
<button type="button" class="btn btn-primary" @onclick="@(() => Save("Published"))" disabled="@_uploading">Veröffentlichen</button>
|
||||
<NavLink class="btn btn-link ms-2" href="@NavigateUrl()">Abbrechen</NavLink>
|
||||
</div>
|
||||
|
||||
@@ -79,6 +106,7 @@
|
||||
|
||||
private ElementReference form;
|
||||
private bool validated = false;
|
||||
private bool _uploading = false;
|
||||
|
||||
private int _id;
|
||||
private string _name;
|
||||
@@ -102,7 +130,6 @@
|
||||
_id = Int32.Parse(PageState.QueryString["id"]);
|
||||
HallOfFame HallOfFame = await HallOfFameService.GetHallOfFameAsync(_id, ModuleState.ModuleId);
|
||||
|
||||
// Security check: only allow editing own entry
|
||||
if (HallOfFame != null)
|
||||
{
|
||||
if (HallOfFame.UserId != PageState.User.UserId)
|
||||
@@ -126,11 +153,9 @@
|
||||
}
|
||||
else // Add Mode
|
||||
{
|
||||
// Check if user already has an entry to prevent duplicates
|
||||
var existing = await HallOfFameService.GetHallOfFameByUserIdAsync(PageState.User.UserId, ModuleState.ModuleId);
|
||||
if (existing != null)
|
||||
{
|
||||
// Use NavigateUrl with parameters properly (simplified here)
|
||||
NavigationManager.NavigateTo(EditUrl(existing.HallOfFameId.ToString()));
|
||||
}
|
||||
}
|
||||
@@ -142,6 +167,50 @@
|
||||
}
|
||||
}
|
||||
|
||||
private async Task HandleFileSelected(InputFileChangeEventArgs e)
|
||||
{
|
||||
var file = e.File;
|
||||
if (file == null) return;
|
||||
|
||||
if (file.Size > 5 * 1024 * 1024)
|
||||
{
|
||||
AddModuleMessage("Die Datei ist zu groß (max. 5 MB allowed).", MessageType.Warning);
|
||||
return;
|
||||
}
|
||||
|
||||
try
|
||||
{
|
||||
_uploading = true;
|
||||
using var stream = file.OpenReadStream(5 * 1024 * 1024);
|
||||
var url = await HallOfFameService.UploadFileAsync(stream, file.Name, ModuleState.ModuleId);
|
||||
if (!string.IsNullOrEmpty(url))
|
||||
{
|
||||
_image = url;
|
||||
AddModuleMessage("Foto erfolgreich hochgeladen.", MessageType.Success);
|
||||
}
|
||||
else
|
||||
{
|
||||
AddModuleMessage("Fehler beim Hochladen des Fotos.", MessageType.Error);
|
||||
}
|
||||
}
|
||||
catch (Exception ex)
|
||||
{
|
||||
await logger.LogError(ex, "Error Uploading File {Error}", ex.Message);
|
||||
AddModuleMessage("Ein technischer Fehler ist beim Upload aufgetreten.", MessageType.Error);
|
||||
}
|
||||
finally
|
||||
{
|
||||
_uploading = false;
|
||||
StateHasChanged();
|
||||
}
|
||||
}
|
||||
|
||||
private void RemoveImage()
|
||||
{
|
||||
_image = string.Empty;
|
||||
StateHasChanged();
|
||||
}
|
||||
|
||||
private async Task Save(string status)
|
||||
{
|
||||
try
|
||||
@@ -156,7 +225,7 @@
|
||||
{
|
||||
HallOfFame HallOfFame = new HallOfFame();
|
||||
HallOfFame.ModuleId = ModuleState.ModuleId;
|
||||
HallOfFame.UserId = PageState.User.UserId; // Set Owner
|
||||
HallOfFame.UserId = PageState.User.UserId;
|
||||
HallOfFame.Name = _name;
|
||||
HallOfFame.Year = _year;
|
||||
HallOfFame.Description = _description;
|
||||
@@ -170,7 +239,6 @@
|
||||
else
|
||||
{
|
||||
HallOfFame HallOfFame = await HallOfFameService.GetHallOfFameAsync(_id, ModuleState.ModuleId);
|
||||
// Ensure we don't overwrite with invalid user logic, though server checks too
|
||||
if (HallOfFame.UserId == PageState.User.UserId)
|
||||
{
|
||||
HallOfFame.Name = _name;
|
||||
|
||||
@@ -1,5 +1,7 @@
|
||||
@using SZUAbsolventenverein.Module.HallOfFame.Services
|
||||
@using SZUAbsolventenverein.Module.HallOfFame.Models
|
||||
@using Oqtane.Security
|
||||
@using Oqtane.Shared
|
||||
|
||||
@namespace SZUAbsolventenverein.Module.HallOfFame
|
||||
@inherits ModuleBase
|
||||
@@ -13,30 +15,44 @@
|
||||
}
|
||||
else
|
||||
{
|
||||
<div class="row mb-4">
|
||||
<div class="col text-end">
|
||||
<div class="row mb-4 align-items-center">
|
||||
<div class="col-md-6">
|
||||
<div class="input-group">
|
||||
<span class="input-group-text"><i class="oi oi-magnifying-glass"></i></span>
|
||||
<input type="text" class="form-control" placeholder="Suchen nach Namen oder Begriffen..." @bind="_searchText" @bind:event="oninput" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
<div class="input-group">
|
||||
<select class="form-select" @bind="_sortOption">
|
||||
<option value="CreatedOn">Datum</option>
|
||||
<option value="Name">Name</option>
|
||||
<option value="Year">Jahrgang</option>
|
||||
</select>
|
||||
<button class="btn btn-outline-secondary" type="button" @onclick="ToggleSortDirection" title="@(_sortAscending ? "Aufsteigend" : "Absteigend")">
|
||||
<i class="oi @(_sortAscending ? "oi-arrow-top" : "oi-arrow-bottom")"></i>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-3 text-end">
|
||||
@if (PageState.User != null)
|
||||
{
|
||||
if (_myEntry != null)
|
||||
{
|
||||
<ActionLink Action="Edit" Parameters="@($"id=" + _myEntry.HallOfFameId.ToString())" Text="Hall-of-Fame-Eintrag bearbeiten" />
|
||||
<ActionLink Action="Edit" Parameters="@($"id=" + _myEntry.HallOfFameId.ToString())" Text="Mein Eintrag" />
|
||||
}
|
||||
else
|
||||
{
|
||||
<ActionLink Action="Add" Text="Neuen Hall-of-Fame-Eintrag erstellen" />
|
||||
<ActionLink Action="Add" Text="Eintragen" />
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
<p class="text-muted">Einloggen, um einen Eintrag zu erstellen.</p>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if (@_HallOfFames.Count != 0)
|
||||
{
|
||||
<div class="row">
|
||||
@foreach (var item in _HallOfFames)
|
||||
@foreach (var item in FilteredHallOfFames)
|
||||
{
|
||||
<div class="col-md-4 mb-3">
|
||||
<div class="card h-100">
|
||||
@@ -44,13 +60,35 @@ else
|
||||
{
|
||||
<img src="@item.Image" class="card-img-top" alt="@item.Name" style="max-height: 200px; object-fit: cover;">
|
||||
}
|
||||
<div class="card-body">
|
||||
<div class="card-body d-flex flex-column">
|
||||
<h5 class="card-title">@item.Name (@item.Year)</h5>
|
||||
<p class="card-text">@item.Description</p>
|
||||
@if (!string.IsNullOrEmpty(item.Link))
|
||||
@if (item.IsReported && UserSecurity.IsAuthorized(PageState.User, RoleNames.Admin + ";" + RoleNames.Host))
|
||||
{
|
||||
<a href="@item.Link" target="_blank" class="btn btn-sm btn-outline-primary">Mehr Infos</a>
|
||||
<div class="alert alert-danger p-1 mb-2" style="font-size: 0.8rem;">
|
||||
<i class="oi oi-warning me-1"></i> <strong>Dieser Eintrag wurde gemeldet!</strong>
|
||||
</div>
|
||||
}
|
||||
<div class="hof-description-container" style="
|
||||
max-height: 150px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
flex-grow: 1;
|
||||
margin-bottom: 0.5rem;
|
||||
">
|
||||
@foreach (var line in (item.Description?.Replace("\t", " ").Split('\n') ?? Array.Empty<string>()))
|
||||
{
|
||||
<div class="hof-description-line">@line</div>
|
||||
}
|
||||
</div>
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<ActionLink Action="Details" Parameters="@($"id=" + item.HallOfFameId.ToString())" Class="btn btn-sm btn-outline-primary" Text="Details ansehen" />
|
||||
<div>
|
||||
@if (UserSecurity.IsAuthorized(PageState.User, RoleNames.Admin + ";" + RoleNames.Host))
|
||||
{
|
||||
<button class="btn btn-sm btn-outline-danger me-1" @onclick="@(() => Delete(item.HallOfFameId))" title="Löschen"><i class="oi oi-trash"></i></button>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -66,7 +104,6 @@ else
|
||||
}
|
||||
|
||||
@code {
|
||||
public override string RenderMode => RenderModes.Static;
|
||||
|
||||
public override List<Resource> Resources => new List<Resource>()
|
||||
{
|
||||
@@ -76,8 +113,53 @@ else
|
||||
|
||||
List<HallOfFame> _HallOfFames;
|
||||
HallOfFame _myEntry;
|
||||
string _searchText = "";
|
||||
string _sortOption = "CreatedOn";
|
||||
bool _sortAscending = false;
|
||||
|
||||
IEnumerable<HallOfFame> FilteredHallOfFames
|
||||
{
|
||||
get
|
||||
{
|
||||
var items = _HallOfFames.AsEnumerable();
|
||||
if (!string.IsNullOrEmpty(_searchText))
|
||||
{
|
||||
items = items.Where(i =>
|
||||
(i.Name?.Contains(_searchText, StringComparison.OrdinalIgnoreCase) ?? false) ||
|
||||
(i.Description?.Contains(_searchText, StringComparison.OrdinalIgnoreCase) ?? false)
|
||||
);
|
||||
}
|
||||
|
||||
items = _sortOption switch
|
||||
{
|
||||
"Name" => _sortAscending ? items.OrderBy(i => i.Name) : items.OrderByDescending(i => i.Name),
|
||||
"Year" => _sortAscending ? items.OrderBy(i => i.Year) : items.OrderByDescending(i => i.Year),
|
||||
"CreatedOn" or _ => _sortAscending ? items.OrderBy(i => i.CreatedOn) : items.OrderByDescending(i => i.CreatedOn)
|
||||
};
|
||||
|
||||
return items;
|
||||
}
|
||||
}
|
||||
|
||||
private string TruncateDescription(string description)
|
||||
{
|
||||
if (string.IsNullOrEmpty(description)) return "";
|
||||
const int maxLength = 150;
|
||||
if (description.Length <= maxLength) return description;
|
||||
return description.Substring(0, maxLength).TrimEnd() + "...";
|
||||
}
|
||||
|
||||
private void ToggleSortDirection()
|
||||
{
|
||||
_sortAscending = !_sortAscending;
|
||||
}
|
||||
|
||||
protected override async Task OnInitializedAsync()
|
||||
{
|
||||
await LoadData();
|
||||
}
|
||||
|
||||
private async Task LoadData()
|
||||
{
|
||||
try
|
||||
{
|
||||
@@ -94,4 +176,19 @@ else
|
||||
AddModuleMessage(Localizer["Message.LoadError"], MessageType.Error);
|
||||
}
|
||||
}
|
||||
|
||||
private async Task Delete(int hallOfFameId)
|
||||
{
|
||||
try
|
||||
{
|
||||
await HallOfFameService.DeleteHallOfFameAsync(hallOfFameId, ModuleState.ModuleId);
|
||||
AddModuleMessage("Eintrag wurde gelöscht.", MessageType.Success);
|
||||
await LoadData();
|
||||
}
|
||||
catch (Exception ex)
|
||||
{
|
||||
await logger.LogError(ex, "Error Deleting HallOfFame {Error}", ex.Message);
|
||||
AddModuleMessage("Fehler beim Löschen des Eintrags.", MessageType.Error);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -9,9 +9,9 @@ namespace SZUAbsolventenverein.Module.HallOfFame
|
||||
{
|
||||
Name = "HallOfFame",
|
||||
Description = "The Hall of Fame module displays selected individuals or achievements within the CMS. Entries are shown online, can be exported as a PDF, and are only published with user consen.",
|
||||
Version = "1.0.0",
|
||||
Version = "1.0.3",
|
||||
ServerManagerType = "SZUAbsolventenverein.Module.HallOfFame.Manager.HallOfFameManager, SZUAbsolventenverein.Module.HallOfFame.Server.Oqtane",
|
||||
ReleaseVersions = "1.0.0",
|
||||
ReleaseVersions = "1.0.0,1.0.2,1.0.3",
|
||||
Dependencies = "SZUAbsolventenverein.Module.HallOfFame.Shared.Oqtane",
|
||||
PackageName = "SZUAbsolventenverein.Module.HallOfFame"
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user