Skip to content

Commit 73b3d6d

Browse files
yekalkanyekalkan
authored
Merge pull request #394 from personball/master
Implements list query filter for users/roles/tenants in angular template
2 parents 9b76d1e + 6644dd8 commit 73b3d6d

File tree

11 files changed

+131
-101
lines changed

11 files changed

+131
-101
lines changed

‎angular/src/app/roles/roles.component.html

Lines changed: 19 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,11 @@
1-
<div class="row clearfix" [@routerTransition]>
1+
<div class="row clearfix" [@routerTransition]>
22
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
33
<div class="card main-content">
44
<div class="header">
55
<h2>{{ "Roles" | localize }}</h2>
66
<ul class="header-dropdown m-r--5">
77
<li>
8-
<button
9-
mat-icon-button
10-
[matMenuTriggerFor]="headerMenu"
11-
class="header-dropdown-mat-icon-button"
12-
>
8+
<button mat-icon-button [matMenuTriggerFor]="headerMenu" class="header-dropdown-mat-icon-button">
139
<mat-icon>more_vert</mat-icon>
1410
</button>
1511
<mat-menu #headerMenu="matMenu">
@@ -22,6 +18,18 @@ <h2>{{ "Roles" | localize }}</h2>
2218
</ul>
2319
</div>
2420
<div class="body table-responsive">
21+
<!--query start-->
22+
<div class="row clearfix">
23+
<form>
24+
<mat-form-field>
25+
<input matInput [placeholder]="l('Filter')" [(ngModel)]="keyword" name="keyword">
26+
</mat-form-field>
27+
28+
<button mat-raised-button color="primary" (click)="getDataPage(1)">{{ 'Search' | localize }}</button>
29+
30+
</form>
31+
</div>
32+
<!--query end-->
2533
<table class="table table-hover table-striped" [busy]="isTableLoading">
2634
<thead>
2735
<tr>
@@ -31,8 +39,7 @@ <h2>{{ "Roles" | localize }}</h2>
3139
</tr>
3240
</thead>
3341
<tbody>
34-
<tr
35-
*ngFor="
42+
<tr *ngFor="
3643
let role of (roles
3744
| paginate
3845
: {
@@ -41,8 +48,7 @@ <h2>{{ "Roles" | localize }}</h2>
4148
currentPage: pageNumber,
4249
totalItems: totalItems
4350
})
44-
"
45-
>
51+
">
4652
<td>{{ role.name }}</td>
4753
<td>{{ role.displayName }}</td>
4854
<td>
@@ -63,22 +69,11 @@ <h2>{{ "Roles" | localize }}</h2>
6369
</tr>
6470
</tbody>
6571
</table>
66-
<div
67-
class="abp-pagination-controls-wrapper"
68-
*ngIf="totalItems > pageSize"
69-
>
70-
<abp-pagination-controls
71-
(pageChange)="getDataPage($event)"
72-
id="server"
73-
>
72+
<div class="abp-pagination-controls-wrapper" *ngIf="totalItems > pageSize">
73+
<abp-pagination-controls (pageChange)="getDataPage($event)" id="server">
7474
</abp-pagination-controls>
7575
</div>
76-
<button
77-
mat-mini-fab
78-
color="primary"
79-
class="pull-right"
80-
(click)="createRole()"
81-
>
76+
<button mat-mini-fab color="primary" class="pull-right" (click)="createRole()">
8277
<mat-icon>add</mat-icon>
8378
</button>
8479
</div>

‎angular/src/app/roles/roles.component.ts

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,11 +20,20 @@ class PagedRolesRequestDto extends PagedRequestDto {
2020

2121
@Component({
2222
templateUrl: './roles.component.html',
23-
animations: [appModuleAnimation()]
23+
animations: [appModuleAnimation()],
24+
styles: [
25+
`
26+
mat-form-field {
27+
padding: 10px;
28+
}
29+
`
30+
]
2431
})
2532
export class RolesComponent extends PagedListingComponentBase<RoleDto> {
2633
roles: RoleDto[] = [];
2734

35+
keyword = '';
36+
2837
constructor(
2938
injector: Injector,
3039
private _rolesService: RoleServiceProxy,
@@ -38,6 +47,9 @@ export class RolesComponent extends PagedListingComponentBase<RoleDto> {
3847
pageNumber: number,
3948
finishedCallback: Function
4049
): void {
50+
51+
request.keyword = this.keyword;
52+
4153
this._rolesService
4254
.getAll(request.keyword, request.skipCount, request.maxResultCount)
4355
.pipe(

‎angular/src/app/tenants/tenants.component.html

Lines changed: 21 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<div class="row clearfix" [@routerTransition]>
1+
<div class="row clearfix" [@routerTransition]>
22
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
33
<div class="card main-content">
44
<div class="header">
@@ -22,6 +22,26 @@ <h2>{{ "Tenants" | localize }}</h2>
2222
</ul>
2323
</div>
2424
<div class="body table-responsive">
25+
<!--query start-->
26+
<div class="row clearfix">
27+
<form>
28+
<mat-form-field>
29+
<input matInput [placeholder]="l('Filter')" [(ngModel)]="keyword" name="keyword">
30+
</mat-form-field>
31+
32+
<mat-form-field>
33+
<mat-select [placeholder]="l('IsActive')" [(ngModel)]="isActive" name="isActive">
34+
<mat-option value="">{{ 'All' | localize }}</mat-option>
35+
<mat-option value="true">{{ 'Yes' | localize }}</mat-option>
36+
<mat-option value="false">{{ 'No' | localize }}</mat-option>
37+
</mat-select>
38+
</mat-form-field>
39+
40+
<button mat-raised-button color="primary" (click)="getDataPage(1)">{{ 'Search' | localize }}</button>
41+
42+
</form>
43+
</div>
44+
<!--query end-->
2545
<table class="table table-hover table-striped" [busy]="isTableLoading">
2646
<thead>
2747
<tr>

‎angular/src/app/tenants/tenants.component.ts

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,10 +21,19 @@ class PagedTenantsRequestDto extends PagedRequestDto {
2121

2222
@Component({
2323
templateUrl: './tenants.component.html',
24-
animations: [appModuleAnimation()]
24+
animations: [appModuleAnimation()],
25+
styles: [
26+
`
27+
mat-form-field {
28+
padding: 10px;
29+
}
30+
`
31+
]
2532
})
2633
export class TenantsComponent extends PagedListingComponentBase<TenantDto> {
2734
tenants: TenantDto[] = [];
35+
keyword = '';
36+
isActive: boolean | null;
2837

2938
constructor(
3039
injector: Injector,
@@ -39,6 +48,10 @@ export class TenantsComponent extends PagedListingComponentBase<TenantDto> {
3948
pageNumber: number,
4049
finishedCallback: Function
4150
): void {
51+
52+
request.keyword = this.keyword;
53+
request.isActive = this.isActive;
54+
4255
this._tenantService
4356
.getAll(request.keyword, request.isActive, request.skipCount, request.maxResultCount)
4457
.pipe(

‎angular/src/app/users/users.component.html

Lines changed: 28 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -5,11 +5,7 @@
55
<h2>{{ "Users" | localize }}</h2>
66
<ul class="header-dropdown m-r--5">
77
<li>
8-
<button
9-
mat-icon-button
10-
[matMenuTriggerFor]="headerMenu"
11-
class="header-dropdown-mat-icon-button"
12-
>
8+
<button mat-icon-button [matMenuTriggerFor]="headerMenu" class="header-dropdown-mat-icon-button">
139
<mat-icon>more_vert</mat-icon>
1410
</button>
1511
<mat-menu #headerMenu="matMenu">
@@ -22,6 +18,26 @@ <h2>{{ "Users" | localize }}</h2>
2218
</ul>
2319
</div>
2420
<div class="body table-responsive">
21+
<!--query start-->
22+
<div class="row clearfix">
23+
<form>
24+
<mat-form-field>
25+
<input matInput [placeholder]="l('Filter')" [(ngModel)]="keyword" name="keyword">
26+
</mat-form-field>
27+
28+
<mat-form-field>
29+
<mat-select [placeholder]="l('IsActive')" [(ngModel)]="isActive" name="isActive">
30+
<mat-option value="">{{ 'All' | localize }}</mat-option>
31+
<mat-option value="true">{{ 'Yes' | localize }}</mat-option>
32+
<mat-option value="false">{{ 'No' | localize }}</mat-option>
33+
</mat-select>
34+
</mat-form-field>
35+
36+
<button mat-raised-button color="primary" (click)="getDataPage(1)">{{ 'Search' | localize }}</button>
37+
38+
</form>
39+
</div>
40+
<!--query end-->
2541
<table class="table table-hover table-striped" [busy]="isTableLoading">
2642
<thead>
2743
<tr>
@@ -35,8 +51,7 @@ <h2>{{ "Users" | localize }}</h2>
3551
</tr>
3652
</thead>
3753
<tbody>
38-
<tr
39-
*ngFor="
54+
<tr *ngFor="
4055
let user of (users
4156
| paginate
4257
: {
@@ -45,24 +60,15 @@ <h2>{{ "Users" | localize }}</h2>
4560
currentPage: pageNumber,
4661
totalItems: totalItems
4762
})
48-
"
49-
>
63+
">
5064
<td>{{ user.userName }}</td>
5165
<td>{{ user.fullName }}</td>
5266
<td>{{ user.emailAddress }}</td>
5367
<td align="center">
54-
<i
55-
class="material-icons"
56-
*ngIf="user.isActive"
57-
style="color:green;"
58-
>
68+
<i class="material-icons" *ngIf="user.isActive" style="color:green;">
5969
check_box
6070
</i>
61-
<i
62-
class="material-icons"
63-
*ngIf="!user.isActive"
64-
style="color:red;"
65-
>
71+
<i class="material-icons" *ngIf="!user.isActive" style="color:red;">
6672
indeterminate_check_box
6773
</i>
6874
</td>
@@ -88,22 +94,11 @@ <h2>{{ "Users" | localize }}</h2>
8894
</tr>
8995
</tbody>
9096
</table>
91-
<div
92-
class="abp-pagination-controls-wrapper"
93-
*ngIf="totalItems > pageSize"
94-
>
95-
<abp-pagination-controls
96-
(pageChange)="getDataPage($event)"
97-
id="server"
98-
>
97+
<div class="abp-pagination-controls-wrapper" *ngIf="totalItems > pageSize">
98+
<abp-pagination-controls (pageChange)="getDataPage($event)" id="server">
9999
</abp-pagination-controls>
100100
</div>
101-
<button
102-
mat-mini-fab
103-
color="primary"
104-
class="pull-right"
105-
(click)="createUser()"
106-
>
101+
<button mat-mini-fab color="primary" class="pull-right" (click)="createUser()">
107102
<mat-icon>add</mat-icon>
108103
</button>
109104
</div>

‎angular/src/app/users/users.component.ts

Lines changed: 17 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,8 @@ import { Component, Injector } from '@angular/core';
22
import { MatDialog } from '@angular/material';
33
import { finalize } from 'rxjs/operators';
44
import { appModuleAnimation } from '@shared/animations/routerTransition';
5-
import {
6-
PagedListingComponentBase,
7-
PagedRequestDto
8-
} from 'shared/paged-listing-component-base';
9-
import {
10-
UserServiceProxy,
11-
UserDto,
12-
PagedResultDtoOfUserDto
13-
} from '@shared/service-proxies/service-proxies';
5+
import { PagedListingComponentBase, PagedRequestDto } from 'shared/paged-listing-component-base';
6+
import { UserServiceProxy, UserDto, PagedResultDtoOfUserDto } from '@shared/service-proxies/service-proxies';
147
import { CreateUserDialogComponent } from './create-user/create-user-dialog.component';
158
import { EditUserDialogComponent } from './edit-user/edit-user-dialog.component';
169
import { Moment } from 'moment';
@@ -19,16 +12,23 @@ import { ResetPasswordDialogComponent } from './reset-password/reset-password.co
1912
class PagedUsersRequestDto extends PagedRequestDto {
2013
keyword: string;
2114
isActive: boolean | null;
22-
from: Moment | null;
23-
to: Moment | null;
2415
}
2516

2617
@Component({
2718
templateUrl: './users.component.html',
28-
animations: [appModuleAnimation()]
19+
animations: [appModuleAnimation()],
20+
styles: [
21+
`
22+
mat-form-field {
23+
padding: 10px;
24+
}
25+
`
26+
]
2927
})
3028
export class UsersComponent extends PagedListingComponentBase<UserDto> {
3129
users: UserDto[] = [];
30+
keyword = '';
31+
isActive: boolean | null;
3232

3333
constructor(
3434
injector: Injector,
@@ -43,8 +43,12 @@ export class UsersComponent extends PagedListingComponentBase<UserDto> {
4343
pageNumber: number,
4444
finishedCallback: Function
4545
): void {
46+
47+
request.keyword = this.keyword;
48+
request.isActive = this.isActive;
49+
4650
this._userService
47-
.getAll(request.keyword, request.isActive, request.from, request.to, request.skipCount, request.maxResultCount)
51+
.getAll(request.keyword, request.isActive, request.skipCount, request.maxResultCount)
4852
.pipe(
4953
finalize(() => {
5054
finishedCallback();

‎angular/src/shared/service-proxies/service-proxies.ts

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1628,22 +1628,16 @@ export class UserServiceProxy {
16281628
/**
16291629
* @param keyword (optional)
16301630
* @param isActive (optional)
1631-
* @param from (optional)
1632-
* @param to (optional)
16331631
* @param skipCount (optional)
16341632
* @param maxResultCount (optional)
16351633
* @return Success
16361634
*/
1637-
getAll(keyword: string | null | undefined, isActive: boolean | null | undefined, from: moment.Moment | null | undefined, to: moment.Moment | null | undefined, skipCount: number | null | undefined, maxResultCount: number | null | undefined): Observable<PagedResultDtoOfUserDto> {
1635+
getAll(keyword: string | null | undefined, isActive: boolean | null | undefined, skipCount: number | null | undefined, maxResultCount: number | null | undefined): Observable<PagedResultDtoOfUserDto> {
16381636
let url_ = this.baseUrl + "/api/services/app/User/GetAll?";
16391637
if (keyword !== undefined)
16401638
url_ += "Keyword=" + encodeURIComponent("" + keyword) + "&";
16411639
if (isActive !== undefined)
16421640
url_ += "IsActive=" + encodeURIComponent("" + isActive) + "&";
1643-
if (from !== undefined)
1644-
url_ += "From=" + encodeURIComponent(from ? "" + from.toJSON() : "") + "&";
1645-
if (to !== undefined)
1646-
url_ += "To=" + encodeURIComponent(to ? "" + to.toJSON() : "") + "&";
16471641
if (skipCount !== undefined)
16481642
url_ += "SkipCount=" + encodeURIComponent("" + skipCount) + "&";
16491643
if (maxResultCount !== undefined)

‎aspnet-core/src/AbpCompanyName.AbpProjectName.Application/Users/Dto/PagedUserResultRequestDto.cs

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,5 @@ public class PagedUserResultRequestDto : PagedResultRequestDto
88
{
99
public string Keyword { get; set; }
1010
public bool? IsActive { get; set; }
11-
public DateTimeOffset? From { get; set; }//javascript date within timezone
12-
public DateTimeOffset? To { get; set; }//javascript date within timezone
1311
}
1412
}

‎aspnet-core/src/AbpCompanyName.AbpProjectName.Application/Users/UserAppService.cs

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -138,10 +138,8 @@ protected override UserDto MapToEntityDto(User user)
138138
protected override IQueryable<User> CreateFilteredQuery(PagedUserResultRequestDto input)
139139
{
140140
return Repository.GetAllIncluding(x => x.Roles)
141-
.WhereIf(!input.Keyword.IsNullOrWhiteSpace(), x => x.UserName.Contains(input.Keyword) || x.Name.Contains(input.Keyword))
142-
.WhereIf(input.IsActive.HasValue, x => x.IsActive == input.IsActive)
143-
.WhereIf(input.From.HasValue, x => x.CreationTime >= input.From.Value.LocalDateTime)
144-
.WhereIf(input.To.HasValue, x => x.CreationTime <= input.To.Value.LocalDateTime);
141+
.WhereIf(!input.Keyword.IsNullOrWhiteSpace(), x => x.UserName.Contains(input.Keyword) || x.Name.Contains(input.Keyword) || x.EmailAddress.Contains(input.Keyword))
142+
.WhereIf(input.IsActive.HasValue, x => x.IsActive == input.IsActive);
145143
}
146144

147145
protected override async Task<User> GetEntityByIdAsync(long id)

‎aspnet-core/src/AbpCompanyName.AbpProjectName.Core/Localization/SourceFiles/AbpProjectName.xml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -94,5 +94,6 @@
9494
<text name="StartTyping">Start Typing</text>
9595
<text name="Skins">Skins</text>
9696
<text name="Settings">Settings</text>
97+
<text name="Filter">Filter</text>
9798
</texts>
9899
</localizationDictionary>

0 commit comments

Comments
 (0)