JEPaaS低代码平台ext.js与功能列表层级使用关系

凯特-李春莹

页面层级说明

jemainview -> jecenterview -> jedataview 和 jeeditview
jedataview -> jegridview 和 jetreeview
jeeditview -> tabpanel -> jeformview

相关代码

1.获取列表相关层级

//获取当前功能整个列表界面
.getCmp("JE_DEMO_PTLB_jemainview").up('[xtype=container]').up('[xtype=appfuncview]');
//根据层级获取列表
Ext.getCmp("JE_DEMO_PTLB_jemainview").down('[xtype=jecenterview]').down('[xtype=jedataview]').down('[xtype=container]').down('[xtype=jegridview]');

2.获取列表

var grid =Ext.getCmp("JE_DEMO_PTLB_jegridview");

3.获取列表按钮条

var  toolbar = Ext.getCmp("JE_DEMO_PTLB_jegridview").down("[xtype=toolbar]");

4.获取列表按钮
其他按钮同下方法，按钮编码不清楚在获取toolbar之后，找到items属性就可以找到

//获取列表左侧“+”按钮并隐藏
Ext.getCmp("JE_DEMO_PTLB_jegridview").down('toolbar[itemId=buttonBar]').down('button[itemId=leftgridadd]').hide();
//列表选中数据时，隐藏列表左侧“+”按钮并隐藏
Ext.getCmp("JE_DEMO_PTLB_jegridview").down("[xtype=toolbar]").down('button[itemId=leftgridadd]').hide();
//获取列表创建按钮并隐藏Ext.getCmp("JE_DEMO_COURSE_jegridview").down('button[ref=gridInsertBtn]')Ext.getCmp("JE_DEMO_PTLB_jegridview").down('toolbar[itemId=buttonBar]').down("button[ref=gridInsertBtn]").hide();
//  获取列表按钮并显示按钮
Ext.getCmp("JE_DEMO_PTLB_jegridview").down('toolbar[itemId=buttonBar]').down("button[ref=gridInsertBtn]").show();
// 获取表单按钮，修改文本
Ext.getCmp("JE_DEMO_PTLB_jegridview").down('toolbar[itemId=buttonBar]').down("button[ref=gridInsertBtn]").setText("测试创建");

5.获取列表字段

//获取列表所有列头数组
Ext.getCmp("JE_DEMO_PTLB_jegridview").headerCt.items.items;
//利用下标获取某一字段
Ext.getCmp("JE_DEMO_PTLB_jegridview").headerCt.items.items[2];
//获取列表某个字段列，修改列头文本
Ext.getCmp("JE_DEMO_PTLB_jegridview").headerCt.items.items[2].setText("测试文本");

6.获取列表子功能

列表内纵向展示

//获取列表所有子功能
Ext.getCmp("JE_DEMO_ZCBJE_jedataview").down("container[id=JE_DEMO_ZCBJE_childs_data_V]").items.items
//获取子功能
var childpanel = Ext.getCmp("JE_DEMO_ZCBJE_jedataview").down("container[id=JE_DEMO_ZCBJE_childs_data_V]").down("jemainview[id=TEST_jemainview]").down("jegridview");
var childpanel = Ext.getCmp("TEST_jedataview").down("jegridview");
//子功能编码直接获取
var child = Ext.getCmp("JE_DEMO_CP3_jemainview");

列表内横向展示

//子功能tab
Ext.getCmp("JE_DEMO_ZCBJE_jedataview").down("[xtype=tabpanel]")Ext.getCmp("JE_DEMO_ZCBJE_jedataview").down("container[itemId=jedataview_center]").down("[xtype=tabpanel]")
//子功能显示的grid
Ext.getCmp("JE_DEMO_ZCBJE_jedataview").down("container[itemId=jedataview_center]").down("[xtype=tabpanel]").down("tab").card.down("jegridview");

7.通过事件（字段/按钮）获取列表层级和子功能

//通过渲染前/后事件获取当前功能列表层级
self.up("jemainview").down("jecenterview").down("jedataview").down("jegridview")
//通过渲染前/后事件获取当前主子功能列表层级
self.up("jemainview").down("jecenterview").down("jedataview").childPanel.items[0].items
//通过渲染前/后事件获取列头
self.up("jemainview").down("jecenterview").down("jedataview").down("jegridview").headerCt
//通过激活事件获取功能列表的过滤条件
self.getStore().proxy.extraParams.j_query
//通过按钮获取列表
btn.up("jegridview");
//通过按钮获取列表层级
btn.up("jegridview").up("jedataview").up("jecenterview").up("jemainview");
//通过按钮获取高级查询面板层级
btn.up("jegridview").up("jedataview").down('jeformview[type=query]')
//获取快速查询面板
btn.up("jemainview").down("[xtype=jetreeview]");
//通过按钮获取列表中某一字段列
btn.up("jegridview").headerCt.items.items[3];



详细文档请查看：https://doc.jepaas.com/docs/je_d ... epaas-1dl6ern91m1mn