luticate
/
front-utils
Volgen 1
Ster 0
Vork 0
Code Kwesties 0 Pull-aanvragen 0 Publicaties 14 Wiki Activiteit
Bladeren bron

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

tags/0.1.0
Robin Thoni 9 jaren geleden
bovenliggende
104c8bae0e
commit
cf58e110aa
3 gewijzigde bestanden met toevoegingen van 89 en 23 verwijderingen
Zij-aan-zij weergave Toon Diff Stats
  1. 59
    0
      src/luhaspermission.js
  2. 9
    8
      src/lupermissionsedit.js
  3. 21
    15
      src/lutable.js

+ 59
- 0
src/luhaspermission.js Bestand weergeven 

@@ -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 Bestand weergeven 

@@ -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 Bestand weergeven 

@@ -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>' +

Schrijf Voorbeeld
Laden…
Annuleren
Opslaan