extjs4 动态加载树菜单和相应的按钮是否显示 ,到对权限的控制粒度细化到按钮

初步想到对权限的控制的就是树菜单从数据库加载,同时也加载相应 增删改查 按钮setVisible和setDisabled的true or false值。

我这里演示用手动设置这些值模拟数据库查询到的值。

先说明一下,用setVisible和setDisabled来实现控制粒度细化到按钮有一点漏洞,setVisible可以通过修改html源码让它显示出来,不过setDisabled我暂时没发现,有发现的朋友通知一下,在此先谢过了……

先上效果图



树菜单的view
Ext.define('yang.view.frameAAA.module.FrameAAAWestChartPanelRemote', {
			extend : 'Ext.tree.Panel',
			alias : 'widget.frameAAAWestChartPanelRemote',
			initComponent : function() {
				var chartStoreRemote = Ext.create('yang.store.frameAAA.module.FrameAAAWestChartStoreRemote');

				var me = this;
				Ext.apply(me, {
							id : 'treeAuthentication',
							title : '<center>www  栏目</center>',
							rootVisible : true,
							lines : true,
							autoScroll : true,
							store : chartStoreRemote
						});
				me.callParent(arguments);
			}
		});

树菜单的store
Ext.define('yang.store.frameAAA.module.FrameAAAWestChartStoreRemote', {
			extend : 'Ext.data.TreeStore',
			autoLoad : true,
			fields : ['text', 'iconCls', 'xtype', 'leaf', 'addBut',
					'deleteBut', 'modifyBut', 'queryBut'],
			proxy : {
				type : 'ajax',
				url : 'http://localhost:8080/b_springmvc_extjs/treeAuthentication.do',
				actionMethods : {
					read : 'POST' // 提交的方式是 POST方式
				},
				reader : {
					type : 'json',
					root : 'children'
					// record: 'node'
				}
			},

			sorters : [{
						property : 'text',
						direction : 'asc'
					}],

			root : {
				nodeType : 'async',
				text : 'treeAuthentication',
				// id: '00',
				expanded : true
			}
		});

然后是单击树菜单的事件监听,这里是核心controller。
'frameAAAWestChartPanelRemote' : {
						itemclick : this.westChartPanelRemoteClick
					}
	//对权限的控制粒度再菜单的显示上细化到按钮
	westChartPanelRemoteClick : function(view, rec, item, index, e) {

			var charId = 'chartRemote_'+rec.get('text');
			var frameAAACenter = Ext.getCmp('frameAAACenter');
			var chartTabPanel=Ext.getCmp(charId);
			if(!chartTabPanel){
			chartTabPanel = frameAAACenter.add({
								xtype : rec.get('xtype'),
								id : 'chartRemote_'+rec.get('text'),
								title : rec.get('text')+'  报表',
								closable : true,
								moduleId:rec.get('id')
							});
			}
			frameAAACenter.setActiveTab(chartTabPanel);
				//根据后台返回来的值动态设置是否显示 增删改查 按钮
				Ext.getCmp(charId+'_addBut').setVisible(rec.get('addBut'));
				Ext.getCmp(charId+'_modifyBut').setVisible(rec.get('modifyBut'));
				Ext.getCmp(charId+'_deleteBut').setVisible(rec.get('deleteBut'));
				
				//根据后台返回来的值动态设置是否可以点击 增删改查 按钮
				Ext.getCmp(charId+'_addBut').setDisabled(!rec.get('addBut'));
				Ext.getCmp(charId+'_modifyBut').setDisabled(!rec.get('modifyBut'));
				Ext.getCmp(charId+'_deleteBut').setDisabled(rec.get('deleteBut'));
	},

最后后台的代码
	@RequestMapping(value = "/treeAuthentication.do", method = RequestMethod.POST)
	@ResponseBody
	public String treeAuthentication() {
		List<TreeStore> list = new ArrayList<TreeStore>();
		int num = new Random().nextInt(10);
		for (int i = 1; i <= num; i++) {
			TreeStore t = new TreeStore();
			t.setId(i);
			t.setText("aaa-" + i);
			t.setLeaf(true);
			if (i % 2 == 0) {
				t.setXtype("frameAAACenterGridPanel");
				t.setAddBut(false);
				t.setDeleteBut(false);
				t.setModifyBut(false);
				t.setQueryBut(false);
			} else {
				t.setXtype("frameAAACenterGridPanel");
				t.setAddBut(true);
				t.setDeleteBut(true);
				t.setModifyBut(true);
				t.setQueryBut(true);
			}
			list.add(t);
		}

		JSONArray jsonArray = JSONArray.fromObject(list);
		String json = "{children:" + jsonArray.toString() + "}";
		System.out.println(json);
		return json;
	}

再附上TreeStore的entity
public class TreeStore implements Serializable {

	/**
	 * @Fields serialVersionUID : TODO(用一句话描述这个变量表示什么)
	 */
	private static final long serialVersionUID = 1L;

	private int id;
	private String text;
	private String xtype;
	private String iconCls = "user";
	private boolean leaf;

	private boolean addBut;
	private boolean deleteBut;
	private boolean modifyBut;
	private boolean queryBut;

	public int getId() {
		return id;
	}

	public void setId(int id) {
		this.id = id;
	}

	public String getText() {
		return text;
	}

	public void setText(String text) {
		this.text = text;
	}

	public String getXtype() {
		return xtype;
	}

	public void setXtype(String xtype) {
		this.xtype = xtype;
	}

	public String getIconCls() {
		return iconCls;
	}

	public void setIconCls(String iconCls) {
		this.iconCls = iconCls;
	}

	public boolean isLeaf() {
		return leaf;
	}

	public void setLeaf(boolean leaf) {
		this.leaf = leaf;
	}

	public boolean isAddBut() {
		return addBut;
	}

	public void setAddBut(boolean addBut) {
		this.addBut = addBut;
	}

	public boolean isDeleteBut() {
		return deleteBut;
	}

	public void setDeleteBut(boolean deleteBut) {
		this.deleteBut = deleteBut;
	}

	public boolean isModifyBut() {
		return modifyBut;
	}

	public void setModifyBut(boolean modifyBut) {
		this.modifyBut = modifyBut;
	}

	public boolean isQueryBut() {
		return queryBut;
	}

	public void setQueryBut(boolean queryBut) {
		this.queryBut = queryBut;
	}

}
相关文章
相关标签/搜索
每日一句
    每一个你不满意的现在,都有一个你没有努力的曾经。
公众号推荐
   一个历史类的公众号,欢迎关注
一两拨千金