Compare commits
No commits in common. "62a1030bd411262b73e401dc3d5bae6eb20f8092" and "0e14f4e199700d882cada58fd517138fddcf140d" have entirely different histories.
62a1030bd4
...
0e14f4e199
@ -20,7 +20,7 @@
|
|||||||
"@abp/ng.setting-management": "~9.0.2",
|
"@abp/ng.setting-management": "~9.0.2",
|
||||||
"@abp/ng.tenant-management": "~9.0.2",
|
"@abp/ng.tenant-management": "~9.0.2",
|
||||||
"@abp/ng.theme.lepton-x": "~4.0.3",
|
"@abp/ng.theme.lepton-x": "~4.0.3",
|
||||||
"@abp/ng.theme.shared": "^9.0.4",
|
"@abp/ng.theme.shared": "~9.0.2",
|
||||||
"@angular/animations": "~18.1.0",
|
"@angular/animations": "~18.1.0",
|
||||||
"@angular/common": "~18.1.0",
|
"@angular/common": "~18.1.0",
|
||||||
"@angular/compiler": "~18.1.0",
|
"@angular/compiler": "~18.1.0",
|
||||||
@ -34,7 +34,7 @@
|
|||||||
"@fullcalendar/core": "^6.1.15",
|
"@fullcalendar/core": "^6.1.15",
|
||||||
"@fullcalendar/daygrid": "^6.1.15",
|
"@fullcalendar/daygrid": "^6.1.15",
|
||||||
"@fullcalendar/interaction": "^6.1.15",
|
"@fullcalendar/interaction": "^6.1.15",
|
||||||
"@swimlane/ngx-datatable": "^20.1.0", "bootstrap-icons": "~1.8.0",
|
"bootstrap-icons": "~1.8.0",
|
||||||
"primeflex": "^3.3.1",
|
"primeflex": "^3.3.1",
|
||||||
"primeicons": "^6.0.1",
|
"primeicons": "^6.0.1",
|
||||||
"primeng": "^17.18.0",
|
"primeng": "^17.18.0",
|
||||||
|
|||||||
@ -1,7 +1,5 @@
|
|||||||
import { NgModule } from '@angular/core';
|
import { NgModule } from '@angular/core';
|
||||||
import { RouterModule, Routes } from '@angular/router';
|
import { RouterModule, Routes } from '@angular/router';
|
||||||
import { CustomUsersComponent } from './modules/custom-identity/custom-users/custom-users.component';
|
|
||||||
import { CustomRolesComponent } from './modules/custom-identity/custom-roles/custom-roles.component';
|
|
||||||
|
|
||||||
const routes: Routes = [
|
const routes: Routes = [
|
||||||
{
|
{
|
||||||
@ -13,12 +11,10 @@ const routes: Routes = [
|
|||||||
path: 'account',
|
path: 'account',
|
||||||
loadChildren: () => import('@abp/ng.account').then(m => m.AccountModule.forLazy()),
|
loadChildren: () => import('@abp/ng.account').then(m => m.AccountModule.forLazy()),
|
||||||
},
|
},
|
||||||
{ path: 'identity/users', component: CustomUsersComponent },
|
{
|
||||||
{ path: 'identity/roles', component: CustomRolesComponent },
|
path: 'identity',
|
||||||
// {
|
loadChildren: () => import('@abp/ng.identity').then(m => m.IdentityModule.forLazy()),
|
||||||
// path: 'identity',
|
},
|
||||||
// loadChildren: () => import('@abp/ng.identity').then(m => m.IdentityModule.forLazy()),
|
|
||||||
// },
|
|
||||||
{
|
{
|
||||||
path: 'tenant-management',
|
path: 'tenant-management',
|
||||||
loadChildren: () =>
|
loadChildren: () =>
|
||||||
|
|||||||
@ -1,23 +0,0 @@
|
|||||||
import { NgModule } from '@angular/core';
|
|
||||||
import { CommonModule } from '@angular/common';
|
|
||||||
import { IdentityModule } from '@abp/ng.identity';
|
|
||||||
import { TableModule } from 'primeng/table';
|
|
||||||
import { ButtonModule } from 'primeng/button';
|
|
||||||
import { CustomRolesComponent } from './custom-roles/custom-roles.component';
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@NgModule({
|
|
||||||
declarations: [],
|
|
||||||
imports: [
|
|
||||||
CommonModule,
|
|
||||||
IdentityModule,
|
|
||||||
TableModule,
|
|
||||||
ButtonModule,
|
|
||||||
CustomRolesComponent
|
|
||||||
],
|
|
||||||
exports:[
|
|
||||||
CustomRolesComponent
|
|
||||||
]
|
|
||||||
})
|
|
||||||
export class CustomIdentityModule { }
|
|
||||||
@ -1,125 +0,0 @@
|
|||||||
<abp-page [title]="'AbpIdentity::Roles' | abpLocalization" [toolbar]="data.items">
|
|
||||||
<div id="identity-roles-wrapper" class="card">
|
|
||||||
<div class="card-body">
|
|
||||||
<!-- <abp-extensible-table
|
|
||||||
[data]="data.items"
|
|
||||||
[recordsTotal]="data.totalCount"
|
|
||||||
[list]="list"
|
|
||||||
></abp-extensible-table> -->
|
|
||||||
<div class="flex justify-content-between align-items-center mb-3">
|
|
||||||
<button pButton icon="pi pi-plus" label="Add Roles" class="p-button-success" (click)="add()"></button>
|
|
||||||
</div>
|
|
||||||
<p-table [value]="data.items" [paginator]="true" [rows]="5" responsiveLayout="scroll">
|
|
||||||
<ng-template pTemplate="header">
|
|
||||||
<tr>
|
|
||||||
<th pSortableColumn="name">Role name <p-sortIcon field="name"></p-sortIcon></th>
|
|
||||||
|
|
||||||
<th>Actions</th>
|
|
||||||
</tr>
|
|
||||||
</ng-template>
|
|
||||||
|
|
||||||
<ng-template pTemplate="body" let-role>
|
|
||||||
<tr>
|
|
||||||
<td>{{ role.name }}</td>
|
|
||||||
|
|
||||||
|
|
||||||
<td>
|
|
||||||
<button pButton icon="pi pi-pencil" class="p-button-text p-button-primary" (click)="edit(role.id)"></button>
|
|
||||||
<button pButton icon="pi pi-trash" class="p-button-text p-button-danger" (click)="delete(role.id,role.name)"></button>
|
|
||||||
<button pButton icon="pi pi-lock" class="p-button-text p-button-success" (click)="openPermissionsModal(role.name)"></button>
|
|
||||||
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</ng-template>
|
|
||||||
</p-table>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<abp-modal [(visible)]="isModalVisible" [busy]="modalBusy">
|
|
||||||
<ng-template #abpHeader>
|
|
||||||
<h3>{{ (selected?.id ? 'AbpIdentity::Edit' : 'AbpIdentity::NewRole') | abpLocalization }}</h3>
|
|
||||||
</ng-template>
|
|
||||||
|
|
||||||
<!-- <ng-template #abpBody>
|
|
||||||
<form [formGroup]="form" (ngSubmit)="save()" validateOnSubmit>
|
|
||||||
<abp-extensible-form [selectedRecord]="selected"></abp-extensible-form>
|
|
||||||
</form>
|
|
||||||
</ng-template> -->
|
|
||||||
|
|
||||||
<ng-template #abpBody>
|
|
||||||
<form #roleForm="ngForm" (ngSubmit)="save()" validateOnSubmit>
|
|
||||||
<!-- Name Field -->
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="name">Name</label>
|
|
||||||
<input
|
|
||||||
id="name"
|
|
||||||
type="text"
|
|
||||||
class="form-control"
|
|
||||||
[(ngModel)]="selected.name"
|
|
||||||
name="name"
|
|
||||||
required
|
|
||||||
#nameCtrl="ngModel"
|
|
||||||
/>
|
|
||||||
<small class="text-danger" *ngIf="nameCtrl.invalid && nameCtrl.touched">Name is required</small>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Is Default Checkbox -->
|
|
||||||
<div class="form-check">
|
|
||||||
<input
|
|
||||||
id="isDefault"
|
|
||||||
type="checkbox"
|
|
||||||
class="form-check-input"
|
|
||||||
[(ngModel)]="selected.isDefault"
|
|
||||||
name="isDefault"
|
|
||||||
/>
|
|
||||||
<label for="isDefault" class="form-check-label">Default</label>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Is Public Checkbox -->
|
|
||||||
<div class="form-check">
|
|
||||||
<input
|
|
||||||
id="isPublic"
|
|
||||||
type="checkbox"
|
|
||||||
class="form-check-input"
|
|
||||||
[(ngModel)]="selected.isPublic"
|
|
||||||
name="isPublic"
|
|
||||||
/>
|
|
||||||
<label for="isPublic" class="form-check-label">Public</label>
|
|
||||||
</div>
|
|
||||||
<br>
|
|
||||||
<abp-button iconClass="fa fa-check" [disabled]="roleForm.invalid" (click)="save()">{{
|
|
||||||
'AbpIdentity::Save' | abpLocalization
|
|
||||||
}}</abp-button>
|
|
||||||
</form>
|
|
||||||
</ng-template>
|
|
||||||
|
|
||||||
<ng-template #abpFooter>
|
|
||||||
<button type="button" class="btn btn-outline-primary" abpClose>
|
|
||||||
{{ 'AbpIdentity::Cancel' | abpLocalization }}
|
|
||||||
</button>
|
|
||||||
<!-- <abp-button iconClass="fa fa-check" [disabled]="roleForm?.invalid" (click)="save()">{{
|
|
||||||
'AbpIdentity::Save' | abpLocalization
|
|
||||||
}}</abp-button> -->
|
|
||||||
</ng-template>
|
|
||||||
</abp-modal>
|
|
||||||
|
|
||||||
<abp-permission-management
|
|
||||||
#abpPermissionManagement="abpPermissionManagement"
|
|
||||||
*abpReplaceableTemplate="
|
|
||||||
{
|
|
||||||
inputs: {
|
|
||||||
providerName: { value: 'R' },
|
|
||||||
providerKey: { value: providerKey },
|
|
||||||
visible: { value: visiblePermissions, twoWay: true },
|
|
||||||
hideBadges: { value: true }
|
|
||||||
},
|
|
||||||
outputs: { visibleChange: onVisiblePermissionChange },
|
|
||||||
componentKey: permissionManagementKey
|
|
||||||
};
|
|
||||||
let init = initTemplate
|
|
||||||
"
|
|
||||||
(abpInit)="init(abpPermissionManagement)"
|
|
||||||
>
|
|
||||||
</abp-permission-management>
|
|
||||||
</abp-page>
|
|
||||||
|
|
||||||
@ -1,23 +0,0 @@
|
|||||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
|
|
||||||
import { CustomRolesComponent } from './custom-roles.component';
|
|
||||||
|
|
||||||
describe('CustomRolesComponent', () => {
|
|
||||||
let component: CustomRolesComponent;
|
|
||||||
let fixture: ComponentFixture<CustomRolesComponent>;
|
|
||||||
|
|
||||||
beforeEach(async () => {
|
|
||||||
await TestBed.configureTestingModule({
|
|
||||||
imports: [CustomRolesComponent]
|
|
||||||
})
|
|
||||||
.compileComponents();
|
|
||||||
|
|
||||||
fixture = TestBed.createComponent(CustomRolesComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -1,213 +0,0 @@
|
|||||||
import {
|
|
||||||
ExtensibleModule,
|
|
||||||
EXTENSIONS_IDENTIFIER,
|
|
||||||
FormPropData,
|
|
||||||
generateFormFromProps,
|
|
||||||
} from '@abp/ng.components/extensible';
|
|
||||||
import { PageModule } from '@abp/ng.components/page';
|
|
||||||
import {
|
|
||||||
CoreModule,
|
|
||||||
ListResultDto,
|
|
||||||
ListService,
|
|
||||||
LocalizationModule,
|
|
||||||
PagedAndSortedResultRequestDto,
|
|
||||||
PagedResultDto,
|
|
||||||
} from '@abp/ng.core';
|
|
||||||
import { IdentityRoleCreateDto, IdentityRoleDto, IdentityRoleService, IdentityRoleUpdateDto } from '@abp/ng.identity/proxy';
|
|
||||||
import {
|
|
||||||
ThemeSharedModule,
|
|
||||||
ConfirmationService,
|
|
||||||
ToasterService,
|
|
||||||
Confirmation,
|
|
||||||
} from '@abp/ng.theme.shared';
|
|
||||||
import { CommonModule } from '@angular/common';
|
|
||||||
import { Component, inject, Injector, OnInit } from '@angular/core';
|
|
||||||
import { FormControl, FormGroup, FormsModule, UntypedFormGroup, Validators } from '@angular/forms';
|
|
||||||
import { ButtonModule } from 'primeng/button';
|
|
||||||
import { TableModule } from 'primeng/table';
|
|
||||||
import { finalize } from 'rxjs';
|
|
||||||
import { ePermissionManagementComponents } from '@abp/ng.permission-management';
|
|
||||||
import { NgxDatatableModule } from '@swimlane/ngx-datatable';
|
|
||||||
import { eIdentityComponents } from '@abp/ng.identity';
|
|
||||||
import { PermissionManagementModule } from '@abp/ng.permission-management';
|
|
||||||
import { NgbNavModule } from '@ng-bootstrap/ng-bootstrap';
|
|
||||||
import { MenuItem } from 'primeng/api';
|
|
||||||
import { Dropdown, DropdownModule } from 'primeng/dropdown';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-custom-roles',
|
|
||||||
standalone: true,
|
|
||||||
imports: [
|
|
||||||
CommonModule,
|
|
||||||
FormsModule,
|
|
||||||
TableModule,
|
|
||||||
ButtonModule,
|
|
||||||
PageModule,
|
|
||||||
LocalizationModule,
|
|
||||||
ThemeSharedModule,
|
|
||||||
NgxDatatableModule,
|
|
||||||
ExtensibleModule,
|
|
||||||
PermissionManagementModule,
|
|
||||||
CoreModule,
|
|
||||||
NgbNavModule,
|
|
||||||
DropdownModule
|
|
||||||
],
|
|
||||||
templateUrl: './custom-roles.component.html',
|
|
||||||
providers: [
|
|
||||||
ListService,
|
|
||||||
{
|
|
||||||
provide: EXTENSIONS_IDENTIFIER,
|
|
||||||
useValue: eIdentityComponents.Roles,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
styleUrl: './custom-roles.component.scss',
|
|
||||||
})
|
|
||||||
export class CustomRolesComponent implements OnInit {
|
|
||||||
protected readonly list = inject(ListService<PagedAndSortedResultRequestDto>);
|
|
||||||
protected readonly confirmationService = inject(ConfirmationService);
|
|
||||||
protected readonly toasterService = inject(ToasterService);
|
|
||||||
private readonly injector = inject(Injector);
|
|
||||||
protected readonly service = inject(IdentityRoleService);
|
|
||||||
|
|
||||||
data: PagedResultDto<IdentityRoleDto> = { items: [], totalCount: 0 };
|
|
||||||
|
|
||||||
form!: UntypedFormGroup;
|
|
||||||
|
|
||||||
selected?: IdentityRoleDto;
|
|
||||||
|
|
||||||
isModalVisible!: boolean;
|
|
||||||
|
|
||||||
visiblePermissions = false;
|
|
||||||
|
|
||||||
providerKey?: string;
|
|
||||||
|
|
||||||
modalBusy = false;
|
|
||||||
|
|
||||||
permissionManagementKey = ePermissionManagementComponents.PermissionManagement;
|
|
||||||
|
|
||||||
onVisiblePermissionChange = (event: boolean) => {
|
|
||||||
this.visiblePermissions = event;
|
|
||||||
};
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
|
|
||||||
this.hookToQuery();
|
|
||||||
}
|
|
||||||
|
|
||||||
// buildForm() {
|
|
||||||
// const data = new FormPropData(this.injector, this.selected);
|
|
||||||
// this.form = generateFormFromProps(data);
|
|
||||||
// }
|
|
||||||
buildForm() {
|
|
||||||
this.form = new FormGroup({
|
|
||||||
name: new FormControl(this.selected?.name || '', Validators.required),
|
|
||||||
isDefault: new FormControl(this.selected?.isDefault || false),
|
|
||||||
isPublic: new FormControl(this.selected?.isPublic || false)
|
|
||||||
});
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
openModal() {
|
|
||||||
this.buildForm();
|
|
||||||
this.isModalVisible = true;
|
|
||||||
}
|
|
||||||
|
|
||||||
add() {
|
|
||||||
debugger
|
|
||||||
// this.selected = {} as IdentityRoleDto;
|
|
||||||
// this.openModal();
|
|
||||||
this.selected = { name: '', isDefault: false, isPublic: false } as IdentityRoleDto;
|
|
||||||
this.isModalVisible = true;
|
|
||||||
}
|
|
||||||
|
|
||||||
edit(id: string) {
|
|
||||||
debugger
|
|
||||||
// this.service.get(id).subscribe(res => {
|
|
||||||
// this.selected = res;
|
|
||||||
// this.openModal();
|
|
||||||
// });
|
|
||||||
this.service.get(id).subscribe(res => {
|
|
||||||
this.selected = res;
|
|
||||||
this.isModalVisible = true;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// save() {
|
|
||||||
// debugger
|
|
||||||
// if (!this.form.valid) return;
|
|
||||||
// this.modalBusy = true;
|
|
||||||
|
|
||||||
// const { id } = this.selected || {};
|
|
||||||
// (id
|
|
||||||
// ? this.service.update(id, { ...this.selected, ...this.form.value })
|
|
||||||
// : this.service.create(this.form.value)
|
|
||||||
// )
|
|
||||||
// .pipe(finalize(() => (this.modalBusy = false)))
|
|
||||||
// .subscribe(() => {
|
|
||||||
// this.isModalVisible = false;
|
|
||||||
// this.toasterService.success('AbpUi::SavedSuccessfully');
|
|
||||||
// this.list.get();
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
save() {
|
|
||||||
debugger
|
|
||||||
if (!this.selected?.name) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
this.modalBusy = true;
|
|
||||||
|
|
||||||
const { id, name, isDefault, isPublic, concurrencyStamp } = this.selected;
|
|
||||||
|
|
||||||
const roleDto = {
|
|
||||||
name,
|
|
||||||
isDefault,
|
|
||||||
isPublic,
|
|
||||||
concurrencyStamp
|
|
||||||
};
|
|
||||||
|
|
||||||
const saveObservable = id
|
|
||||||
? this.service.update(id, roleDto) // Update call
|
|
||||||
: this.service.create(roleDto); // Create call
|
|
||||||
|
|
||||||
saveObservable
|
|
||||||
.pipe(finalize(() => (this.modalBusy = false)))
|
|
||||||
.subscribe(() => {
|
|
||||||
this.isModalVisible = false;
|
|
||||||
this.toasterService.success('AbpUi::SavedSuccessfully');
|
|
||||||
this.list.get();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
delete(id: string, name: string) {
|
|
||||||
this.confirmationService
|
|
||||||
.warn('AbpIdentity::RoleDeletionConfirmationMessage', 'AbpIdentity::AreYouSure', {
|
|
||||||
messageLocalizationParams: [name],
|
|
||||||
})
|
|
||||||
.subscribe((status: Confirmation.Status) => {
|
|
||||||
if (status === Confirmation.Status.confirm) {
|
|
||||||
this.toasterService.success('AbpUi::DeletedSuccessfully');
|
|
||||||
this.service.delete(id).subscribe(() => this.list.get());
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
private hookToQuery() {
|
|
||||||
this.list.hookToQuery(query => this.service.getList(query)).subscribe(res => (this.data = res));
|
|
||||||
}
|
|
||||||
|
|
||||||
openPermissionsModal(providerKey: string) {
|
|
||||||
this.providerKey = providerKey;
|
|
||||||
setTimeout(() => {
|
|
||||||
this.visiblePermissions = true;
|
|
||||||
}, 0);
|
|
||||||
}
|
|
||||||
|
|
||||||
sort(data: any) {
|
|
||||||
const { prop, dir } = data.sorts[0];
|
|
||||||
this.list.sortKey = prop;
|
|
||||||
this.list.sortOrder = dir;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -1,332 +0,0 @@
|
|||||||
<!-- <div>
|
|
||||||
<h3>Total Users: {{ data.totalCount }}</h3>
|
|
||||||
<ul>
|
|
||||||
<li *ngFor="let user of data.items">
|
|
||||||
<strong>{{ user.userName }}</strong> ({{ user.email }})
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div> -->
|
|
||||||
|
|
||||||
<abp-page [title]="'AbpIdentity::Users' | abpLocalization" [toolbar]="data.items">
|
|
||||||
<div id="identity-roles-wrapper" class="card">
|
|
||||||
<div class="card-body">
|
|
||||||
<div id="data-tables-table-filter" class="data-tables-filter mb-3">
|
|
||||||
<div class="flex justify-content-between align-items-center mb-3">
|
|
||||||
<button
|
|
||||||
pButton
|
|
||||||
icon="pi pi-plus"
|
|
||||||
label="Add User"
|
|
||||||
class="p-button-success"
|
|
||||||
(click)="add()"
|
|
||||||
></button>
|
|
||||||
</div>
|
|
||||||
<div class="input-group">
|
|
||||||
<input
|
|
||||||
type="search"
|
|
||||||
class="form-control"
|
|
||||||
[placeholder]="'AbpUi::PagerSearch' | abpLocalization"
|
|
||||||
[(ngModel)]="list.filter"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!--
|
|
||||||
<abp-extensible-table
|
|
||||||
|
|
||||||
[data]="data.items"
|
|
||||||
[recordsTotal]="data.totalCount"
|
|
||||||
[list]="list"
|
|
||||||
|
|
||||||
></abp-extensible-table> -->
|
|
||||||
<p-table
|
|
||||||
[value]="data.items"
|
|
||||||
[tableStyle]="{ 'min-width': '60rem' }"
|
|
||||||
[paginator]="true"
|
|
||||||
[rows]="5"
|
|
||||||
responsiveLayout="scroll"
|
|
||||||
>
|
|
||||||
<ng-template pTemplate="header">
|
|
||||||
<tr>
|
|
||||||
<th pSortableColumn="userName">Username <p-sortIcon field="userName"></p-sortIcon></th>
|
|
||||||
<th pSortableColumn="name">First Name <p-sortIcon field="name"></p-sortIcon></th>
|
|
||||||
<th pSortableColumn="surname">Last Name <p-sortIcon field="surname"></p-sortIcon></th>
|
|
||||||
<th pSortableColumn="email">Email <p-sortIcon field="email"></p-sortIcon></th>
|
|
||||||
<th pSortableColumn="Phone">Phone No <p-sortIcon field="Phone"></p-sortIcon></th>
|
|
||||||
<th>Status</th>
|
|
||||||
<th>Actions</th>
|
|
||||||
</tr>
|
|
||||||
</ng-template>
|
|
||||||
|
|
||||||
<ng-template pTemplate="body" let-user>
|
|
||||||
<tr>
|
|
||||||
<td>{{ user.userName }}</td>
|
|
||||||
<td>{{ user.name }}</td>
|
|
||||||
<td>{{ user.surname }}</td>
|
|
||||||
<td>{{ user.email }}</td>
|
|
||||||
<td>{{ user.phoneNumber }}</td>
|
|
||||||
<td>
|
|
||||||
<p-tag
|
|
||||||
[value]="user.isActive ? 'Active' : 'Inactive'"
|
|
||||||
[severity]="user.isActive ? 'success' : 'danger'"
|
|
||||||
></p-tag>
|
|
||||||
</td>
|
|
||||||
<td>
|
|
||||||
<div class="btn-group" dropdown placement="bottom left" container="body">
|
|
||||||
<p-splitButton
|
|
||||||
label="Actions"
|
|
||||||
icon="pi pi-cog"
|
|
||||||
class="p-button-sm p-button-primary"
|
|
||||||
[model]="actionItems"
|
|
||||||
(onClick)="editUser(user.id)"
|
|
||||||
>
|
|
||||||
</p-splitButton>
|
|
||||||
</div>
|
|
||||||
<!-- <button
|
|
||||||
pButton
|
|
||||||
icon="pi pi-pencil"
|
|
||||||
class="p-button-text p-button-primary"
|
|
||||||
(click)="edit(user.id)"
|
|
||||||
></button>
|
|
||||||
<button
|
|
||||||
pButton
|
|
||||||
icon="pi pi-trash"
|
|
||||||
class="p-button-text p-button-danger"
|
|
||||||
(click)="delete(user.id, user.userName)"
|
|
||||||
></button>
|
|
||||||
<button
|
|
||||||
pButton
|
|
||||||
icon="pi pi-lock"
|
|
||||||
class="p-button-text p-button-success"
|
|
||||||
(click)="openPermissionsModal(user.id, user.userName)"
|
|
||||||
></button> -->
|
|
||||||
<!-- <div class="btn-group" dropdown placement="bottom left" container="body">
|
|
||||||
<button
|
|
||||||
id="dropdownButton"
|
|
||||||
type="button"
|
|
||||||
class="btn btn-primary btn-sm dropdown-toggle"
|
|
||||||
dropdownToggle
|
|
||||||
aria-controls="dropdownMenu"
|
|
||||||
(click)="toggleDropdown()"
|
|
||||||
>
|
|
||||||
<i class="fa fa-cog"></i>
|
|
||||||
<span class="caret"></span>
|
|
||||||
Actions
|
|
||||||
</button>
|
|
||||||
<ul
|
|
||||||
id="dropdownMenu"
|
|
||||||
#dropdownMenu
|
|
||||||
class="dropdown-menu"
|
|
||||||
role="menu"
|
|
||||||
aria-labelledby="dropdownButton"
|
|
||||||
|
|
||||||
>
|
|
||||||
<li role="menuitem" tabindex="0">
|
|
||||||
<a
|
|
||||||
#firstDropdownItem
|
|
||||||
class="dropdown-item"
|
|
||||||
href="javascript:;"
|
|
||||||
(click)="edit(user.id)"
|
|
||||||
>
|
|
||||||
Edit
|
|
||||||
</a>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
</ul>
|
|
||||||
</div> -->
|
|
||||||
</td>
|
|
||||||
</tr>
|
|
||||||
</ng-template>
|
|
||||||
</p-table>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<abp-modal [(visible)]="isModalVisible" [busy]="modalBusy">
|
|
||||||
<ng-template #abpHeader>
|
|
||||||
<h3>
|
|
||||||
{{ (selected?.id ? 'AbpIdentity::EditUser' : 'AbpIdentity::NewUser') | abpLocalization }}
|
|
||||||
</h3>
|
|
||||||
</ng-template>
|
|
||||||
|
|
||||||
<ng-template #abpBody>
|
|
||||||
<form #userForm="ngForm" (ngSubmit)="save(userForm)">
|
|
||||||
<!-- User Information Tab -->
|
|
||||||
<ul ngbNav #nav="ngbNav" class="nav-tabs">
|
|
||||||
<li ngbNavItem>
|
|
||||||
<a ngbNavLink>{{ 'AbpIdentity::UserInformations' | abpLocalization }}</a>
|
|
||||||
<ng-template ngbNavContent>
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="userName">{{ 'User Name' | abpLocalization }}</label>
|
|
||||||
<input
|
|
||||||
id="userName"
|
|
||||||
type="text"
|
|
||||||
class="form-control"
|
|
||||||
[(ngModel)]="selected.userName"
|
|
||||||
name="userName"
|
|
||||||
required
|
|
||||||
#userName="ngModel"
|
|
||||||
/>
|
|
||||||
<div *ngIf="userName.invalid && userName.touched" class="text-danger">
|
|
||||||
User Name is required
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Password -->
|
|
||||||
<div class="form-group" *ngIf="!selected.id">
|
|
||||||
<label for="password">Password</label>
|
|
||||||
<input
|
|
||||||
id="password"
|
|
||||||
type="password"
|
|
||||||
class="form-control"
|
|
||||||
[(ngModel)]="password"
|
|
||||||
name="password"
|
|
||||||
required
|
|
||||||
#passwordField="ngModel"
|
|
||||||
/>
|
|
||||||
<div *ngIf="passwordField.invalid && passwordField.touched" class="text-danger">
|
|
||||||
Password is required
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Name -->
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="name">{{ 'Name' | abpLocalization }}</label>
|
|
||||||
<input
|
|
||||||
id="name"
|
|
||||||
type="text"
|
|
||||||
class="form-control"
|
|
||||||
[(ngModel)]="selected.name"
|
|
||||||
name="name"
|
|
||||||
#name="ngModel"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Surname -->
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="surname">{{ 'Surname' | abpLocalization }}</label>
|
|
||||||
<input
|
|
||||||
id="surname"
|
|
||||||
type="text"
|
|
||||||
class="form-control"
|
|
||||||
[(ngModel)]="selected.surname"
|
|
||||||
name="surname"
|
|
||||||
#surname="ngModel"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Email -->
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="email">{{ 'Email' | abpLocalization }}</label>
|
|
||||||
<input
|
|
||||||
id="email"
|
|
||||||
type="email"
|
|
||||||
class="form-control"
|
|
||||||
[(ngModel)]="selected.email"
|
|
||||||
name="email"
|
|
||||||
required
|
|
||||||
#email="ngModel"
|
|
||||||
/>
|
|
||||||
<div *ngIf="email.invalid && email.touched" class="text-danger">
|
|
||||||
Valid Email is required
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Phone Number -->
|
|
||||||
<div class="form-group">
|
|
||||||
<label for="phoneNumber">{{ 'Phone Number' | abpLocalization }}</label>
|
|
||||||
<input
|
|
||||||
id="phoneNumber"
|
|
||||||
type="text"
|
|
||||||
class="form-control"
|
|
||||||
[(ngModel)]="selected.phoneNumber"
|
|
||||||
name="phoneNumber"
|
|
||||||
#phoneNumber="ngModel"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Active Account (Checkbox) -->
|
|
||||||
<div class="form-check">
|
|
||||||
<input
|
|
||||||
id="isActive"
|
|
||||||
type="checkbox"
|
|
||||||
class="form-check-input"
|
|
||||||
[(ngModel)]="selected.isActive"
|
|
||||||
name="isActive"
|
|
||||||
/>
|
|
||||||
<label for="isActive" class="form-check-label">{{
|
|
||||||
'Active' | abpLocalization
|
|
||||||
}}</label>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Lockout Enabled (Checkbox) -->
|
|
||||||
<div class="form-check">
|
|
||||||
<input
|
|
||||||
id="lockoutEnabled"
|
|
||||||
type="checkbox"
|
|
||||||
class="form-check-input"
|
|
||||||
[(ngModel)]="selected.lockoutEnabled"
|
|
||||||
name="lockoutEnabled"
|
|
||||||
/>
|
|
||||||
<label for="lockoutEnabled" class="form-check-label">{{
|
|
||||||
'Lockout Enabled' | abpLocalization
|
|
||||||
}}</label>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
</li>
|
|
||||||
|
|
||||||
<!-- Roles Tab -->
|
|
||||||
<li ngbNavItem>
|
|
||||||
<a ngbNavLink>{{ 'AbpIdentity::Roles' | abpLocalization }}</a>
|
|
||||||
<ng-template ngbNavContent>
|
|
||||||
<div *ngFor="let role of roles; let i = index">
|
|
||||||
<div class="form-check mb-2">
|
|
||||||
<label class="form-check-label">
|
|
||||||
<input
|
|
||||||
type="checkbox"
|
|
||||||
class="form-check-input"
|
|
||||||
[(ngModel)]="role.selected"
|
|
||||||
name="role-{{ i }}"
|
|
||||||
/>
|
|
||||||
{{ role.name }}
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</ng-template>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
<div class="mt-2 fade-in-top" [ngbNavOutlet]="nav"></div>
|
|
||||||
|
|
||||||
<div class="mt-3">
|
|
||||||
<button type="submit" class="btn btn-primary" [disabled]="userForm.invalid">Save</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</ng-template>
|
|
||||||
|
|
||||||
<ng-template #abpFooter>
|
|
||||||
<button type="button" class="btn btn-outline-primary" abpClose>
|
|
||||||
{{ 'AbpIdentity::Cancel' | abpLocalization }}
|
|
||||||
</button>
|
|
||||||
<!-- <abp-button iconClass="fa fa-check" [disabled]="form?.invalid" (click)="save()">{{
|
|
||||||
'AbpIdentity::Save' | abpLocalization
|
|
||||||
}}</abp-button> -->
|
|
||||||
</ng-template>
|
|
||||||
</abp-modal>
|
|
||||||
|
|
||||||
<abp-permission-management
|
|
||||||
#abpPermissionManagement="abpPermissionManagement"
|
|
||||||
*abpReplaceableTemplate="
|
|
||||||
{
|
|
||||||
inputs: {
|
|
||||||
providerName: { value: 'U' },
|
|
||||||
providerKey: { value: providerKey },
|
|
||||||
visible: { value: visiblePermissions, twoWay: true }
|
|
||||||
},
|
|
||||||
outputs: { visibleChange: onVisiblePermissionChange },
|
|
||||||
componentKey: permissionManagementKey
|
|
||||||
};
|
|
||||||
let init = initTemplate
|
|
||||||
"
|
|
||||||
[entityDisplayName]="entityDisplayName"
|
|
||||||
(abpInit)="init(abpPermissionManagement)"
|
|
||||||
>
|
|
||||||
</abp-permission-management>
|
|
||||||
</abp-page>
|
|
||||||
@ -1,23 +0,0 @@
|
|||||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
|
||||||
|
|
||||||
import { CustomUsersComponent } from './custom-users.component';
|
|
||||||
|
|
||||||
describe('CustomUsersComponent', () => {
|
|
||||||
let component: CustomUsersComponent;
|
|
||||||
let fixture: ComponentFixture<CustomUsersComponent>;
|
|
||||||
|
|
||||||
beforeEach(async () => {
|
|
||||||
await TestBed.configureTestingModule({
|
|
||||||
imports: [CustomUsersComponent]
|
|
||||||
})
|
|
||||||
.compileComponents();
|
|
||||||
|
|
||||||
fixture = TestBed.createComponent(CustomUsersComponent);
|
|
||||||
component = fixture.componentInstance;
|
|
||||||
fixture.detectChanges();
|
|
||||||
});
|
|
||||||
|
|
||||||
it('should create', () => {
|
|
||||||
expect(component).toBeTruthy();
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@ -1,395 +0,0 @@
|
|||||||
import {
|
|
||||||
FormPropData,
|
|
||||||
EXTENSIONS_IDENTIFIER,
|
|
||||||
generateFormFromProps,
|
|
||||||
ExtensibleModule,
|
|
||||||
} from '@abp/ng.components/extensible';
|
|
||||||
import { PageModule } from '@abp/ng.components/page';
|
|
||||||
import {
|
|
||||||
CoreModule,
|
|
||||||
ListResultDto,
|
|
||||||
ListService,
|
|
||||||
LocalizationModule,
|
|
||||||
PagedResultDto,
|
|
||||||
} from '@abp/ng.core';
|
|
||||||
import { eIdentityComponents } from '@abp/ng.identity';
|
|
||||||
import {
|
|
||||||
GetIdentityUsersInput,
|
|
||||||
IdentityRoleDto,
|
|
||||||
IdentityUserDto,
|
|
||||||
IdentityUserService,
|
|
||||||
IdentityUserUpdateDto,
|
|
||||||
} from '@abp/ng.identity/proxy';
|
|
||||||
import { CommonModule } from '@angular/common';
|
|
||||||
import {
|
|
||||||
Component,
|
|
||||||
ElementRef,
|
|
||||||
HostListener,
|
|
||||||
inject,
|
|
||||||
Injector,
|
|
||||||
OnInit,
|
|
||||||
TemplateRef,
|
|
||||||
TrackByFunction,
|
|
||||||
ViewChild,
|
|
||||||
} from '@angular/core';
|
|
||||||
import {
|
|
||||||
AbstractControl,
|
|
||||||
FormsModule,
|
|
||||||
NgForm,
|
|
||||||
UntypedFormArray,
|
|
||||||
UntypedFormBuilder,
|
|
||||||
UntypedFormGroup,
|
|
||||||
} from '@angular/forms';
|
|
||||||
import { ButtonModule } from 'primeng/button';
|
|
||||||
import { TableModule } from 'primeng/table';
|
|
||||||
import {
|
|
||||||
Confirmation,
|
|
||||||
eFormComponets,
|
|
||||||
ThemeSharedModule,
|
|
||||||
ToasterService,
|
|
||||||
ConfirmationService,
|
|
||||||
} from '@abp/ng.theme.shared';
|
|
||||||
import { finalize, switchMap, tap } from 'rxjs';
|
|
||||||
import {
|
|
||||||
ePermissionManagementComponents,
|
|
||||||
PermissionManagementModule,
|
|
||||||
} from '@abp/ng.permission-management';
|
|
||||||
import { NgxDatatableModule } from '@swimlane/ngx-datatable';
|
|
||||||
import { NgbNavModule } from '@ng-bootstrap/ng-bootstrap';
|
|
||||||
import { PaginatorModule } from 'primeng/paginator';
|
|
||||||
import { TagModule } from 'primeng/tag'; // For active/inactive status
|
|
||||||
import { SplitButtonModule } from 'primeng/splitbutton';
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'app-custom-users',
|
|
||||||
standalone: true,
|
|
||||||
imports: [
|
|
||||||
CommonModule,
|
|
||||||
FormsModule,
|
|
||||||
TableModule,
|
|
||||||
ButtonModule,
|
|
||||||
PageModule,
|
|
||||||
LocalizationModule,
|
|
||||||
ThemeSharedModule,
|
|
||||||
NgxDatatableModule,
|
|
||||||
ExtensibleModule,
|
|
||||||
PermissionManagementModule,
|
|
||||||
CoreModule,
|
|
||||||
NgbNavModule,
|
|
||||||
PaginatorModule,
|
|
||||||
TagModule,SplitButtonModule
|
|
||||||
],
|
|
||||||
templateUrl: './custom-users.component.html',
|
|
||||||
providers: [
|
|
||||||
ListService,
|
|
||||||
{
|
|
||||||
provide: EXTENSIONS_IDENTIFIER,
|
|
||||||
useValue: eIdentityComponents.Users,
|
|
||||||
},
|
|
||||||
],
|
|
||||||
styleUrl: './custom-users.component.scss',
|
|
||||||
})
|
|
||||||
export class CustomUsersComponent implements OnInit {
|
|
||||||
protected readonly list = inject(ListService<GetIdentityUsersInput>);
|
|
||||||
protected readonly confirmationService = inject(ConfirmationService);
|
|
||||||
protected readonly service = inject(IdentityUserService);
|
|
||||||
protected readonly toasterService = inject(ToasterService);
|
|
||||||
private readonly fb = inject(UntypedFormBuilder);
|
|
||||||
private readonly injector = inject(Injector);
|
|
||||||
@ViewChild('firstDropdownItem') firstDropdownItem: ElementRef;
|
|
||||||
|
|
||||||
data: PagedResultDto<IdentityUserDto> = { items: [], totalCount: 0 };
|
|
||||||
|
|
||||||
@ViewChild('modalContent', { static: false })
|
|
||||||
modalContent!: TemplateRef<any>;
|
|
||||||
|
|
||||||
form!: UntypedFormGroup;
|
|
||||||
password:string;
|
|
||||||
selected?: IdentityUserDto;
|
|
||||||
|
|
||||||
selectedUserRoles?: IdentityRoleDto[];
|
|
||||||
|
|
||||||
// roles?: IdentityRoleDto[];
|
|
||||||
roles: (IdentityRoleDto & { selected: boolean })[] = []; // Use intersection type to add 'selected'
|
|
||||||
|
|
||||||
visiblePermissions = false;
|
|
||||||
|
|
||||||
providerKey?: string;
|
|
||||||
|
|
||||||
isModalVisible?: boolean;
|
|
||||||
|
|
||||||
modalBusy = false;
|
|
||||||
|
|
||||||
permissionManagementKey = ePermissionManagementComponents.PermissionManagement;
|
|
||||||
|
|
||||||
entityDisplayName: string;
|
|
||||||
|
|
||||||
inputKey = eFormComponets.FormCheckboxComponent;
|
|
||||||
|
|
||||||
trackByFn: TrackByFunction<AbstractControl> = (index, item) => Object.keys(item)[0] || index;
|
|
||||||
isDropdownOpen = false;
|
|
||||||
|
|
||||||
toggleDropdown() {
|
|
||||||
this.isDropdownOpen = !this.isDropdownOpen;
|
|
||||||
|
|
||||||
// After the dropdown is shown, focus the first item in the dropdown
|
|
||||||
setTimeout(() => {
|
|
||||||
if (this.firstDropdownItem) {
|
|
||||||
this.firstDropdownItem.nativeElement.focus();
|
|
||||||
}
|
|
||||||
}, 100); // Delay to ensure dropdown is rendered
|
|
||||||
}
|
|
||||||
|
|
||||||
closeDropdown() {
|
|
||||||
this.isDropdownOpen = false;
|
|
||||||
}
|
|
||||||
actionItems = [
|
|
||||||
{ label: 'Edit', icon: 'pi pi-pencil', command: () => this.edit("") },
|
|
||||||
{ label: 'Delete', icon: 'pi pi-trash', command: () => this.delete("","") },
|
|
||||||
// { label: 'Permissions', icon: 'pi pi-shield', command: () => this.openPermissionsModal("") },
|
|
||||||
];
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
onVisiblePermissionChange = (event: boolean) => {
|
|
||||||
debugger
|
|
||||||
this.visiblePermissions = event;
|
|
||||||
};
|
|
||||||
|
|
||||||
get roleGroups(): UntypedFormGroup[] {
|
|
||||||
return ((this.form.get('roleNames') as UntypedFormArray)?.controls as UntypedFormGroup[]) || [];
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit() {
|
|
||||||
this.hookToQuery();
|
|
||||||
}
|
|
||||||
formValid() {
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
// buildForm() {
|
|
||||||
// debugger
|
|
||||||
// const data = new FormPropData(this.injector, this.selected);
|
|
||||||
// this.form = generateFormFromProps(data);
|
|
||||||
|
|
||||||
// this.service.getAssignableRoles().subscribe(({ items }) => {
|
|
||||||
// this.roles = items;
|
|
||||||
// if (this.roles) {
|
|
||||||
// this.form.addControl(
|
|
||||||
// 'roleNames',
|
|
||||||
// this.fb.array(
|
|
||||||
// this.roles.map(role =>
|
|
||||||
// this.fb.group({
|
|
||||||
// [role.name as string]: [
|
|
||||||
// this.selected?.id
|
|
||||||
// ? !!this.selectedUserRoles?.find(userRole => userRole.id === role.id)
|
|
||||||
// : role.isDefault,
|
|
||||||
// ],
|
|
||||||
// }),
|
|
||||||
// ),
|
|
||||||
// ),
|
|
||||||
// );
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
|
|
||||||
// openModal() {
|
|
||||||
// this.buildForm();
|
|
||||||
// this.isModalVisible = true;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// add() {
|
|
||||||
// debugger
|
|
||||||
// this.selected = {} as IdentityUserDto;
|
|
||||||
// this.selectedUserRoles = [] as IdentityRoleDto[];
|
|
||||||
// this.openModal();
|
|
||||||
// }
|
|
||||||
|
|
||||||
// edit(id: string) {
|
|
||||||
// debugger
|
|
||||||
// this.service
|
|
||||||
// .get(id)
|
|
||||||
// .pipe(
|
|
||||||
// tap(user => (this.selected = user)),
|
|
||||||
// switchMap(() => this.service.getRoles(id)),
|
|
||||||
// )
|
|
||||||
// .subscribe(userRole => {
|
|
||||||
// debugger
|
|
||||||
|
|
||||||
// this.selectedUserRoles = userRole.items || [];
|
|
||||||
// this.openModal();
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
|
|
||||||
// save() {
|
|
||||||
// if (!this.form.valid || this.modalBusy) return;
|
|
||||||
// this.modalBusy = true;
|
|
||||||
|
|
||||||
// const { roleNames = [] } = this.form.value;
|
|
||||||
// const mappedRoleNames =
|
|
||||||
// roleNames
|
|
||||||
// .filter((role: { [key: string]: any }) => !!role[Object.keys(role)[0]])
|
|
||||||
// .map((role: { [key: string]: any }) => Object.keys(role)[0]) || [];
|
|
||||||
|
|
||||||
// const { id } = this.selected || {};
|
|
||||||
|
|
||||||
// (id
|
|
||||||
// ? this.service.update(id, {
|
|
||||||
// ...this.selected,
|
|
||||||
// ...this.form.value,
|
|
||||||
// roleNames: mappedRoleNames,
|
|
||||||
// })
|
|
||||||
// : this.service.create({ ...this.form.value, roleNames: mappedRoleNames })
|
|
||||||
// )
|
|
||||||
// .pipe(finalize(() => (this.modalBusy = false)))
|
|
||||||
// .subscribe(() => {
|
|
||||||
// this.isModalVisible = false;
|
|
||||||
// this.toasterService.success('AbpUi::SavedSuccessfully');
|
|
||||||
// this.list.get();
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
buildForm() {
|
|
||||||
this.service.getAssignableRoles().subscribe(({ items }) => {
|
|
||||||
this.roles = items.map(role => ({
|
|
||||||
...role,
|
|
||||||
selected: this.selectedUserRoles.some(userRole => userRole.id === role.id),
|
|
||||||
}));
|
|
||||||
|
|
||||||
// Initialize the selected roles based on existing data for selected user
|
|
||||||
if (this.selected?.id) {
|
|
||||||
this.roles.forEach(role => {
|
|
||||||
role.selected = this.selectedUserRoles.some(userRole => userRole.id === role.id);
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
// Default values when creating a new user
|
|
||||||
this.roles.forEach(role => {
|
|
||||||
role.selected = role.isDefault;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
openModal() {
|
|
||||||
this.loadRoles(); // Load roles when modal opens
|
|
||||||
this.isModalVisible = true;
|
|
||||||
}
|
|
||||||
loadRoles() {
|
|
||||||
this.service.getAssignableRoles().subscribe(({ items }) => {
|
|
||||||
this.roles = items.map(role => ({
|
|
||||||
...role, // spread IdentityRoleDto properties
|
|
||||||
selected: false, // Initially no role is selected
|
|
||||||
}));
|
|
||||||
});
|
|
||||||
}
|
|
||||||
add() {
|
|
||||||
this.selected = {} as IdentityUserDto;
|
|
||||||
this.selectedUserRoles = [] as IdentityRoleDto[];
|
|
||||||
this.password = ''; // Store password separately
|
|
||||||
|
|
||||||
this.openModal();
|
|
||||||
}
|
|
||||||
|
|
||||||
edit(id: string) {
|
|
||||||
this.service
|
|
||||||
.get(id)
|
|
||||||
.pipe(finalize(() => this.buildForm()))
|
|
||||||
.subscribe(user => {
|
|
||||||
this.selected = user;
|
|
||||||
this.service.getRoles(id).subscribe(userRoles => {
|
|
||||||
this.selectedUserRoles = userRoles.items || [];
|
|
||||||
});
|
|
||||||
});
|
|
||||||
this.openModal();
|
|
||||||
}
|
|
||||||
|
|
||||||
// Save user data (either create or update)
|
|
||||||
save(form: NgForm) {
|
|
||||||
debugger;
|
|
||||||
if (this.modalBusy || form.invalid) return;
|
|
||||||
|
|
||||||
this.modalBusy = true;
|
|
||||||
|
|
||||||
// Prepare roleNames array
|
|
||||||
// Prepare roleNames array
|
|
||||||
const selectedRoleNames = this.roles
|
|
||||||
.filter(role => role.selected) // Only include selected roles
|
|
||||||
.map(role => role.name); // Extract role names
|
|
||||||
|
|
||||||
// Create user payload
|
|
||||||
|
|
||||||
const userPayload: any = {
|
|
||||||
userName: this.selected.userName,
|
|
||||||
name: this.selected.name,
|
|
||||||
surname: this.selected.surname,
|
|
||||||
email: this.selected.email,
|
|
||||||
phoneNumber: this.selected.phoneNumber,
|
|
||||||
isActive: this.selected.isActive,
|
|
||||||
lockoutEnabled: this.selected.lockoutEnabled,
|
|
||||||
roleNames: selectedRoleNames, // Include selected roles
|
|
||||||
|
|
||||||
};
|
|
||||||
|
|
||||||
// Only include password if creating a new user
|
|
||||||
if (!this.selected.id && this.password) {
|
|
||||||
userPayload.password = this.password;
|
|
||||||
}
|
|
||||||
// Handle create or update
|
|
||||||
const saveObservable = this.selected.id
|
|
||||||
? this.service.update(this.selected.id, userPayload) // Update if id exists
|
|
||||||
: this.service.create(userPayload); // Create if no id
|
|
||||||
|
|
||||||
saveObservable.pipe(finalize(() => (this.modalBusy = false))).subscribe(() => {
|
|
||||||
this.isModalVisible = false;
|
|
||||||
this.toasterService.success('AbpUi::SavedSuccessfully');
|
|
||||||
this.list.get(); // Reload the list if needed
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
private getRoleNames() {
|
|
||||||
return this.roles.filter(role => role.selected).map(role => role.name);
|
|
||||||
}
|
|
||||||
|
|
||||||
delete(id: string, userName: string) {
|
|
||||||
this.confirmationService
|
|
||||||
.warn('AbpIdentity::UserDeletionConfirmationMessage', 'AbpIdentity::AreYouSure', {
|
|
||||||
messageLocalizationParams: [userName],
|
|
||||||
})
|
|
||||||
.subscribe((status: Confirmation.Status) => {
|
|
||||||
if (status === Confirmation.Status.confirm) {
|
|
||||||
this.service.delete(id).subscribe(() => {
|
|
||||||
this.toasterService.success('AbpUi::DeletedSuccessfully');
|
|
||||||
this.list.get();
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
sort(data: any) {
|
|
||||||
const { prop, dir } = data.sorts[0];
|
|
||||||
this.list.sortKey = prop;
|
|
||||||
this.list.sortOrder = dir;
|
|
||||||
}
|
|
||||||
|
|
||||||
// private hookToQuery() {
|
|
||||||
// this.list.hookToQuery(query => this.service.getList(query)).subscribe(res => (this.data = res));
|
|
||||||
// }
|
|
||||||
private hookToQuery() {
|
|
||||||
this.list
|
|
||||||
.hookToQuery(query => {
|
|
||||||
console.log('Query:', query); // Log the query
|
|
||||||
return this.service.getList(query);
|
|
||||||
})
|
|
||||||
.subscribe(res => {
|
|
||||||
debugger;
|
|
||||||
this.data = res;
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
openPermissionsModal(providerKey: string, entityDisplayName?: string) {
|
|
||||||
debugger;
|
|
||||||
this.providerKey = providerKey;
|
|
||||||
this.entityDisplayName = entityDisplayName;
|
|
||||||
setTimeout(() => {
|
|
||||||
this.visiblePermissions = true;
|
|
||||||
}, 0);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -7,7 +7,6 @@ export const APP_ROUTE_PROVIDER = [
|
|||||||
|
|
||||||
function configureRoutes(routesService: RoutesService) {
|
function configureRoutes(routesService: RoutesService) {
|
||||||
return () => {
|
return () => {
|
||||||
|
|
||||||
routesService.add([
|
routesService.add([
|
||||||
{
|
{
|
||||||
path: '/',
|
path: '/',
|
||||||
@ -16,7 +15,6 @@ function configureRoutes(routesService: RoutesService) {
|
|||||||
order: 1,
|
order: 1,
|
||||||
layout: eLayoutType.application,
|
layout: eLayoutType.application,
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
path: '/appointment',
|
path: '/appointment',
|
||||||
name: 'Appointments',
|
name: 'Appointments',
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user