You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
115 lines
2.4 KiB
115 lines
2.4 KiB
@using Services.Website |
|
@implements IDisposable; |
|
@inject IMyDialogService MyDialogService |
|
@inject IJSRuntime JsRuntime |
|
|
|
|
|
@inject NavigationManager NavigationManager |
|
|
|
@if (MyDialogService.IsVisible) |
|
{ |
|
<div class="confirmDialogBackground" onclick="@CloseDialog"> |
|
<div class="confirmDialogContainer" |
|
@onclick:preventDefault="true" |
|
@onclick:stopPropagation="true"> |
|
|
|
<div class="confirmDialogHeader"> |
|
@MyDialogService.GetDialogContents().Title |
|
</div> |
|
<div class="confirmDialogBody"> |
|
@MyDialogService.GetDialogContents().Message |
|
</div> |
|
|
|
<div class="confirmDialogFooter"> |
|
<ButtonComponent MyButtonType="MyButtonType.Secondary" OnClick="MyDialogService.GetDialogContents().OnCancel"> |
|
Cancel |
|
</ButtonComponent> |
|
<ButtonComponent MyButtonType="MyButtonType.Primary" OnClick="MyDialogService.GetDialogContents().OnConfirm"> |
|
@MyDialogService.GetDialogContents().ConfirmButtonLabel |
|
</ButtonComponent> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
<style> |
|
.pageContents * { |
|
filter: blur(2px); |
|
} |
|
|
|
.confirmDialogBackground { |
|
position: fixed; |
|
top: 0; |
|
left: 0; |
|
width: 100vw; |
|
height: 100vh; |
|
background-color: rgba(0, 0, 0, 0.5); |
|
display: flex; |
|
} |
|
|
|
|
|
.confirmDialogContainer { |
|
margin-left: auto; |
|
margin-right: auto; |
|
margin-top: 64px; |
|
width: 800px; |
|
height: 600px; |
|
|
|
background-color: var(--background); |
|
border-width: var(--dialog-border-width); |
|
border-style: solid; |
|
border-color: var(--dialog-border-color); |
|
border-radius: var(--dialog-radius); |
|
|
|
padding: 8px; |
|
|
|
|
|
box-shadow: 1px 2px 2px black; |
|
|
|
display: flex; |
|
flex-direction: column; |
|
|
|
} |
|
|
|
.confirmDialogHeader { |
|
font-size: 1.4em; |
|
padding: 12px; |
|
} |
|
|
|
.confirmDialogBody { |
|
padding: 12px; |
|
flex-grow: 1; |
|
} |
|
|
|
.confirmDialogFooter { |
|
display: flex; |
|
gap: 12px; |
|
justify-content: flex-end; |
|
padding: 12px; |
|
} |
|
|
|
</style> |
|
} |
|
|
|
|
|
@code { |
|
|
|
protected override void OnInitialized() |
|
{ |
|
base.OnInitialized(); |
|
|
|
MyDialogService.Subscribe(StateHasChanged); |
|
} |
|
|
|
void IDisposable.Dispose() |
|
{ |
|
MyDialogService.Unsubscribe(StateHasChanged); |
|
} |
|
|
|
|
|
public void CloseDialog() |
|
{ |
|
MyDialogService.Hide(); |
|
} |
|
|
|
|
|
} |