Backend Plugin, ExtJS event wird nicht nicht ausgelöst/an controller geschickt

Hallo zusammen,

ich versuche gerade ein Backend Plugin zu erstellen das Produktvorteile im Produkt->Resourcen Tab analog zu den Links hinzufügt. Meine Erfahrung mit ExtJS ist gelinde gesagt mäßig. Orientiert habe ich mich am Core Code für die Links selbst sowie dem digital publishing plugin.

Da Shopware die Links aber im Artikel selbst speichert konnten mir die Links hier nicht als vorlage dienen. Meine Felder werden angezeigt, nur die events funktionieren nicht und ich kann mir mangels ExtJs erfahrung keinen Reim machen wo nun der Fehler ist.

wird nun der php Controller im store über einen proxy angesteuert, oder (wie im digital publishing plugin) in einem eigenen controller ?

Ich habe hier glaube ich ein generelles Verständnisproblem diesbezüglich…

Mein Controller:

//{namespace name=backend/article/view/main}
//{block name="backend/article/detaildescriptionimage/controller/vorteile"}
Ext.define('Shopware.apps.detaildescriptionimage.controller.Main', {
    extend: 'Enlight.app.Controller',
    init: function() {
        var me = this;

        me.control({
            'article-resources-vorteile': {
                'addVorteile': me.onAddVorteile,
                'removeVorteile': me.onRemoveVorteile,
                'getListQuery': me.onGetListQuery
            }
        });

        me.callParent(arguments);
    },
    onAddVorteile: function(tab,grid,form){
        Ext.Ajax.request({
            url: '{url module="backend" controller="DetailDescriptionImage" action="addVorteile"}',
            method: 'POST',
            params: {
                'title': record.get('titel'),
                'vorteil': form.get('vorteil')
            },
            success: function(response) {
                alert(response);
            }
        });
    },
    onRemoveVorteile: function(tab,grid,form){
        alert("remove");
    },
    onGetListQuery: function(tab,grid,form) {
        alert("list");
    }

});
//{/block}

Model:

//{namespace name=backend/article/view/main}
//{block name="backend/article/detaildescriptionimage/model/vorteile"}
Ext.define('Shopware.apps.Article.detaildescriptionimage.model.Vorteil', {
    extend: 'Ext.data.Model',

    fields: [
        { name: 'id', type: 'int' },
        { name: 'articleId', type: 'int' },
        { name: 'titel', type: 'string' },
        { name: 'vorteil', type: 'string' }
    ]

});
// {/block}

Store:

//{block name="backend/article/detaildescriptionimage/view/vorteile"}
Ext.define('Shopware.apps.Article.detaildescriptionimage.store.Vorteil',{
    //extend: 'Shopware.store.Listing',
    extend: 'Ext.data.Store',
    model: 'Shopware.apps.Article.detaildescriptionimage.model.Vorteil',
    configure: function(){
        return {
            controller: 'DetailDescriptionImage'
        }
    },
    proxy: {
        type: 'ajax',

        url: '{url controller=DetailDescriptionImage action=getListQuery}',

        reader: {
            type: 'json',
            root: 'data',
            totalProperty: 'total'
        }
    }
});
// {/block}

window:

//{namespace name=backend/article/view/main}
//{block name="backend/article/view/detail/window" append}
Ext.define('Shopware.apps.Article.detaildescriptionimage.view.detail.Window', {
    override: 'Shopware.apps.Article.view.detail.Window',

    createResourcesTab: function(){
        var me = this;
        var resourcesTab = me.callParent(arguments);
        var vorteile = Ext.create('Shopware.apps.detaildescriptionimage.view.detail.Vorteile', {
            article: me.article
        });
        resourcesTab.push(vorteile);
        return resourcesTab;
    }
});
//{/block}

app.js

//{block name="backend/article/application" append}

//{include file="backend/article/detaildescriptionimage/controller/vorteile.js"}
//{include file="backend/article/detaildescriptionimage/model/vorteile.js"}
//{include file="backend/article/detaildescriptionimage/store/vorteile.js"}
//{include file="backend/article/detaildescriptionimage/view/detail/vorteile.js"}

//{/block}

View:

//{namespace name=backend/article/view/main}
//{block name="backend/article/detaildescriptionimage/view/detail/vorteile"}

Ext.define('Shopware.apps.detaildescriptionimage.view.detail.Vorteile', {
        /**
         * Define that the billing field set is an extension of the Ext.form.FieldSet
         * @string
*/
    extend: 'Ext.form.FieldSet',
    alias: 'widget.article-resources-vorteile',
    /**
     * Set css class for this component
     * @string
 */
    cls: Ext.baseCSSPrefix + 'article-resources-vorteile',

    /**
     * Contains all snippets for the view component
     * @object
     */
    snippets:{
        title: '{s name=resources/vorteile/field_set}Vorteile{/s}',
        notice: '{s name=resources/vorteile/notice}Produktvorteile hinzufügen{/s}',
        titel: '{s name=resources/vorteile/titel}Titel{/s}',
        vorteil: '{s name=resources/vorteile/vorteil}Vorteil{/s}',
        button: '{s name=resources/vorteile/button}Vorteil hinzufügen{/s}',
        grid: {
            title: '{s name=resources/vorteile/grid/title}Angelegte Vorteile{/s}',
            delete: '{s name=resources/vorteile/grid/delete}Vorteil entfernen{/s}',
        }
    },

    initComponent: function () {
        var me = this;
        me.title = me.snippets.title;
        me.items = me.createElements();
        me.addEvents(
            'addVorteile',
            'removeVorteile'
        );
        me.callParent(arguments);
    },

    createElements: function() {
        var me = this;
        me.vorteileForm = me.createVorteileForm();
        me.vorteileGrid = me.createVorteileGrid();

        me.vorteileElements = Ext.create('Ext.container.Container', {
            layout: 'column',
            items: [
                {
                    xtype: 'container',
                    columnWidth: 0.35,
                    margin: '0 20 0 0',
                    items: [me.vorteileForm]
                }, {
                    xtype: 'container',
                    columnWidth: 0.65,
                    items: [me.vorteileGrid]
                }
            ]
        });

        return [me.vorteileElements];
    },

    createVorteileForm: function() {
        var me = this;
        me.vorteileFormElements = Ext.create('Ext.form.Panel', {
            layout: 'anchor',
            border: false,
            defaults: {
                labelWidth: 155,
                anchor: '100%'
            },
            items: [
                {
                    xtype: 'container',
                    cls: Ext.baseCSSPrefix + 'global-notice-text',
                    html: me.snippets.notice
                }, {
                    xtype: 'textfield',
                    name: 'titel',
                    fieldLabel: me.snippets.titel,
                    allowBlank: true
                }, {
                    xtype: 'textfield',
                    name:'vorteil',
                    fieldLabel: me.snippets.vorteil,
                    allowBlank: false
                }, {
                    xtype: 'button',
                    cls: 'small primary',
                    text: me.snippets.button,
                    anchor: 'auto',
                    margin: '0 0 0 160',
                    handler: function() {
                        me.fireEvent('addVorteile', me.vorteileGrid, me.vorteileForm);
                    }
                }
            ]
        });

        return me.vorteileFormElements;
    },

    createVorteileGrid: function() {
        var me = this;
        me.vorteilStore = Ext.create('Shopware.apps.Article.detaildescriptionimage.store.Vorteil');
        me.vorteileGridElements = Ext.create('Ext.grid.Panel', {
            title: me.snippets.grid.title,
            store: me.vorteilStore,
            name: 'vorteil-listing',
            height: 180,
            plugins: [
                Ext.create('Ext.grid.plugin.CellEditing', {
                    clicksToEdit: 1
                }),
                {
                    ptype: 'grid-attributes',
                    table: 's_articles_information_attributes'
                }
            ],
            columns: [
                {
                    header: me.snippets.name,
                    dataIndex: 'titel',
                    flex: 2,
                    editor: {
                        xtype: 'textfield'
                    }
                }, {
                    header: me.snippets.vorteil,
                    dataIndex: 'vorteil',
                    flex: 2,
                    editor: {
                        xtype: 'textfield'
                    }
                }, {
                    xtype: 'actioncolumn',
                    width: 30,
                    items: [
                        {
                            iconCls: 'sprite-minus-circle-frame',
                            tooltip: me.snippets.grid.delete,
                            handler: function (view, rowIndex, colIndex, item, opts, record) {
                                me.fireEvent('removeVorteile', me.vorteileGrid, record)
                            }
                        }
                    ]
                }
            ]
        });

        return me.vorteileGridElements;
    }

});
//{/block}

 

Habe nun einen Teil gelöst indem ich die Event Handler direkt im View innerhalb meiner Forms unterbringe:

xtype: 'button',
                    cls: 'small primary',
                    text: me.snippets.button,
                    anchor: 'auto',
                    margin: '0 0 0 160',
                    handler: function() {
                        me.fireEvent('addVorteile', me.vorteileGrid, me.vorteileForm);
                        Ext.Ajax.request({
                            url: '{url module="backend" controller="DetailDescriptionImage" action="addVorteile"}',
                            method: 'POST',
                            params: {
                                'title': me.vorteileForm.getForm().findField("titel").getValue(),
                                'vorteil': me.vorteileForm.getForm().findField("vorteil").getValue()
                            },
                            success: function(response) {
                                alert(response);
                            }
                        });
                    }

Der Request wird nun auch generiert, läuft allerdings ins leere.

Ich habe im Plugin selbst unter Controllers/Backend/DetailDescriptionImage.php meinen Backend Controller defniert:

use Shopware\Enlight_Event_EventArgs;
class Shopware_Controllers_Backend_DetailDescriptionImage extends Shopware_Controllers_Backend_Application {
    protected $model = Vorteile::class;
    protected $alias = 'product';

    public function indexAction(){
        die("test");
    }

    public function getVorteileAction(){
        die("ok");
        $articleID = $this->Request()->getParam('articleID');
        error_log("getVorteile: ".$articleID);
    }

    public function removeVorteile(){
        die("ok");
        $articleID = $this->Request()->getParam('articleID');
        error_log("removeVorteile: ".$articleID);
    }

    public function getListQuery(){
        die("ok");
        error_log("getListQuery");
        $articleID = $this->Request()->getParam('articleID');
        error_log($articleID);
        
    }
}

Die Anfrage auf den Controller wird mit einem 404 quittiert. Also wurde der Controller nicht registriert ?

Keine Fehler im core_log oder apache2 error.log.

Laut: Shopware controller

Sollte der Controller meiner Meinung nach registriert werden.

 

Hat jemand einen Vorschlag ?

Danke an Lukaschel an dieser Stelle, der Controller funktioniert nun.

 class Shopware\_Controllers\_Backend\_DetailDescriptionImage extends Shopware\_Controllers\_Backend\_ExtJs 

statt

 class Shopware\_Controllers\_Backend\_DetailDescriptionImage extends Shopware\_Controllers\_Backend\_Application

 

Warum Shopware_Controllers_Backend_Application nicht funktionieren möchte erschliesst sich mir allerdings garnicht. Da muss ich mich wann anders drum kümmern.

Zumindest bekommt mein ExtJs nun eine Antwort vom Controller und ich komme endlich weiter.