Skip to content

Commit b67fa1a

Browse files
committed
#79: aligned user page with angular UI
1 parent c4b6df9 commit b67fa1a

File tree

15 files changed

+406
-63
lines changed

15 files changed

+406
-63
lines changed
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
using System.ComponentModel.DataAnnotations;
2+
using Abp.AutoMapper;
3+
using Abp.MultiTenancy;
4+
5+
namespace AbpCompanyName.AbpProjectName.MultiTenancy.Dto
6+
{
7+
[AutoMapTo(typeof(Tenant))]
8+
public class EditTenantDto
9+
{
10+
[Required]
11+
[StringLength(AbpTenantBase.MaxTenancyNameLength)]
12+
[RegularExpression(Tenant.TenancyNameRegex)]
13+
public string TenancyName { get; set; }
14+
15+
[Required]
16+
[StringLength(Tenant.MaxNameLength)]
17+
public string Name { get; set; }
18+
19+
public bool IsActive { get; set; }
20+
}
21+
}

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

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -69,5 +69,7 @@
6969
<text name="Roles">Roller</text>
7070
<text name="DisplayName">Görünen ad</text>
7171

72+
<text name="Edit">Düzenle</text>
73+
<text name="Delete">Sil</text>
7274
</texts>
7375
</localizationDictionary>

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

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -69,5 +69,7 @@
6969
<text name="Roles">Roles</text>
7070
<text name="DisplayName">Display Name</text>
7171

72+
<text name="Edit">Edit</text>
73+
<text name="Delete">Delete</text>
7274
</texts>
7375
</localizationDictionary>

aspnet-core/src/AbpCompanyName.AbpProjectName.Web.Mvc/AbpCompanyName.AbpProjectName.Web.Mvc.csproj

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@
1818
<ItemGroup>
1919
<Content Include="wwwroot\view-resources\Views\Shared\_Layout.js" />
2020
<Content Include="wwwroot\view-resources\Views\Tenants\_EditTenantModal.js" />
21+
<Content Include="wwwroot\view-resources\Views\Users\_EditUserModal.js" />
2122
</ItemGroup>
2223

2324
<ItemGroup>

aspnet-core/src/AbpCompanyName.AbpProjectName.Web.Mvc/Controllers/UsersController.cs

Lines changed: 24 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,12 @@
1-
using System.Threading.Tasks;
1+
using System.Linq;
2+
using System.Threading.Tasks;
23
using Abp.Application.Services.Dto;
34
using Abp.AspNetCore.Mvc.Authorization;
45
using AbpCompanyName.AbpProjectName.Authorization;
56
using AbpCompanyName.AbpProjectName.Controllers;
7+
using AbpCompanyName.AbpProjectName.Roles;
68
using AbpCompanyName.AbpProjectName.Users;
9+
using AbpCompanyName.AbpProjectName.Web.Models.Users;
710
using Microsoft.AspNetCore.Mvc;
811

912
namespace AbpCompanyName.AbpProjectName.Web.Controllers
@@ -20,8 +23,26 @@ public UsersController(IUserAppService userAppService)
2023

2124
public async Task<ActionResult> Index()
2225
{
23-
var output = await _userAppService.GetAll(new PagedResultRequestDto { MaxResultCount = int.MaxValue }); //Paging not implemented yet
24-
return View(output);
26+
var users = (await _userAppService.GetAll(new PagedResultRequestDto {MaxResultCount = int.MaxValue})).Items; //Paging not implemented yet
27+
var roles = (await _userAppService.GetRoles()).Items;
28+
var model = new UserListViewModel
29+
{
30+
Users = users,
31+
Roles = roles
32+
};
33+
return View(model);
34+
}
35+
36+
public async Task<ActionResult> EditUserModal(long userId)
37+
{
38+
var user = await _userAppService.Get(new EntityDto<long>(userId));
39+
var roles = (await _userAppService.GetRoles()).Items;
40+
var model = new EditUserModalViewModel
41+
{
42+
User = user,
43+
Roles = roles
44+
};
45+
return View("_EditUserModal", model);
2546
}
2647
}
2748
}
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
using System.Collections.Generic;
2+
using System.Linq;
3+
using AbpCompanyName.AbpProjectName.Roles.Dto;
4+
using AbpCompanyName.AbpProjectName.Users.Dto;
5+
6+
namespace AbpCompanyName.AbpProjectName.Web.Models.Users
7+
{
8+
public class EditUserModalViewModel
9+
{
10+
public UserDto User { get; set; }
11+
12+
public IReadOnlyList<RoleDto> Roles { get; set; }
13+
14+
public bool UserIsInRole(RoleDto role)
15+
{
16+
return User.Roles != null && User.Roles.Any(r => r == role.Name);
17+
}
18+
}
19+
20+
public class UserListViewModel
21+
{
22+
public IReadOnlyList<UserDto> Users { get; set; }
23+
24+
public IReadOnlyList<RoleDto> Roles { get; set; }
25+
}
26+
}

aspnet-core/src/AbpCompanyName.AbpProjectName.Web.Mvc/Views/Tenants/_EditTenantModal.cshtml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
@{
66
Layout = null;
77
}
8-
@Html.Partial("~/Views/Shared/Modals/_ModalHeader.cshtml", new ModalHeaderViewModel(L("ChangeTenant")))
8+
@Html.Partial("~/Views/Shared/Modals/_ModalHeader.cshtml", new ModalHeaderViewModel(L("EditTenant")))
99

1010
<div class="modal-body">
1111
<form name="TenantEditForm" role="form" novalidate class="form-validation">
Lines changed: 119 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
@using Abp.Authorization.Users
22
@using AbpCompanyName.AbpProjectName.Web.Startup
3-
@model Abp.Application.Services.Dto.PagedResultDto<AbpCompanyName.AbpProjectName.Users.Dto.UserDto>
3+
@model AbpCompanyName.AbpProjectName.Web.Models.Users.UserListViewModel
44
@{
55
ViewBag.CurrentPageName = PageNames.Users; //The menu item will be active for this page.
66
}
@@ -27,9 +27,7 @@
2727
<i class="material-icons">more_vert</i>
2828
</a>
2929
<ul class="dropdown-menu pull-right">
30-
<li><a href="javascript:void(0);" class=" waves-effect waves-block">Action</a></li>
31-
<li><a href="javascript:void(0);" class=" waves-effect waves-block">Another action</a></li>
32-
<li><a href="javascript:void(0);" class=" waves-effect waves-block">Something else here</a></li>
30+
<li><a id="RefreshButton" href="javascript:void(0);" class="waves-effect waves-block"><i class="material-icons">refresh</i>Refresh</a></li>
3331
</ul>
3432
</li>
3533
</ul>
@@ -45,15 +43,24 @@
4543
</tr>
4644
</thead>
4745
<tbody>
48-
@foreach (var user in Model.Items)
49-
{
46+
@foreach (var user in Model.Users)
47+
{
5048
<tr>
5149
<td>@user.UserName</td>
5250
<td>@user.FullName</td>
5351
<td>@user.EmailAddress</td>
54-
<td>@L(user.IsActive ? "Yes" : "No")</td>
52+
<td><i class="material-icons" style="color:@(user.IsActive ? "green":"red");">@(user.IsActive ? "check_box" : "indeterminate_check_box")</i></td>
53+
<td class="dropdown">
54+
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">
55+
<i class="material-icons">menu</i>
56+
</a>
57+
<ul class="dropdown-menu pull-right">
58+
<li><a href="#" class="waves-effect waves-block edit-user" data-user-id="@user.Id" data-toggle="modal" data-target="#UserEditModal"><i class="material-icons">edit</i>@L("Edit")</a></li>
59+
<li><a href="#" class="waves-effect waves-block delete-user" data-user-id="@user.Id" data-user-name="@user.UserName"><i class="material-icons">delete_sweep</i>@L("Delete")</a></li>
60+
</ul>
61+
</td>
5562
</tr>
56-
}
63+
}
5764
</tbody>
5865
</table>
5966
<button type="button" class="btn btn-primary btn-circle waves-effect waves-circle waves-float pull-right" data-toggle="modal" data-target="#UserCreateModal">
@@ -66,53 +73,114 @@
6673
<div class="modal fade" id="UserCreateModal" tabindex="-1" role="dialog" aria-labelledby="UserCreateModalLabel" data-backdrop="static">
6774
<div class="modal-dialog" role="document">
6875
<div class="modal-content">
69-
<form name="userCreateForm" role="form" novalidate class="form-validation">
70-
<div class="modal-header">
71-
<h4 class="modal-title">
72-
<span>@L("CreateNewUser")</span>
73-
</h4>
74-
</div>
75-
<div class="modal-body">
76-
<div class="form-group form-float">
77-
<div class="form-line">
78-
<input class="form-control" type="text" name="UserName" required maxlength="@AbpUserBase.MaxUserNameLength" minlength="2">
79-
<label class="form-label">@L("UserName")</label>
80-
</div>
81-
</div>
82-
<div class="form-group form-float">
83-
<div class="form-line">
84-
<input type="text" name="Name" class="form-control" required maxlength="@AbpUserBase.MaxNameLength">
85-
<label class="form-label">@L("Name")</label>
86-
</div>
87-
</div>
88-
<div class="form-group form-float">
89-
<div class="form-line">
90-
<input type="text" name="Surname" class="form-control" required maxlength="@AbpUserBase.MaxSurnameLength">
91-
<label class="form-label">@L("Surname")</label>
92-
</div>
93-
</div>
94-
<div class="form-group form-float">
95-
<div class="form-line">
96-
<input type="email" name="EmailAddress" class="form-control" required maxlength="@AbpUserBase.MaxEmailAddressLength">
97-
<label class="form-label">@L("EmailAddress")</label>
76+
<div class="modal-header">
77+
<h4 class="modal-title">
78+
<span>@L("CreateNewUser")</span>
79+
</h4>
80+
</div>
81+
<div class="modal-body">
82+
<form name="userCreateForm" role="form" novalidate class="form-validation">
83+
<ul class="nav nav-tabs tab-nav-right" role="tablist">
84+
<li role="presentation" class="active"><a href="#create-user-details" data-toggle="tab">User Details</a></li>
85+
<li role="presentation"><a href="#create-user-roles" data-toggle="tab">User Roles</a></li>
86+
</ul>
87+
<div class="tab-content">
88+
<div role="tabpanel" class="tab-pane animated fadeIn active" id="create-user-details">
89+
<div class="row clearfix" style="margin-top:10px;">
90+
<div class="col-sm-12">
91+
<div class="form-group form-float">
92+
<div class="form-line">
93+
<input class="form-control" type="text" name="UserName" required maxlength="@AbpUserBase.MaxUserNameLength" minlength="2">
94+
<label class="form-label">@L("UserName")</label>
95+
</div>
96+
</div>
97+
</div>
98+
</div>
99+
<div class="row clearfix">
100+
<div class="col-sm-6">
101+
<div class="form-group form-float">
102+
<div class="form-line">
103+
<input type="text" name="Name" class="form-control" required maxlength="@AbpUserBase.MaxNameLength">
104+
<label class="form-label">@L("Name")</label>
105+
</div>
106+
</div>
107+
</div>
108+
<div class="col-sm-6">
109+
<div class="form-group form-float">
110+
<div class="form-line">
111+
<input type="text" name="Surname" class="form-control" required maxlength="@AbpUserBase.MaxSurnameLength">
112+
<label class="form-label">@L("Surname")</label>
113+
</div>
114+
</div>
115+
</div>
116+
</div>
117+
<div class="row clearfix">
118+
<div class="col-sm-12">
119+
<div class="form-group form-float">
120+
<div class="form-line">
121+
<input type="email" name="EmailAddress" class="form-control" required maxlength="@AbpUserBase.MaxEmailAddressLength">
122+
<label class="form-label">@L("EmailAddress")</label>
123+
</div>
124+
</div>
125+
</div>
126+
</div>
127+
<div class="row clearfix">
128+
<div class="col-sm-12">
129+
<div class="form-group form-float">
130+
<div class="form-line">
131+
<input type="password" id="Password" name="Password" class="form-control" required maxlength="@AbpUserBase.MaxPlainPasswordLength">
132+
<label class="form-label">@L("Password")</label>
133+
</div>
134+
</div>
135+
</div>
136+
</div>
137+
<div class="row clearfix">
138+
<div class="col-sm-12">
139+
<div class="form-group form-float">
140+
<div class="form-line">
141+
<input type="password" id="ConfirmPassword" name="ConfirmPassword" class="form-control" required maxlength="@AbpUserBase.MaxPlainPasswordLength">
142+
<label class="form-label">@L("ConfirmPassword")</label>
143+
</div>
144+
</div>
145+
</div>
146+
</div>
147+
<div class="row clearfix">
148+
<div class="col-sm-12">
149+
<div class="checkbox">
150+
<input type="checkbox" name="IsActive" value="true" id="CreateUserIsActive" class="filled-in" checked />
151+
<label for="CreateUserIsActive">@L("IsActive")</label>
152+
</div>
153+
</div>
154+
</div>
98155
</div>
99-
</div>
100-
<div class="form-group form-float">
101-
<div class="form-line">
102-
<input type="password" name="Password" class="form-control" required maxlength="@AbpUserBase.MaxPlainPasswordLength">
103-
<label class="form-label">@L("Password")</label>
156+
<div role="tabpanel" class="tab-pane animated fadeIn" id="create-user-roles">
157+
<div class="row">
158+
<div class="col-sm-12 ">
159+
@foreach (var role in Model.Roles)
160+
{
161+
<div class="col-sm-6">
162+
<input type="checkbox" name="role" value="@role.NormalizedName" title="@role.Description" class="filled-in" id="[email protected]" />
163+
<label for="[email protected]" title="@role.DisplayName">@role.Name</label>
164+
</div>
165+
}
166+
</div>
167+
</div>
104168
</div>
105169
</div>
106-
<div class="checkbox">
107-
<input type="checkbox" name="IsActive" value="true" id="CreateUserIsActive" class="filled-in" checked />
108-
<label for="CreateUserIsActive">@L("IsActive")</label>
170+
<div class="modal-footer">
171+
<button type="button" class="btn btn-default waves-effect" data-dismiss="modal">@L("Cancel")</button>
172+
<button type="submit" class="btn btn-primary waves-effect">@L("Save")</button>
109173
</div>
110-
</div>
111-
<div class="modal-footer">
112-
<button type="button" class="btn btn-default waves-effect" data-dismiss="modal">@L("Cancel")</button>
113-
<button type="submit" class="btn btn-primary waves-effect">@L("Save")</button>
114-
</div>
115-
</form>
174+
</form>
175+
</div>
116176
</div>
117177
</div>
118178
</div>
179+
180+
<div class="modal fade" id="UserEditModal" tabindex="-1" role="dialog" aria-labelledby="UserEditModalLabel" data-backdrop="static">
181+
<div class="modal-dialog" role="document">
182+
<div class="modal-content">
183+
184+
</div>
185+
</div>
186+
</div>

0 commit comments

Comments
 (0)