完成的事情：

后台管理部分的角色管理部分内容

计划的事情：

登录和项目渲染。PPT

问题：

后台管理部分

根据接口要求（去后台），获取了一串json格式的id，然后

var s = (function(){

    var list = res.data.ids;

    var arr;

    for(var i in list){

        if(i==0){

            arr = 'ids='+list[i];

        }else{

            arr += '&ids='+list[i];

        }

    }

    return arr;

})();

转换成“ids=x&ids=X”的数据请求格式，再次去请求详细数据。

再次获得没法好好使用的项目列表数据（没有分级）

for(var i in scope.moduleList){

    if(scope.moduleList[i].parentID == 0 || scope.moduleList[i].parentID == ''){

        scope.vm.setList.push({parent:scope.moduleList[i],state:false,list:[]});

    }

}

for(var i in scope.moduleList){

    var parentID = scope.moduleList[i].parentID;

    var id = scope.moduleList[i].id;

    for(var j in scope.vm.setList){

        if(scope.vm.setList[j].parent.id == parentID){

            scope.moduleList[i].state = false;

            scope.vm.setList[j].list.push(scope.moduleList[i]);

        }

    }

}

先把parentID为0的筛选出来，添加到某个json变量的第一级中，

再以parentID和json变量第一级的id值比较，添加到json变量的第二级，然后得到这样的数据

因为一会的input需要用到true/false的绑定判断，在一级和二级中分别添加state：false

0: Object

    $$hashKey: "object:10"

    list: Array[5]

        0: Object

            createAt: 0

            createBy: ""

            icon: ""

            id: 2

            level: ""

            menuID: "module"

            name: "模块管理"

            parentID: 1

            state: false

            type: "web"

            updateAt: 1489672688060

            updateBy: 72

            url: "field.module"

        1: Object

        2: Object

        3: Object

        4: Object

    parent: Object

    createAt: 0

    createBy: ""

    icon: "fa-gear"

    id: 1

    level: 700

    menuID: "HTG"

    name: "后台管理"

    parentID: 0

    type: "web"

    updateAt: 1492782012151

    updateBy: 44

    url: "field.back"

1: Object

2: Object

3: Object

4: Object

5: Object

6: Object

7: Object

创建一个$scope.saveData储存新增/编辑数据。

然后使用这些数据在html里进行渲染，选择项目布局完成。

<input type="checkbox" ng-model="checkAll" ng-click="checkChange('all',checkAll)" />全选/全不选

<div style="margin-left:50px;" ng-repeat="x in vm.setList">

    <input type="checkbox" ng-model="x.state" ng-click="checkChange('parent',x.state,$index)" />{{x.parent.name}}

    <div style="margin-left:50px;" ng-repeat="y in x.list">

        <input type="checkbox" ng-model="y.state" ng-click="checkChange('child',y.state,$parent.$index,'',y)" />{{y.name}}

        <input type="checkbox" ng-model="saveData.role.permissionsSet[y.id][0]" ng-click="checkChange('list',saveData.role.permissionsSet[y.id],$index,$parent.$index)" style="margin-left:80px;" />新增

        <input type="checkbox" ng-model="saveData.role.permissionsSet[y.id][1]" ng-click="checkChange('list',saveData.role.permissionsSet[y.id],$index,$parent.$index)" />编辑

        <input type="checkbox" ng-model="saveData.role.permissionsSet[y.id][2]" ng-click="checkChange('list',saveData.role.permissionsSet[y.id],$index,$parent.$index)" />删除

    </div>

</div>

针对编辑情况进行处理，请求得到数据后，由于对应的id状态是以'create'、'update'等字符串显示，需要转换成对应位置的，input能够识别的true、false状态，然后就有了下面的一段代码

for(var i in scope.saveData.role.permissionsSet){

    var arr = scope.saveData.role.permissionsSet[i];

    var state = [];

    for(var j in arr){

        switch(arr[j]){

            case 'create':

                state[0] = true;

                break;

            case 'update':

                state[1] = true;

                break;

            case 'delete':

                state[2] = true;

                break;

            case 'sort':

                state[3] = true;

                break;

            default:

                break;

        }

    }

    scope.saveData.role.permissionsSet[i] = state;

}

选择完成后，进行保存操作，还需要转回'create'、'update'等状态，那么就：

for(var i in $scope.saveData.role.permissionsSet){

    var arr = $scope.saveData.role.permissionsSet[i];

    var state = [];

    for(var j in arr){

        console.log(i,arr,arr[j],j);

        if(arr[j] == true){

            switch(j){

                case '0':

                    state.push('create');

                    break;

                case '1':

                    state.push('update');

                    break;

                case '2':

                    state.push('delete');

                    break;

                case '3':

                    if(state.length == 0)arr = [];

                    break;

                default:

                    break;

            }

        }

    }

    if(arr.length>0){state.push('sort');console.log(arr,'add');}

    $scope.saveData.role.permissionsSet[i] = state;

}

至于还有个点击上级项目，下级项目全选的方法，既然表示状态的数据都已经准备到位了，那么使用一个点击事件，分状态实现对应代码即可。

原来还打算实现下级项目选中，上级对应项目也选中的方法，但官网？没有此功能，而且在“编辑”阶段的初始化时候，根据下级内容对上级进行处理的方法比较耗时，就暂时放下这个功能吧。

收获：

复盘项目进度