Merge "fix: Fix refresh data in detail page after finishing action"

This commit is contained in:
Zuul 2021-08-25 10:25:31 +00:00 committed by Gerrit Code Review
commit 0feb52d99a
27 changed files with 49 additions and 93 deletions

View File

@ -16,7 +16,7 @@ import React from 'react';
import classnames from 'classnames';
import Card from 'components/DetailCard';
import { toJS } from 'mobx';
import { has, isEmpty } from 'lodash';
import { has } from 'lodash';
import { isAdminPage } from 'utils/index';
import styles from './index.less';
@ -78,24 +78,23 @@ export default class BaseDetail extends React.Component {
return isAdminPage(pathname);
}
get shouldFetchDetail() {
return false;
}
getUrl(path, adminStr) {
return this.isAdminPage ? `${path}${adminStr || '-admin'}` : path;
}
getDetailData = () => {
const { detail } = this.props;
if (!detail || isEmpty(detail)) {
this.fetchData();
}
};
fetchData = (params) => {
if (this.shouldFetchDetail && this.store.fetchDetail) {
this.store
.fetchDetail({
id: this.id,
...params,
})
.catch(this.catch);
}
};
init() {

View File

@ -85,6 +85,20 @@ export default class BaseList extends React.Component {
});
}
componentDidUpdate(prevProps) {
if (this.isInDetailPage) {
const { detail: oldDetail } = prevProps;
const { detail: newDetail } = this.props;
if (
!isEmpty(oldDetail) &&
!isEmpty(newDetail) &&
!isEqual(oldDetail, newDetail)
) {
this.handleRefresh(true);
}
}
}
componentWillUnmount() {
this.unsubscribe && this.unsubscribe();
this.disposer && this.disposer();

View File

@ -170,6 +170,11 @@ export default class DetailBase extends React.Component {
return [];
}
// After the operation, the refreshed Tab needs to be forced to load
get forceLoadingTabs() {
return [];
}
handleDetailInfo = () => {
const { collapsed } = this.state;
this.setState(
@ -238,8 +243,8 @@ export default class DetailBase extends React.Component {
this.fetchDataWithPolicy(true);
};
refreshDetailByAction = () => {
this.fetchDataWithPolicy(true);
refreshDetailByAction = (silence) => {
this.fetchDataWithPolicy(silence);
};
catch = (e) => {
@ -276,7 +281,8 @@ export default class DetailBase extends React.Component {
if (success && isDelete) {
this.goBack();
} else {
this.refreshDetailByAction();
const silence = !this.forceLoadingTabs.includes(this.tab.key);
this.refreshDetailByAction(silence);
}
};

View File

@ -14,17 +14,12 @@
import React from 'react';
import { inject, observer } from 'mobx-react';
import { IronicStore } from 'stores/ironic/ironic';
import Base from 'containers/BaseDetail';
import SimpleTable from 'components/Tables/SimpleTable';
@inject('rootStore')
@observer
export default class BaseDetail extends Base {
init() {
this.store = new IronicStore();
}
get leftCards() {
const cards = [
this.baseInfoCard,

View File

@ -14,7 +14,6 @@
import React from 'react';
import { inject, observer } from 'mobx-react';
import { FlavorStore } from 'stores/nova/flavor';
import Base from 'containers/BaseDetail';
import {
categoryHasIOPS,
@ -30,10 +29,6 @@ import {
@inject('rootStore')
@observer
export default class BaseDetail extends Base {
init() {
this.store = new FlavorStore();
}
get leftCards() {
const { category, disk, usbType } = this.detailData;
const isGPUType = isGpuCategory(category);

View File

@ -15,7 +15,6 @@
import React from 'react';
import { toJS } from 'mobx';
import { inject, observer } from 'mobx-react';
import { ImageStore } from 'stores/glance/image';
import { imageProperties, imageVisibility, imageOS } from 'resources/image';
import Base from 'containers/BaseDetail';
import { isObject, isArray } from 'lodash';
@ -24,10 +23,6 @@ import { Link } from 'react-router-dom';
@inject('rootStore')
@observer
export default class BaseDetail extends Base {
init() {
this.store = new ImageStore();
}
get isImageDetail() {
const { pathname } = this.props.location;
return pathname.indexOf('image') >= 0;

View File

@ -34,7 +34,7 @@ export default class ManageMetadata extends ModalAction {
}
get name() {
return t('Manage host');
return t('Manage Metadata');
}
static get modalSize() {

View File

@ -13,16 +13,11 @@
// limitations under the License.
import { inject, observer } from 'mobx-react';
import { KeypairStore } from 'stores/nova/keypair';
import Base from 'containers/BaseDetail';
@inject('rootStore')
@observer
export default class BaseDetail extends Base {
init() {
this.store = new KeypairStore();
}
get leftCards() {
return [this.keypairInfoCard];
}

View File

@ -14,17 +14,12 @@
import React from 'react';
import { inject, observer } from 'mobx-react';
import { MetadataStore } from 'stores/glance/metadata';
import Base from 'containers/BaseDetail';
import styles from './styles.less';
@inject('rootStore')
@observer
export default class BaseDetail extends Base {
init() {
this.store = new MetadataStore();
}
get leftCards() {
return [this.baseInfoCard, this.resourceCard];
}

View File

@ -33,6 +33,10 @@ export default class Edit extends ModalAction {
return t('Edit metadata');
}
get instanceName() {
return this.item.display_name;
}
static policy = 'modify_metadef_namespace';
static allowed = () => Promise.resolve(true);

View File

@ -15,15 +15,10 @@
import React from 'react';
import { inject, observer } from 'mobx-react';
import Base from 'containers/BaseDetail';
import { NeutronAgentStore } from 'stores/neutron/agent';
@inject('rootStore')
@observer
export default class BaseDetail extends Base {
init() {
this.store = new NeutronAgentStore();
}
get leftCards() {
return [this.baseCard];
}

View File

@ -20,8 +20,6 @@ import { rollbackTip } from 'resources/stack';
@inject('rootStore')
@observer
export default class BaseDetail extends Base {
fetchData = () => Promise.resolve(true);
get leftCards() {
return [this.startCard, this.outputCard];
}

View File

@ -47,6 +47,10 @@ export default class InstanceDetail extends Base {
this.store = new ProjectStore();
}
get forceLoadingTabs() {
return ['quota'];
}
get detailInfos() {
return [
{

View File

@ -68,10 +68,6 @@ class CreateForm extends ModalAction {
return data;
}
get listUrl() {
return this.getUrl('/identity/project');
}
get domainList() {
const {
rootStore: { baseDomains },

View File

@ -52,10 +52,6 @@ class EditForm extends ModalAction {
return {};
}
get listUrl() {
return this.getUrl('/identity/project');
}
checkName = (rule, value) => {
if (!value) {
return Promise.reject(t('Please input'));

View File

@ -56,10 +56,6 @@ class EditForm extends ModalAction {
return Promise.resolve(true);
}
get listUrl() {
return this.getUrl('/identity/user');
}
get domainList() {
return (this.userGroupStore.list.data || []).map((it) => ({
label: it.name,

View File

@ -92,10 +92,6 @@ class CreateForm extends ModalAction {
return data;
}
get listUrl() {
return '/identity/user-group-admin';
}
get domainList() {
const { domains } = this.domainStore;
return (domains || []).map((it) => ({

View File

@ -28,6 +28,10 @@ export default class BaseDetail extends Base {
}
}
get shouldFetchDetail() {
return true;
}
init() {
this.store = globalListenerStore;
this.healthmonitorStore = new HealthMonitorStore();

View File

@ -18,8 +18,6 @@ import Base from 'containers/BaseDetail';
@inject('rootStore')
@observer
export default class BaseDetail extends Base {
fetchData = () => {};
get leftCards() {
const cards = [this.baseInfoCard];
return cards;

View File

@ -18,8 +18,6 @@ import Base from 'containers/BaseDetail';
@inject('rootStore')
@observer
export default class BaseDetail extends Base {
fetchData = () => Promise.resolve(true);
get leftCards() {
return [...this.BandwidthCard, this.DSCPMarkingCard];
}

View File

@ -14,16 +14,11 @@
import React from 'react';
import { inject, observer } from 'mobx-react';
import { RouterStore } from 'stores/neutron/router';
import Base from 'containers/BaseDetail';
@inject('rootStore')
@observer
export default class BaseDetail extends Base {
init() {
this.store = new RouterStore();
}
get leftCards() {
const cards = [this.aZoneCard];
return cards;

View File

@ -14,7 +14,6 @@
import React from 'react';
import { inject, observer } from 'mobx-react';
import { PortStore } from 'stores/neutron/port';
import Base from 'containers/BaseDetail';
import { bindingTypes } from 'resources/port';
import { isEmpty } from 'lodash';
@ -22,10 +21,6 @@ import { isEmpty } from 'lodash';
@inject('rootStore')
@observer
export default class BaseDetail extends Base {
init() {
this.store = new PortStore();
}
get leftCards() {
const cards = [this.portInfo];
const {

View File

@ -21,8 +21,6 @@ import { bindingTypes } from 'resources/port';
@inject('rootStore')
@observer
export default class BaseDetail extends Base {
componentDidMount() {}
get leftCards() {
return [this.baseInfoCard];
}

View File

@ -20,8 +20,6 @@ import { Link } from 'react-router-dom';
@inject('rootStore')
@observer
export default class BaseDetail extends Base {
fetchData = () => Promise.resolve(true);
get leftCards() {
const cards = [this.volumeCard];
return cards;

View File

@ -20,8 +20,6 @@ import Base from 'containers/BaseDetail';
@inject('rootStore')
@observer
export default class BaseDetail extends Base {
fetchData = () => Promise.resolve(true);
get leftCards() {
return [this.volumeCard];
}

View File

@ -20,8 +20,6 @@ import Base from 'containers/BaseDetail';
@inject('rootStore')
@observer
export default class BaseDetail extends Base {
fetchData = () => Promise.resolve(true);
get leftCards() {
const cards = [this.attachmentsCard];
if (this.detailData.volume_image_metadata) {

View File

@ -13,17 +13,12 @@
// limitations under the License.
import { inject, observer } from 'mobx-react';
import { VolumeTypeStore } from 'stores/cinder/volume-type';
import Base from 'containers/BaseDetail';
import { controls } from 'resources/volume-type';
@inject('rootStore')
@observer
export default class BaseDetail extends Base {
init() {
this.store = new VolumeTypeStore();
}
get leftCards() {
return [this.encryptionInfo];
}