Sencha panel에 click 이벤트 넣기

Case1

{
	xtype: 'panel',
	bodyStyle: 'background-color:black',
	html: '<div style="height: 50px; display: flex; align-items: center;">Logout</div>',
	listeners: {
		afterrender: function(panel) {
			panel.getEl().on('click', function() {
			Ext.Msg.alert('Panel Clicked', 'You clicked on the panel!');
			});
		}
	}
},

Case2

{
	xtype: 'panel',
	bodyStyle: 'background-color:black',
	html: '<div style="height: 50px; display: flex; align-items: center;">Logout</div>',
	listeners: {
		click: {
        	lement: 'el', //bind to the underlying el property on the panel
            fn: function(){ console.log('click el'); }
        },
	}
},