@ -43,18 +43,27 @@
< legend class = "px-1 h5 mb-0" >
{{ 'AbpPermissionManagement::PermissionGroup' | abpLocalization }}
< / legend >
< div class = "row" >
< div class = "row" ngTabs orientation = "vertical" >
< div class = "col-md-4" >
< div class = "overflow-auto lpx-scroll-pills-container scroll-in-modal" >
< ul class = "nav nav-pills flex-column" >
< div
class="overflow-auto lpx-scroll-pills-container scroll-in-modal"
ngTabList
orientation="vertical"
selectionMode="follow"
[selectedTab]="selectedGroup?.name"
(selectedTabChange)="onTabChange($event)"
>
< div class = "nav nav-pills flex-column" >
@for (group of permissionGroups(); track $index) {
< li class = "border nav-item" >
< div class = "border nav-item" >
@if ({ assignedCount: getAssignedCount(group.name) }; as count) {
< a
class="nav-link pointer"
[class.active]="selectedGroup?.name === group?.name"
(click)="onChangeGroup(group)"
(select)="setDisabled(group.permissions)"
< button
ngTab
[value]="group.name"
class="nav-link pointer text-start w-100"
#tab="ngTab"
[class.active]="tab.selected()"
type="button"
>
< div [ class . font-weight-bold ] = " count . assignedCount " >
{{ group?.displayName }}
@ -62,59 +71,65 @@
< span > ({{ count.assignedCount }})< / span >
}
< / div >
< / a >
< / button >
}
< / li >
< / div >
}
< / ul >
< / div >
< / div >
< / div >
< div class = "col-md-8 scroll-in-modal" >
< div class = "ps-1" >
@if (selectedGroupPermissions.length) {
< div class = "form-check mb-2" >
< input
#selectAllInThisTabsRef
type="checkbox"
id="select-all-in-this-tabs"
name="select-all-in-this-tabs"
class="form-check-input"
[(ngModel)]="selectThisTab"
[disabled]="disableSelectAllTab"
(click)="onClickSelectThisTab()"
/>
< label class = "form-check-label" for = "select-all-in-this-tabs" > {{
'AbpPermissionManagement::SelectAllInThisTab' | abpLocalization
}}< / label >
< / div >
< hr class = "my-2" / >
@for (permission of selectedGroupPermissions; track $index; let i = $index) {
< div [ ngStyle ] = " permission . style " class = "form-check mb-2" >
< input
#permissionCheckbox
type="checkbox"
[checked]="getChecked(permission.name)"
[value]="getChecked(permission.name)"
[attr.id]="permission.name"
class="form-check-input"
[disabled]="isGrantedByOtherProviderName(permission.grantedProviders)"
(click)="onClickCheckbox(permission, permissionCheckbox.value)"
/>
< label class = "form-check-label" [ attr . for ] = " permission . name "
>{{ permission.displayName }}
@if (!hideBadges) {
@for (provider of permission.grantedProviders; track $index) {
< span class = "badge bg-primary text-dark"
>{{ provider.providerName }}: {{ provider.providerKey }}< /span
>
}
@for (group of permissionGroups(); track $index) {
< div ngTabPanel [ value ] = " group . name " >
< ng-template ngTabContent >
< div class = "ps-1" >
@if (selectedGroupPermissions.length) {
< div class = "form-check mb-2" >
< input
#selectAllInThisTabsRef
type="checkbox"
id="select-all-in-this-tabs"
name="select-all-in-this-tabs"
class="form-check-input"
[(ngModel)]="selectThisTab"
[disabled]="disableSelectAllTab"
(click)="onClickSelectThisTab()"
/>
< label class = "form-check-label" for = "select-all-in-this-tabs" > {{
'AbpPermissionManagement::SelectAllInThisTab' | abpLocalization
}}< / label >
< / div >
< hr class = "my-2" / >
@for (permission of selectedGroupPermissions; track $index; let i = $index) {
< div [ ngStyle ] = " permission . style " class = "form-check mb-2" >
< input
#permissionCheckbox
type="checkbox"
[checked]="getChecked(permission.name)"
[value]="getChecked(permission.name)"
[attr.id]="permission.name"
class="form-check-input"
[disabled]="isGrantedByOtherProviderName(permission.grantedProviders)"
(click)="onClickCheckbox(permission, permissionCheckbox.value)"
/>
< label class = "form-check-label" [ attr . for ] = " permission . name "
>{{ permission.displayName }}
@if (!hideBadges) {
@for (provider of permission.grantedProviders; track $index) {
< span class = "badge bg-primary text-dark"
>{{ provider.providerName }}: {{ provider.providerKey }}< /span
>
}
}
< / label >
< / div >
}
< / label >
}
< / div >
}
}
< / div >
< / ng-template >
< / div >
}
< / div >
< / div >
< / fieldset >