tsai
/
abp
mirror of https://github.com/abpframework/abp.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

update: identity package for the latest upgrade (state management and html properties)

pull/25690/head
sumeyye 4 months ago
parent
2e949642a4
commit
b94e77e0b9
5 changed files with 60 additions and 76 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      npm/ng-packs/packages/identity/project.json
  2. 39
      npm/ng-packs/packages/identity/src/lib/components/roles/roles.component.html
  3. 38
      npm/ng-packs/packages/identity/src/lib/components/roles/roles.component.ts
  4. 32
      npm/ng-packs/packages/identity/src/lib/components/users/users.component.html
  5. 25
      npm/ng-packs/packages/identity/src/lib/components/users/users.component.ts

2
npm/ng-packs/packages/identity/project.json
View File

@ -31,7 +31,7 @@
"executor": "@nx/vitest:test", "executor": "@nx/vitest:test",
"outputs": ["{options.reportsDirectory}"], "outputs": ["{options.reportsDirectory}"],
"options": { "options": {
"reportsDirectory": "../../coverage/packages/identity" "reportsDirectory": "{projectRoot}/../../coverage/packages/identity"
} }
} }
} }

39
npm/ng-packs/packages/identity/src/lib/components/roles/roles.component.html
View File

@ -1,11 +1,11 @@
<abp-page [title]="'AbpIdentity::Roles' | abpLocalization" [toolbar]="data.items"> <abp-page [title]="'AbpIdentity::Roles' | abpLocalization" [toolbar]="data().items">
<div id="identity-roles-wrapper" class="card"> <div id="identity-roles-wrapper" class="card">
<div class="card-body"> <div class="card-body">
<abp-extensible-table <abp-extensible-table
[data]="data.items" [data]="data().items"
[recordsTotal]="data.totalCount" [recordsTotal]="data().totalCount"
[list]="list" [list]="list"
></abp-extensible-table> />
</div> </div>
</div> </div>
@ -16,7 +16,7 @@
<ng-template #abpBody> <ng-template #abpBody>
<form [formGroup]="form" (ngSubmit)="save()" [validateOnSubmit]="true"> <form [formGroup]="form" (ngSubmit)="save()" [validateOnSubmit]="true">
<abp-extensible-form [selectedRecord]="selected"></abp-extensible-form> <abp-extensible-form [selectedRecord]="selected" />
</form> </form>
</ng-template> </ng-template>
@ -26,26 +26,25 @@
</button> </button>
<abp-button iconClass="fa fa-check" [disabled]="form?.invalid" (click)="save()">{{ <abp-button iconClass="fa fa-check" [disabled]="form?.invalid" (click)="save()">{{
'AbpIdentity::Save' | abpLocalization 'AbpIdentity::Save' | abpLocalization
}}</abp-button> }}</abp-button>
</ng-template> </ng-template>
</abp-modal> </abp-modal>
<abp-permission-management <abp-permission-management
#abpPermissionManagement="abpPermissionManagement" #abpPermissionManagement="abpPermissionManagement"
*abpReplaceableTemplate=" *abpReplaceableTemplate="
{ {
inputs: { inputs: {
providerName: { value: 'R' }, providerName: { value: 'R' },
providerKey: { value: providerKey }, providerKey: { value: providerKey },
visible: { value: visiblePermissions, twoWay: true }, visible: { value: visiblePermissions, twoWay: true },
hideBadges: { value: true } hideBadges: { value: true },
}, },
outputs: { visibleChange: onVisiblePermissionChange }, outputs: { visibleChange: onVisiblePermissionChange },
componentKey: permissionManagementKey componentKey: permissionManagementKey,
}; };
let init = initTemplate let init = initTemplate
" "
(abpInit)="init(abpPermissionManagement)" (abpInit)="init(abpPermissionManagement)"
> />
</abp-permission-management>
</abp-page> </abp-page>

38
npm/ng-packs/packages/identity/src/lib/components/roles/roles.component.ts
View File

@ -1,10 +1,15 @@
import { Component, inject, Injector } from '@angular/core';
import { toSignal } from '@angular/core/rxjs-interop';
import { ReactiveFormsModule, UntypedFormGroup } from '@angular/forms';
import { finalize } from 'rxjs/operators';
import { NgxValidateCoreModule } from '@ngx-validate/core';
import { import {
InitDirective, InitDirective,
ListService, ListService,
LocalizationPipe, LocalizationPipe,
PagedAndSortedResultRequestDto, PagedAndSortedResultRequestDto,
PagedResultDto, PagedResultDto,
ReplaceableTemplateDirective ReplaceableTemplateDirective,
} from '@abp/ng.core'; } from '@abp/ng.core';
import { IdentityRoleDto, IdentityRoleService } from '@abp/ng.identity/proxy'; import { IdentityRoleDto, IdentityRoleService } from '@abp/ng.identity/proxy';
import { import {
@ -26,12 +31,8 @@ import {
FormPropData, FormPropData,
generateFormFromProps, generateFormFromProps,
} from '@abp/ng.components/extensible'; } from '@abp/ng.components/extensible';
import { Component, inject, Injector, OnInit } from '@angular/core';
import { ReactiveFormsModule, UntypedFormGroup } from '@angular/forms';
import { finalize } from 'rxjs/operators';
import { eIdentityComponents } from '../../enums/components';
import { PageComponent } from '@abp/ng.components/page'; import { PageComponent } from '@abp/ng.components/page';
import { NgxValidateCoreModule } from '@ngx-validate/core'; import { eIdentityComponents } from '../../enums/components';
@Component({ @Component({
selector: 'abp-roles', selector: 'abp-roles',
@ -58,14 +59,17 @@ import { NgxValidateCoreModule } from '@ngx-validate/core';
InitDirective, InitDirective,
], ],
}) })
export class RolesComponent implements OnInit { export class RolesComponent {
protected readonly list = inject(ListService<PagedAndSortedResultRequestDto>); protected readonly list = inject(ListService<PagedAndSortedResultRequestDto>);
protected readonly confirmationService = inject(ConfirmationService); protected readonly confirmationService = inject(ConfirmationService);
protected readonly toasterService = inject(ToasterService); protected readonly toasterService = inject(ToasterService);
private readonly injector = inject(Injector); private readonly injector = inject(Injector);
protected readonly service = inject(IdentityRoleService); protected readonly service = inject(IdentityRoleService);
data: PagedResultDto<IdentityRoleDto> = { items: [], totalCount: 0 }; readonly data = toSignal(
this.list.hookToQuery(query => this.service.getList(query)),
{ initialValue: { items: [], totalCount: 0 } as PagedResultDto<IdentityRoleDto> },
);
form!: UntypedFormGroup; form!: UntypedFormGroup;
selected?: IdentityRoleDto; selected?: IdentityRoleDto;
isModalVisible!: boolean; isModalVisible!: boolean;
@ -78,10 +82,6 @@ export class RolesComponent implements OnInit {
this.visiblePermissions = event; this.visiblePermissions = event;
}; };
ngOnInit() {
this.hookToQuery();
}
buildForm() { buildForm() {
const data = new FormPropData(this.injector, this.selected); const data = new FormPropData(this.injector, this.selected);
this.form = generateFormFromProps(data); this.form = generateFormFromProps(data);
@ -128,20 +128,14 @@ export class RolesComponent implements OnInit {
}) })
.subscribe((status: Confirmation.Status) => { .subscribe((status: Confirmation.Status) => {
if (status === Confirmation.Status.confirm) { if (status === Confirmation.Status.confirm) {
this.toasterService.success('AbpUi::DeletedSuccessfully'); this.service.delete(id).subscribe(() => {
this.service.delete(id).subscribe(() => this.list.get()); this.toasterService.success('AbpUi::DeletedSuccessfully');
this.list.get();
});
} }
}); });
} }
private hookToQuery() {
this.list
.hookToQuery(query => this.service.getList(query))
.subscribe(res => {
this.data = res;
});
}
openPermissionsModal(providerKey: string) { openPermissionsModal(providerKey: string) {
this.providerKey = providerKey; this.providerKey = providerKey;
setTimeout(() => { setTimeout(() => {

32
npm/ng-packs/packages/identity/src/lib/components/users/users.component.html
View File

@ -1,4 +1,4 @@
<abp-page [title]="'AbpIdentity::Users' | abpLocalization" [toolbar]="data.items"> <abp-page [title]="'AbpIdentity::Users' | abpLocalization" [toolbar]="data().items">
<div id="identity-roles-wrapper" class="card"> <div id="identity-roles-wrapper" class="card">
<div class="card-body"> <div class="card-body">
<div id="data-tables-table-filter" class="data-tables-filter mb-3"> <div id="data-tables-table-filter" class="data-tables-filter mb-3">
@ -13,10 +13,10 @@
</div> </div>
<abp-extensible-table <abp-extensible-table
[data]="data.items" [data]="data().items"
[recordsTotal]="data.totalCount" [recordsTotal]="data().totalCount"
[list]="list" [list]="list"
></abp-extensible-table> />
</div> </div>
</div> </div>
@ -32,28 +32,27 @@
<li ngbNavItem="user-info"> <li ngbNavItem="user-info">
<a ngbNavLink>{{ 'AbpIdentity::UserInformations' | abpLocalization }}</a> <a ngbNavLink>{{ 'AbpIdentity::UserInformations' | abpLocalization }}</a>
<ng-template ngbNavContent> <ng-template ngbNavContent>
<abp-extensible-form [selectedRecord]="selected"></abp-extensible-form> <abp-extensible-form [selectedRecord]="selected" />
</ng-template> </ng-template>
</li> </li>
<li ngbNavItem="roles"> <li ngbNavItem="roles">
<a ngbNavLink>{{ 'AbpIdentity::Roles' | abpLocalization }}</a> <a ngbNavLink>{{ 'AbpIdentity::Roles' | abpLocalization }}</a>
<ng-template ngbNavContent> <ng-template ngbNavContent>
@for (roleGroup of roleGroups; track $index; let i = $index) { @for (roleGroup of roleGroups; track $index; let i = $index) {
<div class="form-check mb-2"> <div class="form-check mb-2" [formGroup]="roleGroup">
<abp-checkbox <abp-checkbox
*abpReplaceableTemplate="{ *abpReplaceableTemplate="{
inputs: { inputs: {
checkboxId: 'roles-' + i, checkboxId: { value: 'roles-' + i },
label: roles[i].name, label: { value: roles[i].name },
formControl: roleGroup.controls[roles[i].name] formControl: { value: roleGroup.get(roles[i].name!), twoWay: true },
}, },
componentKey: inputKey componentKey: inputKey,
}" }"
[checkboxId]="'roles-' + i" [checkboxId]="'roles-' + i"
[formControl]="roleGroup.controls[roles[i].name]" [formControlName]="roles[i].name!"
[label]="roles[i].name" [label]="roles[i].name"
> />
</abp-checkbox>
</div> </div>
} }
</ng-template> </ng-template>
@ -84,15 +83,14 @@
inputs: { inputs: {
providerName: { value: 'U' }, providerName: { value: 'U' },
providerKey: { value: providerKey }, providerKey: { value: providerKey },
visible: { value: visiblePermissions, twoWay: true } visible: { value: visiblePermissions, twoWay: true },
}, },
outputs: { visibleChange: onVisiblePermissionChange }, outputs: { visibleChange: onVisiblePermissionChange },
componentKey: permissionManagementKey componentKey: permissionManagementKey,
}; };
let init = initTemplate let init = initTemplate
" "
[entityDisplayName]="entityDisplayName" [entityDisplayName]="entityDisplayName"
(abpInit)="init(abpPermissionManagement)" (abpInit)="init(abpPermissionManagement)"
> />
</abp-permission-management>
</abp-page> </abp-page>

25
npm/ng-packs/packages/identity/src/lib/components/users/users.component.ts
View File

@ -36,11 +36,11 @@ import {
Component, Component,
inject, inject,
Injector, Injector,
OnInit,
TemplateRef, TemplateRef,
TrackByFunction, TrackByFunction,
viewChild viewChild,
} from '@angular/core'; } from '@angular/core';
import { toSignal } from '@angular/core/rxjs-interop';
import { import {
AbstractControl, AbstractControl,
FormsModule, FormsModule,
@ -84,7 +84,7 @@ import { NgxValidateCoreModule } from '@ngx-validate/core';
InitDirective, InitDirective,
], ],
}) })
export class UsersComponent implements OnInit { export class UsersComponent {
protected readonly list = inject(ListService<GetIdentityUsersInput>); protected readonly list = inject(ListService<GetIdentityUsersInput>);
protected readonly confirmationService = inject(ConfirmationService); protected readonly confirmationService = inject(ConfirmationService);
protected readonly service = inject(IdentityUserService); protected readonly service = inject(IdentityUserService);
@ -92,7 +92,12 @@ export class UsersComponent implements OnInit {
private readonly fb = inject(UntypedFormBuilder); private readonly fb = inject(UntypedFormBuilder);
private readonly injector = inject(Injector); private readonly injector = inject(Injector);
data: PagedResultDto<IdentityUserDto> = { items: [], totalCount: 0 }; readonly data = toSignal(
this.list.hookToQuery(query => this.service.getList(query)),
{
initialValue: { items: [], totalCount: 0 } as PagedResultDto<IdentityUserDto>,
},
);
readonly modalContent = viewChild.required<TemplateRef<any>>('modalContent'); readonly modalContent = viewChild.required<TemplateRef<any>>('modalContent');
@ -130,10 +135,6 @@ export class UsersComponent implements OnInit {
return ((this.form.get('roleNames') as UntypedFormArray)?.controls as UntypedFormGroup[]) || []; return ((this.form.get('roleNames') as UntypedFormArray)?.controls as UntypedFormGroup[]) || [];
} }
ngOnInit() {
this.hookToQuery();
}
buildForm() { buildForm() {
const data = new FormPropData(this.injector, this.selected); const data = new FormPropData(this.injector, this.selected);
this.form = generateFormFromProps(data); this.form = generateFormFromProps(data);
@ -233,14 +234,6 @@ export class UsersComponent implements OnInit {
this.list.sortOrder = dir; this.list.sortOrder = dir;
} }
private hookToQuery() {
this.list
.hookToQuery(query => this.service.getList(query))
.subscribe(res => {
this.data = res;
});
}
openPermissionsModal(providerKey: string, entityDisplayName?: string) { openPermissionsModal(providerKey: string, entityDisplayName?: string) {
this.providerKey = providerKey; this.providerKey = providerKey;
this.entityDisplayName = entityDisplayName; this.entityDisplayName = entityDisplayName;

Write Preview
Loading…
Cancel
Save