Is this new settings form for SMTP available in Blazor template? I've updated for the latest version but I can't find them.
Hi mladen,
Please, don't prioritize that! I have a workaround and I end up adding one more component to the layout anyway to show a modal message. I'll close this thread, I appreciate your help and explanation.
Thank you for you answer liangshiwei.
I've overriden the code as per documentation. I just affraid getting issues when updating the framework. It would be awesome having a callback function to onInitialize where we can create instances and hook up that to the main application.
Hi mladen.macanovic,
Thank you for your answer. I got your point and I am rewriting the razor part as well.
I've tried your suggestion with MainHeader component, only inheriting the class part, but that doesn't work, see below:
Code:
using System;
using System.Threading.Tasks;
using Volo.Abp.AspNetCore.Components.Web.LeptonTheme.Components.ApplicationLayout.MainHeader;
using Volo.Abp.DependencyInjection;
namespace TVD_Holdings_Ltd.AvalancheOCP.Blazor.Components.Layout
{
[ExposeServices(typeof(MainHeader))]
[Dependency(ReplaceServices = true)]
public class MainHeaderExtension : MainHeader
{
protected override async Task OnInitializedAsync()
{
Console.WriteLine("MainHeader Init");
}
}
}
Error:
My only concern overriding the .razor and .razor.cs is updating the framework and getting conflit or missing some changes due to overriden files.
ABP Framework version: v4.2.3 rc.1 UI type: Blazor DB provider: EF Core Tiered (MVC) or Identity Server Separated (Angular): yes / no Exception message and stack trace: Steps to reproduce the issue:
Hi,
If I have to extend the component DefaultLayout from Volo.Abp.AspNetCore.Components.Web.LeptonTheme.Components.ApplicationLayout, do I need to rewrite the whole markups elements or it will be inherited?
I was not able to inherited the elements, I had to rewrite them again. I don't want to do that because I just want to override the method OnInitialize().
My new components:
@using Volo.Abp.AspNetCore.Components.Web.LeptonTheme.Components.ApplicationLayout
@inherits DefaultLayout
@using Volo.Abp.Ui.Branding
@using Volo.Abp.BlazoriseUI.Components
@using Volo.Abp.AspNetCore.Components.Web.LeptonTheme.Components.ApplicationLayout.MainHeader
@using Volo.Abp.AspNetCore.Components.Web.LeptonTheme.Components.ApplicationLayout.MainFooter
@inject IBrandingProvider BrandingProvider
<MainHeader />
<div class="lp-content h-100">
<PageAlert />
@Body
<UiMessageAlert />
<UiNotificationAlert />
</div>
<MainFooterComponent />
That is the code that I don't want to have to rewrite. I would like that would be inherited from DefaultLayout as specified by @inherited DefaultLayout
Code-behind:
using Microsoft.AspNetCore.Components;
using System;
using System.Threading.Tasks;
using Volo.Abp.AspNetCore.Components.Web.LeptonTheme.Components.ApplicationLayout;
using Volo.Abp.DependencyInjection;
namespace TVD_Holdings_Ltd.AvalancheOCP.Blazor.Components.ApplicationLayout
{
[ExposeServices(typeof(DefaultLayout))]
[Dependency(ReplaceServices = true)]
public partial class DefaultLayoutExtension
{
[Inject] IConfiguration Configuration { get; set; }
[Inject] IAlertManager _alertManager { get; set; }
private HubConnection hubConnection;
protected override async Task OnInitializedAsync()
{
// Do something
}
}
}
Hi,
I need to hook up a SignalR event for every single page in my application. I was thinking to do that on the Layout page by method OnIntiliaze. However, the Layout code is not available, it is implemented in one of the NuGet packages and the only way to do that is by extending the razor component in my project and then creating the method.
I wonder if there is another way to do that?
In this scenario, the back-end will send a notification (disk full for example), and a toast/modal notification will be shown for users. Is there some example of how to do implement that?
Updating my existing Blazor project, it updates Volo packages but not Blazorise package, so, it becames incompatible:
Error: Severity Code Description Project File Line Suppression State Error NU1605 Detected package downgrade: Blazorise.Components from 0.9.3.3 to 0.9.3-preview6. Reference the package directly from the project to select a different version. TVD_Holdings_Ltd.AvalancheOCP.Blazor -> Volo.Abp.LanguageManagement.Blazor 4.3.0-rc.1 -> Volo.Abp.AspNetCore.Components.Web.Theming 4.3.0-rc.1 -> Volo.Abp.BlazoriseUI 4.3.0-rc.1 -> Blazorise.Components (>= 0.9.3.3) TVD_Holdings_Ltd.AvalancheOCP.Blazor -> Blazorise.Components (>= 0.9.3-preview6) TVD_Holdings_Ltd.AvalancheOCP.Blazor D:\Source\AvalancheOCPLatest\src\TVD_Holdings_Ltd.AvalancheOCP.Blazor\TVD_Holdings_Ltd.AvalancheOCP.Blazor.csproj 1
Error creating a new Blazor project:
Parameters:
@alper, that is a great solution, but it doesn't work 100%. I've been using a similar solution for my AspNetZero projects, but with just one difference.
Issue: When there is a aggregation/association with another class and there is a .Include() in the query, it will not find the field by that string because the right string should be "objectname.field", for example:
Student { public int Id {get; set;} public string Name {get; set;} public int GenderId {get; set;} public virtual Gender Gender {get; set;} }
Gender { public int Id {get; set;} public string Name {get; set;} }
Then, the query will be:
Student.Include(x => x.Gender).OrderBy("Gender.Name");
But, when the fields comes from the grid in the filter, it will come only "Name" or "GenderName", it will depends on my Dto class.
To sort that out in AspNetZero using JQuery DataGrid, there is a property called "Data". When I set that property, it is passed as parameter when filtering. For example:
var dataTable = _$assetFlagTable.DataTable({
scrollY: "calc(100vh - 505px)",
scrollCollapse: false,
paging: true,
serverSide: true,
processing: true,
listAction: {
ajaxFunction: _assetFlagService.getAll,
inputFilter: function () {
return {
filter: $('#AssetFlagTableFilter').val(),
nameFilter: $('#NameFilterId').val(),
actionFilter: $('#ActionFilterId').val(),
flagTypeFilter: $('#FlagTypeFilterId').val(),
isActiveFilter: getFilterIsActive()
};
}
},
columnDefs: [
{
width: 120,
targets: 0,
data: null,
orderable: false,
autoWidth: false,
defaultContent: '',
rowAction: {
cssClass: 'btn btn-brand dropdown-toggle',
text: '<i class="fa fa-cog"></i> ' + app.localize('Actions') + ' <span class="caret"></span>',
items: [
{
text: app.localize('View'),
action: function (data) {
console.log('View AssetFlag', data);
_viewAseetFlagModal.open({ data: data.record });
}
},
{
text: app.localize('Edit'),
visible: function () {
return _permissions.edit;
},
action: function (data) {
console.log('Edit AssetFlag', data);
_createOrEditModal.open({ id: data.record.assetFlag.id });
}
},
{
text: app.localize('Delete'),
visible: function () {
return _permissions.delete;
},
action: function (data) {
deleteAssetFlag(data.record.assetFlag);
}
}]
}
},
{
targets: 1,
data: "assetFlag.flagName", // -->> HERE is the property to be used in the OrderBy method in the back-end.
name: "flagName",
render: function (data, type, row) {
return data.length > 100 ? data.substr(0, 100) + '…' : data;
}
},
{
targets: 2,
data: "assetFlag.flagAction",
name: "flagAction",
render: function (data, type, row) {
return data.length > 100 ? data.substr(0, 100) + '…' : data;
}
},
{
targets: 3,
data: "assetFlag.flagType",
name: "flagType",
render: function (data, type, row) {
return data.length > 100 ? data.substr(0, 100) + '…' : data;
}
},
{
targets: 4,
data: "assetFlag.isActive",
name: "isActive",
render: function (check) {
if (check) {
return '<div class="text-center"><i class="fa fa-check-circle m--font-success" title="True"></i></div>';
}
return '<div class="text-center"><i class="fa fa-times-circle" title="False"></i></div>';
}
}
]
});
My back-end function to populate the grid:
public async Task<PagedResultDto<GetAssetFlagForView>> GetAll(GetAllAssetFlagsInput input)
{
try
{
var filteredAssetFlag = _assetFlagRepository.GetAll()
.WhereIf(!string.IsNullOrWhiteSpace(input.Filter), e => e.FlagName.Contains(input.Filter) || e.FlagAction.Contains(input.Filter))
.WhereIf(!string.IsNullOrWhiteSpace(input.NameFilter), e => e.FlagName.Contains(input.NameFilter))
.WhereIf(!string.IsNullOrWhiteSpace(input.ActionFilter), e => e.FlagAction.Contains(input.ActionFilter))
.WhereIf(!string.IsNullOrWhiteSpace(input.FlagTypeFilter), e => e.FlagType.Contains(input.FlagTypeFilter))
.WhereIf(input.IsActiveFilter.HasValue, e => e.IsActive == input.IsActiveFilter.Value);
filteredAssetFlag = filteredAssetFlag.OrderBy(input.Sorting ?? "flagname asc");
var query = (from o in filteredAssetFlag
select new GetAssetFlagForView()
{
AssetFlag = ObjectMapper.Map<AssetFlagDto>(o)
});
var totalCount = await query.CountAsync();
var AssetFlag = await query
.PageBy(input)
.ToListAsync();
return new PagedResultDto<GetAssetFlagForView>(
totalCount,
AssetFlag
);
}catch(Exception ex)
{
throw ex;
}
}
That works perfectly, using the Abp extension and DataGrid with the property Data for each column.
That is great. Thank you for sharing that.