diff --git a/src/components/FormItem/SelectTable/index.jsx b/src/components/FormItem/SelectTable/index.jsx index 4dc139b2..27e25caf 100644 --- a/src/components/FormItem/SelectTable/index.jsx +++ b/src/components/FormItem/SelectTable/index.jsx @@ -125,6 +125,10 @@ export default class SelectTable extends React.Component { this.sortOrder = props.defaultSortOrder; } + componentDidMount() { + this.getData(); + } + componentDidUpdate(prevProps, prevState) { if (!isEqual(prevProps.backendPageStore, this.props.backendPageStore)) { this.getData(); diff --git a/src/pages/compute/containers/Flavor/actions/ManageAccess.jsx b/src/pages/compute/containers/Flavor/actions/ManageAccess.jsx index 298a146e..7f57dc9e 100644 --- a/src/pages/compute/containers/Flavor/actions/ManageAccess.jsx +++ b/src/pages/compute/containers/Flavor/actions/ManageAccess.jsx @@ -94,6 +94,7 @@ export default class ManageAccess extends ModalAction { type: 'select-table', isMulti: true, required: true, + isLoading: this.projectStore.list.isLoading, datas: this.projects, ...projectTableOptions, }, diff --git a/src/pages/compute/containers/Flavor/actions/StepCreate/AccessTypeSetting.jsx b/src/pages/compute/containers/Flavor/actions/StepCreate/AccessTypeSetting.jsx index ce658638..9d4659a2 100644 --- a/src/pages/compute/containers/Flavor/actions/StepCreate/AccessTypeSetting.jsx +++ b/src/pages/compute/containers/Flavor/actions/StepCreate/AccessTypeSetting.jsx @@ -72,6 +72,7 @@ export default class AccessTypeSetting extends Base { hidden: !showChoose, required: showChoose, datas: this.projects, + isLoading: this.projectStore.list.isLoading, ...projectTableOptions, }, ]; diff --git a/src/pages/compute/containers/HostAggregate/Aggregate/actions/ManageHost.jsx b/src/pages/compute/containers/HostAggregate/Aggregate/actions/ManageHost.jsx index e50a3398..a724f920 100644 --- a/src/pages/compute/containers/HostAggregate/Aggregate/actions/ManageHost.jsx +++ b/src/pages/compute/containers/HostAggregate/Aggregate/actions/ManageHost.jsx @@ -91,6 +91,7 @@ export default class ManageHost extends ModalAction { type: 'select-table', isMulti: true, datas: this.computeHosts, + isLoading: globalComputeHostStore.list.isLoading, filterParams: [ { label: t('Host'), diff --git a/src/pages/compute/containers/Image/actions/Create.jsx b/src/pages/compute/containers/Image/actions/Create.jsx index bdc9a561..97cce01d 100644 --- a/src/pages/compute/containers/Image/actions/Create.jsx +++ b/src/pages/compute/containers/Image/actions/Create.jsx @@ -141,6 +141,7 @@ class CreateForm extends FormAction { required: this.isAdminPage, hidden: !this.isAdminPage, datas: this.projects, + isLoading: this.projectStore.list.isLoading, ...projectTableOptions, }, { @@ -207,6 +208,7 @@ class CreateForm extends FormAction { isMulti: true, hidden: !isShare, datas: this.projects, + isLoading: this.projectStore.list.isLoading, ...projectTableOptions, }, { diff --git a/src/pages/compute/containers/Image/actions/ManageAccess.jsx b/src/pages/compute/containers/Image/actions/ManageAccess.jsx index 254bbaa7..c4212f5c 100644 --- a/src/pages/compute/containers/Image/actions/ManageAccess.jsx +++ b/src/pages/compute/containers/Image/actions/ManageAccess.jsx @@ -92,6 +92,7 @@ export default class ManageAccess extends ModalAction { isMulti: true, required: true, datas: this.projects, + isLoading: this.projectStore.list.isLoading, ...projectTableOptions, }, ]; diff --git a/src/pages/compute/containers/Instance/actions/AssociateFip.jsx b/src/pages/compute/containers/Instance/actions/AssociateFip.jsx index fcee2acf..4a10d969 100644 --- a/src/pages/compute/containers/Instance/actions/AssociateFip.jsx +++ b/src/pages/compute/containers/Instance/actions/AssociateFip.jsx @@ -40,6 +40,7 @@ export default class AssociateFip extends ModalAction { canAssociateFloatingIPs: [], canReachSubnetIdsWithRouterId: [], routerIdWithExternalNetworkInfo: [], + portLoading: true, }; } @@ -64,6 +65,7 @@ export default class AssociateFip extends ModalAction { const interfaces = await getInterfaceWithReason(instanceInterfaces); this.setState({ interfaces, + portLoading: false, }); } @@ -105,7 +107,7 @@ export default class AssociateFip extends ModalAction { } get formItems() { - const { fixed_ip, canAssociateFloatingIPs } = this.state; + const { canAssociateFloatingIPs, portLoading, fipLoading } = this.state; return [ { name: 'instance', @@ -119,6 +121,7 @@ export default class AssociateFip extends ModalAction { type: 'select-table', required: true, datas: this.ports, + isLoading: portLoading, isMulti: false, filterParams: [ { @@ -153,7 +156,7 @@ export default class AssociateFip extends ModalAction { type: 'select-table', required: true, datas: canAssociateFloatingIPs, - hidden: !fixed_ip, + isLoading: fipLoading, isMulti: false, filterParams: [ { diff --git a/src/pages/compute/containers/Instance/actions/AttachInterface.jsx b/src/pages/compute/containers/Instance/actions/AttachInterface.jsx index 58a0d0e2..65a7a7df 100644 --- a/src/pages/compute/containers/Instance/actions/AttachInterface.jsx +++ b/src/pages/compute/containers/Instance/actions/AttachInterface.jsx @@ -176,6 +176,7 @@ export default class AttachInterface extends ModalAction { type: 'select-table', required: isManua, datas: this.subnets, + isLoading: this.subnetStore.list.isLoading, hidden: !isManua, isMulti: false, filterParams: [ diff --git a/src/pages/compute/containers/Instance/actions/CreateIronic/BaseStep/index.jsx b/src/pages/compute/containers/Instance/actions/CreateIronic/BaseStep/index.jsx index 3fad063f..9a4553b4 100644 --- a/src/pages/compute/containers/Instance/actions/CreateIronic/BaseStep/index.jsx +++ b/src/pages/compute/containers/Instance/actions/CreateIronic/BaseStep/index.jsx @@ -145,6 +145,10 @@ export default class BaseStep extends Base { }; get formItems() { + const { image } = this.locationParams; + const imageLoading = image + ? this.imageStore.isLoading + : this.imageStore.list.isLoading; return [ { name: 'project', @@ -187,6 +191,7 @@ export default class BaseStep extends Base { label: t('Operating System'), type: 'select-table', datas: this.images, + isLoading: imageLoading, isMulti: false, filterParams: [ { diff --git a/src/pages/compute/containers/Instance/actions/CreateIronic/SystemStep/index.jsx b/src/pages/compute/containers/Instance/actions/CreateIronic/SystemStep/index.jsx index 6a41db9e..540af8e3 100644 --- a/src/pages/compute/containers/Instance/actions/CreateIronic/SystemStep/index.jsx +++ b/src/pages/compute/containers/Instance/actions/CreateIronic/SystemStep/index.jsx @@ -98,6 +98,7 @@ export default class SystemStep extends Base { label: t('Keypair'), type: 'select-table', datas: this.keypairs, + isLoading: this.keyPairStore.list.isLoading, isMulti: false, required: !isPassword, hidden: isPassword, diff --git a/src/pages/compute/containers/Instance/actions/DetachInterface.jsx b/src/pages/compute/containers/Instance/actions/DetachInterface.jsx index 6cc39d80..1406c4ac 100644 --- a/src/pages/compute/containers/Instance/actions/DetachInterface.jsx +++ b/src/pages/compute/containers/Instance/actions/DetachInterface.jsx @@ -29,6 +29,7 @@ export default class DetachInterface extends ModalAction { init() { this.store = new ServerStore(); this.getPorts(); + this.state.portLoading = true; } get name() { @@ -60,8 +61,11 @@ export default class DetachInterface extends ModalAction { return portsMap; } - getPorts() { - this.store.fetchInterfaceList({ id: this.item.id }); + async getPorts() { + await this.store.fetchInterfaceList({ id: this.item.id }); + this.setState({ + portLoading: false, + }); } get defaultValue() { @@ -82,6 +86,7 @@ export default class DetachInterface extends ModalAction { ); get formItems() { + const { portLoading } = this.state; return [ { name: 'instance', @@ -95,6 +100,7 @@ export default class DetachInterface extends ModalAction { type: 'select-table', required: true, datas: this.ports, + isLoading: portLoading, isMulti: true, filterParams: [ { diff --git a/src/pages/compute/containers/Instance/actions/DetachIsoVolume.jsx b/src/pages/compute/containers/Instance/actions/DetachIsoVolume.jsx index dab5885b..cf675fe5 100644 --- a/src/pages/compute/containers/Instance/actions/DetachIsoVolume.jsx +++ b/src/pages/compute/containers/Instance/actions/DetachIsoVolume.jsx @@ -98,6 +98,7 @@ export default class DetachIsoVolume extends ModalAction { type: 'select-table', required: true, datas: this.volumes, + isLoading: this.volumeStore.list.isLoading, isMulti: true, filterParams: [ { diff --git a/src/pages/compute/containers/Instance/actions/DetachVolume.jsx b/src/pages/compute/containers/Instance/actions/DetachVolume.jsx index 4339d04a..26132d4d 100644 --- a/src/pages/compute/containers/Instance/actions/DetachVolume.jsx +++ b/src/pages/compute/containers/Instance/actions/DetachVolume.jsx @@ -93,6 +93,7 @@ export default class DetachVolume extends ModalAction { type: 'select-table', required: true, datas: this.volumes, + isLoading: this.volumeStore.list.isLoading, filterParams: [ { label: t('Name'), diff --git a/src/pages/compute/containers/Instance/actions/LiveMigrate.jsx b/src/pages/compute/containers/Instance/actions/LiveMigrate.jsx index d1c61217..1cc43795 100644 --- a/src/pages/compute/containers/Instance/actions/LiveMigrate.jsx +++ b/src/pages/compute/containers/Instance/actions/LiveMigrate.jsx @@ -121,6 +121,9 @@ export default class LiveMigrate extends ModalAction { label: t('Target Compute Host'), type: 'select-table', datas: this.hypervisors, + isLoading: + this.hypervisorStore.list.isLoading && + globalComputeHostStore.list.isLoading, isMulti: false, extra: t( 'If nova-compute on the host is disabled, it will be forbidden to be selected as the target host.' diff --git a/src/pages/compute/containers/Instance/actions/ManageSecurityGroup.jsx b/src/pages/compute/containers/Instance/actions/ManageSecurityGroup.jsx index acb80075..209424aa 100644 --- a/src/pages/compute/containers/Instance/actions/ManageSecurityGroup.jsx +++ b/src/pages/compute/containers/Instance/actions/ManageSecurityGroup.jsx @@ -142,6 +142,8 @@ export default class ManageSecurityGroup extends ModalAction { type: 'select-table', required: true, datas: this.ports, + isLoading: + this.portStore.list.isLoading && this.portStoreOrigin.list.isLoading, isMulti: false, onChange: this.onPortChange, filterParams: [ diff --git a/src/pages/compute/containers/Instance/actions/Migrate.jsx b/src/pages/compute/containers/Instance/actions/Migrate.jsx index ef295ec9..f0c053d0 100644 --- a/src/pages/compute/containers/Instance/actions/Migrate.jsx +++ b/src/pages/compute/containers/Instance/actions/Migrate.jsx @@ -118,6 +118,9 @@ export default class LiveMigrate extends ModalAction { label: t('Target Compute Host'), type: 'select-table', datas: this.hypervisors, + isLoading: + this.hypervisorStore.list.isLoading && + globalComputeHostStore.list.isLoading, isMulti: false, extra: t( 'If nova-compute on the host is disabled, it will be forbidden to be selected as the target host.' diff --git a/src/pages/compute/containers/Instance/actions/RebuildSelect.jsx b/src/pages/compute/containers/Instance/actions/RebuildSelect.jsx index 16436ada..582f86e6 100644 --- a/src/pages/compute/containers/Instance/actions/RebuildSelect.jsx +++ b/src/pages/compute/containers/Instance/actions/RebuildSelect.jsx @@ -144,6 +144,7 @@ export default class Rebuild extends ModalAction { label: t('Operating System'), type: 'select-table', datas: this.images, + isLoading: this.imageStore.list.isLoading, required: true, isMulti: false, filterParams: [ diff --git a/src/pages/compute/containers/Instance/actions/StepCreate/BaseStep/index.jsx b/src/pages/compute/containers/Instance/actions/StepCreate/BaseStep/index.jsx index 54549f63..f0ccb167 100644 --- a/src/pages/compute/containers/Instance/actions/StepCreate/BaseStep/index.jsx +++ b/src/pages/compute/containers/Instance/actions/StepCreate/BaseStep/index.jsx @@ -307,6 +307,10 @@ export default class BaseStep extends Base { }; get formItems() { + const { image } = this.locationParams; + const imageLoading = image + ? this.imageStore.isLoading + : this.imageStore.list.isLoading; return [ { name: 'project', @@ -359,6 +363,7 @@ export default class BaseStep extends Base { label: t('Operating System'), type: 'select-table', datas: this.images, + isLoading: imageLoading, required: this.sourceTypeIsImage, isMulti: false, hidden: !this.sourceTypeIsImage, @@ -381,6 +386,7 @@ export default class BaseStep extends Base { label: t('Bootable Volume'), type: 'select-table', datas: this.volumes, + isLoading: this.volumeStore.list.isLoading, required: this.sourceTypeIsVolume, isMulti: false, hidden: !this.sourceTypeIsVolume, diff --git a/src/pages/compute/containers/Instance/actions/StepCreate/SystemStep/index.jsx b/src/pages/compute/containers/Instance/actions/StepCreate/SystemStep/index.jsx index 1c4613e5..0921a8dc 100644 --- a/src/pages/compute/containers/Instance/actions/StepCreate/SystemStep/index.jsx +++ b/src/pages/compute/containers/Instance/actions/StepCreate/SystemStep/index.jsx @@ -216,6 +216,7 @@ export default class SystemStep extends Base { label: t('Keypair'), type: 'select-table', datas: this.keypairs, + isLoading: this.keyPairStore.list.isLoading, isMulti: false, required: !isPassword, hidden: isPassword, @@ -279,6 +280,7 @@ export default class SystemStep extends Base { hidden: !this.hasAdminRole || !more || !isManually, required: isManually, datas: this.hypervisors, + isLoading: this.hypervisorStore.list.isLoading, extra: t( 'You can manually specify a physical node to create an instance.' ), @@ -291,6 +293,7 @@ export default class SystemStep extends Base { type: 'select-table', hidden: !more, datas: this.serverGroups, + isLoading: this.serverGroupStore.list.isLoading, extra: t( 'Using server groups, you can create cloud hosts on the same/different physical nodes as much as possible to meet the affinity/non-affinity requirements of business applications.' ), diff --git a/src/pages/compute/containers/Instance/components/FlavorSelectTable.jsx b/src/pages/compute/containers/Instance/components/FlavorSelectTable.jsx index d9a2fda0..071db208 100644 --- a/src/pages/compute/containers/Instance/components/FlavorSelectTable.jsx +++ b/src/pages/compute/containers/Instance/components/FlavorSelectTable.jsx @@ -332,10 +332,13 @@ export default class FlavorSelectTable extends Component { render() { const { value } = this.props; + const isLoading = + this.settingStore.list.isLoading && this.flavorStore.list.isLoading; const props = { columns: this.columns, datas: this.flavors, tableHeader: this.renderTableHeander(), + isLoading, filterParams: [ { label: t('Name'), diff --git a/src/pages/configuration/containers/Metadata/actions/Manage.jsx b/src/pages/configuration/containers/Metadata/actions/Manage.jsx index eca5d145..1905d2b7 100644 --- a/src/pages/configuration/containers/Metadata/actions/Manage.jsx +++ b/src/pages/configuration/containers/Metadata/actions/Manage.jsx @@ -114,6 +114,7 @@ export default class Manage extends ModalAction { label: t('Resource Types'), type: 'select-table', datas: this.resourceTypes, + isLoading: this.store.resourceTypeLoading, isMulti: true, filterParams: [ { diff --git a/src/pages/network/containers/FloatingIp/Detail/PortForwarding/actions/Edit.jsx b/src/pages/network/containers/FloatingIp/Detail/PortForwarding/actions/Edit.jsx index 159c1d70..07ec6ab2 100644 --- a/src/pages/network/containers/FloatingIp/Detail/PortForwarding/actions/Edit.jsx +++ b/src/pages/network/containers/FloatingIp/Detail/PortForwarding/actions/Edit.jsx @@ -59,8 +59,8 @@ export default class Edit extends ModalAction { } async getFipAlreadyUsedPorts() { - const detail = await globalPortForwardingStore.getFipAlreadyUsedPorts({ - fipID: this.item.fip.id, + const detail = await globalPortForwardingStore.fetchList({ + fipId: this.item.fip.id, }); this.setState({ alreadyUsedPorts: detail || [], @@ -68,6 +68,9 @@ export default class Edit extends ModalAction { } async getInitialPortFixedIPs() { + this.setState({ + fixedIpLoading: true, + }); const { internal_port_id, internal_ip_address } = this.item; const portDetail = await globalPortStore.fetchDetail({ id: internal_port_id, @@ -143,6 +146,9 @@ export default class Edit extends ModalAction { } handlePortSelect = async (data) => { + this.setState({ + fixedIpLoading: true, + }); const { canReachSubnetIdsWithRouterId } = this.state; const interfacesWithReason = await getInterfaceWithReason( data.selectedRows @@ -156,6 +162,7 @@ export default class Edit extends ModalAction { this.setState({ portFixedIPs, fixed_ip_address: undefined, + fixedIpLoading: false, }); this.formRef.current && @@ -181,7 +188,7 @@ export default class Edit extends ModalAction { data.internal_port_id = selectedRows[0].id; return globalPortForwardingStore.edit( { - fipID: this.item.fip.id, + fipId: this.item.fip.id, id: this.item.id, }, data diff --git a/src/pages/network/containers/FloatingIp/Detail/PortForwarding/index.jsx b/src/pages/network/containers/FloatingIp/Detail/PortForwarding/index.jsx index 97390cb4..3f4a3b57 100644 --- a/src/pages/network/containers/FloatingIp/Detail/PortForwarding/index.jsx +++ b/src/pages/network/containers/FloatingIp/Detail/PortForwarding/index.jsx @@ -39,7 +39,7 @@ export default class PortForwarding extends Base { updateFetchParams = (params) => { const { id, all_projects, ...rest } = params; return { - fipID: id, + fipId: id, fipInfo: this.props.detail, ...rest, }; diff --git a/src/pages/network/containers/FloatingIp/actions/Associate.jsx b/src/pages/network/containers/FloatingIp/actions/Associate.jsx index 5054a41e..78dd8923 100644 --- a/src/pages/network/containers/FloatingIp/actions/Associate.jsx +++ b/src/pages/network/containers/FloatingIp/actions/Associate.jsx @@ -116,6 +116,20 @@ export default class Associate extends ModalAction { }; handleInstanceSelect = async (data) => { + this.setState({ + instanceLoading: true, + }); + if (data.selectedRows.length === 0) { + this.setState({ + instanceFixedIPs: interfacesWithReasons, + instanceLoading: false, + }); + return Promise.resolve().then(() => { + this.formRef.current.setFieldsValue({ + port: null, + }); + }); + } const { id } = data.selectedRows[0]; // 获取云主机所有的interface const instanceInterfaces = await globalServerStore.fetchInterfaceList({ @@ -130,6 +144,7 @@ export default class Associate extends ModalAction { ); this.setState({ instanceFixedIPs: interfacesWithReasons, + instanceLoading: false, }); return Promise.resolve().then(() => { this.formRef.current.setFieldsValue({ @@ -139,6 +154,9 @@ export default class Associate extends ModalAction { }; handlePortSelect = async (data) => { + this.setState({ + fixedIpLoading: true, + }); const { canReachSubnetIdsWithRouterId } = this.state; const interfacesWithReason = await getInterfaceWithReason( data.selectedRows @@ -151,6 +169,7 @@ export default class Associate extends ModalAction { this.setState({ portFixedIPs, + fixedIpLoading: false, }); return Promise.resolve().then(() => { this.formRef.current.setFieldsValue({ @@ -200,7 +219,11 @@ export default class Associate extends ModalAction { get formItems() { // console.log(toJS(this.store.list.data)); - const { resourceType = 'instance', instanceFixedIPs } = this.state; + const { + resourceType = 'instance', + instanceFixedIPs, + instanceLoading, + } = this.state; const ret = [ { name: 'floatingIp', @@ -239,6 +262,7 @@ export default class Associate extends ModalAction { type: 'select-table', required: true, datas: instanceFixedIPs, + isLoading: instanceLoading, isMulti: false, filterParams: [ { diff --git a/src/pages/network/containers/FloatingIp/actions/CreateDNAT.jsx b/src/pages/network/containers/FloatingIp/actions/CreateDNAT.jsx index 2d612cf4..2b8476c2 100644 --- a/src/pages/network/containers/FloatingIp/actions/CreateDNAT.jsx +++ b/src/pages/network/containers/FloatingIp/actions/CreateDNAT.jsx @@ -54,8 +54,8 @@ export default class CreateDNAT extends ModalAction { } async getFipAlreadyUsedPorts() { - const detail = await globalPortForwardingStore.getFipAlreadyUsedPorts({ - fipID: this.item.id, + const detail = await globalPortForwardingStore.fetchList({ + fipId: this.item.id, }); this.setState({ alreadyUsedPorts: detail || [], @@ -85,6 +85,9 @@ export default class CreateDNAT extends ModalAction { } handlePortSelect = async (data) => { + this.setState({ + fixedIpLoading: true, + }); const { canReachSubnetIdsWithRouterId } = this.state; const interfacesWithReason = await getInterfaceWithReason( data.selectedRows @@ -98,6 +101,7 @@ export default class CreateDNAT extends ModalAction { this.setState({ portFixedIPs, fixed_ip_address: undefined, + fixedIpLoading: false, }); this.formRef.current && diff --git a/src/pages/network/containers/LoadBalancers/LoadBalancerInstance/actions/AssociateFIP.jsx b/src/pages/network/containers/LoadBalancers/LoadBalancerInstance/actions/AssociateFIP.jsx index 331f7bf9..93511aa7 100644 --- a/src/pages/network/containers/LoadBalancers/LoadBalancerInstance/actions/AssociateFIP.jsx +++ b/src/pages/network/containers/LoadBalancers/LoadBalancerInstance/actions/AssociateFIP.jsx @@ -38,6 +38,7 @@ export default class AssociateFip extends ModalAction { portFixedIPs: [], canAssociateFloatingIPs: [], canReachSubnetIdsWithRouterId: [], + portLoading: true, }; } @@ -69,6 +70,7 @@ export default class AssociateFip extends ModalAction { const interfaces = await getInterfaceWithReason(buildInterfaces); this.setState({ interfaces, + portLoading: false, }); } @@ -107,7 +109,7 @@ export default class AssociateFip extends ModalAction { }; get formItems() { - const { fixed_ip, canAssociateFloatingIPs } = this.state; + const { canAssociateFloatingIPs, portLoading, fipLoading } = this.state; return [ { name: 'lb', @@ -121,6 +123,7 @@ export default class AssociateFip extends ModalAction { type: 'select-table', required: true, datas: this.ports, + isLoading: portLoading, disabledFunc: (record) => !record.available, onChange: this.handleFixedIPChange, isMulti: false, @@ -151,7 +154,7 @@ export default class AssociateFip extends ModalAction { type: 'select-table', required: true, datas: canAssociateFloatingIPs, - hidden: !fixed_ip, + isLoading: fipLoading, isMulti: false, filterParams: [ { diff --git a/src/pages/network/containers/Router/actions/AssociateFip.jsx b/src/pages/network/containers/Router/actions/AssociateFip.jsx index 3ce892f2..23e360c6 100644 --- a/src/pages/network/containers/Router/actions/AssociateFip.jsx +++ b/src/pages/network/containers/Router/actions/AssociateFip.jsx @@ -104,6 +104,7 @@ export default class AssociateFip extends ModalAction { type: 'select-table', required: true, datas: this.fipList, + isLoading: this.floatingIpStore.list.isLoading, isMulti: false, filterParams: [ { diff --git a/src/pages/network/containers/Router/actions/ConnectSubnet.jsx b/src/pages/network/containers/Router/actions/ConnectSubnet.jsx index cd3c1ba3..3b8bf07d 100644 --- a/src/pages/network/containers/Router/actions/ConnectSubnet.jsx +++ b/src/pages/network/containers/Router/actions/ConnectSubnet.jsx @@ -101,6 +101,7 @@ export default class ConnectSubnet extends ModalAction { }; get formItems() { + const { networkId } = this.state; return [ { name: 'name', @@ -120,6 +121,7 @@ export default class ConnectSubnet extends ModalAction { label: t('Subnet'), type: 'select-table', datas: this.subnets, + isLoading: networkId && this.subnetStore.list.isLoading, disabledFunc: this.disabledFuncSubnet, required: true, filterParams: [ diff --git a/src/pages/network/containers/Router/actions/Create.jsx b/src/pages/network/containers/Router/actions/Create.jsx index abf64f7d..ed300b1f 100644 --- a/src/pages/network/containers/Router/actions/Create.jsx +++ b/src/pages/network/containers/Router/actions/Create.jsx @@ -118,6 +118,7 @@ export default class Create extends ModalAction { label: t('Availability Zone Hints'), type: 'select-table', datas: this.aZones, + isLoading: globalNeutronStore.zoneLoading, isMulti: true, filterParams: [ { diff --git a/src/pages/network/containers/Router/actions/DisconnectSubnet.jsx b/src/pages/network/containers/Router/actions/DisconnectSubnet.jsx index 8717e489..8ba8ff86 100644 --- a/src/pages/network/containers/Router/actions/DisconnectSubnet.jsx +++ b/src/pages/network/containers/Router/actions/DisconnectSubnet.jsx @@ -33,6 +33,7 @@ export default class DisconnectSubnet extends ModalAction { this.subnetStore = globalSubnetStore; this.portStore = new PortStore(); this.getSubnetList(); + this.state.subnetLoading = true; } static policy = 'remove_router_interface'; @@ -83,13 +84,14 @@ export default class DisconnectSubnet extends ModalAction { }); this.setState({ subnets: subnets.map((it) => toJS(it)), + subnetLoading: false, }); } static allowed = () => Promise.resolve(true); get formItems() { - const { subnets = [] } = this.state; + const { subnets = [], subnetLoading } = this.state; return [ { name: 'name', @@ -102,6 +104,7 @@ export default class DisconnectSubnet extends ModalAction { label: t('Subnet'), type: 'select-table', datas: subnets, + isLoading: subnetLoading, required: true, filterParams: [ { diff --git a/src/pages/network/containers/VPN/EndpointGroup/actions/Create.js b/src/pages/network/containers/VPN/EndpointGroup/actions/Create.js index 981d385b..7bc0f022 100644 --- a/src/pages/network/containers/VPN/EndpointGroup/actions/Create.js +++ b/src/pages/network/containers/VPN/EndpointGroup/actions/Create.js @@ -54,12 +54,16 @@ export default class Create extends ModalAction { this.state = { subnets: [], type: 'subnet', + subnetLoading: true, }; this.getAllSubnets(); } async getAllSubnets() { this.allSubnets = await this.subnetStore.pureFetchList(); + this.setState({ + subnetLoading: false, + }); } get defaultValue() { @@ -87,18 +91,22 @@ export default class Create extends ModalAction { }; handleRouterChange = async (value) => { + this.setState({ + subnetLoading: true, + }); const ports = await getPortsWithFixedIPs(); const allSubnets = getSubnetToRouter(ports, value.selectedRows, false); this.setState({ subnets: this.allSubnets.filter((item) => { return allSubnets.findIndex((i) => i.subnet_id === item.id) > -1; }), + subnetLoading: false, }); this.formRef.current.resetFields(['subnet_id']); }; get formItems() { - const { subnets, type } = this.state; + const { subnets, type, subnetLoading } = this.state; const isLocal = type === 'subnet'; return [ @@ -151,6 +159,7 @@ export default class Create extends ModalAction { label: t('Subnet'), type: 'select-table', datas: subnets, + isLoading: subnetLoading, isMulti: true, columns: [ { diff --git a/src/pages/network/containers/VirtualAdapter/actions/AssociateFIP.jsx b/src/pages/network/containers/VirtualAdapter/actions/AssociateFIP.jsx index 302251c9..56fa649f 100644 --- a/src/pages/network/containers/VirtualAdapter/actions/AssociateFIP.jsx +++ b/src/pages/network/containers/VirtualAdapter/actions/AssociateFIP.jsx @@ -38,6 +38,7 @@ export default class AssociateFip extends ModalAction { fixed_ip: null, canAssociateFloatingIPs: [], canReachSubnetIdsWithRouterId: [], + portLoading: true, }; } @@ -46,6 +47,7 @@ export default class AssociateFip extends ModalAction { const interfaces = await getInterfaceWithReason(buildInterfaces); this.setState({ interfaces, + portLoading: false, }); } @@ -104,7 +106,7 @@ export default class AssociateFip extends ModalAction { }; get formItems() { - const { fixed_ip, canAssociateFloatingIPs } = this.state; + const { canAssociateFloatingIPs, portLoading, fipLoading } = this.state; return [ { name: 'virtualAdapter', @@ -118,6 +120,7 @@ export default class AssociateFip extends ModalAction { type: 'select-table', required: true, datas: this.ports, + isLoading: portLoading, disabledFunc: (record) => !record.available, onChange: this.handleFixedIPChange, isMulti: false, @@ -148,7 +151,7 @@ export default class AssociateFip extends ModalAction { type: 'select-table', required: true, datas: canAssociateFloatingIPs, - hidden: !fixed_ip, + isLoading: fipLoading, isMulti: false, filterParams: [ { diff --git a/src/pages/network/containers/VirtualAdapter/actions/Create.jsx b/src/pages/network/containers/VirtualAdapter/actions/Create.jsx index f25b7cbd..c8d70ab1 100644 --- a/src/pages/network/containers/VirtualAdapter/actions/Create.jsx +++ b/src/pages/network/containers/VirtualAdapter/actions/Create.jsx @@ -265,6 +265,7 @@ export default class CreateAction extends ModalAction { 'The security group is similar to the firewall function for setting up network access control, or you can go to the console and create a new security group. (Note: The security group you selected will work on all virtual LANS on the instances.)' ), datas: this.securityGroups, + isLoading: this.securityGroupStore.list.isLoading, extraParams: { project_id: this.currentProjectId }, backendPageStore: this.securityGroupStore, isMulti: true, diff --git a/src/pages/storage/containers/Volume/actions/Create/index.jsx b/src/pages/storage/containers/Volume/actions/Create/index.jsx index 0f742caf..e03eb2d9 100644 --- a/src/pages/storage/containers/Volume/actions/Create/index.jsx +++ b/src/pages/storage/containers/Volume/actions/Create/index.jsx @@ -361,6 +361,7 @@ export default class Create extends FormAction { label: t('Operating System'), type: 'select-table', datas: this.images, + isLoading: this.imageStore.list.isLoading, required: this.sourceTypeIsImage, isMulti: false, hidden: !this.sourceTypeIsImage, @@ -434,6 +435,7 @@ export default class Create extends FormAction { ), ...volumeTypeSelectProps, datas: this.volumeTypes, + isLoading: this.volumeTypeStore.list.isLoading, required: true, extra: this.getVolumeTypeExtra(), onChange: this.onVolumeTypeChange, diff --git a/src/pages/storage/containers/Volume/actions/Migrate.jsx b/src/pages/storage/containers/Volume/actions/Migrate.jsx index 41a02375..651f1c93 100644 --- a/src/pages/storage/containers/Volume/actions/Migrate.jsx +++ b/src/pages/storage/containers/Volume/actions/Migrate.jsx @@ -30,7 +30,7 @@ export default class Migrate extends ModalAction { return 'large'; } - get modalSize() { + getModalSize() { return 'large'; } @@ -89,6 +89,7 @@ export default class Migrate extends ModalAction { type: 'select-table', required: true, datas: this.pools, + isLoading: this.poolStore.list.isLoading, disabledFunc: this.disableFunc, rowKey: 'name', columns: poolColumns, diff --git a/src/pages/storage/containers/VolumeType/VolumeType/actions/Create.jsx b/src/pages/storage/containers/VolumeType/VolumeType/actions/Create.jsx index 22096186..0fdceb57 100644 --- a/src/pages/storage/containers/VolumeType/VolumeType/actions/Create.jsx +++ b/src/pages/storage/containers/VolumeType/VolumeType/actions/Create.jsx @@ -148,6 +148,7 @@ export default class Create extends ModalAction { isMulti: true, hidden: isPublic, datas: this.projects, + isLoading: this.projectStore.list.isLoading, ...projectTableOptions, }, ]; diff --git a/src/pages/storage/containers/VolumeType/VolumeType/actions/ManageAccess.jsx b/src/pages/storage/containers/VolumeType/VolumeType/actions/ManageAccess.jsx index 6bab7ca7..d3997077 100644 --- a/src/pages/storage/containers/VolumeType/VolumeType/actions/ManageAccess.jsx +++ b/src/pages/storage/containers/VolumeType/VolumeType/actions/ManageAccess.jsx @@ -113,6 +113,7 @@ export default class ManageAccess extends ModalAction { isMulti: true, hidden: isPublic, datas: this.projects, + isLoading: this.projectStore.list.isLoading, ...projectTableOptions, }, ]; diff --git a/src/pages/storage/containers/VolumeType/VolumeType/actions/ManageQos.jsx b/src/pages/storage/containers/VolumeType/VolumeType/actions/ManageQos.jsx index 09bdb1c0..ec9a8149 100644 --- a/src/pages/storage/containers/VolumeType/VolumeType/actions/ManageQos.jsx +++ b/src/pages/storage/containers/VolumeType/VolumeType/actions/ManageQos.jsx @@ -79,6 +79,7 @@ export default class ManageQos extends ModalAction { type: 'select-table', required: false, datas: this.QosMap, + isLoading: this.store.list.isLoading, isMulti: false, filterParams: [ { diff --git a/src/resources/floatingip.js b/src/resources/floatingip.js index 942b3fb6..52b4c0e1 100644 --- a/src/resources/floatingip.js +++ b/src/resources/floatingip.js @@ -258,7 +258,17 @@ export async function getFipsFromRouterId(router) { } export async function handleFixedIPChange(e) { + this.setState({ + fipLoading: true, + }); const { canReachSubnetIdsWithRouterId } = this.state; + if (!e.selectedRows.length) { + this.setState({ + fixed_ip: null, + canAssociateFloatingIPs: [], + fipLoading: false, + }); + } const item = e.selectedRows[0]; const totalFips = []; // 考虑单subnet连接多个路由，并且路由开启了不同的公网网关。 @@ -280,5 +290,6 @@ export async function handleFixedIPChange(e) { this.setState({ fixed_ip: item, canAssociateFloatingIPs: norepeatFips, + fipLoading: false, }); } diff --git a/src/resources/port.jsx b/src/resources/port.jsx index 9b11fb73..619b6cd3 100644 --- a/src/resources/port.jsx +++ b/src/resources/port.jsx @@ -84,7 +84,7 @@ export function getPortsAndReasons( } export function getPortFormItem(device_owner) { - const { portFixedIPs } = this.state; + const { portFixedIPs, fixedIpLoading } = this.state; return [ { name: 'virtual_adapter', @@ -151,6 +151,7 @@ export function getPortFormItem(device_owner) { rowKey: 'fixed_ip_address', required: true, datas: portFixedIPs, + isLoading: fixedIpLoading, isMulti: false, filterParams: [ {