imhven
/
abp
mirror of https://github.com/abpframework/abp
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

WIP: Confirmation message implementation and started the adding options and styles

Browse Source
pull/5712/head
Mladen Macanovic 5 years ago
parent 9dcf9a789e
commit 8330e0bd21
8 changed files with 264 additions and 44 deletions
Show Stats Download Patch File Download Diff File

28
framework/src/Volo.Abp.AspNetCore.Components.WebAssembly/Volo/Abp/AspNetCore/Components/WebAssembly/IUiMessageNotifierService.cs
Unescape View File

@ -7,19 +7,43 @@ namespace Volo.Abp.AspNetCore.Components.WebAssembly
{
event EventHandler<UiMessageEventArgs> MessageReceived;
Task NotifyMessageReceived(string message, string title = null);
Task NotifyMessageReceivedAsync(UiMessageType messageType, string message, string title = null);
Task NotifyConfirmationReceivedAsync(string message, string title, TaskCompletionSource<bool> callback);
}
public class UiMessageEventArgs : EventArgs
{
public UiMessageEventArgs(string message, string title)
public UiMessageEventArgs(UiMessageType messageType, string message, string title)
{
MessageType = messageType;
Message = message;
Title = title;
}
public UiMessageEventArgs(UiMessageType messageType, string message, string title, TaskCompletionSource<bool> callback)
{
MessageType = messageType;
Message = message;
Title = title;
Callback = callback;
}
public UiMessageType MessageType { get; set; }
public string Message { get; }
public string Title { get; }
public TaskCompletionSource<bool> Callback { get; }
}
public enum UiMessageType
{
Info,
Success,
Warning,
Error,
Confirmation,
}
}

19
framework/src/Volo.Abp.AspNetCore.Components.WebAssembly/Volo/Abp/AspNetCore/Components/WebAssembly/UiMessageOptions.cs
Unescape View File

@ -0,0 +1,19 @@
namespace Volo.Abp.AspNetCore.Components.WebAssembly
{
public class UiMessageOptions
{
public bool ShowMessageIcon { get; set; } = true;
public string OkButtonText { get; set; }
public object OkButtonIcon { get; set; }
public string ConfirmButtonText { get; set; }
public object ConfirmButtonIcon { get; set; }
public string CancelButtonText { get; set; }
public object CancelButtonIcon { get; set; }
}
}

17
framework/src/Volo.Abp.BlazoriseUI/BlazoriseUiMessageService.cs
Unescape View File

@ -1,5 +1,4 @@
using System.Threading.Tasks;
using Blazorise;
using Microsoft.Extensions.Logging;
using Microsoft.Extensions.Logging.Abstractions;
using Volo.Abp.AspNetCore.Components.WebAssembly;
@ -23,27 +22,31 @@ namespace Volo.Abp.BlazoriseUI
public Task InfoAsync(string message, string title = null)
{
return uiMessageNotifierService.NotifyMessageReceived(message, title);
return uiMessageNotifierService.NotifyMessageReceivedAsync(UiMessageType.Info, message, title);
}
public Task SuccessAsync(string message, string title = null)
{
return uiMessageNotifierService.NotifyMessageReceived(message, title);
return uiMessageNotifierService.NotifyMessageReceivedAsync(UiMessageType.Success, message, title);
}
public Task WarnAsync(string message, string title = null)
{
return uiMessageNotifierService.NotifyMessageReceived(message, title);
return uiMessageNotifierService.NotifyMessageReceivedAsync(UiMessageType.Warning, message, title);
}
public Task ErrorAsync(string message, string title = null)
{
return uiMessageNotifierService.NotifyMessageReceived(message, title);
return uiMessageNotifierService.NotifyMessageReceivedAsync(UiMessageType.Error, message, title);
}
public Task<bool> ConfirmAsync(string message, string title = null)
public async Task<bool> ConfirmAsync(string message, string title = null)
{
return Task.FromResult(true);
var callback = new TaskCompletionSource<bool>();
await uiMessageNotifierService.NotifyConfirmationReceivedAsync(message, title, callback);
return await callback.Task;
}
}
}

37
framework/src/Volo.Abp.BlazoriseUI/Components/UiMessageAlert.razor
Unescape View File

@ -1,17 +1,48 @@
<Modal @ref="@ModalRef">
<ModalBackdrop />
<ModalContent>
<ModalContent Centered="true">
<ModalHeader>
<ModalTitle>
@Title
</ModalTitle>
</ModalHeader>
<ModalBody>
@if ( ShowMessageIcon )
{
<DisplayHeading Size="DisplayHeadingSize.Is2">
<Icon Name="@MessageIcon" Style="@MessageIconStyle" />
</DisplayHeading>
}
@Message
</ModalBody>
<ModalFooter>
<Button Color="Color.Secondary" Clicked="@OnCancelClicked">Cancel</Button>
<Button Color="Color.Primary" Clicked="@OnOKClicked">OK</Button>
@if ( IsConfirmation )
{
<Button Color="Color.Danger" Padding="Padding.Is2.OnX" Margin="Margin.IsAuto.FromRight" Clicked="@OnCancelClicked">
@if ( Options?.CancelButtonIcon != null )
{
<Icon Name="@Options.CancelButtonIcon" Margin="Margin.Is2.FromRight" />
}
@CancelButtonText
</Button>
<Button Color="Color.Primary" Padding="Padding.Is2.OnX" Clicked="@OnConfirmClicked">
@if ( Options?.ConfirmButtonIcon != null )
{
<Icon Name="@Options.ConfirmButtonIcon" Margin="Margin.Is2.FromRight" />
}
@ConfirmButtonText
</Button>
}
else
{
<Button Color="Color.Primary" Padding="Padding.Is2.OnX" Clicked="@OnOkClicked">
@if ( Options?.OkButtonIcon != null )
{
<Icon Name="@Options.OkButtonIcon" Margin="Margin.Is2.FromRight" />
}
@OkButtonText
</Button>
}
</ModalFooter>
</ModalContent>
</Modal>

97
framework/src/Volo.Abp.BlazoriseUI/Components/UiMessageAlert.razor.cs
Unescape View File

@ -1,5 +1,4 @@
using System;
using System.Collections.Generic;
using System.Text;
using System.Threading.Tasks;
using Blazorise;
@ -10,17 +9,21 @@ namespace Volo.Abp.BlazoriseUI.Components
{
public partial class UiMessageAlert : ComponentBase, IDisposable
{
private object messageIcon;
protected override void OnInitialized()
{
UiMessageNotifierService.MessageReceived += UiMessageNotifierService_MessageReceived;
UiMessageNotifierService.MessageReceived += OnMessageReceived;
base.OnInitialized();
}
private void UiMessageNotifierService_MessageReceived(object sender, UiMessageEventArgs e)
private void OnMessageReceived(object sender, UiMessageEventArgs e)
{
MessageType = e.MessageType;
Message = e.Message;
Title = e.Title;
Callback = e.Callback;
ModalRef.Show();
}
@ -29,30 +32,106 @@ namespace Volo.Abp.BlazoriseUI.Components
{
if (UiMessageNotifierService != null)
{
UiMessageNotifierService.MessageReceived -= UiMessageNotifierService_MessageReceived;
UiMessageNotifierService.MessageReceived -= OnMessageReceived;
}
}
protected Task OnCancelClicked()
protected Task OnOkClicked()
{
ModalRef.Hide();
return Task.CompletedTask;
return Okayed.InvokeAsync(null);
}
protected Task OnConfirmClicked()
{
ModalRef.Hide();
if (IsConfirmation && Callback != null)
{
Callback.SetResult(true);
}
return Confirmed.InvokeAsync(null);
}
protected Task OnOKClicked()
protected Task OnCancelClicked()
{
ModalRef.Hide();
return Task.CompletedTask;
if (IsConfirmation && Callback != null)
{
Callback.SetResult(false);
}
return Canceled.InvokeAsync(null);
}
protected Modal ModalRef { get; set; }
[Inject] IUiMessageNotifierService UiMessageNotifierService { get; set; }
protected virtual bool IsConfirmation
=> MessageType == UiMessageType.Confirmation;
protected virtual bool ShowMessageIcon
=> Options?.ShowMessageIcon ?? true;
protected virtual object MessageIcon => MessageType switch
{
UiMessageType.Info => IconName.Info,
UiMessageType.Success => IconName.Check,
UiMessageType.Warning => IconName.Exclamation,
UiMessageType.Error => IconName.Stop,
UiMessageType.Confirmation => IconName.QuestionCircle,
_ => null,
};
protected virtual string MessageIconColor => MessageType switch
{
UiMessageType.Info => "#0000ff",
UiMessageType.Success => "#00ff00",
UiMessageType.Warning => "#ffae00",
UiMessageType.Error => "#e8301c",
UiMessageType.Confirmation => "#de692f",
_ => null,
};
protected virtual string MessageIconStyle
{
get
{
var sb = new StringBuilder();
sb.Append($"color:{MessageIconColor}");
return sb.ToString();
}
}
protected virtual string OkButtonText
=> Options?.OkButtonText ?? "OK";
protected virtual string ConfirmButtonText
=> Options?.ConfirmButtonText ?? "Confirm";
protected virtual string CancelButtonText
=> Options?.CancelButtonText ?? "Cancel";
[Parameter] public UiMessageType MessageType { get; set; }
[Parameter] public string Title { get; set; }
[Parameter] public string Message { get; set; }
[Parameter] public TaskCompletionSource<bool> Callback { get; set; }
[Parameter] public UiMessageOptions Options { get; set; }
[Parameter] public EventCallback Okayed { get; set; } // TODO: ?
[Parameter] public EventCallback Confirmed { get; set; }
[Parameter] public EventCallback Canceled { get; set; }
[Inject] protected IUiMessageNotifierService UiMessageNotifierService { get; set; }
}
}

11
framework/src/Volo.Abp.BlazoriseUI/UiMessageNotifierService.cs
Unescape View File

@ -10,9 +10,16 @@ namespace Volo.Abp.BlazoriseUI
{
public event EventHandler<UiMessageEventArgs> MessageReceived;
public Task NotifyMessageReceived(string message, string title = null)
public Task NotifyMessageReceivedAsync(UiMessageType messageType, string message, string title = null)
{
MessageReceived?.Invoke(this, new UiMessageEventArgs(message, title));
MessageReceived?.Invoke(this, new UiMessageEventArgs(messageType, message, title));
return Task.CompletedTask;
}
public Task NotifyConfirmationReceivedAsync(string message, string title, TaskCompletionSource<bool> callback)
{
MessageReceived?.Invoke(this, new UiMessageEventArgs(UiMessageType.Confirmation, message, title, callback));
return Task.CompletedTask;
}

37
templates/app/aspnet-core/src/MyCompanyName.MyProjectName.Blazor/Pages/Index.razor
Unescape View File

@ -1,7 +1,6 @@
@page "/"
@using Volo.Abp.Users
@using Volo.Abp.MultiTenancy
@using System.Security.Claims
@using Microsoft.Extensions.Localization
@using MyCompanyName.MyProjectName.Localization
@using Volo.Abp.BlazoriseUI.Components
@ -20,19 +19,31 @@
<CardTitle>UI Message Tests</CardTitle>
</CardHeader>
<CardBody>
<Button Color="Color.Info" Clicked="@(()=>UiMessageService.InfoAsync("This is info message", "Info"))">
<Button Color="Color.Info" Clicked="@OnInfoTestClicked">
INFO
</Button>
<Button Color="Color.Success" Clicked="@OnSuccessTestClicked">
SUCCESS
</Button>
<Button Color="Color.Warning" Clicked="@OnWarningTestClicked">
WARNING
</Button>
<Button Color="Color.Danger" Clicked="@OnErrorTestClicked">
DANGER
</Button>
<Button Color="Color.Secondary" Clicked="@OnConfirmTestClicked">
CONFIRM
</Button>
</CardBody>
</Card>
<UiMessageAlert />
<h1>Welcome to the Application</h1>
<p class="lead px-lg-5 mx-lg-5">@L["LongWelcomeMessage"]</p>
@if (!CurrentUser.IsAuthenticated)
@if ( !CurrentUser.IsAuthenticated )
{
<a class="btn btn-primary" href="/authentication/login">
<i class="fa fa-sign-in-alt"></i> @L["Login"]
@ -171,20 +182,4 @@
<a href="https://github.com/abpframework/abp" target="_blank" class="mx-2"><i class="fab fa-github"></i><span class="text-secondary"> abpframework</span></a>
</p>
</div>
</div>
@code
{
[Inject] IUiMessageService UiMessageService { get; set; }
private IEnumerable<Claim> _claims;
protected override async Task OnInitializedAsync()
{
var authState = await AuthenticationStateProvider.GetAuthenticationStateAsync();
if (authState.User.Identity.IsAuthenticated)
{
_claims = authState.User.Claims;
}
}
}
</div>

62
templates/app/aspnet-core/src/MyCompanyName.MyProjectName.Blazor/Pages/Index.razor.cs
Unescape View File

@ -0,0 +1,62 @@
using System;
using System.Collections.Generic;
using System.Linq;
using System.Security.Claims;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Components;
using Volo.Abp.AspNetCore.Components.WebAssembly;
namespace MyCompanyName.MyProjectName.Blazor.Pages
{
public partial class Index
{
private IEnumerable<Claim> _claims;
protected override async Task OnInitializedAsync()
{
var authState = await AuthenticationStateProvider.GetAuthenticationStateAsync();
if ( authState.User.Identity.IsAuthenticated )
{
_claims = authState.User.Claims;
}
}
Task OnInfoTestClicked()
{
return UiMessageService.InfoAsync( "This is the Info message", "Info" );
}
Task OnSuccessTestClicked()
{
return UiMessageService.SuccessAsync( "This is the Success message", "Success" );
}
Task OnWarningTestClicked()
{
return UiMessageService.WarnAsync( "This is the Warning message", "Warning" );
}
Task OnErrorTestClicked()
{
return UiMessageService.ErrorAsync( "This is the Error message", "Error" );
}
Task OnConfirmTestClicked()
{
return UiMessageService.ConfirmAsync( "This is the Confirm message", "Confirm" )
.ContinueWith( result =>
{
if ( result.Result )
{
Console.WriteLine( "Confirmed" );
}
else
{
Console.WriteLine( "Cancelled" );
}
} );
}
[Inject] IUiMessageService UiMessageService { get; set; }
}
}
Write Preview
Loading…
Cancel
Save