Merge pull request #10816 from abpframework/fix/10774

fix permission click

npm/ng-packs/packages/permission-management/src/lib/components/permission-management.component.html

@@ -73,11 +73,9 @@
                 [attr.id]="permission.name"
                 class="form-check-input"
                 [disabled]="isGrantedByOtherProviderName(permission.grantedProviders)"
-              />
-              <label
-                class="form-check-label"
-                [attr.for]="permission.name"
                 (click)="onClickCheckbox(permission, permissionCheckbox.value)"
+              />
+              <label class="form-check-label" [attr.for]="permission.name"
                 >{{ permission.displayName }}
                 <ng-container *ngIf="!hideBadges">
                   <span

npm/ng-packs/packages/permission-management/src/lib/components/permission-management.component.ts

@@ -26,6 +26,10 @@ type PermissionWithStyle = PermissionGrantInfoDto & {
   style: string;
 };
 
+type PermissionWithGroupName = PermissionGrantInfoDto & {
+  groupName: string;
+};
+
 @Component({
   selector: 'abp-permission-management',
   templateUrl: './permission-management.component.html',
@@ -91,7 +95,7 @@ export class PermissionManagementComponent
 
   selectedGroup: PermissionGroupDto;
 
-  permissions: PermissionGrantInfoDto[] = [];
+  permissions: PermissionWithGroupName[] = [];
 
   selectThisTab = false;
 
@@ -277,7 +281,7 @@ export class PermissionManagementComponent
 
   getAssignedCount(groupName: string) {
     return this.permissions.reduce(
-      (acc, val) => (val.name.split('.')[0] === groupName && val.isGranted ? acc + 1 : acc),
+      (acc, val) => (val.groupName === groupName && val.isGranted ? acc + 1 : acc),
       0,
     );
   }
@@ -304,6 +308,9 @@ function findMargin(permissions: PermissionGrantInfoDto[], permission: Permissio
   return parentPermission ? 20 : 0;
 }
 
-function getPermissions(groups: PermissionGroupDto[]): PermissionGrantInfoDto[] {
+function getPermissions(groups: PermissionGroupDto[]): PermissionWithGroupName[] {
-  return groups.reduce((acc, val) => [...acc, ...val.permissions], []);
+  return groups.reduce(
+    (acc, val) => [...acc, ...val.permissions.map(p => ({ ...p, groupName: val.name }))],
+    [],
+  );
 }