73 lines
2.6 KiB
Plaintext
73 lines
2.6 KiB
Plaintext
@page "/gallery"
|
|
|
|
@using DataAccess.Data
|
|
@using DataAccess.Models
|
|
|
|
@inject DialogService DialogService;
|
|
@inject BildInfoData BildInfoData;
|
|
@inject WunschInfoData WunschInfoData;
|
|
|
|
<style>
|
|
.small-image {
|
|
width: 10em;
|
|
height: 10em;
|
|
z-index: auto;
|
|
margin: 0.5em;
|
|
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
|
|
border-radius: 1em;
|
|
/* Gibt an, dass Änderungen an der transform-Eigenschaft innerhalb von 0.2s angewandt werden.*/
|
|
transition: transform 0.2s;
|
|
}
|
|
|
|
/* Style, der angewendet wird, wenn über small-image gehovert wird. */
|
|
.small-image:hover {
|
|
transform: scale(1.1, 1.1);
|
|
z-index: 100;
|
|
}
|
|
</style>
|
|
|
|
<RadzenDataList WrapItems="@true" AllowPaging="true" PageSize="40" Data="@_bildInfos" PagerHorizontalAlign="HorizontalAlign.Left" ShowPagingSummary="true">
|
|
<Template Context="bildInfo">
|
|
<RadzenImage class="small-image" Src="@bildInfo.Dateiname" Click="@(args => ShowImageDialog(bildInfo))" />
|
|
</Template>
|
|
</RadzenDataList>
|
|
|
|
@code {
|
|
IEnumerable<BildInfoModel>? _bildInfos;
|
|
|
|
protected override async Task OnInitializedAsync()
|
|
{
|
|
_bildInfos = await BildInfoData.GetAllBildInfosAsync();
|
|
|
|
await base.OnInitializedAsync();
|
|
}
|
|
|
|
async Task ShowImageDialog(BildInfoModel bildInfo)
|
|
{
|
|
WunschInfoModel wunschInfo = await WunschInfoData.GetWunschInfoAsync(bildInfo.WunschId);
|
|
|
|
List<BildInfoModel> bilderVomWunsch = _bildInfos!.Where(info => info.WunschId == wunschInfo.Id).ToList();
|
|
|
|
var result = await DialogService.OpenAsync(wunschInfo.Wunsch, ds =>
|
|
@<div>
|
|
<RadzenStack Orientation="Orientation.Horizontal" Wrap="FlexWrap.Wrap">
|
|
<RadzenStack Orientation="Orientation.Horizontal">
|
|
<RadzenStack Orientation="Orientation.Vertical">
|
|
<RadzenImage Style="width: 400px; height: 400px;" Path="@bildInfo.Dateiname" />
|
|
</RadzenStack>
|
|
<RadzenText Text="@wunschInfo.BildBeschreibung"/>
|
|
</RadzenStack>
|
|
@foreach (var bild in bilderVomWunsch)
|
|
{
|
|
<RadzenImage class="small-image" Path="@bild.Dateiname"
|
|
Click="async () => { bildInfo = bild; DialogService.Close(); await ShowImageDialog(bild); }" />
|
|
}
|
|
</RadzenStack>
|
|
</div>,
|
|
new DialogOptions() { CloseDialogOnOverlayClick = true, Width = "50%" });
|
|
}
|
|
|
|
[Inject]
|
|
private IWebHostEnvironment _environment { get; set; }
|
|
}
|