Browse Source

enable/disable show/hide element if permission is true/false

tags/0.1.0
Robin Thoni 8 years ago
parent
commit
cf58e110aa
3 changed files with 89 additions and 23 deletions
  1. 59
    0
      src/luhaspermission.js
  2. 9
    8
      src/lupermissionsedit.js
  3. 21
    15
      src/lutable.js

+ 59
- 0
src/luhaspermission.js View File

@@ -0,0 +1,59 @@
1
+/**
2
+ * Created by robin on 11/5/15.
3
+ */
4
+
5
+angular.module('luticateUtils')
6
+    .directive('luShowPermission', ['luticateAuthCache',
7
+        function(luticateAuthCache) {
8
+            return {
9
+                restrict: 'A',
10
+                link: function ($scope, element, attrs) {
11
+
12
+                    $scope.$watch(function()
13
+                    {
14
+                        var permissions = luticateAuthCache.getEffectivePermissions();
15
+                        if (permissions == null) {
16
+                            return null;
17
+                        }
18
+                        var permission_name = attrs.luShowPermission;
19
+                        if ($scope[permission_name] != null) {
20
+                            permission_name = $scope[permission_name];
21
+                        }
22
+
23
+                        var value = permissions[permission_name];
24
+                        return value == null ? null : value;
25
+                    }, function(newValue, oldValue)
26
+                    {
27
+                        if (newValue == true) {
28
+                            element.show();
29
+                        }
30
+                        else {
31
+                            element.hide();
32
+                        }
33
+                    })
34
+                }
35
+            };
36
+        }])
37
+    .directive('luEnablePermission', ['luticateAuthCache',
38
+        function(luticateAuthCache) {
39
+            return {
40
+                restrict: 'A',
41
+                scope: {
42
+                    luEnablePermission: '@'
43
+                },
44
+                link: function ($scope, element, attrs) {
45
+
46
+                    $scope.$watch(function() {
47
+                        return luticateAuthCache.hasEffectivePermissions($scope.luEnablePermission);
48
+                    }, function(newValue)
49
+                    {
50
+                        if (newValue == true) {
51
+                            element.removeAttr("disabled");
52
+                        }
53
+                        else {
54
+                            element.attr("disabled", "disabled");
55
+                        }
56
+                    })
57
+                }
58
+            };
59
+        }]);

+ 9
- 8
src/lupermissionsedit.js View File

@@ -20,7 +20,8 @@ angular.module('luticateUtils')
20 20
                         Name: "",
21 21
                         Value: true
22 22
                     };
23
-                    var luModel = $scope.luModel();
23
+                    $scope.luModelOptions = $scope.luModel();
24
+                    console.log();
24 25
 
25 26
                     $scope.editPermission = function(permission, value)
26 27
                     {
@@ -28,7 +29,7 @@ angular.module('luticateUtils')
28 29
                             id: "promiseEditPermission_" + permission.Name,
29 30
                             loaderGroups: ['permission_' + permission.Name]
30 31
                         };
31
-                        luModel.getEditPermissionPromise(permission.Name, value, promiseEditPermission)
32
+                        $scope.luModelOptions.getEditPermissionPromise(permission.Name, value, promiseEditPermission)
32 33
                             .then(function(data)
33 34
                             {
34 35
                                 permission.Value = value;
@@ -41,7 +42,7 @@ angular.module('luticateUtils')
41 42
                             id: "promiseDelPermission_" + permission.Name,
42 43
                             loaderGroups: ['permission_' + permission.Name]
43 44
                         };
44
-                        luModel.getDelPermissionPromise(permission.Name, promiseDelPermission)
45
+                        $scope.luModelOptions.getDelPermissionPromise(permission.Name, promiseDelPermission)
45 46
                             .then(function(data)
46 47
                             {
47 48
                                 $scope.loadPermissions();
@@ -54,7 +55,7 @@ angular.module('luticateUtils')
54 55
                             id: "promiseAddPermission_" + permission.Name,
55 56
                             loaderGroups: ['permission_add']
56 57
                         };
57
-                        luModel.getAddPermissionPromise(permission.Name, permission.Value, promiseAddPermission)
58
+                        $scope.luModelOptions.getAddPermissionPromise(permission.Name, permission.Value, promiseAddPermission)
58 59
                             .then(function(data)
59 60
                             {
60 61
                                 $scope.loadPermissions();
@@ -67,7 +68,7 @@ angular.module('luticateUtils')
67 68
                             id: "promiseLoadPermissions_",
68 69
                             groups: ['permissionList']
69 70
                         };
70
-                        luModel.getGetAllPromise(null, null, promiseLoadPermissions)
71
+                        $scope.luModelOptions.getGetAllPromise(null, null, promiseLoadPermissions)
71 72
                             .then(function (permissions) {
72 73
                                 $scope.permissions = permissions.Data;
73 74
                                 $scope.allPermissionsCleared = [];
@@ -115,7 +116,7 @@ angular.module('luticateUtils').run(['$templateCache', function($templateCache)
115 116
 '    <label class="col-sm-6 control-label">{{ permission.Name }}</label>' +
116 117
 '<div class="col-sm-6">' +
117 118
 '    <div class="btn-group">' +
118
-'    <a class="btn btn-default dropdown-toggle btn-select" data-toggle="dropdown" href="">' +
119
+'    <a class="btn btn-default dropdown-toggle btn-select" data-toggle="dropdown" href="" lu-enable-permission="{{ luModelOptions.permissions.edit }}">' +
119 120
 '    {{ permission.Value ? \'Allow\' : \'Disallow\' }} <span class="caret"></span>' +
120 121
 '    </a>' +
121 122
 '    <ul class="dropdown-menu">' +
@@ -124,7 +125,7 @@ angular.module('luticateUtils').run(['$templateCache', function($templateCache)
124 125
 '</ul>' +
125 126
 '</div>' +
126 127
 '<div class="btn-group">' +
127
-'    <button type="button" class="btn btn-default" ng-click="delPermission(permission)">' +
128
+'    <button type="button" class="btn btn-default" ng-click="delPermission(permission)" lu-show-permission="{{ luModelOptions.permissions.del }}">' +
128 129
 '    <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>' +
129 130
 '    </button>' +
130 131
 '    </div>' +
@@ -132,7 +133,7 @@ angular.module('luticateUtils').run(['$templateCache', function($templateCache)
132 133
 '    </div>' +
133 134
 '    </div>' +
134 135
 '    <div class="clearfix"></div>' +
135
-'    <div class="col-sm-12" lu-busy="permission_add">' +
136
+'    <div class="col-sm-12" lu-busy="permission_add" lu-show-permission="{{ luModelOptions.permissions.add }}">' +
136 137
 '    <div class="btn-group">' +
137 138
 '    <a class="btn btn-default dropdown-toggle btn-select" data-toggle="dropdown" href="">' +
138 139
 '    {{ tmpPermission.Name }} <span class="caret"></span>' +

+ 21
- 15
src/lutable.js View File

@@ -7,6 +7,9 @@ angular.module('luticateUtils')
7 7
         function(dialogs, luticateDialogErrorHelper) {
8 8
             return {
9 9
                 restrict: 'E',
10
+                scope: {
11
+                    options: '&'
12
+                },
10 13
                 templateUrl: "/luticate/lutable.html",
11 14
                 link: function ($scope, element, attrs) {
12 15
                     $scope.page = 0;
@@ -15,6 +18,8 @@ angular.module('luticateUtils')
15 18
                     $scope.pages = [];
16 19
                     $scope.selectedItems = [];
17 20
 
21
+                    $scope.tableOptions = $scope.options();
22
+
18 23
                     var promiseLoadItems = {
19 24
                         id: "promiseLoadItems",
20 25
                         groups: ['itemList']
@@ -25,7 +30,7 @@ angular.module('luticateUtils')
25 30
                     };
26 31
 
27 32
                     $scope.loadPage = function (page) {
28
-                        $scope.getLoadPagePromise(page, $scope.perPage, promiseLoadItems)
33
+                        $scope.tableOptions.getLoadPagePromise(page, $scope.perPage, promiseLoadItems)
29 34
                             .then(function (items) {
30 35
                                 $scope.page = page;
31 36
                                 $scope.items = items;
@@ -40,7 +45,7 @@ angular.module('luticateUtils')
40 45
                     };
41 46
 
42 47
                     $scope.displayItem = function (item) {
43
-                        var ctrl = $scope.getEditController();
48
+                        var ctrl = $scope.tableOptions.getEditController();
44 49
                         dialogs.create('views/modals/' + ctrl.toLowerCase() + '.html', ctrl + 'Controller', item)
45 50
                             .result.then(function (data) {
46 51
                                 $scope.loadPage($scope.page);
@@ -52,7 +57,7 @@ angular.module('luticateUtils')
52 57
                             $scope.loadPage($scope.page);
53 58
                             return;
54 59
                         }
55
-                        $scope.getDelPromise($scope.selectedItems[0], promiseDelItems)
60
+                        $scope.tableOptions.getDelPromise($scope.selectedItems[0], promiseDelItems)
56 61
                             .then(function (data) {
57 62
                                 $scope.selectedItems.splice(0, 1);
58 63
                                 $scope.removeItems();
@@ -66,7 +71,7 @@ angular.module('luticateUtils')
66 71
                     };
67 72
 
68 73
                     $scope.addItem = function () {
69
-                        var ctrl = $scope.getEditController();
74
+                        var ctrl = $scope.tableOptions.getEditController();
70 75
                         dialogs.create('views/modals/' + ctrl.toLowerCase() + '.html', ctrl + 'Controller', null)
71 76
                             .result.then(function (data) {
72 77
                                 $scope.loadPage($scope.page);
@@ -74,7 +79,7 @@ angular.module('luticateUtils')
74 79
                     };
75 80
 
76 81
                     $scope.toggleSelectedItem = function (item) {
77
-                        var id = $scope.getItemId(item);
82
+                        var id = $scope.tableOptions.getItemId(item);
78 83
                         var idx = $scope.selectedItems.indexOf(id);
79 84
                         if (idx > -1) {
80 85
                             $scope.selectedItems.splice(idx, 1);
@@ -91,18 +96,18 @@ angular.module('luticateUtils')
91 96
                         else {
92 97
                             $scope.selectedItems = [];
93 98
                             for (var i = 0; i < $scope.items.Data.length; ++i) {
94
-                                $scope.selectedItems.push($scope.getItemId($scope.items.Data[i]));
99
+                                $scope.selectedItems.push($scope.tableOptions.getItemId($scope.items.Data[i]));
95 100
                             }
96 101
                         }
97 102
                     };
98 103
 
99 104
                     $scope.isItemChecked = function(item)
100 105
                     {
101
-                        return $scope.selectedItems.indexOf($scope.getItemId(item)) > -1;
106
+                        return $scope.selectedItems.indexOf($scope.tableOptions.getItemId(item)) > -1;
102 107
                     };
103 108
 
104
-                    if (!$scope.getItemId) {
105
-                        $scope.getItemId = function(item)
109
+                    if (!$scope.tableOptions.getItemId) {
110
+                        $scope.tableOptions.getItemId = function(item)
106 111
                         {
107 112
                             return item.Id;
108 113
                         };
@@ -120,20 +125,20 @@ angular.module('luticateUtils').run(['$templateCache', function($templateCache)
120 125
 '        <table class="col-sm-12 table table-hover">' +
121 126
 '    <thead>' +
122 127
 '    <tr>' +
123
-'    <th>' +
128
+'    <th lu-show-permission="{{ tableOptions.permissions.del }}">' +
124 129
 '    <input type="checkbox" ng-click="toggleSelectAll()"' +
125 130
 '    ng-checked="selectedItems.length == items.Data.length && items.Data.length != 0">' +
126 131
 '        </th>' +
127
-'        <th class="col-sm-{{ col.width }}" ng-repeat="col in columns">{{ col.name }}</th>' +
132
+'        <th class="col-sm-{{ col.width }}" ng-repeat="col in tableOptions.columns">{{ col.name }}</th>' +
128 133
 '</tr>' +
129 134
 '</thead>' +
130 135
 '<tbody>' +
131 136
 '<tr ng-repeat="item in items.Data" style="cursor: pointer" ng-click="displayItem(item)">' +
132
-'    <td>' +
137
+'    <td lu-show-permission="{{ tableOptions.permissions.del }}">' +
133 138
 '    <input name="selectedItems[]" type="checkbox" ng-checked="isItemChecked(item)"' +
134 139
  '   ng-click="$event.stopPropagation();toggleSelectedItem(item)" >' +
135 140
 '        </td>' +
136
-'        <td ng-repeat="col in columns">{{ col.getValue(item) }}</td>' +
141
+'        <td ng-repeat="col in tableOptions.columns">{{ col.getValue(item) }}</td>' +
137 142
 '</tr>' +
138 143
 '</tbody>' +
139 144
 '</table>' +
@@ -143,10 +148,11 @@ angular.module('luticateUtils').run(['$templateCache', function($templateCache)
143 148
 '</div>' +
144 149
 
145 150
 '<div class="col-sm-12">' +
146
-'    <button class="btn btn-default" type="button" ng-click="removeItems()" ng-disabled="selectedItems.length == 0">' +
151
+'    <button class="btn btn-default" type="button" ng-click="removeItems()"' +
152
+'ng-disabled="selectedItems.length == 0" lu-show-permission="{{ tableOptions.permissions.del }}">' +
147 153
 '    <span class="glyphicon glyphicon-remove" aria-hidden="true"></span> Remove' +
148 154
 '    </button>' +
149
-'    <button class="btn btn-default" type="button" ng-click="addItem()">' +
155
+'    <button class="btn btn-default" type="button" ng-click="addItem()" lu-show-permission="{{ tableOptions.permissions.add }}">' +
150 156
 '    <span class="glyphicon glyphicon-plus" aria-hidden="true"></span> Add' +
151 157
 '    </button>' +
152 158
 '    </div>' +

Loading…
Cancel
Save