Blazor App: Issues overriding Login Page #2442

joe@tronactive.com created 3 years ago

ABP Framework version: v5.1.1
UI type: Blazor
DB provider: EF Core
Tiered (MVC) or Identity Server Separated (Angular): no

I have been working on trying to override the login page. The first issue I am having is I want to remove the drop-down for localization on the login screen. I see that isn't a part of the account/login.cshtml page. I also want to change the tenant text box to a drop-down as our app is for the internal use of our company only. But the same issue with the language switch. I cannot figure out where to go for that. I thought I needed to override the Themes/Layouts/Account/Default.cshtml file, but that isn't working.

The second issue I am having is the CustomLoginModel.cs I created that inherits from LoginModel.cs doesn't seem to be working correctly. in the Login.cshtml the model isn't populated because when I hit an if statement in login.cshtml the bools are not set such as EnableLocalLogin so the login form doesn't show up anymore since I set this up.

Any help would be much appreciated. I wanted to note that I started out using this as a reference https://github.com/bartvanhoey/AbpBlazorCustomizeLoginPage

maliming created 3 years ago

Support Team Fullstack Developer

The first issue I am having is I want to remove the drop-down for localization on the login screen

Line 92 lepton-theme\src\Volo.Abp.AspNetCore.Mvc.UI.Theme.Lepton\Themes\Lepton\Layouts\Account\Default.cshtml lepton-theme\src\Volo.Abp.AspNetCore.Mvc.UI.Theme.Lepton\Themes\Lepton\Components\Toolbar\LanguageSwitch\

I also want to change the tenant text box to a drop-down as our app is for the internal use of our company

https://github.com/abpframework/abp/tree/dev/framework/src/Volo.Abp.AspNetCore.Mvc.UI.MultiTenancy/Pages/Abp/MultiTenancy https://github.com/abpframework/abp/blob/dev/framework/src/Volo.Abp.AspNetCore.Mvc.UI.MultiTenancy/Pages/Abp/MultiTenancy/TenantSwitchModal.cshtml

The second issue I am having is the CustomLoginModel.cs I created that inherits from LoginModel.cs doesn't seem to be working correctly. in the Login.cshtml the model isn't populated because when I hit an if statement in login.cshtml the bools are not set such as EnableLocalLogin so the login form doesn't show up anymore since I set this up.

Please share your LoginModel class code.

joe@tronactive.com created 3 years ago

Here is the Custom Login Model. Literally just basic.

using Microsoft.AspNetCore.Authentication;
using Microsoft.AspNetCore.Identity;
using Microsoft.Extensions.Options;
using Owl.reCAPTCHA;
using Volo.Abp.Account.ExternalProviders;
using Volo.Abp.Account.Public.Web;
using Volo.Abp.Account.Public.Web.Pages.Account;
using Volo.Abp.Account.Security.Recaptcha;
using Volo.Abp.Security.Claims;

namespace Cure8.Pages.Account
{
    public class CustomLoginModel : LoginModel
    {
        public CustomLoginModel(IAuthenticationSchemeProvider schemeProvider, 
            IOptions<AbpAccountOptions> accountOptions, 
            IAbpRecaptchaValidatorFactory recaptchaValidatorFactory, 
            IAccountExternalProviderAppService accountExternalProviderAppService, 
            ICurrentPrincipalAccessor currentPrincipalAccessor,
            IOptions<IdentityOptions> identityOptions,
            IOptionsSnapshot<reCAPTCHAOptions> reCaptchaOptions) :
            base(schemeProvider, accountOptions, recaptchaValidatorFactory, 
                accountExternalProviderAppService, 
                currentPrincipalAccessor,
                identityOptions, reCaptchaOptions)
        {
        }
    }
}

Then in the view here is where I reference the model @using Cure8.Pages.Account @model CustomLoginModel

joe@tronactive.com created 3 years ago

WHen I added Themes/Lepton/Layouts/Account/Default.cshtml and made my changes it comes up with a white page with the form and my changes but no styling. In the console window it has the below.

Uncaught ReferenceError: $ is not defined at ApplicationConfigurationScript:3:1 at ApplicationConfigurationScript:2571:3

Uncaught ReferenceError: abp is not defined at ServiceProxyScript:12:5 at ServiceProxyScript:59:5 at ServiceProxyScript:236:3

maliming created 3 years ago

Support Team Fullstack Developer

Can you create a new template copy your code then share it with me? liming.ma@volosoft.com

joe@tronactive.com created 3 years ago

I switched things to Blazor Server instead of Web assembly and everything worked perfectly fine. Not sure why it wouldn't in the web assembly version.