Merge branch 'application-mgt-new' into 'application-mgt-new'

Add supported OS versions field to add new app & release forms in APPM Publisher UI

See merge request entgra/carbon-device-mgt!283
feature/appm-store/pbac
Dharmakeerthi Lasantha 5 years ago
commit 0bbd34cfa7

@ -490,7 +490,7 @@ class AppDetailsDrawer extends React.Component {
<div className="releases-details">
{(app.type === "ENTERPRISE") && (
<Link to={`/publisher/apps/${app.id}/add-release`}><Button htmlType="button"
<Link to={`/publisher/apps/${app.deviceType}/${app.id}/add-release`}><Button htmlType="button"
size="small">Add
new release</Button></Link>)}
<List

@ -52,11 +52,19 @@ class AddNewAppFormComponent extends React.Component {
binaryFiles: [],
application: null,
release: null,
isError: false
isError: false,
deviceType: null,
supportedOsVersions: []
};
}
onSuccessApplicationData = (application) => {
const {formConfig} = this.props;
if (application.hasOwnProperty("deviceType") &&
formConfig.installationType !== "WEB_CLIP" &&
formConfig.installationType !== "CUSTOM") {
this.getSupportedOsVersions(application.deviceType);
}
this.setState({
application,
current: 1
@ -84,7 +92,7 @@ class AddNewAppFormComponent extends React.Component {
});
data.append(formConfig.jsonPayloadName, blob);
const url = window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications" + formConfig.endpoint;
const url = window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications" + formConfig.endpoint;
axios.post(
url,
@ -119,10 +127,30 @@ class AddNewAppFormComponent extends React.Component {
this.setState({current});
};
getSupportedOsVersions = (deviceType) => {
const config = this.props.context;
axios.get(
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.deviceMgt +
`/admin/device-types/${deviceType}/versions`
).then(res => {
if (res.status === 200) {
let supportedOsVersions = JSON.parse(res.data.data);
this.setState({
supportedOsVersions,
loading: false,
});
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load supported OS versions.");
this.setState({
loading: false
});
});
};
render() {
const { loading, current, isError} = this.state;
const {loading, current, isError, supportedOsVersions} = this.state;
const {formConfig} = this.props;
return (
<div>
<Spin tip="Uploading..." spinning={loading}>
@ -142,6 +170,7 @@ class AddNewAppFormComponent extends React.Component {
<div style={{display: (current === 1 ? 'unset' : 'none')}}>
<NewAppUploadForm
formConfig={formConfig}
supportedOsVersions={supportedOsVersions}
onSuccessReleaseData={this.onSuccessReleaseData}
onClickBackButton={this.onClickBackButton}/>
</div>

@ -160,8 +160,6 @@ class NewAppDetailsForm extends React.Component {
loading: false,
});
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load device types.");
this.setState({
@ -175,7 +173,6 @@ class NewAppDetailsForm extends React.Component {
const {categories, tags, deviceTypes} = this.state;
const {getFieldDecorator} = this.props.form;
return (
<div>
<Row>
@ -186,8 +183,7 @@ class NewAppDetailsForm extends React.Component {
<Form
labelAlign="right"
layout="horizontal"
onSubmit={this.handleSubmit}
>
onSubmit={this.handleSubmit}>
{formConfig.installationType !== "WEB_CLIP" && (
<Form.Item {...formItemLayout} label="Device Type">
{getFieldDecorator('deviceType', {

@ -19,15 +19,17 @@
import React from "react";
import {Button, Col, Form, Icon, Input, Row, Select, Switch, Upload, InputNumber, Modal} from "antd";
import "@babel/polyfill";
import axios from "axios";
import {handleApiError} from "../../../js/Utils";
const formItemLayout = {
labelCol: {
xs: {span: 24},
sm: {span: 5},
sm: {span: 8},
},
wrapperCol: {
xs: {span: 24},
sm: {span: 19},
sm: {span: 16},
},
};
const {Option} = Select;
@ -60,7 +62,9 @@ class NewAppUploadForm extends React.Component {
iconHelperText: '',
screenshotHelperText: '',
metaData: []
}
};
this.lowerOsVersion = null;
this.upperOsVersion = null;
}
normFile = e => {
@ -95,7 +99,7 @@ class NewAppUploadForm extends React.Component {
};
if (formConfig.installationType !== "WEB_CLIP" && formConfig.installationType !== "CUSTOM") {
release.supportedOsVersions = "4-30";
release.supportedOsVersions = `${this.lowerOsVersion}-${this.upperOsVersion}`;
}
if (specificElements.hasOwnProperty("version")) {
@ -190,8 +194,16 @@ class NewAppUploadForm extends React.Component {
})
};
handleLowerOsVersionChange = (lowerOsVersion) => {
this.lowerOsVersion = lowerOsVersion;
};
handleUpperOsVersionChange = (upperOsVersion) => {
this.upperOsVersion = upperOsVersion;
};
render() {
const {formConfig} = this.props;
const {formConfig, supportedOsVersions} = this.props;
const {getFieldDecorator} = this.props.form;
const {
icons,
@ -354,6 +366,46 @@ class NewAppUploadForm extends React.Component {
)}
</Form.Item>
{(formConfig.installationType !== "WEB_CLIP" && formConfig.installationType !== "CUSTOM") && (
<Form.Item {...formItemLayout} label="Supported OS Versions">
{getFieldDecorator('supportedOS')(
<div>
<InputGroup>
<Row gutter={8}>
<Col span={11}>
<Select
placeholder="Lower version"
style={{width: "100%"}}
onChange={this.handleLowerOsVersionChange}>
{supportedOsVersions.map(version => (
<Option key={version.versionName}
value={version.versionName}>
{version.versionName}
</Option>
))}
</Select>
</Col>
<Col span={2}>
<p> - </p>
</Col>
<Col span={11}>
<Select style={{width: "100%"}}
placeholder="Upper version"
onChange={this.handleUpperOsVersionChange}>
{supportedOsVersions.map(version => (
<Option key={version.versionName}
value={version.versionName}>
{version.versionName}
</Option>
))}
</Select>
</Col>
</Row>
</InputGroup>
</div>
)}
</Form.Item>
)}
<Form.Item {...formItemLayout} label="Price Type">
{getFieldDecorator('select', {
rules: [{required: true, message: 'Please select price Type'}],

@ -63,10 +63,38 @@ class AddNewReleaseFormComponent extends React.Component {
screenshots: [],
loading: false,
binaryFiles: [],
isFree: true
isFree: true,
supportedOsVersions: []
};
this.lowerOsVersion = null;
this.upperOsVersion = null;
}
componentDidMount() {
this.getSupportedOsVersions(this.props.deviceType);
}
getSupportedOsVersions = (deviceType) => {
const config = this.props.context;
axios.get(
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.deviceMgt +
`/admin/device-types/${deviceType}/versions`
).then(res => {
if (res.status === 200) {
let supportedOsVersions = JSON.parse(res.data.data);
this.setState({
supportedOsVersions,
loading: false,
});
}
}).catch((error) => {
handleApiError(error, "Error occurred while trying to load supported OS versions.");
this.setState({
loading: false
});
});
};
handleSubmit = e => {
const config = this.props.context;
e.preventDefault();
@ -89,9 +117,8 @@ class AddNewReleaseFormComponent extends React.Component {
isSharedWithAllTenants,
metaData: "string",
releaseType: releaseType,
supportedOsVersions: "4-30"
supportedOsVersions: `${this.lowerOsVersion}-${this.upperOsVersion}`
};
data.append('binaryFile', binaryFile[0].originFileObj);
data.append('icon', icon[0].originFileObj);
data.append('screenshot1', screenshots[0].originFileObj);
@ -105,7 +132,7 @@ class AddNewReleaseFormComponent extends React.Component {
data.append("applicationRelease", blob);
const url = window.location.origin+ config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/"+deviceType+"/ent-app/" + appId;
const url = window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/" + deviceType + "/ent-app/" + appId;
axios.post(
url,
@ -124,7 +151,7 @@ class AddNewReleaseFormComponent extends React.Component {
const uuid = res.data.data.uuid;
this.props.history.push('/publisher/apps/releases/'+uuid);
this.props.history.push('/publisher/apps/releases/' + uuid);
}
}).catch((error) => {
@ -155,8 +182,16 @@ class AddNewReleaseFormComponent extends React.Component {
});
};
handleLowerOsVersionChange = (lowerOsVersion) => {
this.lowerOsVersion = lowerOsVersion;
};
handleUpperOsVersionChange = (upperOsVersion) => {
this.upperOsVersion = upperOsVersion;
};
render() {
const {isFree, icons, screenshots, loading, binaryFiles} = this.state;
const {isFree, icons, screenshots, loading, binaryFiles, supportedOsVersions} = this.state;
const {getFieldDecorator} = this.props.form;
return (
<div>
@ -264,6 +299,45 @@ class AddNewReleaseFormComponent extends React.Component {
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Supported OS Versions">
{getFieldDecorator('supportedOS')(
<div>
<InputGroup>
<Row gutter={8}>
<Col span={11}>
<Select
placeholder="Lower version"
style={{width: "100%"}}
onChange={this.handleLowerOsVersionChange}>
{supportedOsVersions.map(version => (
<Option key={version.versionName}
value={version.versionName}>
{version.versionName}
</Option>
))}
</Select>
</Col>
<Col span={2}>
<p> - </p>
</Col>
<Col span={11}>
<Select style={{width: "100%"}}
placeholder="Upper version"
onChange={this.handleUpperOsVersionChange}>
{supportedOsVersions.map(version => (
<Option key={version.versionName}
value={version.versionName}>
{version.versionName}
</Option>
))}
</Select>
</Col>
</Row>
</InputGroup>
</div>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Price Type">
{getFieldDecorator('select', {
rules: [{required: true, message: 'Please select price Type'}],

Loading…
Cancel
Save