diff --git a/aspnet-core/modules/file-management/LINGYUN.Abp.FileManagement.Application/LINGYUN/Abp/FileManagement/FileManagementApplicationServiceBase.cs b/aspnet-core/modules/file-management/LINGYUN.Abp.FileManagement.Application/LINGYUN/Abp/FileManagement/FileManagementApplicationServiceBase.cs
index 5b0dfbc85..3fb7d3781 100644
--- a/aspnet-core/modules/file-management/LINGYUN.Abp.FileManagement.Application/LINGYUN/Abp/FileManagement/FileManagementApplicationServiceBase.cs
+++ b/aspnet-core/modules/file-management/LINGYUN.Abp.FileManagement.Application/LINGYUN/Abp/FileManagement/FileManagementApplicationServiceBase.cs
@@ -1,6 +1,4 @@
-using System;
-using System.Collections.Generic;
-using System.Text;
+using LINGYUN.Abp.FileManagement.Localization;
 using Volo.Abp.Application.Services;
 
 namespace LINGYUN.Abp.FileManagement
@@ -9,7 +7,7 @@ namespace LINGYUN.Abp.FileManagement
     {
         protected FileManagementApplicationServiceBase()
         {
-
+            LocalizationResource = typeof(AbpFileManagementResource);
         }
     }
 }
diff --git a/aspnet-core/modules/file-management/LINGYUN.Abp.FileManagement.Application/LINGYUN/Abp/FileManagement/FileSystemAppService.cs b/aspnet-core/modules/file-management/LINGYUN.Abp.FileManagement.Application/LINGYUN/Abp/FileManagement/FileSystemAppService.cs
index c715555ca..7e54afc81 100644
--- a/aspnet-core/modules/file-management/LINGYUN.Abp.FileManagement.Application/LINGYUN/Abp/FileManagement/FileSystemAppService.cs
+++ b/aspnet-core/modules/file-management/LINGYUN.Abp.FileManagement.Application/LINGYUN/Abp/FileManagement/FileSystemAppService.cs
@@ -379,6 +379,8 @@ namespace LINGYUN.Abp.FileManagement
                 blobPath = Path.Combine(blobPath, containerName);
             }
             path = path.Replace(blobPath, "");
+            path = path.Replace('/', Path.DirectorySeparatorChar);
+            path = path.Replace('\\', Path.DirectorySeparatorChar);
             return path;
         }
         /// <summary>
@@ -393,6 +395,8 @@ namespace LINGYUN.Abp.FileManagement
 
             if (!path.IsNullOrWhiteSpace() && fileSystemConfiguration.AppendContainerNameToBasePath)
             {
+                path = path.Replace('/', Path.DirectorySeparatorChar);
+                path = path.Replace('\\', Path.DirectorySeparatorChar);
                 // 去除第一个路径标识符
                 path = path.RemovePreFix("/", "\\");
                 blobPath = Path.Combine(blobPath, path);
diff --git a/aspnet-core/modules/identity/LINGYUN.Abp.Identity.Application.Contracts/LINGYUN/Abp/Identity/IOrganizationUnitAppService.cs b/aspnet-core/modules/identity/LINGYUN.Abp.Identity.Application.Contracts/LINGYUN/Abp/Identity/IOrganizationUnitAppService.cs
index 631a1bdef..9991efcc2 100644
--- a/aspnet-core/modules/identity/LINGYUN.Abp.Identity.Application.Contracts/LINGYUN/Abp/Identity/IOrganizationUnitAppService.cs
+++ b/aspnet-core/modules/identity/LINGYUN.Abp.Identity.Application.Contracts/LINGYUN/Abp/Identity/IOrganizationUnitAppService.cs
@@ -22,6 +22,8 @@ namespace LINGYUN.Abp.Identity
 
         Task<ListResultDto<OrganizationUnitDto>> FindChildrenAsync(OrganizationUnitGetChildrenDto input);
 
+        Task<ListResultDto<string>> GetRoleNamesAsync(Guid id);
+
         Task<PagedResultDto<IdentityRoleDto>> GetRolesAsync(OrganizationUnitGetRoleByPagedDto input);
 
         Task<ListResultDto<IdentityUserDto>> GetUsersAsync(OrganizationUnitGetUserDto input);
diff --git a/aspnet-core/modules/identity/LINGYUN.Abp.Identity.Application/LINGYUN/Abp/Identity/OrganizationUnitAppService.cs b/aspnet-core/modules/identity/LINGYUN.Abp.Identity.Application/LINGYUN/Abp/Identity/OrganizationUnitAppService.cs
index 56aa0694a..17bb80e91 100644
--- a/aspnet-core/modules/identity/LINGYUN.Abp.Identity.Application/LINGYUN/Abp/Identity/OrganizationUnitAppService.cs
+++ b/aspnet-core/modules/identity/LINGYUN.Abp.Identity.Application/LINGYUN/Abp/Identity/OrganizationUnitAppService.cs
@@ -98,6 +98,13 @@ namespace LINGYUN.Abp.Identity
                 ObjectMapper.Map<List<OrganizationUnit>, List<OrganizationUnitDto>>(origanizationUnits));
         }
 
+        [Authorize(IdentityPermissions.OrganizationUnits.ManageRoles)]
+        public virtual async Task<ListResultDto<string>> GetRoleNamesAsync(Guid id)
+        {
+            var inOrignizationUnitRoleNames = await UserRepository.GetRoleNamesInOrganizationUnitAsync(id);
+            return new ListResultDto<string>(inOrignizationUnitRoleNames);
+        }
+
         [Authorize(IdentityPermissions.OrganizationUnits.ManageRoles)]
         public virtual async Task<PagedResultDto<IdentityRoleDto>> GetRolesAsync(OrganizationUnitGetRoleByPagedDto input)
         {
diff --git a/aspnet-core/modules/identity/LINGYUN.Abp.Identity.HttpApi/LINGYUN/Abp/Identity/OrganizationUnitController.cs b/aspnet-core/modules/identity/LINGYUN.Abp.Identity.HttpApi/LINGYUN/Abp/Identity/OrganizationUnitController.cs
index 7aa254430..0a106b8e7 100644
--- a/aspnet-core/modules/identity/LINGYUN.Abp.Identity.HttpApi/LINGYUN/Abp/Identity/OrganizationUnitController.cs
+++ b/aspnet-core/modules/identity/LINGYUN.Abp.Identity.HttpApi/LINGYUN/Abp/Identity/OrganizationUnitController.cs
@@ -84,6 +84,13 @@ namespace LINGYUN.Abp.Identity
             return await OrganizationUnitAppService.GetListAsync(input);
         }
 
+        [HttpGet]
+        [Route("management-roles/{id}")]
+        public virtual async Task<ListResultDto<string>> GetRoleNamesAsync(Guid id)
+        {
+            return await OrganizationUnitAppService.GetRoleNamesAsync(id);
+        }
+
         [HttpGet]
         [Route("management-roles")]
         public virtual async Task<PagedResultDto<IdentityRoleDto>> GetRolesAsync(OrganizationUnitGetRoleByPagedDto input)
diff --git a/vueJs/package-lock.json b/vueJs/package-lock.json
index c098e42d3..be3cf43d6 100644
--- a/vueJs/package-lock.json
+++ b/vueJs/package-lock.json
@@ -21273,6 +21273,11 @@
       "integrity": "sha1-YIeoYTLqgSWqieX44Kl4+8jPb1k=",
       "dev": true
     },
+    "vue-contextmenujs": {
+      "version": "1.3.10",
+      "resolved": "https://registry.npm.taobao.org/vue-contextmenujs/download/vue-contextmenujs-1.3.10.tgz",
+      "integrity": "sha1-fdl2wlwyHvRFQT/uWMo6x1uQnoQ="
+    },
     "vue-count-to": {
       "version": "1.0.13",
       "resolved": "https://registry.npm.taobao.org/vue-count-to/download/vue-count-to-1.0.13.tgz",
diff --git a/vueJs/package.json b/vueJs/package.json
index 6617266cf..e5f50de33 100644
--- a/vueJs/package.json
+++ b/vueJs/package.json
@@ -46,6 +46,7 @@
     "view-design": "^4.2.0",
     "vue": "^2.6.11",
     "vue-class-component": "^7.2.3",
+    "vue-contextmenujs": "^1.3.10",
     "vue-count-to": "^1.0.13",
     "vue-i18n": "^8.16.0",
     "vue-image-crop-upload": "^2.5.0",
diff --git a/vueJs/src/App.vue b/vueJs/src/App.vue
index 2d7738f0e..f828bf2f9 100644
--- a/vueJs/src/App.vue
+++ b/vueJs/src/App.vue
@@ -17,7 +17,7 @@ import ServiceWorkerUpdatePopup from '@/pwa/components/ServiceWorkerUpdatePopup.
   }
 })
 export default class extends Vue {
-  mounted() {
+  created() {
     this.initializeAbpConfiguration()
   }
 
diff --git a/vueJs/src/api/apiresources.ts b/vueJs/src/api/apiresources.ts
index d89b6c259..4056bf72b 100644
--- a/vueJs/src/api/apiresources.ts
+++ b/vueJs/src/api/apiresources.ts
@@ -23,7 +23,9 @@ export default class ApiResourceService {
     let _url = '/api/IdentityServer/ApiResources'
     _url += '?filter=' + payload.filter
     _url += '&sorting=' + payload.sorting
-    _url += '&skipCount=' + pagerFormat(payload.skipCount)
+    // abp设计原因,需要前端计算分页
+    _url += '&skipCount=' + pagerFormat(payload.skipCount) * payload.maxResultCount
+    // _url += '&skipCount=' + pagerFormat(payload.skipCount)
     _url += '&maxResultCount=' + payload.maxResultCount
     return ApiService.Get<PagedResultDto<ApiResource>>(_url, serviceUrl)
   }
@@ -129,7 +131,7 @@ export class ApiScope {
   required!: boolean
   emphasize!: boolean
   showInDiscoveryDocument!: boolean
-  userClaims : ApiScopeClaim[]
+  userClaims: ApiScopeClaim[]
 
   constructor() {
     this.userClaims = new Array<ApiScopeClaim>()
@@ -144,7 +146,7 @@ export class ApiScopeCreate {
   required!: boolean
   emphasize!: boolean
   showInDiscoveryDocument!: boolean
-  userClaims : ApiScopeClaim[]
+  userClaims: ApiScopeClaim[]
 
   constructor() {
     this.apiResourceId = ''
@@ -277,4 +279,4 @@ export class ApiResourceGetByPaged extends PagedAndSortedResultRequestDto {
     super()
     this.filter = ''
   }
-}
\ No newline at end of file
+}
diff --git a/vueJs/src/api/clients.ts b/vueJs/src/api/clients.ts
index ba27d5dc8..1a12fee29 100644
--- a/vueJs/src/api/clients.ts
+++ b/vueJs/src/api/clients.ts
@@ -15,7 +15,8 @@ export default class ClientService {
     let _url = '/api/IdentityServer/Clients'
     _url += '?filter=' + payload.filter
     _url += '&sorting=' + payload.sorting
-    _url += '&skipCount=' + pagerFormat(payload.skipCount)
+    // 因为abp设计的原因, 需要前端组合页面
+    _url += '&skipCount=' + pagerFormat(payload.skipCount) * payload.maxResultCount
     _url += '&maxResultCount=' + payload.maxResultCount
     return ApiService.Get<PagedResultDto<Client>>(_url, serviceUrl)
   }
diff --git a/vueJs/src/api/filemanagement.ts b/vueJs/src/api/filemanagement.ts
index 33c14b82f..f986231e6 100644
--- a/vueJs/src/api/filemanagement.ts
+++ b/vueJs/src/api/filemanagement.ts
@@ -75,23 +75,6 @@ export default class FileManagementService {
     return ApiService.Put<void>(_url, payload, serviceUrl)
   }
 
-  public static mergeFile(name: string, path: string | undefined) {
-    const _url = baseUrl + '/files'
-    const _data = {
-      path: path,
-      fileName: name,
-      mergeFile: true
-    }
-    return ApiService.HttpRequest<void>({
-      url: _url,
-      data: qs.stringify(_data),
-      method: 'POST',
-      headers: {
-        'Content-Type': 'application/x-www-form-urlencoded'
-      }
-    })
-  }
-
   public static downlodFle(name: string, path: string | undefined, currentByte: number | undefined) {
     let _url = baseUrl + '/files?name=' + name
     if (path) {
diff --git a/vueJs/src/api/identityresources.ts b/vueJs/src/api/identityresources.ts
index dcff8cfc8..e08bccf49 100644
--- a/vueJs/src/api/identityresources.ts
+++ b/vueJs/src/api/identityresources.ts
@@ -7,7 +7,7 @@ const serviceUrl = process.env.VUE_APP_BASE_API
 
 /** 身份资源Api接口 */
 export default class IdentityResourceService {
-  /** 
+  /**
    * 获取身份资源
    * @param id 身份资源标识
    * @returns 返回类型为 IdentityResource 的对象
@@ -27,7 +27,9 @@ export default class IdentityResourceService {
     let _url = '/api/IdentityServer/IdentityResources'
     _url += '?filter=' + payload.filter
     _url += '&sorting=' + payload.sorting
-    _url += '&skipCount=' + pagerFormat(payload.skipCount)
+    // abp设计原因,需要前端计算分页
+    _url += '&skipCount=' + pagerFormat(payload.skipCount) * payload.maxResultCount
+    // _url += '&skipCount=' + pagerFormat(payload.skipCount)
     _url += '&maxResultCount=' + payload.maxResultCount
     return ApiService.Get<PagedResultDto<IdentityResource>>(_url, serviceUrl)
   }
@@ -153,7 +155,7 @@ export class IdentityResourceCreate {
 
   /** 创建身份资源 */
   public static create(identityResource: IdentityResource) {
-    let resource = new IdentityResourceCreate()
+    const resource = new IdentityResourceCreate()
     resource.description = identityResource.description
     resource.displayName = identityResource.displayName
     resource.emphasize = identityResource.emphasize
@@ -196,7 +198,7 @@ export class IdentityResourceUpdate {
 
   /** 创建身份资源 */
   public static create(identityResource: IdentityResource) {
-    let resource = new IdentityResourceUpdate()
+    const resource = new IdentityResourceUpdate()
     resource.concurrencyStamp = identityResource.concurrencyStamp
     resource.description = identityResource.description
     resource.displayName = identityResource.displayName
@@ -219,11 +221,11 @@ export class IdentityResource extends FullAuditedEntityDto {
   name!: string
   /** 显示名称 */
   displayName?: string
- /** 说明 */
+  /** 说明 */
   description?: string
   /** 并发令牌 */
   concurrencyStamp!: string
- /** 启用 */
+  /** 启用 */
   enabled!: boolean
   /** 必须 */
   required!: boolean
@@ -238,7 +240,7 @@ export class IdentityResource extends FullAuditedEntityDto {
 
   /** 返回一个空对象 */
   public static empty() {
-    const resource =  new IdentityResource()
+    const resource = new IdentityResource()
     resource.enabled = true
     return resource
   }
diff --git a/vueJs/src/api/organizationunit.ts b/vueJs/src/api/organizationunit.ts
index 74ad331c2..231af13ac 100644
--- a/vueJs/src/api/organizationunit.ts
+++ b/vueJs/src/api/organizationunit.ts
@@ -120,7 +120,9 @@ export default class OrganizationUnitService {
     _url += '?id=' + payload.id
     _url += '&filter=' + payload.filter
     _url += '&sorting=' + payload.sorting
-    _url += '&skipCount=' + pagerFormat(payload.skipCount)
+    // abp设计原因,需要前端计算分页
+    _url += '&skipCount=' + pagerFormat(payload.skipCount) * payload.maxResultCount
+    // _url += '&skipCount=' + pagerFormat(payload.skipCount)
     _url += '&maxResultCount=' + payload.maxResultCount
     return ApiService.Get<PagedResultDto<RoleDto>>(_url, serviceUrl)
   }
diff --git a/vueJs/src/api/roles.ts b/vueJs/src/api/roles.ts
index e80d45f97..cc2334a31 100644
--- a/vueJs/src/api/roles.ts
+++ b/vueJs/src/api/roles.ts
@@ -1,13 +1,24 @@
+import { pagerFormat } from '@/utils/index'
 import ApiService from './serviceBase'
-import { ListResultDto } from './types'
+import { ListResultDto, PagedAndSortedResultRequestDto, PagedResultDto } from './types'
 
 const IdentityServiceUrl = process.env.VUE_APP_BASE_API
 
 export default class RoleService {
-  public static getRoles() {
+  public static getAllRoles() {
     return ApiService.Get<ListResultDto<RoleDto>>('/api/identity/roles', IdentityServiceUrl)
   }
 
+  public static getRoles(payload: RoleGetPagedDto) {
+    let _url = '/api/identity/roles'
+    // 因为abp设计的原因, 需要前端组合页面
+    _url += '?skipCount=' + pagerFormat(payload.skipCount) * payload.maxResultCount
+    _url += '&maxResultCount=' + payload.maxResultCount
+    _url += '&sorting=' + payload.sorting
+    _url += '&filter=' + payload.filter
+    return ApiService.Get<PagedResultDto<RoleDto>>(_url, IdentityServiceUrl)
+  }
+
   public static getRoleById(id: string) {
     let _url = '/api/identity/roles/'
     _url += id
@@ -43,6 +54,10 @@ export class RoleDto extends RoleBaseDto {
   concurrencyStamp?: string
 }
 
+export class RoleGetPagedDto extends PagedAndSortedResultRequestDto {
+  filter?: string
+}
+
 export class CreateRoleDto extends RoleBaseDto {
   constructor() {
     super()
diff --git a/vueJs/src/api/tenant.ts b/vueJs/src/api/tenant.ts
index d2c372231..34adb082a 100644
--- a/vueJs/src/api/tenant.ts
+++ b/vueJs/src/api/tenant.ts
@@ -21,7 +21,8 @@ export default class TenantService {
     let _url = '/api/multi-tenancy/tenants'
     _url += '?filter=' + payload.filter
     _url += '&sorting=' + payload.sorting
-    _url += '&skipCount=' + pagerFormat(payload.skipCount)
+    // 因为abp设计的原因, 需要前端组合页面
+    _url += '&skipCount=' + pagerFormat(payload.skipCount) * payload.maxResultCount
     _url += '&maxResultCount=' + payload.maxResultCount
     return ApiService.Get<PagedResultDto<TenantDto>>(_url, serviceUrl)
   }
diff --git a/vueJs/src/api/users.ts b/vueJs/src/api/users.ts
index f7d018e10..a9470ef63 100644
--- a/vueJs/src/api/users.ts
+++ b/vueJs/src/api/users.ts
@@ -10,7 +10,8 @@ export default class UserApiService {
 
   public static getUsers(input: UsersGetPagedDto) {
     let _url = '/api/identity/users'
-    _url += '?skipCount=' + pagerFormat(input.skipCount)
+    // 因为abp设计的原因, 需要前端组合页面
+    _url += '?skipCount=' + pagerFormat(input.skipCount) * input.maxResultCount
     _url += '&maxResultCount=' + input.maxResultCount
     if (input.sorting) {
       _url += '&sorting=' + input.sorting
diff --git a/vueJs/src/components/MarkdownEditor/index.vue b/vueJs/src/components/MarkdownEditor/index.vue
index 3e14cc5d6..f0fc7abab 100644
--- a/vueJs/src/components/MarkdownEditor/index.vue
+++ b/vueJs/src/components/MarkdownEditor/index.vue
@@ -74,10 +74,8 @@ export default class extends Vue {
   private initEditor() {
     const editorElement = document.getElementById(this.id)
     if (!editorElement) return
-    this.markdownEditor = new TuiEditor({
-      el: editorElement,
-      ...this.editorOptions
-    })
+    this.editorOptions.el = editorElement
+    this.markdownEditor = new TuiEditor(this.editorOptions)
     if (this.value) {
       this.markdownEditor.setValue(this.value)
     }
diff --git a/vueJs/src/lang/en.ts b/vueJs/src/lang/en.ts
index 7c7d002bb..e4349e598 100644
--- a/vueJs/src/lang/en.ts
+++ b/vueJs/src/lang/en.ts
@@ -78,7 +78,9 @@ export default {
     clients: 'clients',
     apiresources: 'api resources',
     identityresources: 'id resources',
-    organizationUnit: 'organization unit'
+    organizationUnit: 'organization unit',
+    filemanagement: 'file management',
+    filesystem: 'file system'
   },
   navbar: {
     logOut: 'Log Out',
@@ -612,10 +614,36 @@ export default {
     confirm: '确 定',
     correctEmailAddress: '正确的邮件地址',
     correctPhoneNumber: '正确的手机号码',
-    operatingFast: '您的操作过快,请稍后再试!'
+    operatingFast: '您的操作过快,请稍后再试!',
+    request404: '您所请求的资源不存在!'
   },
   messages: {
     noNotifications: '没有通知',
     noMessages: '没有消息'
+  },
+  fileSystem: {
+    setting: '文件系统',
+    name: '名称',
+    creationTime: '创建时间',
+    lastModificationTime: '修改时间',
+    type: '类型',
+    folder: '文件夹',
+    file: '文件',
+    fileType: '{exten}文件',
+    size: '大小',
+    root: '文件系统',
+    download: '下载文件',
+    upload: '上传文件',
+    deleteFolder: '删除目录',
+    deleteFile: '删除文件',
+    addFile: '添加文件',
+    addFolder: '添加目录',
+    uploadError: '上传失败',
+    uploading: '正在上传',
+    waitingUpload: '等待上传',
+    paused: '已暂停',
+    uploadSuccess: '上传成功',
+    folderNameIsRequired: '目录名称不能为空',
+    folderCreateSuccess: '目录 {name} 已创建!'
   }
 }
diff --git a/vueJs/src/lang/zh.ts b/vueJs/src/lang/zh.ts
index 88d027f68..2c5e712fb 100644
--- a/vueJs/src/lang/zh.ts
+++ b/vueJs/src/lang/zh.ts
@@ -642,6 +642,8 @@ export default {
     uploading: '正在上传',
     waitingUpload: '等待上传',
     paused: '已暂停',
-    uploadSuccess: '上传成功'
+    uploadSuccess: '上传成功',
+    folderNameIsRequired: '目录名称不能为空',
+    folderCreateSuccess: '目录 {name} 已创建!'
   }
 }
diff --git a/vueJs/src/main.ts b/vueJs/src/main.ts
index 751da2c76..fdee7340a 100644
--- a/vueJs/src/main.ts
+++ b/vueJs/src/main.ts
@@ -6,6 +6,7 @@ import ViewUI from 'view-design'
 import SvgIcon from 'vue-svgicon'
 
 import uploader from 'vue-simple-uploader'
+import contextMenu from 'vue-contextmenujs'
 
 import '@/styles/element-variables.scss'
 import 'view-design/dist/styles/iview.css'
@@ -40,6 +41,7 @@ Vue.use(SvgIcon, {
 })
 
 Vue.use(uploader)
+Vue.use(contextMenu)
 
 // Register global directives
 Object.keys(directives).forEach(key => {
diff --git a/vueJs/src/router/index.ts b/vueJs/src/router/index.ts
index 0022ac0e1..05c5a579f 100644
--- a/vueJs/src/router/index.ts
+++ b/vueJs/src/router/index.ts
@@ -9,7 +9,7 @@ import Layout from '@/layout/index.vue'
 // import chartsRouter from './modules/charts'
 // import tableRouter from './modules/table'
 // import nestedRouter from './modules/nested'
-import taskRouter from './modules/task'
+// import taskRouter from './modules/task'
 import adminRouter from './modules/admin'
 import apigatewayRouter from './modules/apigateway'
 import identityServerRouter from './modules/identityServer'
@@ -124,7 +124,6 @@ export const asyncRoutes: RouteConfig[] = [
       }
     ]
   },
-  taskRouter,
   adminRouter,
   apigatewayRouter,
   identityServerRouter,
diff --git a/vueJs/src/router/modules/task.ts b/vueJs/src/router/modules/task.ts
deleted file mode 100644
index 7ff30a247..000000000
--- a/vueJs/src/router/modules/task.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { RouteConfig } from 'vue-router'
-import Layout from '@/layout/index.vue'
-
-const taskRouter: RouteConfig = {
-  path: '/task',
-  component: Layout,
-  redirect: '/task',
-  meta: {
-    title: 'tasks',
-    icon: 'lock',
-    roles: ['AbpIdentity.Roles', 'TaskManagement.Task'], // you can set roles in root nav
-    alwaysShow: true // will always show the root menu
-  },
-  children: [
-    {
-      path: 'list',
-      component: () => import(/* webpackChunkName: "permission-page" */ '@/views/task/index.vue'),
-      name: 'tasks',
-      meta: {
-        title: 'tasks',
-        roles: ['AbpIdentity.Roles', 'TaskManagement.Task'] // or you can only set roles in sub nav
-      }
-    }
-  ]
-}
-
-export default taskRouter
diff --git a/vueJs/src/shims.d.ts b/vueJs/src/shims.d.ts
index 6fd27e077..a8e598bd3 100644
--- a/vueJs/src/shims.d.ts
+++ b/vueJs/src/shims.d.ts
@@ -27,4 +27,7 @@ declare module 'vue-image-crop-upload'
 declare module 'vue-splitpane'
 
 // TODO vue-simple-uploader
-declare module 'vue-simple-uploader'
\ No newline at end of file
+declare module 'vue-simple-uploader'
+
+// TODO vue-contextmenujs
+declare module 'vue-contextmenujs'
\ No newline at end of file
diff --git a/vueJs/src/views/admin/components/RoleReference.vue b/vueJs/src/views/admin/components/RoleReference.vue
new file mode 100644
index 000000000..352574a7e
--- /dev/null
+++ b/vueJs/src/views/admin/components/RoleReference.vue
@@ -0,0 +1,45 @@
+<template>
+  <div class="role-reference-pane">
+    <el-table
+      ref="roleTable"
+      v-loading="userLoading"
+      row-key="id"
+      :data="userList"
+      border
+      fit
+      highlight-current-row
+      max-height="250px"
+      @row-click="onRowClick"
+    />
+  </div>
+</template>
+
+<script lang="ts">
+import { dateFormat } from '@/utils'
+import { Component, Vue } from 'vue-property-decorator'
+import RoleAppService, { RoleGetPagedDto } from '@/api/roles'
+
+@Component({
+  name: 'RoleReference',
+  filters: {
+    dateTimeFilter(datetime: string) {
+      const date = new Date(datetime)
+      return dateFormat(date, 'YYYY-mm-dd HH:MM')
+    }
+  }
+})
+export default class extends Vue {
+  private roleQueryFilter = new RoleGetPagedDto()
+
+  private hanldGetRoles() {
+    // TODO 待完成
+    RoleAppService.getRoles(this.roleQueryFilter).then(res => {
+      console.log(res)
+    })
+  }
+}
+</script>
+
+<style lang="stylus" scoped>
+
+</style>
diff --git a/vueJs/src/views/admin/components/UserReference.vue b/vueJs/src/views/admin/components/UserReference.vue
new file mode 100644
index 000000000..4d4b05902
--- /dev/null
+++ b/vueJs/src/views/admin/components/UserReference.vue
@@ -0,0 +1,176 @@
+<template>
+  <div class="user-reference-pane">
+    <el-form>
+      <el-form-item>
+        <el-button
+          class="confirm"
+          type="primary"
+          style="width:100px"
+        >
+          {{ $t('global.confirm') }}
+        </el-button>
+        <el-button
+          class="cancel"
+          style="width:100px"
+        >
+          {{ $t('global.cancel') }}
+        </el-button>
+      </el-form-item>
+      <el-form-item>
+        <el-table
+          ref="userTable"
+          v-loading="userLoading"
+          row-key="id"
+          :data="userList"
+          border
+          fit
+          highlight-current-row
+          max-height="250px"
+          @row-click="onRowClick"
+        >
+          <el-table-column
+            type="selection"
+            width="50"
+            align="center"
+          />
+          <el-table-column
+            :label="$t('users.userName')"
+            prop="userName"
+            sortable
+            width="110px"
+            align="center"
+          >
+            <template slot-scope="{row}">
+              <span>{{ row.userName }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            :label="$t('users.name')"
+            prop="name"
+            width="110px"
+            align="center"
+          >
+            <template slot-scope="{row}">
+              <span>{{ row.name }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            :label="$t('users.email')"
+            prop="email"
+            sortable
+            min-width="180"
+            align="center"
+          >
+            <template slot-scope="{row}">
+              <span>{{ row.email }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            :label="$t('users.phoneNumber')"
+            prop="phoneNumber"
+            width="140px"
+            align="center"
+          >
+            <template slot-scope="{row}">
+              <span>{{ row.phoneNumber }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            :label="$t('users.lockoutEnd')"
+            prop="lockoutEnd"
+            sortable
+            width="140px"
+            align="center"
+          >
+            <template slot-scope="{row}">
+              <span>{{ row.lockoutEnd | dateTimeFilter }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column
+            :label="$t('users.creationTime')"
+            prop="creationTime"
+            sortable
+            width="140px"
+            align="center"
+          >
+            <template slot-scope="{row}">
+              <span>{{ row.creationTime | dateTimeFilter }}</span>
+            </template>
+          </el-table-column>
+        </el-table>
+
+        <pagination
+          v-show="userCount>0"
+          :total="userCount"
+          :page.sync="userQueryFilter.skipCount"
+          :limit.sync="userQueryFilter.maxResultCount"
+          @pagination="handleGetUserList"
+        />
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script lang="ts">
+import { dateFormat } from '@/utils'
+import { Component, Vue } from 'vue-property-decorator'
+import Pagination from '@/components/Pagination/index.vue'
+import UserAppService, { UsersGetPagedDto, UserDataDto } from '@/api/users'
+
+@Component({
+  name: 'UserReference',
+  components: {
+    Pagination
+  },
+  filters: {
+    dateTimeFilter(datetime: string) {
+      const date = new Date(datetime)
+      return dateFormat(date, 'YYYY-mm-dd HH:MM')
+    }
+  }
+})
+export default class extends Vue {
+  private userCount = 0
+  private userLoading = false
+  private userList = new Array<UserDataDto>()
+  private userQueryFilter = new UsersGetPagedDto()
+
+  mounted() {
+    this.handleGetUserList()
+    // 滚动延迟加载
+    // const userTable = this.$refs.userTable as any
+    // userTable.bodyWrapper.addEventListener('scroll', (res: any) => this.onTableScrollChanged(res), true)
+  }
+
+  private handleGetUserList() {
+    this.userLoading = true
+    UserAppService.getUsers(this.userQueryFilter).then(res => {
+      this.userList = res.items
+      this.userCount = res.totalCount
+      this.userLoading = false
+    })
+  }
+
+  private onRowClick(row: any) {
+    const table = this.$refs.userTable as any
+    table.toggleRowSelection(row)
+  }
+
+  private onTableScrollChanged(dom: any) {
+    console.log(dom)
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.user-reference-pane .user-table {
+  width: 100%;
+  cursor: pointer;
+}
+.confirm {
+  position: relative;
+}
+.cancel {
+  position: relative;
+}
+</style>
diff --git a/vueJs/src/views/admin/organization-unit/components/EditOrganizationUint.vue b/vueJs/src/views/admin/organization-unit/components/EditOrganizationUint.vue
index d16bcbc0e..a82a524d3 100644
--- a/vueJs/src/views/admin/organization-unit/components/EditOrganizationUint.vue
+++ b/vueJs/src/views/admin/organization-unit/components/EditOrganizationUint.vue
@@ -43,12 +43,24 @@
         </el-tree>
       </div>
     </el-card>
+
+    <el-dialog
+      :visible.sync="showUserReferenceDialog"
+      title="用户列表"
+      :show-close="false"
+      @closed="onUserReferenceDialogClosed"
+    >
+      <user-reference
+        ref="userReference"
+      />
+    </el-dialog>
   </div>
 </template>
 
 <script lang="ts">
 import { Component, Vue } from 'vue-property-decorator'
 import { ListResultDto } from '@/api/types'
+import UserReference from '../../components/UserReference.vue'
 import OrganizationUnitService, { OrganizationUnitCreate, OrganizationUnit } from '@/api/organizationunit'
 
 class OrganizationUnitTree {
@@ -67,6 +79,9 @@ class OrganizationUnitTree {
 
 @Component({
   name: 'EditOrganizationUint',
+  components: {
+    UserReference
+  },
   data() {
     return {
       organizationProps: {
@@ -78,6 +93,7 @@ class OrganizationUnitTree {
   }
 })
 export default class extends Vue {
+  private showUserReferenceDialog = false
   private async loadOrganizationUnit(node: any, resolve: any) {
     if (node.level === 0) {
       const rootOrganizationUnit = new OrganizationUnitTree()
@@ -153,7 +169,7 @@ export default class extends Vue {
         organizationUnit.displayName = res.displayName
         data.children.push(organizationUnit)
       })
-    })
+    }).catch(_ => _)
   }
 
   private handleRemoveOrganizationUnit(node: any, data: any) {
@@ -176,6 +192,11 @@ export default class extends Vue {
 
   private handleOrganizationUnitUserAdd(data: any) {
     console.log(data)
+    this.showUserReferenceDialog = true
+  }
+
+  private onUserReferenceDialogClosed() {
+    this.showUserReferenceDialog = false
   }
 
   private handleOrganizationUnitRoleAdd(data: any) {
diff --git a/vueJs/src/views/admin/roles/index.vue b/vueJs/src/views/admin/roles/index.vue
index eff81a0f0..0c5dec153 100644
--- a/vueJs/src/views/admin/roles/index.vue
+++ b/vueJs/src/views/admin/roles/index.vue
@@ -134,6 +134,14 @@
       </el-table-column>
     </el-table>
 
+    <pagination
+      v-show="roleCount>0"
+      :total="roleCount"
+      :page.sync="roleQueryFilter.skipCount"
+      :limit.sync="roleQueryFilter.maxResultCount"
+      @pagination="handleGetRoles"
+    />
+
     <el-dialog
       :visible="hasLoadPermission"
       custom-class="profile"
@@ -163,22 +171,26 @@
 
 <script lang="ts">
 import { Component, Vue } from 'vue-property-decorator'
-import RoleService, { CreateRoleDto, RoleDto, UpdateRoleDto } from '@/api/roles'
+import RoleService, { CreateRoleDto, RoleDto, UpdateRoleDto, RoleGetPagedDto } from '@/api/roles'
 import { checkPermission } from '@/utils/permission'
 import { IPermission } from '@/api/types'
+import Pagination from '@/components/Pagination/index.vue'
 import PermissionService, { PermissionDto, UpdatePermissionsDto } from '@/api/permission'
 import PermissionTree from '@/components/PermissionTree/index.vue'
 
 @Component({
   name: 'RoleList',
   components: {
-    PermissionTree
+    PermissionTree,
+    Pagination
   },
   methods: {
     checkPermission
   }
 })
 export default class extends Vue {
+  private roleCount: number
+  private roleQueryFilter: RoleGetPagedDto
   private roleList: RoleDto[]
   private roleListLoading: boolean
   /** 是否加载角色权限 */
@@ -192,10 +204,12 @@ export default class extends Vue {
 
   constructor() {
     super()
+    this.roleCount = 0
     this.roleListLoading = false
     this.hasLoadPermission = false
     this.rolePermissionChanged = false
     this.rolePermission = new PermissionDto()
+    this.roleQueryFilter = new RoleGetPagedDto()
     this.roleList = new Array<RoleDto>()
     this.editRolePermissions = new Array<IPermission>()
   }
@@ -207,8 +221,9 @@ export default class extends Vue {
   /** 获取角色权限列表 */
   private handleGetRoles() {
     this.roleListLoading = true
-    RoleService.getRoles().then(data => {
-      this.roleList = data.items
+    RoleService.getRoles(this.roleQueryFilter).then(res => {
+      this.roleList = res.items
+      this.roleCount = res.totalCount
       this.roleListLoading = false
     })
   }
diff --git a/vueJs/src/views/admin/users/components/UserEditForm.vue b/vueJs/src/views/admin/users/components/UserEditForm.vue
index 90c577b7c..2ee0e1206 100644
--- a/vueJs/src/views/admin/users/components/UserEditForm.vue
+++ b/vueJs/src/views/admin/users/components/UserEditForm.vue
@@ -242,7 +242,7 @@ export default class extends Vue {
   }
 
   private handleGetRoles() {
-    RoleService.getRoles().then(data => {
+    RoleService.getAllRoles().then(data => {
       const roles = data.items.map((item: IRoleData) => {
         return {
           key: item.name,
diff --git a/vueJs/src/views/file-management/components/FileUploadForm.vue b/vueJs/src/views/file-management/components/FileUploadForm.vue
index c6a2ad9b4..d48afc184 100644
--- a/vueJs/src/views/file-management/components/FileUploadForm.vue
+++ b/vueJs/src/views/file-management/components/FileUploadForm.vue
@@ -22,7 +22,8 @@
 
 <script lang="ts">
 import { Component, Vue, Prop, Watch } from 'vue-property-decorator'
-import FileManagementAppService, { FileUploadUrl } from '@/api/filemanagement'
+import { FileUploadUrl } from '@/api/filemanagement'
+import { UserModule } from '@/store/modules/user'
 
 export class UploadOptions {
   target!: string
@@ -65,6 +66,7 @@ export default class extends Vue {
     this.options.target = FileUploadUrl
     this.options.successStatuses = [200, 201, 202, 204, 205]
     this.options.permanentErrors = [400, 401, 403, 404, 415, 500, 501]
+    this.options.headers.Authorization = UserModule.token
   }
 
   public close() {
@@ -95,8 +97,7 @@ export default class extends Vue {
   }
 
   private onFileUploadCompleted(file: any) {
-    console.log(file)
-    this.$emit('onFileUploaded')
+    this.$emit('onFileUploaded', file)
   }
 }
 </script>
diff --git a/vueJs/src/views/file-management/index.vue b/vueJs/src/views/file-management/index.vue
index bd0ebb6d8..c6dffe812 100644
--- a/vueJs/src/views/file-management/index.vue
+++ b/vueJs/src/views/file-management/index.vue
@@ -37,6 +37,7 @@
       :row-class-name="tableRowClassName"
       @row-click="onRowClick"
       @row-dblclick="onRowDoubleClick"
+      @contextmenu.native="onContextMenu"
     >
       <el-table-column
         type="selection"
@@ -184,6 +185,7 @@ import FileSystemService, { FileSystem, FileSystemGetByPaged, FileSystemType } f
 const kbUnit = 1 * 1024
 const mbUnit = kbUnit * 1024
 const gbUnit = mbUnit * 1024
+const $contextmenu = Vue.prototype.$contextmenu
 
 @Component({
   name: 'FileManagement',
@@ -330,7 +332,11 @@ export default class extends Vue {
         break
       case 'upload':
         if (command.row.type === 0) {
-          this.handleUploadFile(command.row.name)
+          let path = command.row.name
+          if (command.row.parent) {
+            path = command.row.parent + '/' + path
+          }
+          this.handleUploadFile(path)
         } else {
           this.handleUploadFile(command.row.parent)
         }
@@ -381,6 +387,13 @@ export default class extends Vue {
   }
 
   private onRowClick(row: any) {
+    if (row.type === FileSystemType.Folder) {
+      let path = row.name
+      if (row.parent) {
+        path = row.parent + '/' + row.name
+      }
+      this.lastFilePath = path
+    }
     const table = this.$refs.fileSystemTable as any
     table.toggleRowSelection(row)
   }
@@ -412,6 +425,57 @@ export default class extends Vue {
     frmUpload.close()
   }
 
+  private onContextMenu(event: any) {
+    event.preventDefault()
+    $contextmenu({
+      items: [
+        {
+          label: this.$t('fileSystem.addFolder'),
+          disabled: !checkPermission(['AbpFileManagement.FileSystem.Create']),
+          onClick: () => {
+            let parent = ''
+            // 在根目录下
+            if (this.fileSystemRoot.length > 1) {
+              parent = this.fileSystemRoot.slice(1).join('/')
+            }
+            this.$prompt(this.$t('global.pleaseInputBy', { key: this.$t('fileSystem.name') }).toString(),
+              this.$t('fileSystem.addFolder').toString(), {
+                showInput: true,
+                inputValidator: (val) => {
+                  return !(!val || val.length === 0)
+                },
+                inputErrorMessage: this.$t('fileSystem.folderNameIsRequired').toString(),
+                inputPlaceholder: this.$t('global.pleaseInputBy', { key: this.$t('fileSystem.name') }).toString()
+              }).then((val: any) => {
+              FileSystemService.createFolder(val.value, parent).then(() => {
+                this.$message.success(this.$t('fileSystem.folderCreateSuccess', { name: val.value }).toString())
+                this.handleGetFileSystemList()
+              })
+            }).catch(_ => _)
+          },
+          divided: true
+        },
+        {
+          label: this.$t('fileSystem.upload'),
+          disabled: !checkPermission(['AbpFileManagement.FileSystem.FileManager.Create']),
+          onClick: () => {
+            let path = ''
+            if (this.fileSystemRoot.length > 1) {
+              path = this.fileSystemRoot.slice(1).join('/')
+            }
+            this.lastFilePath = path
+            this.showFileUploadDialog = true
+          }
+        }
+      ],
+      event,
+      customClass: 'context-menu',
+      zIndex: 3,
+      minWidth: 150
+    })
+    return false
+  }
+
   private l(name: string, values?: any[] | { [key: string]: any }) {
     return this.$t(name, values).toString()
   }