未经博主允许，不得转载
上一篇URL：https://blog.csdn.net/gbp_Anl/article/details/80751437
本人登陆界面是在jquery插件库（http://www.jq22.com/）该网站上下载的（花钱的）并做了简易的修改而成，
界面展示如下：

用户名和密码的校验都是通过extjs提供的Ext.Ajax.request实现的，
具体代码如下：

Ext.Ajax.request({
            url:"/extjsSpringM/ajaxVildUser.do",
            mehtod:'POST',
            params:{
                "username":username,
                "password":password
            },
            success : function(response, options) {
                var result = JSON.parse(response.responseText);
                if (result.flag == "false") {
                    Ext.Msg.alert('登陆失败', '原因如下：' +result.msg);
                    return false;
                }  else if (result.flag == "true" && null != result.msg && "" != result.msg) {
                    Ext.Msg.alert('登陆失败', '原因如下：' +result.msg,3000);
                    return false;
                } else {
                    $("#submitForm").submit();
                }
            },

后台对用户输入的用户名密码做校验，检查是否存在该用户，

登陆成功之后，将用户查询得到的实体类包含的所有信息存放到session中，
该信息中包含用户所属的部门等信息（做权限判断是使用），
您也可以将用户权限的信息在登陆成功之后查询得到，全部保存到session中，
后期会做拦截器，对特定的请求作处理，现在暂时就这样了
注意：一定要设置session的过期时间，
用户登陆成功之后，跳转到受页面，登陆失败，登陆界面做提示信息，让重新输入
主界面如下：

登陆成功之后，由于该项目没有使用jsp，使用html，所以不能使用jsp页面的方法将用户登陆之后的信息带回到页面上去，因此用户名的展示使用Ext.Ajax.request回写到主界面
实现方法如下：

Ext.onReady(function(){
    Ext.Ajax.request({
        url:"/extjsSpringM/userAction/getIndexUserModel.do",
        mehtod:'get',
        success : function(response, options) {
            var userModel = JSON.parse(response.responseText);
            var nickname = userModel.nickname;
            $("#clogin").text(nickname);
        },
        failure : function(response, options) {
            $("#clogin").html("<font color='red'>请登陆</font>");
        }
    });
});

重点：菜单树的展示
将所有的代码都卸载Ext.onReady(function(){});中
1.定义model

var model = Ext.define('treeModel',{
        extend:'Ext.data.Model',
        id:"treeModelId",
        fields:[
                {name:'mid',type:'String'},
                {name:'menuCode',type:'String'},
                {name:'text',type:'String'},
                {name:'leaf',type:'boolean'},
                {name:'url',type:'String'},
                {name:'iconCls',type:'String'}
                ]
    });

2.定义store

var indeMenuStore = Ext.create('Ext.data.TreeStore',{
        model:model,
        autoLoad : true,  
        proxy:{
            type:'ajax',
            url:projectName+'/meanAction/showAllTree.do',
            reader:{
                type:'json',
                root: 'root',  //数据
                totalProperty: 'total'
            }
        },
        root : {  
            text : '管理菜单',  
            expanded : true           
        },
        listeners : {  
            'beforeexpand' : function(node,eOpts){  
                //点击父亲节点的菜单会将节点的id通过ajax请求，将到后台  
                //this.proxy.extraParams.mid = node.raw.mid;
                this.proxy.extraParams.mCode = node.raw.menuCode;
            }  
        }  
    });

3.加载菜单树

var leftTree = Ext.create('Ext.tree.Panel',{
        title:'<span style="color:black">基础菜单</span>',
        width:180,
        minWidth:90,
        height:iHBody,//自适应高
        region:'west',
        store:indeMenuStore,
        collapsible: true,
        animate : true,// 动画切换效果
        rootVisible: false,//隐藏根节点
        listeners:{
            itemclick:function(view, record, item, index, e){
                var url = record.raw.url
                var leaf = record.raw.leaf
                var tableid = record.raw.mid
                var text = "<span style='color:black'>"+record.raw.text+"</span>";
                if (leaf) {//创建在主界面上要打开的tab
                    var newTab = Ext.create('Ext.panel.Panel',{
                        id:tableid,
                        title:text,
                        closable : true,
                        html:'<iframe width="100%" height="100%" scrolling="no" frameborder="0" src="'+url+'"></iframe>'
                    });
                    var activeTitle = Ext.getCmp("center_id").getActiveTab().title;
                    var arrayItems = Ext.getCmp("center_id").items.items;
                    for (var i= 0;i < arrayItems.length;i++) {
                        //当已经打开的tab里面存在的时候，再次点击是，切换到点击的tab，不重新打开
                        if (text == arrayItems[i].title){
                            centerMain.setActiveTab(newTab);
                            return;
                        } 
                    }
                    if (text != activeTitle) {
                        centerMain.add(newTab);
                        centerMain.setActiveTab(newTab);
                    }
                }
            },
        scope : this
        }
    });

后端的实现
实现原理：
1，从session中获取得到想要的信息，查询数据库，
2，判断登陆的人是不是超级管理员，
①：假如是：赋予最高权限，操作所有
②：假如不是，从session中获取部门id，查询所对应的菜单
注：菜单在起初加载的时候，只是加载父菜单，并不是把所有的菜单数据拼接成json一起加载出来，当点击父菜单是，通过父菜单的id查询对应的子菜单，而且在对超级管理员做标记时，没有做多余的设置，只是在用户名使用superadmin做标记，后期回做处理
具体代码实现如下：

/**
     * 受页面进去之后加载所有的菜单
     * @param request
     * @return
     * @throws IOException 
     */
    @RequestMapping("meanAction/showAllTree")
    public @ResponseBody List<Map<String,Object>> showAllTree(HttpServletRequest request,
            HttpServletResponse response) throws IOException{
        Map<String,Object> menuMap = new HashMap<>();
        String node = request.getParameter("node");
        String mCode = request.getParameter("mCode");
        if (CommonUtils.isNotEmpty(mCode)){
            int mcodelength = mCode.length();
            menuMap.put("mCode", mCode);
            menuMap.put("mcodelength", mcodelength*2);
        }
        menuMap.put("node", node);
        UserModel user = (UserModel) request.getSession().getAttribute("userModel");
        response.setContentType("text/html;charset=utf-8");
        if (null != user && "superadmin".equals(user.getUsername()) && "root".equals(node)){
            List<Map<String,Object>> superModelMap = meanService.showSuperAllTree(menuMap);
            return superModelMap;
        }else if (null != user && !"root".equals(node)){
            List<Map<String,Object>> superModelMap = meanService.showAllTree(menuMap);
            return superModelMap;
        } else {
            List<DeptModel> deptSessionList = user.getDeptList();
            if (CollectionsUtil.isListNotEmpty(deptSessionList)){
                if (null != node && "root".equals(node)) {
                    List<DeptModel> deptList =deptService.getDeptInfoByUserName(user.getUid());
                    String allDeptId = "";
                    if (CollectionsUtil.isListNotEmpty(deptList)) {
                        for (DeptModel dm :deptList) {
                            int deptid = dm.getDgId();
                            allDeptId +=deptid+",";
                        }
                        logger.error("[showAllTree查询得到的部门id]："+allDeptId);
                        if (CommonUtils.isNotEmpty(allDeptId)) {
                            menuMap.put("deptId", Arrays.asList(allDeptId.split(",")));
                        } else {
                            response.getWriter().print("{\"success\": true,\"flag\":\"true\",\"msg\":\"您还没有任何权限，请联系管理员赋权之后在来！！！\" }");
                            return null;
                        }
                    }
                    logger.error("[查询菜单树时，最后的数据map]:"+menuMap);
                    List<Map<String,Object>> superModelMap = meanService.showAllTree(menuMap);
                    return superModelMap;
                } else {
                    List<Map<String,Object>> superModelMap = meanService.showAllTree(menuMap);
                    return superModelMap;
                }
            } else {
                response.getWriter().print("{\"success\": true,\"flag\":\"true\",\"msg\":\"您还没有任何权限，请联系管理员赋权之后在来！！！\" }");
                return null;
            }
        }
    }

menuMap.put(“mcodelength”, mcodelength*2);这一步的处理是因为在数据库已经对菜单做了限制，最多能增三层，菜单的menuCode的存放格式为：001001001

**后续更新中….
有不足之处，欢迎指正，共同进步**