Customize Admin Login

Shopware 6 (German) Administration
1

Hallo Community,

ich versuche jetzt schon eine ganze Weile das Admin Login zu customizen bzw. zu Branden. Der Kunde möchte dort statt dem Shopware Logo lieber sein eigenes Logo sehen und auch die Texte sollen entsprechend angepasst werden. Ich habe mir ein Plugin angelegt um die nötigen Anpassungen umzusetzen und habe dort auch  ‘sw-login’ und ‘sw-login-login’, wie in der Doku beschrieben, überschrieben.

Allerdings sehe ich meine Änderungen nur, wenn ich mich im Shop einmal angemeldet habe und mich dann wieder auslogge. Jedes mal wenn ich die Loginseite direkt neu lade, sehe ich stets die Ursprüngliche, Shopware-gebrandete Loginseite. Lade ich die Loginseite direkt neu, komme ich auch gar nicht an der main.js meines Modules vorbei. Ich habe irgendwie keine möglichkeit bei diesem initialen Aufruf einzugreifen.

Beim debuggen habe ich gemerkt, dass beim direkten Aufruf die ‘login’ function aus src/Administration/Resources/app/administration/src/module/index.js aufgerufen wird, welche dann die sw-login Komponente lädt. Bin ich aber angemeldet, wird in der gleichen Datei der default export genutzt. Dieser lädt dann dynamisch alle anderen module (außer sw-login).

Habe ich hier eine Möglichkeit einzugreifen und dafür zu sorgen, dass auch beim initialien Laden der Loginseite meine überschriebene sw-login anstatt der ursprünglichen verwendet wird?

 

Hier der Inhalt von src/Administration/Resources/app/administration/src/module/index.js

export default () => {
    const context = require.context('./', true, /\.\/[a-z-]+\/index\.js$/);

    // Reversing the order so, for example sw-settings will be included before sw-settings-country.
    return context.keys().reverse().reduce((accumulator, item) => {
        // do not load the sw-login by default
        if (item.includes('./sw-login/')) {
            return accumulator;
        }

        const module = context(item).default;
        accumulator.push(module);
        return accumulator;
    }, []);
};

export const login = () => {
    const context = require.context('./sw-login', true, /\.\/index\.js/);

    // import login dependencies
    return context.keys().map((key) => context(key).default);
};

 

2

Keiner ne Idee? Bin ich dafür hier eigentlich im richtigen Bereich oder wäre das eher was für “Theme/Design”?  Undecided

3

Ich versuche es immer mal wieder, komme aber einfach nicht weiter. Ich kann auf der initialen Login-Seite ja nicht mal eigenes css einbinden ohne irgendwelche Core-Files zu überschreiben. Ist das wirklich so gedacht oder übersehe ich hier irgendwas??  Foot-in-Mouth

 

Bin für jede Idee dankbar!  Blush

4

Hallo Sascha_S,

das geht nicht, da du mittels Deines Plugins das Login überschreiben willst. In der Administration-App wird aber in shopware/platform/src/Administration/Resources/app/administration/src/core/application.js bei einem fehlendem Login eine reduzierte Variante der App OHNE Plugins geladen. Somit greifen die Änderungen auch niemals:

startBootProcess() {
 const loginService = this.getContainer('service').loginService;
 const isUserLoggedIn = loginService.isLoggedIn();

 // if user is not logged in
 if (!isUserLoggedIn) {
   loginService.logout();
   return this.bootLogin();
 }
 return this.bootFullApplication();
}

Grüße, Stefan