Add supported OS versions to add new app form in APPM UI

feature/appm-store/pbac
Jayasanka 5 years ago
parent 128c226cd3
commit 407cbc6ef4

@ -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'}],
@ -419,22 +471,22 @@ class NewAppUploadForm extends React.Component {
placeholder="key"
value={data.key}
onChange={(e) => {
metaData[index]['key'] = e.currentTarget.value;
this.setState({
metaData
})
}}/>
metaData[index]['key'] = e.currentTarget.value;
this.setState({
metaData
})
}}/>
</Col>
<Col span={8}>
<Input
placeholder="value"
value={data.value}
onChange={(e) => {
metaData[index].value = e.currentTarget.value;
this.setState({
metaData
});
}}/>
metaData[index].value = e.currentTarget.value;
this.setState({
metaData
});
}}/>
</Col>
<Col span={3}>
<Button type="dashed"

@ -63,10 +63,37 @@ class AddNewReleaseFormComponent extends React.Component {
screenshots: [],
loading: false,
binaryFiles: [],
isFree: true
isFree: true,
supportedOsVersions: []
};
}
componentDidMount() {
this.getSupportedOsVersions();
}
getSupportedOsVersions = () => {
const config = this.props.context;
axios.get(
window.location.origin + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher +
"/admin/device-types/{deviceTypeName}/versions"
).then(res => {
if (res.status === 200) {
// let tags = JSON.parse(res.data.data);
// this.setState({
// tags: tags,
// 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();

Loading…
Cancel
Save