Extjs3.0角色权限管理系统-菜单管理模块篇

1.菜单管理功能模块效果图如下


2.用户管理功能模块->新增、修改和详情功能大致相同,故截一个图,效果图如下


菜单管理模块后台controller代码

package com.gsww.controller.sys;

import java.util.HashMap;
import java.util.List;
import java.util.Map;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import net.sf.json.JSONArray;

import org.apache.commons.lang.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.data.domain.Page;
import org.springframework.data.domain.PageRequest;
import org.springframework.data.jpa.domain.Specification;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import org.springside.modules.web.Servlets;

import com.gsww.controller.BaseController;
import com.gsww.entity.sys.SysMenu;
import com.gsww.entity.sys.SysMenuInfo;
import com.gsww.entity.sys.SysSession;
import com.gsww.service.sys.SysMenuInfoService;
import com.gsww.util.PageUtils;
import com.gsww.util.TimeHelper;

/**
 * 系统系统菜单管理
 * @author Administrator
 *
 */
@Controller
@RequestMapping(value = "/sysMenu")
public class SysMenuInfoController extends BaseController{
	
	@Autowired
	private SysMenuInfoService sysMenuInfoService;
	
	/*
	 * 返回系统菜单管理页面
	 */
	@RequestMapping(value = "/getSysMenuIndex")
	public String getSysMenuIndex(HttpServletRequest request, 
			HttpServletResponse response) throws Exception{
		return "sysManage/sysMenuInfo";
	}
	
	/*
	 * 返回系统菜单列表树管理页面
	 */
	@RequestMapping(value = "/getSysMenuTreeTableIndex")
	public String getSysMenuTreeTableIndex(HttpServletRequest request, 
			HttpServletResponse response) throws Exception{
		return "sysManage/sysMenuTreeTable";
	}
	
	/*
	 * 获取系统菜单分页列表
	 */
	@RequestMapping(value = "/getSysMenuInfoPage",method = RequestMethod.GET)
	public void getSysMenuInfoPage(@RequestParam(value = "start", defaultValue = "1") int page,
			@RequestParam(value = "limit", defaultValue = LIMIT) int pageSize,
			@RequestParam(value = "orderField", defaultValue = "menuSort") String orderField,
			@RequestParam(value = "orderSort", defaultValue = "ASC") String orderSort,
			@RequestParam(value = "menuName", defaultValue = "") String menuName,
			@RequestParam(value = "findNowPage", defaultValue = "false") String findNowPage,
			Model model,HttpServletRequest request,HttpServletResponse response){
		try {
			//初始化分页数据
			page = page/pageSize + 1;
			PageUtils pageUtils=new PageUtils(page,pageSize,orderField,orderSort);
			PageRequest pageRequest=super.buildPageRequest(request,pageUtils,SysMenuInfo.class,findNowPage);
			//获取页面的参数
			Map<String, Object> searchParams = Servlets.getParametersStartingWith(request, "search_");
			if(StringUtils.isNotBlank(menuName)){
				searchParams.put("LIKE_menuName", menuName);
			}
			Specification<SysMenuInfo> spec=super.toSpecification(searchParams, SysMenuInfo.class);
			//分页
			Page<SysMenuInfo> sysRolePage = sysMenuInfoService.getSysMenuInfoPage(spec, pageRequest);
			for (SysMenuInfo sysMenuInfo : sysRolePage.getContent()) {
				String pId = sysMenuInfo.getMenuPid();
				if(!pId.equals("0")){
					SysMenuInfo smi = sysMenuInfoService.getSysMenuInfoByMenuId(pId);
					if(null!=smi){
						sysMenuInfo.setMenuPname(smi.getMenuName());
					}
				}
			}
			Map<String,Object> dataMap = new HashMap<String,Object>();
			dataMap.put("data", sysRolePage.getContent());
			dataMap.put("count", sysRolePage.getTotalElements());
			this.getJson(response, dataMap);
		} catch (Exception e) {
			e.printStackTrace();
		}
	}
	
	/*
	 * 返回系统菜单JSON数据
	 */
	@RequestMapping(value = "/getSysMenuInfoJson")
	public void getSysMenuInfoJson(HttpServletRequest request, 
			HttpServletResponse response) throws Exception{
		SysSession sysSession = (SysSession) request.getSession().getAttribute("sysSession");
		List<SysMenu> rootMenu = sysMenuInfoService.getSysMenuInfoJson(sysSession.getUserId());
		JSONArray jsonarr = JSONArray.fromObject(rootMenu);
		this.getJson(response, jsonarr.toString());
	}
	
	/*
	 * 返回系统菜单树表格Json数据
	 */
	@RequestMapping(value = "/getAuthSysMenuInfoJson")
	public void getAuthSysMenuInfoJson(HttpServletRequest request, 
			HttpServletResponse response,String menuName) throws Exception{
		List<SysMenu> rootMenu = sysMenuInfoService.getAuthSysMenuInfoJson(menuName);
		JSONArray jsonarr = JSONArray.fromObject(rootMenu);
		this.getJson(response, jsonarr.toString());
	}
	
	/*
	 * 系统菜单新增
	 */
	@RequestMapping(value = "/sysMenuInfoSave",method = RequestMethod.POST)
	public void sysMenuInfoSave(HttpServletRequest request, 
			HttpServletResponse response,SysMenuInfo sysMenuInfo) throws Exception{
		String pId = sysMenuInfo.getMenuPid();
		String menuId = sysMenuInfo.getMenuId();
		if(StringUtils.isBlank(pId)){
			sysMenuInfo.setMenuPid("0");
		}
		if(StringUtils.isBlank(menuId)){
			sysMenuInfo.setCreateTime(TimeHelper.getCurrentTime());
		}else{
			sysMenuInfo.setUpdateTime(TimeHelper.getCurrentTime());
		}
		String menuState = sysMenuInfo.getMenuState();
		if(StringUtils.isNotBlank(menuState)){
			if(menuState.equals("有效")){
				menuState = "1";
			}else{
				menuState = "0";
			}
			sysMenuInfo.setMenuState(menuState);
		}
		sysMenuInfoService.sysMenuInfoSave(sysMenuInfo);
	}
	
	/*
	 * 系统菜单删除
	 */
	@RequestMapping(value = "/sysMenuInfoDelete",method = RequestMethod.GET)
	public void sysMenuInfoDelete(HttpServletRequest request,
			HttpServletResponse response,String idStr) throws Exception{
		if(StringUtils.isNotBlank(idStr)){
			String[] arr = idStr.split(",");
			int delSum = 0; 
			for (String menuId : arr) {
				List<SysMenuInfo> listMenu = sysMenuInfoService.getSysMenuInfoByPid(menuId);
				if(listMenu.size()==0){				
					sysMenuInfoService.sysMenuInfoDelet(menuId);
					delSum++;
				}
			}
			String message = "您成功删除了"+delSum+"条记录!";
			int failSum = arr.length-delSum;
			if(failSum>0){
				message+=","+failSum+"条记录由于下面有子菜单,删除失败!";
			}
			this.getJson(response, message);
		}
	}
	
	/*
	 * 系统菜单启用停用
	 */
	@RequestMapping(value = "/sysMenuInfoUpdate",method = RequestMethod.GET)
	public void sysMenuInfoUpdate(HttpServletRequest request,
			HttpServletResponse response,String idStr,String menuState) throws Exception{
		if(StringUtils.isNotBlank(idStr)){
			String[] arr = idStr.split(",");
			int sucSum = 0; 
			for (String menuId : arr) {
				SysMenuInfo sysMenuInfo = sysMenuInfoService.getSysMenuInfoByMenuId(menuId);
				if(sysMenuInfo!=null){
					String parState = sysMenuInfo.getMenuState();
					if(!parState.equals(menuState)){
						//启用或停用菜单
						sysMenuInfoService.sysMenuInfoUpdate(menuState, menuId);
						sucSum++;
					}
				}
			}
			String menuStateText = menuState!=null&&menuState.equals("1")?"启用":"停用";
			String message = "您成功"+menuStateText+sucSum+"条记录!";
			int failSum = arr.length-sucSum;
			if(failSum>0){
				message+=","+failSum+"条记录由于已"+menuStateText+","+menuStateText+"失败!";
			}
			this.getJson(response, message);
		}
	}
}
菜单管理jsp代码

<%@ page language="java" contentType="text/html;charset=utf-8" pageEncoding="utf-8"%>
<!DOCTYPE HTML>
<html>
<%@ include file="/resource/include/meta.jsp"%>
  <head>
    <title>菜单管理</title>
	<script type="text/javascript" src="${ctx}/resource/common/js/sysManage/sysMenuInfo.js"></script>
  </head>
  <body>
  	<div id="menuContent" class="menuContent" style="display:none; position: absolute;z-index: 90000;
  		border:1px solid #ccc;width:278px;height:200px;overflow:auto;background:#fff;">
	    <ul id="treeDemo" class="ztree" style="margin-top:0;"></ul>
	</div>
  </body>
  <script type="text/javascript">
  /*******************************************zTree树配置开始************************************************/
	var setting = {
        view: {
            selectedMulti: false//是否支持同时选中多个节点
        },
        data: {
            key: {
                //将treeNode的ItemName属性当做节点名称
                name: "text"        
            },
            simpleData: {
                enable: true,//是否使用简单数据模式
                idKey: "id",//当前节点id属性  
                pIdKey: "pId",//当前节点的父节点id属性 
                rootPId: 0//用于修正根节点父节点数据,即pIdKey指定的属性值
            }
        },
        callback: {
            onClick: onClick
        }
    };

    function onClick(e, treeId, treeNode) {
        var zTree = $.fn.zTree.getZTreeObj("treeDemo");
        var nodes = zTree.getSelectedNodes();
        $("#menuPname").attr("value", nodes[0].text);
        $("#menuPid").attr("value", nodes[0].id);
    }

    function showMenu() {
        var cityObj = $("#menuPname");
        var cityOffset = $("#menuPname").offset();
        $("#menuContent").css({left:cityOffset.left + "px", top:cityOffset.top + cityObj.outerHeight() + "px"}).slideDown("fast");
        $("body").bind("mousedown", onBodyDown);
    }
    function hideMenu() {
        $("#menuContent").fadeOut("fast");
        $("body").unbind("mousedown", onBodyDown);
    }
    function onBodyDown(event) {
        if (!(event.target.id == "menuBtn" || event.target.id == "menuContent" || $(event.target).parents("#menuContent").length>0)) {
            hideMenu();
        }
    }
    var zNodes = [];
    $(function(){
     	$.ajax({    
            async : false,    
            cache:false,    
            type: 'POST',    
            dataType : 'json',    
            url: basepath + '/sysMenu/getAuthSysMenuInfoJson',
            success:function(data){ 
               zNodes = data;  
            },  
            error: function () {
            },    
        });   
        var treeObj =  $.fn.zTree.init($("#treeDemo"), setting, zNodes);  
        treeObj.expandAll(true);//默认展开所有节点   
    });
	/*******************************************zTree树配置结束************************************************/
  </script>
</html>
菜单管理js代码

/********************************************Ext入口函数,相当于java中的主函数开始********************************************/
Ext.onReady(function() {
	Ext.QuickTips.init();
	var menuStateStore = new Ext.data.ArrayStore({
		autoLoad :true,						//页面加载时自动load数据
		fields : ['key', 'value'],
		data : [['有效','1'],['无效', '0']]
	});
	var record = Ext.data.Record.create([
        {name:'menuId'},
		{name:'menuName'},
		{name:'menuPname'},
		{name:'menuUrl'},
		{name:'menuIcon'},
		{name:'menuPid'},
		{name:'menuState'},
		{name:'menuSort'},
		{name:'createTime'},
		{name:'updateTime'},
		{name:'menuDesc'}
	  ]);
	/*****************************      表格数据代理Store开始       *******************************************/
	var dataStore = new Ext.data.Store({
	    restful : true,     
	    autoLoad : true,
	    proxy : new Ext.data.HttpProxy({
	        url:basepath+'/sysMenu/getSysMenuInfoPage',
			method : 'GET'
	    }),
	    reader : new Ext.data.JsonReader({
			successProperty : 'success',
			idProperty : 'ID',
			messageProperty : 'message',
			root : 'data',
			totalProperty : 'count'
		}, record)
	});
	/*****************************      表格数据代理Store结束       *******************************************/

	/*****************************      定义自动当前页行号开始       *******************************************/
	var rownum = new Ext.grid.RowNumberer({
		header : 'No.',
		width : 28
	});
	/*****************************      定义自动当前页行号结束       *******************************************/
	
	/*****************************      定义复选框开始       *******************************************/
	var sm = new Ext.grid.CheckboxSelectionModel();
	/*****************************      定义复选框结束       *******************************************/
	
	/*****************************      设置分页参数开始       *******************************************/
	var pagesize_combo = new Ext.form.ComboBox({
        name : 'pagesize',
        triggerAction : 'all',
        mode : 'local',
        store : new Ext.data.ArrayStore({
            fields : ['value', 'text'],
            data : [ [ 10, '10条/页' ], [ 20, '20条/页' ], [ 50, '50条/页' ],
						[ 100, '100条/页' ], [ 250, '250条/页' ],
						[ 500, '500条/页' ] ]
        }),
        valueField : 'value',
        displayField : 'text',
        value: 20,
        editable : false,
        width : 85
	});
	
	var bbar = new Ext.PagingToolbar({					//分页组件
        pageSize : parseInt(pagesize_combo.getValue()),
        store : dataStore,
        displayInfo : true,
        displayMsg : '显示{0}条到{1}条,共{2}条',       
        emptyMsg : "没有符合条件的记录",
        items : ['-', '  ', pagesize_combo]
    });
	pagesize_combo.on("select", function(comboBox) {
        bbar.pageSize = parseInt(pagesize_combo.getValue()),
        dataStore.reload({
            params : {
                start : 0,
                limit : parseInt(pagesize_combo.getValue())
            }
        });
    });
	/*****************************       设置分页参数结束       *******************************************/
	
	/*****************************************   新增editForm开始  **************************************************/
	var editForm = new Ext.form.FormPanel({
		formId:'editForm',
        frame:true,
        border:false,
        labelAlign:'center',
        standardSubmit:false,
    	layout : 'form',//*form布局
        items : [{
	    	layout:'column',
        	items : [{
                 columnWidth : .5,					//列宽为25%
   	        	 layout : 'form',					//*form布局
   	        	 items: [{
	            	columnWidth : .5,					//列宽为25%
   	  	        	layout : 'form',					//*form布局
   	  	        	items: [{
   	  	        		fieldLabel : '<font color="red">*</font>菜单名称',
   	  	        		name : 'menuName', 
   	  	        		xtype : 'textfield', 			// 设置为数字输入框类型
   	  	        		labelStyle : 'text-align:right;',//右对齐
   	  	        		emptyText:'请您输入菜单名称',	//水印提示
   	  	        		allowBlank:false,               //allowBlank : false就是已经定义好的校验规则,extjs getForm().isValid()函数会调用已经定义的校验规则来验证输入框中的值
   	  	        		anchor : '90%'
   	  	        	}]
       	        },{
	            	columnWidth : .5,					//列宽为25%
   	  	        	layout : 'form',					//*form布局
   	  	        	items: [{
   	  	        		fieldLabel : '菜单图标',
   	  	        		id : 'menuIcon', 
   	  	        		name : 'menuIcon', 
   	  	        		xtype : 'textfield', 			// 设置为数字输入框类型
   	  	        		labelStyle : 'text-align:right;',//右对齐
   	  	        		emptyText:'请您选择菜单图标',	//水印提示
   	  	        		anchor : '90%',
   	  	        		readOnly:true
   	  	        	}]
       	        },{
   	            	columnWidth : .5,					//列宽为25%
   					layout : 'form',					//*form布局
   					items : [{ //下拉框
   						xtype : 'combo',
   						fieldLabel : '<font color="red">*</font>菜单状态',
   						name : 'menuState',
   						store : menuStateStore,			//*加载客户类型Store
   						//下列属性在复用时一般不作修改
   						editable : false,				//false为不可编辑,页面效果为点击下拉框空白处直接触发下拉菜单
   						labelStyle : 'text-align:right;',//fieldLabel右对齐
   						triggerAction : 'all',			//*触发器被激活时执行allQuery查询
   						displayField : 'key',			//*下列列表选项的中文名,对应Store中的value
   						valueField : 'value',				//*下列列表选项对应的key值,对应Store中的key
   						mode : 'local',					//*读取本地数据
   						emptyText:'请您选择菜单状态',	//*水印提示
   						resizable : false,				//*下拉框下部的缩放柄,可改变下拉框大小
   						allowBlank:false,               //allowBlank : false就是已经定义好的校验规则,extjs getForm().isValid()函数会调用已经定义的校验规则来验证输入框中的值
   						anchor : '90%'
   					}]	
   	            }]
        	},{
            	columnWidth : .5,					//列宽为25%
	  	        	layout : 'form',					//*form布局
	  	        	items: [{
	  	        		fieldLabel : '<font color="red">*</font>菜单URL',
	  	        		id:'menuUrl',				
	  	        		name : 'menuUrl', 
	  	        		xtype : 'textfield', 			// 设置为数字输入框类型
	  	        		labelStyle : 'text-align:right;',//右对齐
	  	        		emptyText:'请您输入菜单URL',	//水印提示
	  	        		anchor : '90%'
	  	        	}]
        	  },{
   	            	columnWidth : .5,					//列宽为25%
   					layout : 'form',					//*form布局
   					items : [{
   						fieldLabel : '父级菜单',
   						id : 'menuPname',
   	  	        		name : 'menuPname', 
   	  	        		xtype : 'textfield', 			// 设置为数字输入框类型
   	  	        		labelStyle : 'text-align:right;',//右对齐
   	  	        		emptyText:'请您选择父级菜单',	//水印提示
   	  	        		anchor : '90%',
   	  	        		readOnly:true,
     				    listeners:{
     				    	focus: function(){
     				    		showMenu();
     				        },
     				    	blur: function(){
     				    		hideMenu();
     				        } 
     				    }
   				    }]	
   	            },{
	            	columnWidth : .5,					//列宽为25%
   	  	        	layout : 'form',					//*form布局
   	  	        	items: [{
   	  	        		fieldLabel : '<font color="red">*</font>菜单排序',
   	  	        		id:'menuSort',				
   	  	        		name : 'menuSort', 
   	  	        		xtype : 'textfield', 			// 设置为数字输入框类型
   	  	        		labelStyle : 'text-align:right;',//右对齐
   	  	        		emptyText:'请您输入菜单排序',	//水印提示
   	  	        		allowBlank:false,               //allowBlank : false就是已经定义好的校验规则,extjs getForm().isValid()函数会调用已经定义的校验规则来验证输入框中的值
   	  	        		anchor : '90%'
   	  	        	}]
       	        }]
		},{
        	columnWidth : 1,					//列宽为25%
        	layout : 'form',					//*form布局
        	items: [{
                xtype : 'htmleditor',
                height : 140,
                width : 700,
                fontFamilies : ['宋体','黑体','隶书','微软雅黑','Arial','Courier New','Tahoma','Times New Roman','Verdana'],
                defaultFont: '宋体',
                defaultLinkValue:"http://www.",
                enableAlignments:true,
                enableColors:true,
                enableFont:true,
                enableFontSize:true,
                enableFormat:true,
                enableLinks:true,
                enableSourceEdit:true,
                fieldLabel:'菜单描述',
                labelStyle:'text-align:right;',
                name:'menuDesc',
                anchor:'95%'
            }]
	  },{
        	id:'menuId',
			name : 'menuId',
			xtype : 'hidden'
        },{
        	id:'menuPid',
			name : 'menuPid',
			xtype : 'hidden'
        },{
        	id:'createTime',
			name : 'createDate',
			xtype : 'hidden'
        }]
	});
	/*****************************************   新增editForm结束  **************************************************/
	
	/*****************************************   新增和修改editWindow窗口开始  **************************************************/
	var editWindow=new Ext.Window({
		id:'editWindow',
		width : 880,
		height :350,
		closable : true,
		resizable : false,
		collapsible : false,
		draggable : true,
		closeAction : 'hide',
		title : '新增系统菜单',
		modal : true, 
		animCollapse : false,
		border : false,
		closable : true,
		animateTarget : Ext.getBody(),
		constrain : true,
		items : [editForm],
		buttonAlign:'center',
		buttons:[{
			text:'保存',
			handler:function(){
				if(!editForm.getForm().isValid()){
					Ext.MessageBox.alert('系统提示', '请您正确输入各项信息!');
					return false;
				}         
				var pars = editForm.getForm().getFieldValues();
				var menuSort=pars.menuSort;
				var reg=/^\+?[1-9][0-9]*$/;//baseNum dimName    dimCd 
				if(!reg.test(menuSort)){
					Ext.MessageBox.alert('系统提示', '菜单排序必须是数字!');
               	 	return false;
                }
				//提交表单的方法
				editForm.getForm().submit({
					url : basepath + '/sysMenu/sysMenuInfoSave',
					method : 'POST',
					waitTilte : '系统提示',
					waitMsg : '正在提交数据,请稍后!',
                  	success:function(response){
                  		Ext.Msg.alert('系统提示', '保存成功!',function(btn){
                  			if(btn == 'ok'){
                  				dataStore.load({
                  					params : {
                      					start : 0,
                      					limit : parseInt(pagesize_combo.getValue())
                      				}
                  				});
                  			}
                  		});
                  	},
                  	failure : function(form, action){
                    	Ext.MessageBox.alert('系统提示', '保存失败!');
                  	},
				});
				editWindow.hide();
      	  	}
		},{
			text: '关闭',
			handler:function(){
				editWindow.hide();
          	}
		}]  
	});
	/*****************************************   新增和修改editWindow窗口结束  **************************************************/
	
   /*****************************************   详情detailForm开始  **************************************************/
   var detailForm=new Ext.FormPanel({
        formId:'detailForm',
        frame:true,
        border:false,
        labelAlign:'right',
        standardSubmit:false,
        width : '100%',
        layout:'form',
        items : [{
        	layout:'column',
        	items : [{
        		columnWidth : .5,
            	layout : 'form',
                items : [{
                    xtype : 'textfield',
                    fieldLabel : '菜单ID',
                    name : 'menuId', 
                    editable : false,
                    anchor : '90%' 
                },{                                
                	xtype : 'textfield',
                    fieldLabel : '菜单URL',
                    name : 'menuUrl', 
                    readOnly:true,
                    editable : false,
                    anchor : '90%' 
                },{
                	xtype : 'textfield',
                    fieldLabel : '父级菜单',
                    name : 'menuPname', 
                    readOnly:true,
                    editable : false,
                    anchor : '90%' 
                },{
                	xtype : 'textfield',
                    fieldLabel : '菜单排序',
                    name : 'menuSort', 
                    readOnly:true,
                    editable : false,
                    anchor : '90%' 
                }]
        	},{
                columnWidth : .5,
                layout : 'form',
                items : [{
                	xtype : 'textfield',
                    fieldLabel : '菜单名称',
                    name : 'menuName', 
                    readOnly:true,
                    editable : false,
                    anchor : '90%' 
                },{
                	xtype : 'textfield',
                    fieldLabel : '菜单图标',
                    name : 'menuIcon', 
                    readOnly:true,
                    editable : false,
                    anchor : '90%' 
                },{                                
                	xtype : 'combo',
                    fieldLabel : '菜单状态',
                    labelStyle:{
                        width:'120px'
                    },        
                    name : 'menuState',
                    allowBlank:false,
                    mode:'local',
                    emptyText:'请您选择',
                    store:menuStateStore,
                    triggerAction:'all',
                    valueField:'value',
                    editable : false,
                    displayField:'key',
                    anchor : '90%'
                }]
        	},{
                columnWidth : .5,
                layout : 'form',
                items : [{                                
                	xtype : 'textfield',
                    fieldLabel : '创建时间',
                    name : 'createTime', 
                    readOnly:true,
                    editable : false,
                    anchor : '90%' 
                }]
        	},{
                columnWidth : .5,
                layout : 'form',
                items : [{                                
                	xtype : 'textfield',
                    fieldLabel : '更新时间',
                    name : 'updateTime', 
                    readOnly:true,
                    editable : false,
                    anchor : '90%' 
                }]
        	}]
        },{
            columnWidth : .5,
            layout : 'form',
            items : [{
                xtype : 'htmleditor',
                height : 140,
                fontFamilies : ['宋体','黑体','隶书','微软雅黑','Arial','Courier New','Tahoma','Times New Roman','Verdana'],
                defaultFont: '宋体',
                defaultLinkValue:"http://www.",
                enableAlignments:true,
                enableColors:true,
                enableFont:true,
                enableFontSize:true,
                enableFormat:true,
                enableLinks:true,
                enableLists:true,
                enableSourceEdit:true,
                id:'noticeContentBaby',
                fieldLabel : '菜单描述',
                readOnly:true,
                name : 'menuDesc',
                anchor : '95%' 
            }]
    	}]
    }); 
    /*****************************************   详情detailForm结束  **************************************************/
   
	/*****************************************   详情detailWindow窗口开始  **************************************************/
	var detailWindow = new Ext.Window({
		id:'detailWindow',
		width : 880,
		height :350,
		closable : true,
		resizable : false,
		collapsible : false,
		draggable : true,
		closeAction : 'hide',
		title : '系统菜单详情',
		modal : true, 
		animCollapse : false,
		border : false,
		closable : true,
		animateTarget : Ext.getBody(),
		constrain : true,
		items : [detailForm],
		buttonAlign:'center',
	    buttons : [{
	        text : '关闭',
	        handler : function() {
	    		detailWindow.hide();
	    		dataStore.reload();
	        }
	    }]
	});
	/*****************************************   详情detailWindow窗口结束  **************************************************/
	
	/*****************************************  系统菜单信息表格开始  **************************************************/
    var grid = new Ext.grid.GridPanel({
        title : '系统菜单信息',
        store : dataStore, 
        region : 'center',
        stripeRows : true, 
        border : false,
        tbar : [
            {
	    		text : '新增',
	    		iconCls : 'addIconCss',   //定义图标
	    		handler : function(){	  //调用新增方法
            		editWindow.setTitle("新增系统菜单");
            		editForm.getForm().reset();
	            	editWindow.restore();
	            	editWindow.show();
	    		}
            }, '-', {
        		text : '修改',
    			iconCls : 'editIconCss',
    			handler : function() { 
	            	if(grid.selModel.hasSelection()){
	            		// 得到被选择的行
						var record = grid.getSelectionModel();
						if (record.selections.length>1) {
							Ext.MessageBox.alert('系统提示', '请您选择其中一条记录进行修改!');
							return false;
						} else {
							editWindow.setTitle("修改系统菜单");
			                editForm.getForm().loadRecord(record.getSelected());
			                editWindow.restore();
		            		editWindow.show();
						}
					}else{
						Ext.Msg.alert("系统提示", "请您先选择一条要修改的记录!");
					}
    			}
	    	}, '-', {
	    		text : '删除',
	    		iconCls : 'deleteIconCss',
	    		handler : function() { 
		    		var checkedNodes = grid.getSelectionModel().selections.items;
	                if(checkedNodes.length==0){
	                    Ext.Msg.alert("系统提示", "请您先选择一条要删除的记录!");
	                    return ;
	                }else{
	                	Ext.MessageBox.confirm("系统提示","您确定要删除吗?",
                  	  		function(button,text){  
                                if( button == 'yes'){  
                                	var idStr = "";
        	                        for(var i=0;i<checkedNodes.length;i++){
        	                            var menuId = checkedNodes[i].data.menuId;
        	                            idStr +=menuId+",";
        	                        }
        							Ext.Ajax.request({
        								url : basepath	+ '/sysMenu/sysMenuInfoDelete?idStr=' + idStr,
        								waitTilte : '系统提示',
        								waitMsg : '正在删除数据,请您等待...', // 显示读盘的动画效果,执行完成后效果消失
        								success : function(response) {
        									Ext.Msg.alert("系统提示", response.responseText);
        									dataStore.reload();
        								},
        								failure : function() {
        									Ext.MessageBox.alert('系统提示', '操作失败!');
        								}
        							});
                                }  
                            }   
                        ); 
                    }
				}
	    	}, '-', {
	    		text : '详情', 
	    		iconCls : 'detailIconCss',
	    		handler : function() { 
		    		if(grid.selModel.hasSelection()){
		    			// 得到被选择的行
		    			var _record = grid.getSelectionModel();
						if (_record.selections.length>1) {
							Ext.MessageBox.alert('系统提示', '请您选择其中一条记录进行查看!');
							return false;
						} else {
							detailForm.getForm().loadRecord(_record.getSelected());
							detailWindow.restore();
                    		detailWindow.show();
						}
					}else{
						Ext.Msg.alert("系统提示", "请您先选择一条要查看的记录!");
					}
				}
	    	},'-', {
	    		text : '启用', 
	    		iconCls : 'optionIconCss',
	    		handler : function() { 
		    		if(grid.selModel.hasSelection()){
	    				var idStr = "";
		    			var _record = grid.getSelectionModel().selections.items;
                        for(var i=0;i<_record.length;i++){
                            var menuId = _record[i].data.menuId;
                            idStr +=menuId+",";
                        }
                        Ext.Ajax.request({
							url : basepath	+ '/sysMenu/sysMenuInfoUpdate?idStr=' + idStr+'&menuState=1',
							waitTilte : '系统提示',
							waitMsg : '正在启用数据,请您等待...', // 显示读盘的动画效果,执行完成后效果消失
							success : function(response) {
								Ext.Msg.alert("系统提示", response.responseText);
								dataStore.reload();
							},
							failure : function() {
								Ext.MessageBox.alert('系统提示', '操作失败!');
							}
						});
					}else{
						Ext.Msg.alert("系统提示", "请您先选择一条要启用的记录!");
					}
				}
	    	},'-', {
	    		text : '停用', 
	    		iconCls : 'optionIconCss',
	    		handler : function() { 
		    		if(grid.selModel.hasSelection()){
	    				var idStr = "";
		    			var _record = grid.getSelectionModel().selections.items;
	                    for(var i=0;i<_record.length;i++){
	                        var menuId = _record[i].data.menuId;
	                        idStr +=menuId+",";
	                    }
	                    Ext.Ajax.request({
							url : basepath	+ '/sysMenu/sysMenuInfoUpdate?idStr=' + idStr+'&menuState=0',
							waitTilte : '系统提示',
							waitMsg : '正在停用数据,请您等待...', // 显示读盘的动画效果,执行完成后效果消失
							success : function(response) {
								Ext.Msg.alert("系统提示", response.responseText);
								dataStore.reload();
							},
							failure : function() {
								Ext.MessageBox.alert('系统提示', '操作失败!');
							}
						});
					}else{
						Ext.Msg.alert("系统提示", "请您先选择一条要停用的记录!");
					}
				}
	    	},{
                xtype : 'textfield',
                id:'menuName',	
                name : 'menuName', 
                emptyText : '请您输入要查询的菜单名称',
                anchor : '90%' 
            },{
            	text : '搜索',
            	iconCls : 'searchIconCss',
            	handler : function(){
            		var menuName = Ext.getCmp("menuName").getValue();
            		dataStore.load({
      					params : {
          					start : 0,
          					menuName :menuName,
          					limit : parseInt(pagesize_combo.getValue())
          				}
      				});
            	}
            },{
            	text : '重置',
            	iconCls : 'resetIconCss',
            	handler : function(){
            		Ext.getCmp("menuName").setValue('');
            		dataStore.load({
      					params : {
          					start : 0,
          					limit : parseInt(pagesize_combo.getValue())
          				}
      				});
            	}
            }
    	],
        cm : new Ext.grid.ColumnModel([					//定义列模型
       	        rownum,sm, 
                {header : 'ID',dataIndex : 'menuId',sortable : true/*表示为可在该列上进行排列*/,hidden : true},
                {header : '菜单名称',dataIndex : 'menuName',width : 80,sortable : true},
        	    {header : '菜单URL',dataIndex : 'menuUrl',width : 200,sortable : true},
        	    {header : '菜单图标',dataIndex : 'menuIcon',width : 80,sortable : true},
        	    {header : '菜单父级ID',dataIndex : 'menuPid',width : 80,sortable : true},
        	    {header : '菜单状态',dataIndex : 'menuState',width : 80,sortable : true,
        	    	renderer : function(value){
        	    	  	if(value=="1"){
        	    	  		return "<span style='color:green;'>有效</span>";
        	    	  	}else if( value=="0"){
        	    	  		return "<span style='color:red;'>无效</span>";
        	    	  	}
        	      	}
        	    },
        	    {header : '菜单排序',dataIndex : 'menuSort',width : 80,sortable : true},
        	    {header : '创建时间',dataIndex : 'createTime',width : 100,sortable : true},
        	    {header : '更新时间',dataIndex : 'updateTime',width : 100,sortable : true},
        	    {header : '菜单描述',dataIndex : 'menuDesc',width : 250,sortable : true},
        	    {header : '父级菜单',dataIndex : 'menuPname',width : 80,hidden : true},
    	]),
        sm : sm,		//定义复选框
	    bbar : bbar,
        viewConfig : {
        },
        loadMask : {
            msg : '正在加载表格数据,请您稍等...'
        },
        listeners:{
        	rowdblclick:function(grid,row){
    			var _record = grid.getSelectionModel();
				if (_record.selections.length>1) {
					Ext.MessageBox.alert('系统提示', '请您选择其中一条记录进行查看!');
					return false;
				} else {
					detailForm.getForm().loadRecord(_record.getSelected());
					dataStore.load({
						params : {
							id :_record.getSelected().data.id
                    	},
                    	callback:function(){
                    		detailWindow.show();
                    	}
					});
				}
        	}
        }
    });
    /*****************************************  系统菜单信息表格结束  **************************************************/
    
	/*****************************************   布局模型开始  **************************************************/
	var viewport = new Ext.Viewport({
	    layout:'fit',
	    items:[{
			layout : 'border',
			items: [grid]
	    }]
	});
	/*****************************************   布局模型结束  **************************************************/
});
/********************************************Ext入口函数,相当于java中的主函数结束********************************************/



评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值