postMessageApi in Tab nutzen?

Shopware 5 Programmierung
1

Hallo zusammen,

ich habe im Bestellungs-Detail Fenster ein neues Tab mit einem iFrame erstellt und dort eine Seite reingeladen. Aus dieser Seite würde ich gerne die postMessageApi nutzen. Genauer gesagt, möchte ich ein Fenster aus dem Pickware ERP Plugin öffnen. Ich brauche also die Funktion openModule(). Leider bekomme ich die Meldung “Instance Uuid not defined for communication. Probably the handshake wasn’t successful.” beim nutzen der Funktion. Wie mir scheint, wird bei einem richtigen Lightweight Backend Modul diese API erstmal für das iFrame initialisiert. Daher kann ich es in meinem Tab-iFrame wohl nicht nutzen.

Hat jemand eine Idee was ich tun muss, um es in meinem iFrame nutzen zukönnen?

Und woher weis ich, was ich bei dem Parameter “action” aus der Doku eintragen muss? Ich möchte in “Shopware.apps.ViisonPickwareERPSupplierOrders” gerne das “Edit” Fenster/View öffnen. 

postMessageApi.openModule({
    name: 'Shopware.apps.Article'
    action: 'detail',
    params: {
        articleId: 007
    }
});

LG Arne 

2

Ich anworte mir mal selber. Falls jemand per Suchfunktion hieraufstößt.

Der Code unten fügt dem Bestell Details Fenster ein weiteres Tab hinzu. In dem Tab wird per iFrame ein Shopware Controller mit einer WebApp geladen. Die App in dem iFrame kann jetzt ganz normal die Post Message Api nutzen. Das funktioniert analog wie bei einem Lightwight Backend Module. Die Methoden zum Ändern der Fenstergröße funktionieren natürlich nicht. 

//{namespace name=backend/order/main}
//{block name="backend/order/view/detail/window"}
//{$smarty.block.parent}
Ext.define('Shopware.apps.Order.view.detail.Window-MyIframePostMessageApi', {
	override: 'Shopware.apps.Order.view.detail.Window',

    createTabPanel: function() {
		var me = this, tabs;

		tabs = me.callParent(arguments);
        tabs.add(me.createTabWithIFrame());

		return tabs;
	},

    createTabWithIFrame: function () {
        var me = this;

        return me.createPostMessageApiEnabledTabComponent(
            'Mein Tab',
            '{url controller=MyController action=index orderId=""}' + me.record.get('id')
        );
    },

    createPostMessageApiEnabledTabComponent: function(label, url) {
        var me = this,
            swModuleManager = Shopware.ModuleManager,
            // @see Shopware.ModuleManager.createSimplifiedModule()
            instance = swModuleManager.uuidGenerator.generate(),
            content = swModuleManager.createContentFrame(url, instance, true),
            subApp = null,
            windows = Ext.create('Ext.util.MixedCollection'),
            contentWindow;

        contentWindow = Ext.create('Ext.Component', {
            title: label,
            component: 'main',
            content: 'content',
            listeners: {
                render: function(component, eOpts) {
                    component.el.appendChild(content);
                    component.setLoading(true);
                },
            },
        });

        content.dom._window = contentWindow;
        windows.add('main', contentWindow);

        // push component into registry
        swModuleManager.modules.add(instance, {
            name: url,
            instance: instance,
            subApp: subApp,
            windows: windows
        });

        return contentWindow;
    }
});
//{/block}