waruni
/
device-mgt-core
forked from community/device-mgt-core
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add loading animation when installing/uninstall app in APPM store

Browse Source
feature/appm-store/pbac
Jayasanka Weerasinghe 5 years ago committed by Dharmakeerthi Lasantha
parent 41f53d06c6
commit 78bd339cd4
3 changed files with 44 additions and 38 deletions
Show Stats Download Patch File Download Diff File

5
components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/ReleaseView.js vendored
Unescape View File

@ -17,7 +17,7 @@
*/ */
import React from "react"; import React from "react";
import {Divider, Row, Col, Typography, Button, Dropdown, notification, Menu, Icon} from "antd"; import {Divider, Row, Col, Typography, Button, Dropdown, notification, Menu, Icon, Spin} from "antd";
import "../../../App.css"; import "../../../App.css";
import ImgViewer from "../../apps/release/images/ImgViewer"; import ImgViewer from "../../apps/release/images/ImgViewer";
import StarRatings from "react-star-ratings"; import StarRatings from "react-star-ratings";
@ -126,17 +126,18 @@ class ReleaseView extends React.Component {
</Menu> </Menu>
); );
return ( return (
<div> <div>
<AppInstallModal <AppInstallModal
uuid={release.uuid} uuid={release.uuid}
loading={this.state.loading}
visible={this.state.appInstallModalVisible} visible={this.state.appInstallModalVisible}
deviceType={deviceType} deviceType={deviceType}
onClose={this.closeAppOperationModal} onClose={this.closeAppOperationModal}
onInstall={this.appOperation}/> onInstall={this.appOperation}/>
<AppUninstallModal <AppUninstallModal
uuid={release.uuid} uuid={release.uuid}
loading={this.state.loading}
visible={this.state.appUninstallModalVisible} visible={this.state.appUninstallModalVisible}
deviceType={deviceType} deviceType={deviceType}
onClose={this.closeAppOperationModal} onClose={this.closeAppOperationModal}

44
components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/AppInstallModal.js vendored
Unescape View File

@ -17,18 +17,19 @@
*/ */
import React from "react"; import React from "react";
import {Modal, Tabs} from "antd"; import {Modal, Spin, Tabs} from "antd";
import UserInstall from "./UserInstall"; import UserInstall from "./UserInstall";
import GroupInstall from "./GroupInstall"; import GroupInstall from "./GroupInstall";
import RoleInstall from "./RoleInstall"; import RoleInstall from "./RoleInstall";
import DeviceInstall from "./DeviceInstall"; import DeviceInstall from "./DeviceInstall";
const { TabPane } = Tabs; const {TabPane} = Tabs;
class AppInstallModal extends React.Component{ class AppInstallModal extends React.Component {
state={ state = {
data:[] data: []
}; };
render() { render() {
const {deviceType} = this.props; const {deviceType} = this.props;
return ( return (
@ -37,22 +38,23 @@ class AppInstallModal extends React.Component{
title="Install App" title="Install App"
visible={this.props.visible} visible={this.props.visible}
onCancel={this.props.onClose} onCancel={this.props.onClose}
footer={null} footer={null}>
> <Spin spinning={this.props.loading}>
<Tabs defaultActiveKey="device"> <Tabs defaultActiveKey="device">
<TabPane tab="Device" key="device"> <TabPane tab="Device" key="device">
<DeviceInstall deviceType={deviceType} onInstall={this.props.onInstall}/> <DeviceInstall deviceType={deviceType} onInstall={this.props.onInstall}/>
</TabPane> </TabPane>
<TabPane tab="User" key="user"> <TabPane tab="User" key="user">
<UserInstall onInstall={this.props.onInstall}/> <UserInstall onInstall={this.props.onInstall}/>
</TabPane> </TabPane>
<TabPane tab="Role" key="role"> <TabPane tab="Role" key="role">
<RoleInstall onInstall={this.props.onInstall}/> <RoleInstall onInstall={this.props.onInstall}/>
</TabPane> </TabPane>
<TabPane tab="Group" key="group"> <TabPane tab="Group" key="group">
<GroupInstall onInstall={this.props.onInstall}/> <GroupInstall onInstall={this.props.onInstall}/>
</TabPane> </TabPane>
</Tabs> </Tabs>
</Spin>
</Modal> </Modal>
</div> </div>
); );

33
components/application-mgt/org.wso2.carbon.device.application.mgt.store.ui/react-app/src/components/apps/release/install/AppUninstallModal.js vendored
Unescape View File

@ -16,31 +16,33 @@
* under the License. * under the License.
*/ */
import React from "react"; import React from "react";
import {Modal, Tabs} from "antd"; import {Modal, Spin, Tabs} from "antd";
import DeviceUninstall from "./DeviceUninstall"; import DeviceUninstall from "./DeviceUninstall";
import UserUninstall from "./UserUninstall"; import UserUninstall from "./UserUninstall";
import RoleUninstall from "./RoleUninstall"; import RoleUninstall from "./RoleUninstall";
import GroupUninstall from "./GroupUninstall"; import GroupUninstall from "./GroupUninstall";
const { TabPane } = Tabs; const {TabPane} = Tabs;
class AppUninstallModal extends React.Component{ class AppUninstallModal extends React.Component {
state={ state = {
data:[] data: []
}; };
render() { render() {
const {deviceType} = this.props; const {deviceType} = this.props;
return ( return (
<div> <div>
<Modal <Modal
title="Uninstall App" title="Uninstall App"
visible={this.props.visible} visible={this.props.visible}
onCancel={this.props.onClose} onCancel={this.props.onClose}
footer={null} footer={null}>
> <Spin spinning={this.props.loading}>
<Tabs defaultActiveKey="device"> <Tabs defaultActiveKey="device">
<TabPane tab="Device" key="device"> <TabPane tab="Device" key="device">
<DeviceUninstall deviceType={deviceType} onUninstall={this.props.onUninstall} uuid={this.props.uuid}/> <DeviceUninstall deviceType={deviceType} onUninstall={this.props.onUninstall}
uuid={this.props.uuid}/>
</TabPane> </TabPane>
<TabPane tab="User" key="user"> <TabPane tab="User" key="user">
<UserUninstall onUninstall={this.props.onUninstall} uuid={this.props.uuid}/> <UserUninstall onUninstall={this.props.onUninstall} uuid={this.props.uuid}/>
@ -52,8 +54,9 @@ class AppUninstallModal extends React.Component{
<GroupUninstall onUninstall={this.props.onUninstall} uuid={this.props.uuid}/> <GroupUninstall onUninstall={this.props.onUninstall} uuid={this.props.uuid}/>
</TabPane> </TabPane>
</Tabs> </Tabs>
</Modal> </Spin>
</div> </Modal>
</div>
); );
} }
} }

Write Preview
Loading…
Cancel
Save