Artikel Backend um Tab erweitern

[eMod]

Hallo,

wie der Titel schon verrät, versuche ich gerade mit einem eigenen Plugin die Artikel-Bearbeitungs-Ansicht im Backend um einen Tab zu erweitern.

Um mir das Vorgehen dabei zu verinnerlichen hab’ ich mir das Demoplugin aus der Doku installiert:
Backend extensions 

Dieses soll ja das Kunden Backend erweitern. Leider kommt jedoch ein Fehler im Backend:

 

Also weiß hier zufällig jemand Rat bzw. woran es hier scheitert ? Den angezeigten SyntaxError kann ich hier einfach nicht nachvollziehen.

Meine Shopware-Version ist 5.4.6.

Danke schonmal.

 

[eMod]

Oder Gibt es vielleicht eine andere / aktuelle Extension bei der man sich das abschauen könnte ?

[simkli]

Den angezeigten SyntaxError kann ich hier einfach nicht nachvollziehen.

Also irgendwas hast du ja scheinbar verändert. Bitte zeig uns den kompletten Quellcode, sonst können wir dir nicht helfen.

Viele Grüße 

[eMod]

Das Plugin kann man hier runterladen; ganz unten auf der Seite.
Backend extensions 

An dem Quellcode habe ich nichts geändert.
Daher meine Verwunderung darüber, dass das (IN DER DOKU VERLINKTE !) Plugin diesen Fehler aufweist.

[BestShopPossible]

Wäre nicht das erste…

[eMod]

Scheint mir ja fast ein Core-Bug zu sein 

Auch beim eigenen Plugin (nach Doku erstellt) taucht dieser Fehler nun auf.

Ich konnte den Fehler schon einmal ein weeenig eingrenzen…
Sobald ich in meiner Klasse  ExtendArticle  die Funktion auskommentiere die die eigene app.js lädt, wird der Fehler nicht mehr ausgegeben.

Hier ein wenig Quellcode zum Nachvollziehen:
 

pluginDirectory = $pluginDirectory;
    }

    /**
     * {@inheritdoc}
     */
    public static function getSubscribedEvents() {
        return [
            'Enlight_Controller_Action_PostDispatchSecure_Backend_Article' => 'onArticlePostDispatch'
        ];
    }

    public function onArticlePostDispatch(\Enlight_Event_EventArgs $args) {

        /** @var \Shopware_Controllers_Backend_Article $controller */
        $controller = $args->getSubject();

        $view = $controller->View();
        $request = $controller->Request();

        $view->addTemplateDir($this->pluginDirectory . '/Resources/views');

// if ($request->getActionName() == 'index') {
// $view->extendsTemplate('backend/my_plugin/app.js');
// }

        if ($request->getActionName() == 'load') {
            $view->extendsTemplate('backend/my_plugin/view/detail/window.js');
        }
    }

}

 

Und hier die entsprechende app.js:

//{block name="backend/article/application"}
// {$smarty.block.parent}
// {include file="backend/my_plugin/controller/my_own_controller.js"}
// {include file="backend/my_plugin/view/detail/my_own_tab.js"}
//{/block}

 

Der controller:

Ext.define('Shopware.apps.MyPlugin.controller.MyOwnController', {
    
    /**
     * Override the article main controller
     * @string
     */
    override: 'Shopware.apps.Article.controller.Main',

    init: function () {
        var me = this;

        // me.callParent will execute the init function of the overridden controller
        me.callParent(arguments);
    }
});

 

Und der Tab:
 

// This tab should be shown in the article module

Ext.define('Shopware.apps.MyPlugin.view.detail.MyOwnTab', {
    extend: 'Ext.container.Container',
    padding: 10,
    title: 'MyOwnTab',

    initComponent: function() {
        var me = this;

        me.items = [{
            xtype: 'label',
            html: 'Hello world'
        }];

        me.callParent(arguments);
    }

});

 

[eMod]

Und hier noch die window.js:
 

//{block name="backend/article/view/detail/window"}
// {$smarty.block.parent}
Ext.define('Shopware.apps.MyPlugin.view.detail.Window', {
    override: 'Shopware.apps.Article.view.detail.Window',

    createMainTabPanel: function () {
        var me = this,
            result = me.callParent();

        result.push(Ext.create('Shopware.apps.MyPlugin.view.detail.MyOwnTab'));

        return result;
    },

});
//{/block}

 

[eMod]

Nobody ?!

Dann vielleicht nochmal die Frage nach einem funktionierenden Beispiel / Plugin, das genau das tut. Also die Artikel-Bearbeitung um einen Tab erweitern.

Wäre so was wohl irgendwo zu finden ?

[simkli]

Wir helfen hier doch alle freiwillig. Bitte nicht ständig doppelposten und mal etwas Geduld haben. Es ist unfair gegenüber anderen Fragestellern, die ihr Thema nicht ständig nach oben pushen mit Doppelpostings.

onTopic: So ich hab’ mir das jetzt mal im Detail angesehen. Ich hatte das gleiche Problem vor einer Ewigkeit auch mal (leider finde ich gerade den Post nicht mehr). Irgendwie scheinet Shopware gerne mal am Anfang vom ExtJs Code etwas ab. Bei Shopware steht am Anfang meistens der Lizenz Header, daher fällt dies nicht auf. (Wenn du dir mal den geladenen Request ansiehst, merkt man, dass einfach ein Teil vom Code fehlt)

Füge mal bei deinen ExtJS Scripten am Anfang einfach mal folgendes ein:

/**
 *
*/

(einfach einen leeren Kommentar).

Dann den Cache leeren und es sollte gehen.

Was genau schiefläuft weiß ich noch nicht. Ich habe gerade keine Zeit es ausführlicher zu debuggen.

Viele Grüße

[simkli]

Ha , habe meinen alten Beitrag gefunden… 4 Jahre ist das jetzt schon her:

https://forum.shopware.com/discussion/comment/89486/#Comment_89486

Viele Grüße

[eMod]

Genial … aber auch irgendwie dämlich … (vielleicht hat es aber auch einen guten Grund warum ExtJS den Code stripped; idk)

Das hat mein Problem tatsächlich gelöst.
Danke 

 

[eMod]

Ich muss den Thread hier leider nochmal aufwärmen…

ich bin wie oben beschrieben vorgegangen um einen eigenen Tab innerhalb der Artikel Detailansicht zu generieren.
Soweit so gut … Um den Tab zu befüllen, wird via Ajax request ein record abgefragt und das result als Liste (UL - unordered list [html]) im Tab dargestellt.

Nun soll via Click auf ein Listen-Element eine JS-Funktion ausgeführt werden.
Allerdings ist das DOM-Element immer NULL, egal wie es selektiert wird (z.B. über document.getElementById(‘elementId’); oder Ext.get(‘elementId’)).

Meine Vermutung hier ist, dass das Skript ausgeführt wird bevor die DOM komplett geladen ist.

Das Skript wurde wie folgt implementiert:
 

app.js:

//{block name="backend/article/application" append}
// {$smarty.block.parent}
// {include file="backend/my_custom_plugin/controller/be_view_controller.js"}
//{/block}

 

be-view-controller.js:

/**
 * 
 */
Ext.define('Shopware.apps.MyCustomPlugin.controller.BeViewController', {

    /**
     * Override the article main controller
     * @string
     */
    override: 'Shopware.apps.Article.controller.Main',

    init: function () {
        
        var me = this;
        me.callParent(arguments);
        
        var ulWrap = document.getElementById('customUlId');
        
        var ulWrap2 = Ext.get('customUlId');

        console.log(ulWrap);
        console.log(ulWrap2);
        
    },

});

Wie wäre hier der korrekt Weg um die Tab-Elemente im Skript “anzusprechen” ?
Bzw. gibt es hier eine “Best-Practice” Methode für diesen Fall ?

EDIT:  Ich mach lieber n eigenen thread draus.