diff --git a/public/app/core/components/user_picker.ts b/public/app/core/components/user_picker.ts index aee1e6e4348..b0310de3bae 100644 --- a/public/app/core/components/user_picker.ts +++ b/public/app/core/components/user_picker.ts @@ -7,37 +7,35 @@ const template = ` `; export class UserPickerCtrl { user: any; - userId: number; debouncedSearchUsers: any; + userPicked: any; /** @ngInject */ constructor(private backendSrv, private $scope, $sce) { - this.user = {text: 'Choose', value: null}; + this.reset(); this.debouncedSearchUsers = _.debounce(this.searchUsers, 500, {'leading': true, 'trailing': false}); } searchUsers(query: string) { return Promise.resolve(this.backendSrv.get('/api/users/search?perpage=10&page=1&query=' + query).then(result => { return _.map(result.users, user => { - return {text: user.login + ' - ' + user.email, value: user.id}; + return {text: user.login + ' - ' + user.email, value: user}; }); })); } - onChange() { - this.userId = this.user.value; + onChange(option) { + this.userPicked({$user: option.value}); } - userIdChanged() { - if (this.userId === null) { - this.user = {text: 'Choose', value: null}; - } + reset() { + this.user = {text: 'Choose', value: null}; } } @@ -56,11 +54,11 @@ export function userPicker() { bindToController: true, controllerAs: 'ctrl', scope: { - userId: '=', + userPicked: '&', }, link: function(scope, elem, attrs, ctrl) { - scope.$watch("ctrl.userId", (newVal, oldVal) => { - ctrl.userIdChanged(newVal); + scope.$on("user-picker-reset", () => { + ctrl.reset(); }); } }; diff --git a/public/app/features/dashboard/acl/acl.html b/public/app/features/dashboard/acl/acl.html index b9f4a11b5c0..02727459a38 100644 --- a/public/app/features/dashboard/acl/acl.html +++ b/public/app/features/dashboard/acl/acl.html @@ -1,4 +1,4 @@ -
+

@@ -10,111 +10,118 @@

-
- - - - - - - - - - - - - - - - - - - - - - - - - - +
+
- - + + + +
can... - - {{acl.permissionName}} - - + Can +
+ +
- +
+ No permission, will only accessable by admins. +
+ +
Add Permission For
+
+
+
+ +
+
+
+ User + +
+
+ User Group + +
+
+ Can +
+ +
+
+
+ +
+
+
- + Close
- -
+
+ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/app/features/dashboard/acl/acl.ts b/public/app/features/dashboard/acl/acl.ts index 069cbfa4704..87249f8891f 100644 --- a/public/app/features/dashboard/acl/acl.ts +++ b/public/app/features/dashboard/acl/acl.ts @@ -13,14 +13,16 @@ export class AclCtrl { {value: 4, text: 'Admin'} ]; - type = 'User Group'; - permission = 1; - userId: number; - userGroupId: number; + newType: string; + newAcl: DashboardAcl; + canUpdate: boolean; /** @ngInject */ - constructor(private backendSrv, private dashboardSrv, private $sce) { + constructor(private backendSrv, private dashboardSrv, private $sce, private $scope) { this.aclItems = []; + this.newType = 'User Group'; + this.resetNew(); + this.dashboard = dashboardSrv.getCurrent(); this.get(this.dashboard.id); } @@ -28,72 +30,57 @@ export class AclCtrl { get(dashboardId: number) { return this.backendSrv.get(`/api/dashboards/id/${dashboardId}/acl`) .then(result => { - this.aclItems = _.map(result, item => { - if (item.userId > 0) { - item.icon = "fa fa-fw fa-user"; - item.nameHtml = this.$sce.trustAsHtml(item.userLogin); - } else if (item.userGroupId > 0) { - item.icon = "fa fa-fw fa-users"; - item.nameHtml = this.$sce.trustAsHtml(item.userGroup); - } else if (item.role) { - item.icon = "fa fa-fw fa-street-view"; - item.nameHtml = this.$sce.trustAsHtml(`Everyone with ${item.role} Role`); - } - return item; - }); + this.aclItems = _.map(result, this.prepareViewModel.bind(this)); }); } + prepareViewModel(item: DashboardAcl): DashboardAcl { + if (item.userId > 0) { + item.icon = "fa fa-fw fa-user"; + item.nameHtml = this.$sce.trustAsHtml(item.userLogin); + } else if (item.userGroupId > 0) { + item.icon = "fa fa-fw fa-users"; + item.nameHtml = this.$sce.trustAsHtml(item.userGroup); + } else if (item.role) { + item.icon = "fa fa-fw fa-street-view"; + item.nameHtml = this.$sce.trustAsHtml(`Everyone with ${item.role} Role`); + } + + return item; + } + addPermission() { - if (this.type === 'User') { - if (!this.userId) { - return; - } - return this.addOrUpdateUserPermission(this.userId, this.permission).then(() => { - this.userId = null; - return this.get(this.dashboard.id); - }); - } else { - if (!this.userGroupId) { - return; - } - - return this.addOrUpdateUserGroupPermission(this.userGroupId, this.permission).then(() => { - this.userGroupId = null; - return this.get(this.dashboard.id); - }); - } + this.aclItems.push(this.prepareViewModel(this.newAcl)); + this.$scope.$broadcast('user-picker-reset'); + this.$scope.$broadcast('user-group-picker-reset'); } - addOrUpdateUserPermission(userId: number, permissions: number) { + resetNew() { + this.newAcl = { + userId: 0, + userGroupId: 0, + permission: 1 + }; + } + + update() { return this.backendSrv.post(`/api/dashboards/id/${this.dashboard.id}/acl`, { - userId: userId, - permissions: permissions + acl: this.aclItems }); } - addOrUpdateUserGroupPermission(userGroupId: number, permissions: number) { - return this.backendSrv.post(`/api/dashboards/id/${this.dashboard.id}/acl`, { - userGroupId: userGroupId, - permissions: permissions - }); + permissionChanged() { + this.canUpdate = true; } - updatePermission(permission: DashboardAcl) { - if (permission.userId > 0) { - return this.addOrUpdateUserPermission(permission.userId, permission.permissions); - } else { - if (!permission.userGroupId) { - return; - } - return this.addOrUpdateUserGroupPermission(permission.userGroupId, permission.permissions); - } + userPicked(user) { + this.newAcl.userLogin = user.login; + this.newAcl.userId = user.id; } - removePermission(permission: DashboardAcl) { - return this.backendSrv.delete(`/api/dashboards/id/${permission.dashboardId}/acl/${permission.id}`).then(() => { - return this.get(permission.dashboardId); - }); + removeItem(index) { + this.aclItems.splice(index, 1); + this.canUpdate = true; } } @@ -118,18 +105,18 @@ export interface FormModel { } export interface DashboardAcl { - id: number; - orgId: number; - dashboardId: number; - created: Date; - updated: Date; + id?: number; + dashboardId?: number; userId: number; - userLogin: number; - userEmail: string; + userLogin?: number; + userEmail?: string; userGroupId: number; - userGroup: string; - permissions: number; - permissionName: string; + userGroup?: string; + permission?: number; + permissionName?: string; + role?: string; + icon?: string; + nameHtml?: string; } coreModule.directive('dashAclModal', dashAclModal);