Edit user roles

src/Volo.Abp.Identity.Application.Contracts/Volo/Abp/Identity/IIdentityUserAppService.cs

@@ -10,5 +10,7 @@ namespace Volo.Abp.Identity
         Task<ListResultDto<IdentityRoleDto>> GetRolesAsync(Guid id);
 
         Task UpdateRolesAsync(Guid id, IdentityUserUpdateRolesDto input);
+
+        Task<IdentityUserCreateOrUpdateOutput> GetUserForCreateOrUpdateAsync(Guid? id);
     }
 }

src/Volo.Abp.Identity.Application.Contracts/Volo/Abp/Identity/IdentityUserCreateOrUpdateOutput.cs

@@ -2,7 +2,7 @@
 
 namespace Volo.Abp.Identity
 {
-    public class IdentityUserCreateOrUpdateOutput: EntityDto
+    public class IdentityUserCreateOrUpdateOutput
     {
         public IdentityUserDto User { get; set; }
 

src/Volo.Abp.Identity.Application/Volo/Abp/Identity/IdentityUserAppService.cs

@@ -29,7 +29,7 @@ namespace Volo.Abp.Identity
             );
         }
 
-        public async Task<IdentityUserCreateOrUpdateOutput> GetUserForCreateOrUpdateAsync(Guid id)
+        public async Task<IdentityUserCreateOrUpdateOutput> GetUserForCreateOrUpdateAsync(Guid? id)
         {
             var userRoleDtos = ObjectMapper.Map<List<IdentityRole>, IdentityUserRoleDto[]>(await _roleRepository.GetListAsync());
             var output = new IdentityUserCreateOrUpdateOutput
@@ -37,8 +37,9 @@ namespace Volo.Abp.Identity
                 Roles = userRoleDtos
             };
 
-            var user = await _userManager.GetByIdAsync(id);
+            if (!id.HasValue) return output;
 
+            var user = await _userManager.GetByIdAsync(id.Value);
             output.User = ObjectMapper.Map<IdentityUser, IdentityUserDto>(user);
 
             foreach (var userRoleDto in userRoleDtos)

src/Volo.Abp.Identity.Web/Areas/Identity/Controllers/UsersController.cs

@@ -22,7 +22,9 @@ namespace Volo.Abp.Identity.Web.Areas.Identity.Controllers
 
         public async Task<ActionResult> _Create()
         {
-            return PartialView();
+            var identityUser = await _identityUserAppService.GetUserForCreateOrUpdateAsync(null);
+
+            return PartialView(identityUser);
         }
 
         public async Task<ActionResult> _Update(Guid id)

src/Volo.Abp.Identity.Web/Areas/Identity/Views/Users/_Create.cshtml

@@ -1,4 +1,4 @@
-@model Volo.Abp.Identity.IdentityUserDto
+@model Volo.Abp.Identity.IdentityUserCreateOrUpdateOutput
 
 <div class="modal-header">
     <h5 class="modal-title" id="userModalLabel">Create User</h5>
@@ -7,21 +7,22 @@
     </button>
 </div>
 <div class="modal-body">
+    <form id="createUserForm">
+        <!-- Nav tabs -->
+        <ul class="nav nav-tabs" role="tablist">
+            <li class="nav-item">
+                <a class="nav-link active" data-toggle="tab" href="#userInformations" role="tab">User informations</a>
+            </li>
+            <li class="nav-item">
+                <a class="nav-link" data-toggle="tab" href="#roles" role="tab">Roles</a>
+            </li>
+        </ul>
 
-    <!-- Nav tabs -->
-    <ul class="nav nav-tabs" role="tablist">
-        <li class="nav-item">
-            <a class="nav-link active" data-toggle="tab" href="#userInformations" role="tab">User informations</a>
-        </li>
-        <li class="nav-item">
-            <a class="nav-link" data-toggle="tab" href="#roles" role="tab">Roles</a>
-        </li>
-    </ul>
+        <!-- Tab panes -->
+        <div class="tab-content pt-3">
+
+            <div class="tab-pane active" id="userInformations" role="tabpanel">
 
-    <!-- Tab panes -->
-    <div class="tab-content">
-        <div class="tab-pane active" id="userInformations" role="tabpanel">
-            <form id="createUserForm">
                 <div class="form-group">
                     <label for="userName">User name</label>
                     <input type="text" class="form-control" id="userName" name="UserName" placeholder="User name">
@@ -38,24 +39,24 @@
                     <label for="phoneNumber">Phone number</label>
                     <input type="tel" class="form-control" id="phoneNumber" name="PhoneNumber" placeholder="Phone number">
                 </div>
-            </form>
-        </div>
-        <div class="tab-pane" id="roles" role="tabpanel">
-            @foreach (var role in Model.Roles)
-            {
-                <div class="form-check">
-                    <label class="form-check-label">
-                        <input id="EditUser_@(role.RoleName)" class="form-check-input" type="checkbox" name="@(role.RoleName)" value="true" @Html.Raw(role.IsAssigned ? "checked=\"checked\"" : "")>
-                        <input class="form-check-input" type="checkbox" value="">
-                        @role.RoleName
-                    </label>
-                </div>
-            }
-        </div>
-    </div>
-
 
+            </div>
+            <div class="tab-pane" id="roles" role="tabpanel">
+                <div class="user-role-checkbox-list">
+                    @foreach (var role in Model.Roles)
+                    {
+                        <div class="form-check">
+                            <label class="form-check-label">
+                                <input id="CreateUser_@(role.Name)" class="form-check-input" type="checkbox" name="@(role.Name)" value="true" @Html.Raw(role.IsAssigned ? "checked=\"checked\"" : "")>
+                                @role.Name
+                            </label>
+                        </div>
+                    }
+                </div>
+            </div>
 
+        </div>
+    </form>
 </div>
 <div class="modal-footer">
     <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>

src/Volo.Abp.Identity.Web/Areas/Identity/Views/Users/_Update.cshtml

@@ -1,4 +1,4 @@
-@model Volo.Abp.Identity.IdentityUserDto
+@model Volo.Abp.Identity.IdentityUserCreateOrUpdateOutput
 
 <div class="modal-header">
     <h5 class="modal-title" id="userModalLabel">Update User</h5>
@@ -8,19 +8,51 @@
 </div>
 <div class="modal-body">
     <form id="updateUserForm">
-        <input type="hidden" name="Id" value="@Model.Id"/>
+        <!-- Nav tabs -->
+        <ul class="nav nav-tabs" role="tablist">
+            <li class="nav-item">
+                <a class="nav-link active" data-toggle="tab" href="#userInformations" role="tab">User informations</a>
+            </li>
+            <li class="nav-item">
+                <a class="nav-link" data-toggle="tab" href="#roles" role="tab">Roles</a>
+            </li>
+        </ul>
+
+        <!-- Tab panes -->
+        <div class="tab-content pt-3">
+
+            <div class="tab-pane active" id="userInformations" role="tabpanel">
+
+                <input type="hidden" name="Id" value="@Model.User.Id" />
+
+                <div class="form-group">
+                    <label for="userName">User name</label>
+                    <input type="text" class="form-control" id="userName" name="UserName" placeholder="User name" value="@Model.User.UserName">
+                </div>
+                <div class="form-group">
+                    <label for="email">Email address</label>
+                    <input type="email" class="form-control" id="email" name="Email" placeholder="Enter email" value="@Model.User.Email">
+                </div>
+                <div class="form-group">
+                    <label for="phoneNumber">Phone number</label>
+                    <input type="tel" class="form-control" id="phoneNumber" name="PhoneNumber" placeholder="Phone number" value="@Model.User.PhoneNumber">
+                </div>
+
+            </div>
+            <div class="tab-pane" id="roles" role="tabpanel">
+                <div class="user-role-checkbox-list">
+                    @foreach (var role in Model.Roles)
+                    {
+                        <div class="form-check">
+                            <label class="form-check-label">
+                                <input id="UpdateUser_@(role.Name)" class="form-check-input" type="checkbox" name="@(role.Name)" value="true" @Html.Raw(role.IsAssigned ? "checked=\"checked\"" : "")>
+                                @role.Name
+                            </label>
+                        </div>
+                    }
+                </div>
+            </div>
 
-        <div class="form-group">
-            <label for="userName">User name</label>
-            <input type="text" class="form-control" id="userName" name="UserName" placeholder="User name" value="@Model.UserName">
-        </div>
-        <div class="form-group">
-            <label for="email">Email address</label>
-            <input type="email" class="form-control" id="email" name="Email" placeholder="Enter email" value="@Model.Email">
-        </div>
-        <div class="form-group">
-            <label for="phoneNumber">Phone number</label>
-            <input type="tel" class="form-control" id="phoneNumber" name="PhoneNumber" placeholder="Phone number" value="@Model.PhoneNumber">
         </div>
     </form>
 </div>

src/Volo.Abp.Identity.Web/wwwroot/modules/identity/views/users/index.js

@@ -1,5 +1,5 @@
 $(function () {
-    var identityUserAppService = volo.abp.identity.identityUser;
+    var _identityUserAppService = volo.abp.identity.identityUser;
 
     var dataTable = $('#IdentityUsersTable').DataTable({
         processing: true,
@@ -29,7 +29,7 @@
             }
 
             if (callback) {
-                identityUserAppService.getList(inputFilter).done(function (result) {
+                _identityUserAppService.getList(inputFilter).done(function (result) {
                     callback({
                         recordsTotal: result.totalCount,
                         recordsFiltered: result.totalCount,
@@ -85,7 +85,7 @@
         var id = $(this).data('id');
 
         if (confirm('Are you sure you want to delete?')) {
-            identityUserAppService.delete(id).done(function () {
+            _identityUserAppService.delete(id).done(function () {
                 dataTable.ajax.reload();
             });
         }
@@ -101,10 +101,11 @@
         var $createUserForm = $('#createUserForm');
         var user = $createUserForm.serializeFormToObject();
 
-        identityUserAppService.create(user).done(function () {
-            $('#createUpdateUserModal').modal('hide');
-
-            dataTable.ajax.reload();
+        _identityUserAppService.create(user).done(function (result) {
+            _identityUserAppService.updateRoles(result.id, { roleNames: findAssignedRoleNames() }).done(function () {
+                $('#createUpdateUserModal').modal('hide');
+                dataTable.ajax.reload();
+            });
         });
     });
 
@@ -112,14 +113,30 @@
         var $updateUserForm = $('#updateUserForm');
         var user = $updateUserForm.serializeFormToObject();
 
-        identityUserAppService.update(user.Id, user).done(function () {
-            $('#createUpdateUserModal').modal('hide');
-
-            dataTable.ajax.reload();
+        _identityUserAppService.update(user.Id, user).done(function (result) {
+            _identityUserAppService.updateRoles(result.id, { roleNames: findAssignedRoleNames() }).done(function () {
+                $('#createUpdateUserModal').modal('hide');
+                dataTable.ajax.reload();
+            });
         });
     });
 });
 
+
+function findAssignedRoleNames() {
+    var assignedRoleNames = [];
+
+    $(document).find('.user-role-checkbox-list input[type=checkbox]')
+        .each(function () {
+            if ($(this).is(':checked')) {
+                assignedRoleNames.push($(this).attr('name'));
+            }
+        });
+
+    return assignedRoleNames;
+}
+
+//TODO: move to common script file
 $.fn.serializeFormToObject = function () {
     //serialize to array
     var data = $(this).serializeArray();

src/Volo.Abp/Volo/Abp/Application/Services/IAsyncCrudAppService.cs

@@ -38,8 +38,6 @@ namespace Volo.Abp.Application.Services
     {
         Task<TEntityDto> GetAsync(TPrimaryKey id);
 
-        Task<TEntityDto> GetUserForCreateOrUpdateAsync(Guid id);
-
         Task<PagedResultDto<TEntityDto>> GetListAsync(TGetListInput input);
 
         Task<TEntityDto> CreateAsync(TCreateInput input);