How to Display the ExtraProperties in the ui using abp.io

Question

I’m using abp.io community edition 3.3.1 with blazor and i’m trying to add new property for the user (identityuserdto) and i want to appears it in the create & edit form and in the data table, i followed this documentation for that https://docs.abp.io/en/commercial/latest/guides/module-entity-extensions

because the documention https://docs.abp.io/en/latest/Module-Entity-Extensions is not found.

this is my situation enum Domain.Shared

namespace University.Situation
{
    public enum SituationType
    {
        Student = 1,
        AssistantProfessor,
        Professor
    }

}

and my ModuleExtensionConfigurator

        public static void Configure()
        {
            OneTimeRunner.Run(() =>
            {
                ObjectExtensionManager.Instance.Modules()
                  .ConfigureIdentity(identity =>
                  {
                      identity.ConfigureUser(user =>
                      {
                          user.AddOrUpdateProperty<SituationType>(
                              "Situation"
                          );
                      });
                  });
            }); 
            OneTimeRunner.Run(() =>
            {
                ConfigureExistingProperties();
                ConfigureExtraProperties();
            });

When i execute my host project i can see my extraproperty in swagger, but when i execute my blazor project my field is not appears in create & edit forms and in the data table.

so how can i add them manually since i guess only the commercial version can add the extraproperties automatically ?

Thank you in advance.

Answer 1

If you take a look at this documentation and for example this issue (which came from me :-|) you will see that you need to inherit from the page or component which you want to overwrite.

On the one hand you have the database layer and the domain layer which need the additional property/ properties. Your question shows code for the domain layer.

For EF Core you would need to customize the *EfCoreEntityExtensionMappings.cs which you find in the *.EntityFrameworkCore project.

Now for the application and services you need to go to your *.Application.Contracts Project and add code to the *DtoExtensions.cs (the class contains comments that describe how to do that).

Finally you create a new page (*.Blazor project) which will be your custom implementation of the default page.

Copy all content from the default page.

After that make sure that you inherit from the default page.

Now edit the code regarding to your needs.

As I had my diffuculties following the documentation I want to explain how I did that. If you wanted to customize the tenant management page the process would be:

1. Create a page like "MyTenantManagement.razor"

2. Get the default file content from here and paste it into "MyTenantManagement.razor"

3. Replace the @inherits line with this:

   @inherits Volo.Abp.TenantManagement.Blazor.Pages.TenantManagement.TenantManagement

4. remove the @page thing (so that the router does not get confused

5. add usings that may be missing (I had that so it might be a required step.

The upper part of the file may look like this:

Abp.DependencyInjection
@using Microsoft.AspNetCore.Authorization
@using Volo.Abp.FeatureManagement.Blazor.Components
@using Volo.Abp.TenantManagement.Localization
@using Volo.Abp.TenantManagement
@using TT2Masterz.Localization
@using Microsoft.Extensions.Localization

@inherits Volo.Abp.TenantManagement.Blazor.Pages.TenantManagement.TenantManagement

@attribute [Authorize(TenantManagementPermissions.Tenants.Default)]
@attribute [ExposeServices(typeof(Volo.Abp.TenantManagement.Blazor.Pages.TenantManagement.TenantManagement))]
@attribute [Dependency(ReplaceServices = true)]

@inject AbpBlazorMessageLocalizerHelper<AbpTenantManagementResource> LH
@inject IStringLocalizer<TT2MasterzResource> LT

<h2>This is my custom tenant managemant page</h2>

I hope that this helps you :)