Code:
Ext.define('Abs.menu.Menu',{
region: 'west',
extend: 'Ext.tab.Panel',
split: true,
collapsible: false,
width: 250,
tabBar: {
defaults: {
height: 24
},height: 24
},
layout: {
type: 'vbox',
align: 'stretch'
},
items: [
{
title: ' ',
iconCls: 'tab-ico-tree',
flex: 1,
layout: {
type: 'vbox',
align: 'stretch'
},
items: [{
xtype: 'treepanel',
itemId: 'tree',
rootVisible: false,
flex: 1,
store: {
xtype: 'tree',
proxy: {
type: 'ajax',
url: 'index.php?mod=menu&async=1&f=c'
},
root: {
text: 'Categories',
id: 'id',
expanded: true
},
fields: [
//{name: 'id', mapping: 'i'},
{name: 'menu', mapping: 'm'},
{name: 'optn', mapping: 'o'},
{name: 'text', mapping: 'text'},
{name: 'desc', mapping: 'text'},
{name: 'info', mapping: 'd'},
{name: 'rptg', mapping: 'rptg'},
{name: 'type', mapping: 'type'},
{name: 'prgm', mapping: 'c'}
]
},
listeners: {
itemclick: function (t, record, item, index, e, eOpts ) {
if (record && record.data && record.data.leaf) {
Abs.menu.addHtmlClient(record.data);
//Ext.MessageBox.alert('Menu Called', record.data.m+':'+record.data.o);
}
}
}
}]
},{
title: ' ',
iconCls: 'tab-ico-search',
layout: {
type: 'vbox',
align: 'stretch'
},
items: [{
xtype: 'textfield',
emptyText: 'Search...',
tmr: null,
lastVal: null,
fltr: function () {
var me = this;
var val = this.value;
if (val === this.lastVal) {
return;
}
if (!me.store) {
me.store = this.ownerCt.getComponent('gridMenu').store;
}
Abs.menuResult = null;
Abs.menuQuery = this.lastVal = val;
if (!val || val.length < 2) {
me.store.clearFilter(false);
return;
}
if (val) {
me.store.clearFilter(true);
me.store.filter([
{
filterFn: function (item) {
if (Abs.menuQuery.length < 5) {
if (item.data.menu == Abs.menuQuery.substring(0,2).toUpperCase()) {
if (item.data.optn == Abs.menuQuery.substring(2).toUpperCase()) {
Abs.menuResult = item;
}
return true;
}
if (Abs.menuQuery.length < 3) {
return false;
}
}
return new RegExp(Abs.menuQuery, 'i').test(item.data.name);
}
}
]);
} else {
me.store.clearFilter(false);
}
},
enableKeyEvents: true,
searchInit: function (me) {
if (!me.searchInterval) {
me.searchInterval = setInterval(function () { me.fltr(); }, 250);
}
},
listeners: {
keyDown: function () {
this.searchInit(this);
},
keyUp: function () {
this.searchInit(this);
}
}
},{
xtype: 'grid',
itemId: 'gridMenu',
flex: 1,
store: {
model: 'Abs.menu.Command',
groupField: 'group',
proxy: {
type: 'ajax',
url: '?mod=menu&f=n&async=1',
reader: {
type: 'json',
root: 'menu'
}
},
autoLoad: true
},
columns: [
//{ text: 'Results', xtype: 'templatecolumn', tpl: '{menu}:{optn} {desc}', flex: 1 },
{
xtype: 'actioncolumn', icon: 'img/info2.png', width: 20, groupable: false, hideable: false,
getTip: function (v,metadata,r,rowIndex,colIndex,store) {
return r.data.desc;
}
},
{ text: 'Menu', xtype: 'templatecolumn', tpl: '{menu}:{optn}', width: 50, groupable: false, hideable: true, },
{ text: 'Name', dataIndex:'name', flex: 1, groupable: false, hideable: false }
],
features: [{
ftype:'grouping'
,groupHeaderTpl:[
//'Group: ',
'<div>{name:this.formatName}</div>',
{
formatName: function(name) {
return Ext.String.trim(name);
}
}
]
//,groupHeaderTpl: '{menu}'
}],
listeners: {
itemClick: function (a,b,c,d) {
Abs.menu.addHtmlClient(b.data);
}
}
}]
},{
title: ' ',
iconCls: 'tab-ico-func',
layout: {
type: 'vbox',
align: 'stretch'
},
}
]
});