From e3ac749fde3d0ac65090451d08fb927f1ed6ca3d Mon Sep 17 00:00:00 2001 From: muhammedaltug Date: Fri, 20 Jan 2023 11:59:04 +0300 Subject: [PATCH 1/2] change html structure update grant checkbox state based on changeable permissions --- .../permission-management.component.html | 75 ++++++++++--------- .../permission-management.component.ts | 44 +++++++---- 2 files changed, 68 insertions(+), 51 deletions(-) diff --git a/npm/ng-packs/packages/permission-management/src/lib/components/permission-management.component.html b/npm/ng-packs/packages/permission-management/src/lib/components/permission-management.component.html index c7d29c190f..2d95ede2d7 100644 --- a/npm/ng-packs/packages/permission-management/src/lib/components/permission-management.component.html +++ b/npm/ng-packs/packages/permission-management/src/lib/components/permission-management.component.html @@ -7,45 +7,46 @@ -
- - -
- -
-
- +
+
+ + +
+ +
+
+ +
-

{{ selectedGroup?.displayName }}

-
-
+
-
+
= (_, item) => item.name; @@ -137,13 +139,13 @@ export class PermissionManagementComponent return (this.permissions.find(per => per.name === name) || { isGranted: false }).isGranted; } - setDisabled(grantedProviders) { - if (grantedProviders.length) { - grantedProviders.forEach(permission => { - this.disableSelectAllTab = permission.grantedProviders?.some( - p => p.providerName !== this.providerName, - ); - }); + setDisabled(permissions: PermissionGrantInfoDto[]) { + if (permissions.length) { + this.disableSelectAllTab = permissions.every( + permission => + permission.isGranted && + permission.grantedProviders?.every(p => p.providerName !== this.providerName), + ); } else { this.disableSelectAllTab = false; } @@ -180,10 +182,13 @@ export class PermissionManagementComponent } setTabCheckboxState() { - const selectedPermissions = this.selectedGroupPermissions.filter(per => per.isGranted); + const selectableGroupPermissions = this.selectedGroupPermissions.filter(per => + per.grantedProviders.every(p => p.providerName === this.providerName), + ); + const selectedPermissions = selectableGroupPermissions.filter(per => per.isGranted); const element = document.querySelector('#select-all-in-this-tabs') as any; - if (selectedPermissions.length === this.selectedGroupPermissions.length) { + if (selectedPermissions.length === selectableGroupPermissions.length) { element.indeterminate = false; this.selectThisTab = true; } else if (selectedPermissions.length === 0) { @@ -195,10 +200,13 @@ export class PermissionManagementComponent } setGrantCheckboxState() { - const selectedAllPermissions = this.permissions.filter(per => per.isGranted); + const selectablePermissions = this.permissions.filter(per => + per.grantedProviders.every(p => p.providerName === this.providerName), + ); + const selectedAllPermissions = selectablePermissions.filter(per => per.isGranted); const checkboxElement = document.querySelector('#select-all-in-all-tabs') as any; - if (selectedAllPermissions.length === this.permissions.length) { + if (selectedAllPermissions.length === selectablePermissions.length) { checkboxElement.indeterminate = false; this.selectAllTab = true; } else if (selectedAllPermissions.length === 0) { @@ -232,8 +240,10 @@ export class PermissionManagementComponent isGranted: this.isGrantedByOtherProviderName(permission.grantedProviders) || !this.selectAllTab, })); - - this.selectThisTab = !this.selectAllTab; + if (!this.disableSelectAllTab) { + this.selectThisTab = !this.selectAllTab; + this.setTabCheckboxState(); + } } onChangeGroup(group: PermissionGroupDto) { @@ -283,6 +293,12 @@ export class PermissionManagementComponent this.data = permissionRes; this.selectedGroup = permissionRes.groups[0]; this.permissions = getPermissions(permissionRes.groups); + this.disabledSelectAllInAllTabs = this.permissions.every( + per => + per.isGranted && + per.grantedProviders.every(provider => provider.providerName !== this.providerName), + ); + console.log(this.permissions, this.disabledSelectAllInAllTabs); }), ); } @@ -290,7 +306,7 @@ export class PermissionManagementComponent initModal() { // TODO: Refactor setTimeout(() => { - this.setDisabled(this.permissions); + this.setDisabled(this.selectedGroup.permissions); this.setTabCheckboxState(); this.setGrantCheckboxState(); }); From de688d6702fcf87513387bb469e54ddddd5a4b36 Mon Sep 17 00:00:00 2001 From: muhammedaltug Date: Fri, 20 Jan 2023 12:00:39 +0300 Subject: [PATCH 2/2] remove console --- .../permission-management.component.ts | 19 +++++++++---------- 1 file changed, 9 insertions(+), 10 deletions(-) diff --git a/npm/ng-packs/packages/permission-management/src/lib/components/permission-management.component.ts b/npm/ng-packs/packages/permission-management/src/lib/components/permission-management.component.ts index 7e17e946ee..35380fe47c 100644 --- a/npm/ng-packs/packages/permission-management/src/lib/components/permission-management.component.ts +++ b/npm/ng-packs/packages/permission-management/src/lib/components/permission-management.component.ts @@ -1,13 +1,13 @@ -import { ConfigStateService, CurrentUserDto } from '@abp/ng.core'; +import { ConfigStateService, CurrentUserDto } from "@abp/ng.core"; import { GetPermissionListResultDto, PermissionGrantInfoDto, PermissionGroupDto, PermissionsService, ProviderInfoDto, - UpdatePermissionDto, -} from '@abp/ng.permission-management/proxy'; -import { LocaleDirection } from '@abp/ng.theme.shared'; + UpdatePermissionDto +} from "@abp/ng.permission-management/proxy"; +import { LocaleDirection } from "@abp/ng.theme.shared"; import { Component, ElementRef, @@ -16,11 +16,11 @@ import { Output, QueryList, TrackByFunction, - ViewChildren, -} from '@angular/core'; -import { concat, of } from 'rxjs'; -import { finalize, switchMap, take, tap } from 'rxjs/operators'; -import { PermissionManagement } from '../models/permission-management'; + ViewChildren +} from "@angular/core"; +import { concat, of } from "rxjs"; +import { finalize, switchMap, take, tap } from "rxjs/operators"; +import { PermissionManagement } from "../models/permission-management"; type PermissionWithStyle = PermissionGrantInfoDto & { style: string; @@ -298,7 +298,6 @@ export class PermissionManagementComponent per.isGranted && per.grantedProviders.every(provider => provider.providerName !== this.providerName), ); - console.log(this.permissions, this.disabledSelectAllInAllTabs); }), ); }