feat: add user group info for domain page

1. Add user group column in domain list page
2. Add user group tab in domain detail page
3. Update detail path check in list page
4. Remove domain column for user/group list in domain detail page

Change-Id: Ib81db9cac0d213c47c5f45fb8457728d0b96aa76
This commit is contained in:
Jingwei.Zhang 2022-06-15 11:56:47 +08:00
parent e15dc5f0d6
commit ec2e85a551
12 changed files with 97 additions and 54 deletions

View File

@ -17,6 +17,7 @@ import { DomainStore } from 'stores/keystone/domain';
import Base from 'containers/TabDetail';
import { enabledColumn } from 'resources/keystone/domain';
import User from '../../User';
import UserGroup from '../../UserGroup';
import Project from '../../Project';
import actionConfigs from '../actions';
@ -44,13 +45,17 @@ export class DomainDetail extends Base {
dataIndex: 'name',
},
enabledColumn,
{
title: t('Project Num'),
dataIndex: 'projectCount',
},
{
title: t('User Num'),
dataIndex: 'userCount',
},
{
title: t('Project Num'),
dataIndex: 'projectCount',
title: t('User Group Num'),
dataIndex: 'groupCount',
},
{
title: t('Description'),
@ -61,15 +66,20 @@ export class DomainDetail extends Base {
get tabs() {
const tabs = [
{
title: t('Projects'),
key: 'project',
component: Project,
},
{
title: t('Users'),
key: 'user',
component: User,
},
{
title: t('Projects'),
key: 'project',
component: Project,
title: t('User Groups'),
key: 'userGroup',
component: UserGroup,
},
];
return tabs;

View File

@ -45,14 +45,19 @@ export class Domains extends Base {
dataIndex: 'name',
routeName: 'domainDetailAdmin',
},
{
title: t('Project Num'),
dataIndex: 'projectCount',
isHideable: true,
},
{
title: t('User Num'),
dataIndex: 'userCount',
isHideable: true,
},
{
title: t('Project Num'),
dataIndex: 'projectCount',
title: t('User Group Num'),
dataIndex: 'groupCount',
isHideable: true,
},
enabledColumn,

View File

@ -41,23 +41,19 @@ export class Projects extends Base {
}
get inProject() {
const { pathname } = this.props.location;
return pathname.includes('project-admin');
return this.path.includes('project-admin');
}
get inUserDetail() {
const { pathname } = this.props.location;
return this.inDetailPage && pathname.includes('user-admin/detail');
return this.inDetailPage && this.path.includes('user-admin/detail');
}
get inUserGroupDetail() {
const { pathname } = this.props.location;
return this.inDetailPage && pathname.includes('user-group-admin/detail');
return this.inDetailPage && this.path.includes('user-group-admin/detail');
}
get inDomainDetail() {
const { pathname } = this.props.location;
return this.inDetailPage && pathname.includes('domain-admin/detail');
return this.inDetailPage && this.path.includes('domain-admin/detail');
}
getUserProjectRole = (record) => {
@ -237,11 +233,19 @@ export class Projects extends Base {
getColumns() {
const columns = this.getBaseColumns();
if (this.inProject || this.inDomainDetail) {
if (this.inProject) {
return columns.filter(
(it) => !['userProjectRole', 'groupProjectRole'].includes(it.dataIndex)
);
}
if (this.inDomainDetail) {
return columns.filter(
(it) =>
!['domainName', 'userProjectRole', 'groupProjectRole'].includes(
it.dataIndex
)
);
}
if (this.inUserDetail) {
return columns.filter(
(it) => !['num', 'groupProjectRole'].includes(it.dataIndex)

View File

@ -146,7 +146,8 @@ export class User extends Base {
}
if (this.inDomainDetail) {
return columns.filter(
(it) => !['domain', 'projects', 'projectRoles'].includes(it.dataIndex)
(it) =>
!['domainName', 'projects', 'projectRoles'].includes(it.dataIndex)
);
}
if (this.inRoleDetail) {

View File

@ -39,18 +39,19 @@ export class UserGroups extends Base {
}
get inUserDetail() {
const { pathname } = this.props.location;
return this.inDetailPage && pathname.includes('user-admin/detail');
return this.inDetailPage && this.path.includes('user-admin/detail');
}
get inDomainDetail() {
return this.inDetailPage && this.path.includes('domain-admin/detail');
}
get inProjectDetail() {
const { pathname } = this.props.location;
return this.inDetailPage && pathname.includes('project-admin/detail');
return this.inDetailPage && this.path.includes('project-admin/detail');
}
get inRoleDetail() {
const { pathname } = this.props.location;
return this.inDetailPage && pathname.includes('role-admin/detail');
return this.inDetailPage && this.path.includes('role-admin/detail');
}
getBaseColumns() {
@ -187,20 +188,31 @@ export class UserGroups extends Base {
getColumns() {
const columns = this.getBaseColumns();
if (!this.inDetailPage || this.inUserDetail) {
return columns.filter((it) => !it.dataIndex.includes('DetailPage'));
return columns.filter(
(it) =>
!['rolesInProjectDetailPage', 'projectsInRoleDetailPage'].includes(
it.dataIndex
)
);
}
if (this.inDomainDetail) {
return columns.filter(
(it) =>
![
'domainName',
'rolesInProjectDetailPage',
'projectsInRoleDetailPage',
].includes(it.dataIndex)
);
}
if (this.inProjectDetail) {
return columns.filter(
(it) =>
it.dataIndex !== 'projects' &&
it.dataIndex !== 'projectsInRoleDetailPage'
(it) => !['projects', 'projectsInRoleDetailPage'].includes(it.dataIndex)
);
}
if (this.inRoleDetail) {
return columns.filter(
(it) =>
it.dataIndex !== 'rolesInProjectDetailPage' &&
it.dataIndex !== 'projects'
(it) => !['projects', 'rolesInProjectDetailPage'].includes(it.dataIndex)
);
}
return columns;
@ -232,6 +244,8 @@ export class UserGroups extends Base {
newParams.projectId = id;
} else if (this.inRoleDetail) {
newParams.roleId = id;
} else if (this.inDomainDetail) {
newParams.domainId = id;
}
return newParams;
};

View File

@ -52,18 +52,15 @@ export class FloatingIps extends Base {
}
get inQosDetail() {
const { pathname } = this.props.location;
return this.inDetailPage && pathname.includes('qos');
return this.inDetailPage && this.path.includes('qos');
}
get isRecycleBinDetail() {
const { pathname } = this.props.location;
return this.inDetailPage && pathname.includes('recycle-bin');
return this.inDetailPage && this.path.includes('recycle-bin');
}
get inInstanceDetail() {
const { pathname } = this.props.location;
return this.inDetailPage && pathname.includes('instance');
return this.inDetailPage && this.path.includes('instance');
}
async getData({ silent, ...params } = {}) {

View File

@ -35,8 +35,7 @@ export class SecurityGroups extends Base {
}
get isRecycleBinDetail() {
const { pathname } = this.props.location;
return pathname.indexOf('recycle-bin') >= 0;
return this.inDetailPage && this.path.includes('recycle-bin');
}
get actionConfigs() {

View File

@ -80,8 +80,7 @@ export class VirtualAdapter extends Base {
}
get isRecycleBinDetail() {
const { pathname } = this.props.location;
return pathname.indexOf('recycle-bin') >= 0;
return this.inDetailPage && this.path.includes('recycle-bin');
}
get actionConfigs() {

View File

@ -37,23 +37,19 @@ export class Share extends Base {
}
get inShareGroupDetailPage() {
const { pathname } = this.props.location;
return this.inDetailPage && pathname.includes('share-group');
return this.inDetailPage && this.path.includes('share-group');
}
get inShareTypeDetailPage() {
const { pathname } = this.props.location;
return this.inDetailPage && pathname.includes('share-type');
return this.inDetailPage && this.path.includes('share-type');
}
get inShareNetworkDetailPage() {
const { pathname } = this.props.location;
return this.inDetailPage && pathname.includes('share-network');
return this.inDetailPage && this.path.includes('share-network');
}
get inShareServerDetailPage() {
const { pathname } = this.props.location;
return this.inDetailPage && pathname.includes('share-server');
return this.inDetailPage && this.path.includes('share-server');
}
get isSortByBackend() {

View File

@ -44,8 +44,7 @@ export class Volume extends Base {
}
get isRecycleBinDetail() {
const { pathname } = this.props.location;
return pathname.indexOf('recycle-bin') >= 0;
return this.inDetailPage && this.path.includes('recycle-bin');
}
get actionConfigs() {

View File

@ -28,6 +28,10 @@ export class DomainStore extends Base {
return client.keystone.users;
}
get userGroupClient() {
return client.keystone.groups;
}
get projectClient() {
return client.keystone.projects;
}
@ -36,9 +40,10 @@ export class DomainStore extends Base {
if (!items.length) {
return items;
}
const [userResult, projectResult] = await Promise.all([
const [userResult, projectResult, userGroupResult] = await Promise.all([
this.userClient.list(),
this.projectClient.list(),
this.userGroupClient.list(),
]);
return items.map((it) => {
const users = (userResult.users || []).filter(
@ -47,30 +52,39 @@ export class DomainStore extends Base {
const projects = (projectResult.projects || []).filter(
(project) => project.domain_id === it.id
);
const groups = (userGroupResult.groups || []).filter(
(group) => group.domain_id === it.id
);
return {
...it,
users,
userCount: users.length,
projects,
projectCount: projects.length,
groups,
groupCount: groups.length,
};
});
}
async detailDidFetch(item) {
const { id } = item;
const [userResult, projectResult] = await Promise.all([
const [userResult, projectResult, groupResult] = await Promise.all([
this.userClient.list({ domain_id: id }),
this.projectClient.list({ domain_id: id }),
this.userGroupClient.list({ domain_id: id }),
]);
const { users = [] } = userResult || {};
const { projects = [] } = projectResult || {};
const { groups = [] } = groupResult || {};
return {
...item,
users,
userCount: users.length,
projects,
projectCount: projects.length,
groups,
groupCount: groups.length,
};
}

View File

@ -62,6 +62,7 @@ export class GroupStore extends Base {
groupId,
roleId,
projectId,
domainId,
withRole,
all_projects,
...rest
@ -182,7 +183,7 @@ export class GroupStore extends Base {
if (!items.length) {
return items;
}
const { projectId, roleId, withRole = true } = filters;
const { projectId, roleId, domainId, withRole = true } = filters;
const params = {};
if (projectId) {
params['project.id'] = projectId;
@ -201,7 +202,11 @@ export class GroupStore extends Base {
const { domains = [] } = domainResult;
const { projects = [] } = projectsResult || {};
const { role_assignments: assigns = [] } = roleAssignmentResult || {};
const newItems = items.map((group) => {
let newItems = items;
if (domainId) {
newItems = items.filter((it) => it.domain_id === domainId);
}
newItems = newItems.map((group) => {
return this.updateUserGroup(group, assigns, roles, domains, projects);
});
if (projectId || roleId) {