Ext.define('make.view.sys.parameter.SettingNav', {
    extend: 'Ext.panel.Panel',
    xtype: 'make-parameter-settingNav',
    viewModel: 'make-parameter-settingNav',
    controller: 'make-parameter-settingNav',
    cls: 'sys-parameter-nav',
    height: '100%',
    layout: 'fit',
    initComponent: function () {
        var me = this;
        Ext.apply(me, {
            items: [{
                xtype: 'dataview',
                itemSelector: 'li.x-nav-item',
                defaultIndex: 0,
                bind: {
                    store: '{nav}'
                },
                tpl: new Ext.XTemplate(
                    '<div class="sys-parameter-box">',
                    '<tpl for=".">',
                    '<div class="x-nav-box">',
                    '<ul>',
                        '<tpl if="this.isDefault(xindex)">',
                            '<li class="x-nav-item x-nav-item-selected">{name}</li>',
                        '<tpl else>',
                            '<li class="x-nav-item">{name}</li>',
                        '</tpl>',
                    '</ul>',
                    '</div>',
                    '</tpl>',
                    '</div>',
                    {
                        isDefault: function(xindex){
                           return this.owner.defaultIndex == (xindex-1);
                        }
                    } 
                ),
                listeners: {
                    itemmousedown: 'onMenuChange'
                },
            }]
        });
        me.callParent(arguments);
        // me.setIndexItem();
    },
    setIndexItem: function () {
        var me = this;
    }
});