权限概览

将底部导航栏tabs中的元素tab-item，和进入tab页签后的超链接作为授权的单位。

图片.png

实现思路

用户登录时，通过login服务查询用户权限（以json格式表示）。前台通过ng-if控制页面权限元素的展示。

后台代码

登录返回的权限数据格式 ：

ifsuccess表示账号密码是否通过验证，modules表示用户权限数据，1表示有权，0表示无权限。

{    
    "ifsuccess":1,
    "modules":{
        "tabHome":1,
        "tabChat":1,
           "chat1":0,
           "chat2":1,
            "char3":1,  
     "tabSetting":1,
          "setting1":1,
           "setting2":0,
           "setting3":1,     
     "tabTest":0
        }
    }

控制器代码：

app.js 添加控制器

.state('tab',{
  ...
  controller:'tabCtrl'
})

controller.js 实现控制器,包括tabCtrl和LoginCtrl

.controller('tabCtrl',function($scope,config) {
  $scope.moudles = config.modules;
}
.controller('LoginCtrl',function($scope,localStorage,utilFun,Login,$state,config) {
     Login.LOGIN(params).then(function (response) { //Login.LOGIN方法实现在service.js
          console.log(response);          
          if (angular.isObject(response)) {
            var data = response.data;
            if (data.ifsuccess === 1) {
              loginInfo.remUser = $scope.loginInfo.remUser;
              loginInfo.remPass = $scope.loginInfo.remPass;
              config.USER = $scope.loginInfo.userName;
              config.PWD=$scope.loginInfo.userPass;
              if ($scope.loginInfo.remUser) {//记住用户名
                loginInfo.userName = $scope.loginInfo.userName;
              } else {
                loginInfo.userName = '';
              }
              if ($scope.loginInfo.remPass) {//记住密码
                loginInfo.userPass = $scope.loginInfo.userPass;
              } else {
                loginInfo.userPass = '';
              }
              loginInfo.host=$scope.loginInfo.host;
              localStorage.setObject('loginInfo', loginInfo);//存储用户登录信息
              //保存权限信息
              config.modules=data.modules;   
              //跳转到首页
              $state.go('tab.home');
           else  {//登录失败
              $scope.loginInfo.userPass = '';
              // toast.show("用户名或者密码错误", "center");
           }
    });  
}

前台控制展示

<ion-tab title="chat" href="#tab/chats" ng-if="module.tabChat ===1">
...
</ion-tab>

-----------------------------------------------------------------------------

That's all