diff --git a/modules/identity/src/Volo.Abp.Identity.Blazor/Pages/Identity/RoleManagement.razor b/modules/identity/src/Volo.Abp.Identity.Blazor/Pages/Identity/RoleManagement.razor
index e6d34cb2c4..361e197cec 100644
--- a/modules/identity/src/Volo.Abp.Identity.Blazor/Pages/Identity/RoleManagement.razor
+++ b/modules/identity/src/Volo.Abp.Identity.Blazor/Pages/Identity/RoleManagement.razor
@@ -35,8 +35,8 @@
                     </DropdownToggle>
                     <DropdownMenu>
                         <DropdownItem Clicked="() => OpenEditModalAsync(context.As<IdentityRoleDto>().Id)">@L["Edit"]</DropdownItem>
-                        <DropdownItem>@L["Permissions"]</DropdownItem>
-                        <DropdownDivider />
+                        <DropdownItem Clicked="() => _permissionManagementModal.OpenAsync(PermissionProviderName,context.As<IdentityRoleDto>().Name)">@L["Permissions"]</DropdownItem>
+                        <DropdownDivider/>
                         <DropdownItem Clicked="() => DeleteRoleAsync(context.As<IdentityRoleDto>())">@L["Delete"]</DropdownItem>
                     </DropdownMenu>
                 </Dropdown>
@@ -109,4 +109,4 @@
     </ModalContent>
 </Modal>
 
-@*<PermissionManagementModal/>*@
\ No newline at end of file
+<PermissionManagementModal @ref="_permissionManagementModal"/>
\ No newline at end of file
diff --git a/modules/identity/src/Volo.Abp.Identity.Blazor/Pages/Identity/RoleManagement.razor.cs b/modules/identity/src/Volo.Abp.Identity.Blazor/Pages/Identity/RoleManagement.razor.cs
index 9b86d68fdf..f8a9aefdd4 100644
--- a/modules/identity/src/Volo.Abp.Identity.Blazor/Pages/Identity/RoleManagement.razor.cs
+++ b/modules/identity/src/Volo.Abp.Identity.Blazor/Pages/Identity/RoleManagement.razor.cs
@@ -9,11 +9,14 @@ using Volo.Abp.ObjectExtending;
 using Volo.Abp.Application.Dtos;
 using Volo.Abp.AspNetCore.Components.WebAssembly;
 using Volo.Abp.ObjectMapping;
+using Volo.Abp.PermissionManagement.Blazor.Components;
 
 namespace Volo.Abp.Identity.Blazor.Pages.Identity
 {
     public partial class RoleManagement
     {
+        private const string PermissionProviderName = "R";
+
         [Inject] private IIdentityRoleAppService RoleAppService { get; set; }
         [Inject] private IUiMessageService UiMessageService { get; set; }
         [Inject] private IObjectMapper<AbpIdentityBlazorModule> ObjectMapper { get; set; }
@@ -30,6 +33,7 @@ namespace Volo.Abp.Identity.Blazor.Pages.Identity
 
         private Modal _createModal;
         private Modal _editModal;
+        private PermissionManagementModal _permissionManagementModal;
 
         public RoleManagement()
         {
diff --git a/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/Components/PermissionManagementModal.razor b/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/Components/PermissionManagementModal.razor
index c17f33c52b..bbe76dd058 100644
--- a/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/Components/PermissionManagementModal.razor
+++ b/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/Components/PermissionManagementModal.razor
@@ -1,3 +1,40 @@
-<div class="my-component">
-    Permission management modal!
-</div>
+@using Microsoft.Extensions.Localization
+@using Volo.Abp.PermissionManagement.Localization
+@inject IStringLocalizer<AbpPermissionManagementResource> L
+<Modal @ref="_modal">
+    <ModalBackdrop />
+    <ModalContent IsCentered="true">
+        <ModalHeader>
+            <ModalTitle>Edit role</ModalTitle>
+            <CloseButton Clicked="CloseModal" />
+        </ModalHeader>
+        <ModalBody>
+            @if (_groups != null)
+            {
+                <Tabs Pills="true">
+                    <Items>
+                        @foreach (var group in _groups)
+                        {
+                            <Tab Name="@GetNormalizedGroupName(group.Name)">@group.DisplayName</Tab>
+                        }
+                    </Items>
+                    <Content>
+                        @foreach (var group in _groups)
+                        {
+                            <TabPanel Name="@GetNormalizedGroupName(group.Name)">
+                                @foreach (var permission in group.Permissions)
+                                {
+                                    <Check @bind-checked="@permission.IsGranted" TValue="bool">@permission.DisplayName (@permission.IsGranted.ToString())</Check>
+                                }
+                            </TabPanel>
+                        }
+                    </Content>
+                </Tabs>
+            }
+        </ModalBody>
+        <ModalFooter>
+            <Button Color="Color.Secondary" Clicked="CloseModal">@L["Cancel"]</Button>
+            <Button Color="Color.Primary" Clicked="SaveAsync">@L["Save"]</Button>
+        </ModalFooter>
+    </ModalContent>
+</Modal>
\ No newline at end of file
diff --git a/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/Components/PermissionManagementModal.razor.cs b/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/Components/PermissionManagementModal.razor.cs
new file mode 100644
index 0000000000..e64cacf447
--- /dev/null
+++ b/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/Components/PermissionManagementModal.razor.cs
@@ -0,0 +1,48 @@
+using System.Collections.Generic;
+using System.Threading.Tasks;
+using Blazorise;
+using Microsoft.AspNetCore.Components;
+
+namespace Volo.Abp.PermissionManagement.Blazor.Components
+{
+    public partial class PermissionManagementModal
+    {
+        [Inject] private IPermissionAppService PermissionAppService { get; set; }
+
+        private Modal _modal;
+        
+        private string _providerName;
+        private string _providerKey;
+
+        private string _entityDisplayName;
+        private List<PermissionGroupDto> _groups;
+        
+        public async Task OpenAsync(string providerName, string providerKey)
+        {
+            _providerName = providerName;
+            _providerKey = providerKey;
+
+            var result = await PermissionAppService.GetAsync(_providerName, _providerKey);
+
+            _entityDisplayName = result.EntityDisplayName;
+            _groups = result.Groups;
+
+            _modal.Show();
+        }
+
+        private void CloseModal()
+        {
+            _modal.Hide();
+        }
+
+        private async Task SaveAsync()
+        {
+            
+        }
+
+        public string GetNormalizedGroupName(string name)
+        {
+            return "PermissionGroup_" + name.Replace(".", "_");
+        }
+    }
+}
diff --git a/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/_Imports.razor b/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/_Imports.razor
index 77285129da..4685ac9893 100644
--- a/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/_Imports.razor
+++ b/modules/permission-management/src/Volo.Abp.PermissionManagement.Blazor/_Imports.razor
@@ -1 +1,5 @@
 @using Microsoft.AspNetCore.Components.Web
+@using Volo.Abp.AspNetCore.Components.WebAssembly
+@using Volo.Abp.BlazoriseUI
+@using Blazorise
+@using Blazorise.DataGrid
\ No newline at end of file