343 lines
14 KiB
Plaintext
343 lines
14 KiB
Plaintext
@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="ShowPdfPreview">
|
|
<i class="oi oi-eye me-2"></i> PDF Vorschau
|
|
</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>
|
|
}
|
|
@if (_showPdfModal)
|
|
{
|
|
<div class="modal fade show" style="display: block; background: rgba(0,0,0,0.6); z-index: 1050;" tabindex="-1">
|
|
<div class="modal-dialog modal-xl modal-dialog-centered" style="max-width: 90vw; height: 90vh;">
|
|
<div class="modal-content" style="height: 90vh;">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title"><i class="oi oi-document me-2"></i> PDF Vorschau</h5>
|
|
<button type="button" class="btn-close" @onclick="ClosePdfPreview"></button>
|
|
</div>
|
|
<div class="modal-body p-0" style="flex: 1; overflow: hidden;">
|
|
<iframe src="@_pdfPreviewUrl" style="width: 100%; height: 100%; border: none;"></iframe>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" @onclick="ClosePdfPreview">Schließen</button>
|
|
<button type="button" class="btn btn-primary" @onclick="DownloadPdf">
|
|
<i class="oi oi-data-transfer-download me-2"></i> Herunterladen
|
|
</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 = "";
|
|
private bool _showPdfModal = false;
|
|
private string _pdfPreviewUrl = "";
|
|
|
|
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 void ShowPdfPreview()
|
|
{
|
|
_pdfPreviewUrl = $"/api/HallOfFamePdf?moduleid={ModuleState.ModuleId}";
|
|
_showPdfModal = true;
|
|
}
|
|
|
|
private void ClosePdfPreview()
|
|
{
|
|
_showPdfModal = false;
|
|
_pdfPreviewUrl = "";
|
|
}
|
|
|
|
private async Task DownloadPdf()
|
|
{
|
|
var url = $"/api/HallOfFamePdf?moduleid={ModuleState.ModuleId}&download=true";
|
|
await JSRuntime.InvokeVoidAsync("eval", $"var a = document.createElement('a'); a.href = '{url}'; a.download = 'HallOfFame.pdf'; document.body.appendChild(a); a.click(); document.body.removeChild(a);");
|
|
}
|
|
|
|
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);
|
|
}
|
|
}
|
|
}
|