refactor: Refactor QoS Policy code

refactor qos policy code

Change-Id: I22b3655cf879b280a1a30a5516daed1c26a44b32
This commit is contained in:
zhuyue 2021-09-15 18:04:20 +08:00
parent 438bc2e6fa
commit 6e96e18809
9 changed files with 160 additions and 302 deletions

View File

@ -33,7 +33,6 @@ export class Edit extends ModalAction {
init() {
this.qosPolicyStore = new QoSPolicyStore();
this.state.qosPolicy = this.item.qos_policy_id;
}
get defaultValue() {
@ -45,7 +44,7 @@ export class Edit extends ModalAction {
selectedRows: item.qos_policy_id
? [
{
key: item.qos_policy_id,
id: item.qos_policy_id,
name: item.qos_policy_id,
},
]

View File

@ -1,77 +0,0 @@
// Copyright 2021 99cloud
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
import { observer, inject } from 'mobx-react';
import Base from 'containers/List';
import { QoSPolicyStore } from 'stores/neutron/qos-policy';
import { qosPolicyColumns, qosPolicyFilters } from 'resources/qos-policy';
import actionConfigs from './actions';
export class QoSPolicy extends Base {
init() {
this.store = new QoSPolicyStore();
this.downloadStore = new QoSPolicyStore();
}
get policy() {
return 'get_policy';
}
get name() {
return t('QoS policies');
}
get actionConfigs() {
if (this.isAdminPage) {
return actionConfigs.actionConfigs;
}
return actionConfigs.consoleActions;
}
get isFilterByBackend() {
return true;
}
get isSortByBackend() {
return true;
}
get defaultSortKey() {
return 'name';
}
getColumns = () => {
const ret = [...qosPolicyColumns];
ret[0].linkPrefix = `/network/${this.getUrl('qos-policy')}/detail`;
ret.splice(2, 0, {
title: t('Project ID/Name'),
dataIndex: 'project_name',
sortKey: 'project_id',
});
return ret;
};
get searchFilters() {
const filters = [
...qosPolicyFilters,
{
label: t('Project ID'),
name: 'tenant_id',
},
];
return filters;
}
}
export default inject('rootStore')(observer(QoSPolicy));

View File

@ -1,82 +0,0 @@
// Copyright 2021 99cloud
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
import { observer, inject } from 'mobx-react';
import Base from 'containers/List';
import { QoSPolicyStore } from 'stores/neutron/qos-policy';
import { qosPolicyColumns, qosPolicyFilters } from 'resources/qos-policy';
import actionConfigs from './actions';
export class QoSPolicy extends Base {
init() {
this.store = new QoSPolicyStore();
this.downloadStore = new QoSPolicyStore();
}
get fetchDataByCurrentProject() {
// add project_id to fetch data;
return true;
}
get policy() {
return 'get_policy';
}
get name() {
return t('QoS policies');
}
get actionConfigs() {
if (this.isAdminPage) {
return actionConfigs.actionConfigs;
}
return actionConfigs.consoleActions;
}
get isFilterByBackend() {
return true;
}
get isSortByBackend() {
return true;
}
get defaultSortKey() {
return 'name';
}
getColumns = () => {
const ret = [...qosPolicyColumns];
ret[0].linkPrefix = `/network/${this.getUrl('qos-policy')}/detail`;
this.isAdminPage &&
ret.splice(2, 0, {
title: t('Project ID/Name'),
dataIndex: 'project_name',
sortKey: 'project_id',
});
return ret;
};
get searchFilters() {
const filters = [...qosPolicyFilters];
this.isAdminPage &&
filters.push({
label: t('Project ID'),
name: 'tenant_id',
});
return filters;
}
}
export default inject('rootStore')(observer(QoSPolicy));

View File

@ -15,7 +15,7 @@
import { observer, inject } from 'mobx-react';
import Base from 'containers/List';
import { QoSPolicyStore } from 'stores/neutron/qos-policy';
import { qosPolicyColumns, qosPolicyFilters } from 'resources/qos-policy';
import { getQosPolicyColumns, getQosPolicyFilters } from 'resources/qos-policy';
import actionConfigs from './actions';
export class QoSPolicy extends Base {
@ -26,7 +26,7 @@ export class QoSPolicy extends Base {
updateFetchParamsByPage = (params) => ({
...params,
shared: true,
all_projects: this.tabKey === 'allQoSPolicy' || this.isAdminPage,
});
get policy() {
@ -56,29 +56,46 @@ export class QoSPolicy extends Base {
return 'name';
}
getColumns = () => {
const ret = [...qosPolicyColumns];
ret[0].linkPrefix = `/network/${this.getUrl('qos-policy')}/detail`;
this.isAdminPage &&
ret.splice(2, 0, {
title: t('Project ID/Name'),
dataIndex: 'project_name',
sortKey: 'project_id',
});
return ret;
get tabKey() {
const { tab } = this.props;
return tab;
}
getColumnParamsFromTabKey() {
switch (this.tabKey) {
case 'projectQoSPolicy':
return {
self: this,
all: false,
shared: false,
};
case 'sharedQoSPolicy':
return {
self: this,
all: false,
shared: true,
};
case 'allQoSPolicy':
return {
self: this,
all: true,
shared: false,
};
default:
return {
self: this,
all: true,
shared: false,
};
}
}
getColumns() {
return getQosPolicyColumns(this.getColumnParamsFromTabKey());
}
get searchFilters() {
const filters = [...qosPolicyFilters];
// shared tab do not need this filter
const sharedFilterIndex = filters.findIndex((i) => i.name === 'shared');
filters.splice(sharedFilterIndex, 1);
this.isAdminPage &&
filters.push({
label: t('Project ID'),
name: 'tenant_id',
});
return filters;
return getQosPolicyFilters(this.getColumnParamsFromTabKey());
}
}

View File

@ -14,31 +14,29 @@
import { observer, inject } from 'mobx-react';
import Base from 'containers/TabList';
import ProjectQoSPolicy from './ProjectQoSPolicy';
import AdminQoSPolicy from './AdminQoSPolicy';
import SharedQoSPolicy from './SharedQoSPolicy';
import QoSPolicyComponent from './QoSPolicy';
@inject('rootStore')
@observer
export default class Network extends Base {
export default class QoSPolicy extends Base {
get tabs() {
const tabs = [
{
title: t('Current Project QoS Policy'),
key: 'projectQoSPolicy',
component: ProjectQoSPolicy,
component: QoSPolicyComponent,
},
{
title: t('Shared QoS Policy'),
key: 'sharedQoSPolicy',
component: SharedQoSPolicy,
component: QoSPolicyComponent,
},
];
if (this.hasAdminRole) {
tabs.push({
title: t('All QoS Policy'),
key: 'allQoSPolicy',
component: AdminQoSPolicy,
component: QoSPolicyComponent,
});
}
return tabs;

View File

@ -317,7 +317,7 @@ export class CreateAction extends ModalAction {
name: 'qos_policy_id',
label: t('QoS Policy'),
type: 'tab-select-table',
tabs: getQoSPolicyTabs.call(this, {}, false),
tabs: getQoSPolicyTabs.call(this),
isMulti: false,
required: enableQosPolicy,
tip: t('Choosing a QoS policy can limit bandwidth and DSCP'),

View File

@ -19,9 +19,7 @@ import { QoSPolicyStore } from 'stores/neutron/qos-policy';
import globalVirtualAdapterStore from 'stores/neutron/virtual-adapter';
import { getQoSPolicyTabs } from 'resources/qos-policy';
@inject('rootStore')
@observer
export default class ModifyQoS extends ModalAction {
export class ModifyQoS extends ModalAction {
static id = 'modify_qos';
static title = t('Modify QoS');
@ -132,13 +130,9 @@ export default class ModifyQoS extends ModalAction {
name: 'qos_policy_id',
label: t('QoS Policy'),
type: 'tab-select-table',
tabs: getQoSPolicyTabs.call(
this,
{
tabs: getQoSPolicyTabs.call(this, {
disabledFunc: (item) => item.id === this.item.qos_policy_id,
},
false
),
}),
isMulti: false,
required: true,
tip: t('Choosing a QoS policy can limit bandwidth and DSCP'),
@ -147,3 +141,5 @@ export default class ModifyQoS extends ModalAction {
];
}
}
export default inject('rootStore')(observer(ModifyQoS));

View File

@ -26,7 +26,7 @@ import PortDetail from '../containers/Router/Port/Detail';
import VirtualAdapter from '../containers/VirtualAdapter';
import VirtualAdapterDetail from '../containers/VirtualAdapter/Detail';
import QoSPolicy from '../containers/QoSPolicy';
import AdminQoSPolicy from '../containers/QoSPolicy/AdminQoSPolicy';
import AdminQoSPolicy from '../containers/QoSPolicy/QoSPolicy';
import QoSPolicyDetail from '../containers/QoSPolicy/Detail';
import LoadBalancers from '../containers/LoadBalancers/LoadBalancerInstance';
import StepCreateLoadBalancer from '../containers/LoadBalancers/LoadBalancerInstance/actions/StepCreate';

View File

@ -30,10 +30,12 @@ const getRuleValue = (rule) => {
: `${t('DSCP Marking')}: ${rule.dscp_mark}`;
};
export const qosPolicyColumns = [
export const getQosPolicyColumns = ({ self, all = false }) => {
const ret = [
{
title: t('ID/Name'),
dataIndex: 'name',
linkPrefix: `/network/${self.getUrl('qos-policy')}/detail`,
},
{
title: t('Description'),
@ -83,9 +85,19 @@ export const qosPolicyColumns = [
isHideable: true,
sorter: false,
},
];
];
if (all) {
ret.splice(2, 0, {
title: t('Project ID/Name'),
dataIndex: 'project_name',
sortKey: 'project_id',
});
}
return ret;
};
export const qosPolicyFilters = [
export const getQosPolicyFilters = ({ self, shared = false }) => {
const ret = [
{
label: t('Name'),
name: 'name',
@ -94,12 +106,22 @@ export const qosPolicyFilters = [
label: t('Description'),
name: 'description',
},
{
];
if (!shared) {
ret.push({
label: t('Shared'),
name: 'shared',
options: yesNoOptions,
},
];
});
}
if (self.hasAdminRole) {
ret.push({
label: t('Project ID'),
name: 'tenant_id',
});
}
return ret;
};
export const qosPolicySortProps = {
isSortByBack: true,
@ -107,32 +129,26 @@ export const qosPolicySortProps = {
defaultSortOrder: 'descend',
};
export const qosPolicySelectTableProps = {
export const getQosPolicySelectTableProps = ({ self, all, shared }) => ({
...qosPolicySortProps,
columns: qosPolicyColumns,
filterParams: qosPolicyFilters,
};
columns: getQosPolicyColumns({ self, all }),
filterParams: getQosPolicyFilters({ self, shared }),
});
/**
* * getQosPolicyTabs in component, should used by call/apply to make this' point to component
* @param {*} extraProps
* @returns {[{title: *, key: string, props: *}, {title: *, key: string, props: *}]}
* getQosPolicyTabs in component, should used by call/apply to make this' point to component
*/
export function getQoSPolicyTabs(extraProps) {
export function getQoSPolicyTabs(extraProps = {}) {
const baseProps = {
...qosPolicySelectTableProps,
backendPageStore: this.qosPolicyStore,
...extraProps,
};
// make ID/Name column show id
baseProps.columns[0].linkPrefix = `/network/${this.getUrl(
'qos-policy'
)}/detail`;
const ret = [
{
title: t('Current Project QoS Policy'),
key: 'project',
props: merge({}, baseProps, {
...getQosPolicySelectTableProps({ self: this }),
extraParams: {
project_id: this.currentProjectId,
},
@ -142,6 +158,7 @@ export function getQoSPolicyTabs(extraProps) {
title: t('Shared QoS Policy'),
key: 'shared',
props: merge({}, baseProps, {
...getQosPolicySelectTableProps({ shared: true, self: this }),
extraParams: {
shared: true,
},
@ -149,28 +166,18 @@ export function getQoSPolicyTabs(extraProps) {
},
];
// shared tab do not need shared filter
const sharedFilterIndex = ret[1].props.filterParams.findIndex(
(i) => i.name === 'shared'
);
ret[1].props.filterParams.splice(sharedFilterIndex, 1);
if (this.hasAdminRole) {
const adminBaseProps = merge({}, baseProps, {
extraParams: {
all_projects: true,
},
});
adminBaseProps.columns.splice(1, 0, {
title: t('Project ID/Name'),
dataIndex: 'project_name',
sortKey: 'project_id',
});
ret.push({
title: t('All QoS Policy'),
key: 'all',
props: adminBaseProps,
props: merge({}, baseProps, {
...getQosPolicySelectTableProps({ all: true, self: this }),
extraParams: {
all_projects: true,
},
}),
});
}
return ret;
}