Fujitsu HPC Gateway Addon - 如何使用单独的文件

Question

如何将 HPC 网关插件的逻辑拆分到单独的文件中？即我想做这样的事情：

Main.js

Ext.define('App.view.main.Main', {
    extend: 'Ext.tab.Panel',
    items: [{
        title: 'Stuff',
        xtype: 'stuff',
        iconCls: 'x-fa fa-object-group'
    }, {
        title: 'About',
        xtype: 'about',
        iconCls: 'x-fa fa-info-circle',
    }]
});

Stuff.js

Ext.define('App.widget.Stuff', {
    extend: 'Ext.panel.Panel',
    alias: 'widget.stuff',
    html: '<h1>Stuff'
});

About.js

Ext.define('App.widget.About', {
    extend: 'Ext.panel.Panel',
    alias: 'widget.about',
    html: '<h1>Version: x.y.z'
});

根据 creating an addon 的官方 fujitsu 文档，没有将您的逻辑分成多个文件的示例，只有两个包含视图和控制器逻辑的整体文件：

appModule.js

Ext.define('desktop.addons.app_abcdef12.view.appModule', {
    extend: 'desktop.core.utils.Module',
    requires:[],

    /**
     * Create window
     * @param taskBar the task bar
     * @returns {desktop.core.view.utils.ModuleView} the module view
     */
    createWindow: function (taskBar) {
        var me = this;
        return Ext.create('desktop.core.view.utils.ModuleView', {
            title: me.title,
            iconCls: me.iconCls,
            stateId: 'app-module',
            name: 'app-window',
            taskBar: taskBar,
            multipleView: false,
            width: 320,
            height: 150,
            items:me.buildItems(),
            buttons: [
            ]
        });
    },

    /**
     * Build items
     * @returns {{xtype: string, layout: {type: string, align: string}, items: *[]}} items in json format
     */
    buildItems:function(){
        return {
            xtype: 'panel',
            layout: 'center',
            items: [{
                xtype: 'textfield',
                name: 'value',
                fieldLabel: desktop.core.utils.Symbols.getText('app_abcdef12.textfield.input')+" *",
                allowBlank:false,
                listeners: {
                    change: function(textfield, newValue){
                        var window = textfield.up('window');
                        window.fireEvent('textfieldChanged', textfield, newValue);
                    }
                }
            }]
        };
    }
});

appController.js

Ext.define('desktop.addons.app_abcdef12.controller.appController', {
    extend: 'desktop.core.controller.abstract.AbstractToriiController',
    requires: [],
    control: {
        'window[name=app-window]': {
            textfieldChanged: 'performTextfieldChanged'
        }
    },

    performTextfieldChanged: function (textfield, newValue) {
        if (Ext.isEmpty(newValue)) {
            textfield.up('window').down('button[name=save]').disable();
        } else {
            textfield.up('window').down('button[name=save]').enable();
        }
    }
});

当我尝试使用 widget.stuff 的 xtype 创建类似 desktop.addons.app_abcdef12.view.Stuff 的东西时，我使 HPC 实例崩溃，不得不删除 mongodb 中列出的插件并重新启动服务。这严重减少了我可以通过反复试验找出有效方法的次数。

有人做过吗？

Answer 1

最后我没能使用 xtype 得到任何东西，但我在直接使用 Ext.create 时做到了：

appModule.js

buildItems:function(){
    return {
        xtype: 'tabpanel',
        items: [
            Ext.create('desktop.addons.app_abcdef12.view.Stuff'),
            Ext.create('desktop.addons.app_abcdef12.view.About'),
        ]
    };
}

Stuff.js

Ext.define('desktop.addons.app_abcdef12.view.Stuff', {
    title: 'Stuff',
    extend: 'Ext.panel.Panel',
    iconCls: 'x-fa fa-id-card',
    html: '<h1>Stuff'
});

About.js

Ext.define('desktop.addons.app_abcdef12.view.About', {
    title: 'About',
    extend: 'Ext.panel.Panel',
    iconCls: 'x-fa fa-info',
    html: '<h1>About'
});

Fujitsu HPC Gateway Addon - 如何使用单独的文件

Fujitsu HPC Gateway Addon - How To Use Separate Files

extjs

hpc