|
|
@ -17,12 +17,28 @@
|
|
|
|
*/
|
|
|
|
*/
|
|
|
|
|
|
|
|
|
|
|
|
import React from "react";
|
|
|
|
import React from "react";
|
|
|
|
import {Modal, Button, Icon, notification, Spin, Tooltip, Upload, Input, Switch, Form, Divider, Row, Col} from 'antd';
|
|
|
|
import {
|
|
|
|
|
|
|
|
Modal,
|
|
|
|
|
|
|
|
Button,
|
|
|
|
|
|
|
|
Icon,
|
|
|
|
|
|
|
|
notification,
|
|
|
|
|
|
|
|
Spin,
|
|
|
|
|
|
|
|
Tooltip,
|
|
|
|
|
|
|
|
Upload,
|
|
|
|
|
|
|
|
Input,
|
|
|
|
|
|
|
|
Switch,
|
|
|
|
|
|
|
|
Form,
|
|
|
|
|
|
|
|
Divider,
|
|
|
|
|
|
|
|
Row,
|
|
|
|
|
|
|
|
Col,
|
|
|
|
|
|
|
|
Select
|
|
|
|
|
|
|
|
} from 'antd';
|
|
|
|
import axios from "axios";
|
|
|
|
import axios from "axios";
|
|
|
|
import {withConfigContext} from "../../../../context/ConfigContext";
|
|
|
|
import {withConfigContext} from "../../../../context/ConfigContext";
|
|
|
|
|
|
|
|
|
|
|
|
const {TextArea} = Input;
|
|
|
|
const {TextArea} = Input;
|
|
|
|
const InputGroup = Input.Group;
|
|
|
|
const InputGroup = Input.Group;
|
|
|
|
|
|
|
|
const {Option} = Select;
|
|
|
|
|
|
|
|
|
|
|
|
const formItemLayout = {
|
|
|
|
const formItemLayout = {
|
|
|
|
labelCol: {
|
|
|
|
labelCol: {
|
|
|
@ -33,6 +49,15 @@ const formItemLayout = {
|
|
|
|
},
|
|
|
|
},
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function getBase64(file) {
|
|
|
|
|
|
|
|
return new Promise((resolve, reject) => {
|
|
|
|
|
|
|
|
const reader = new FileReader();
|
|
|
|
|
|
|
|
reader.readAsDataURL(file);
|
|
|
|
|
|
|
|
reader.onload = () => resolve(reader.result);
|
|
|
|
|
|
|
|
reader.onerror = error => reject(error);
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
class EditReleaseModal extends React.Component {
|
|
|
|
class EditReleaseModal extends React.Component {
|
|
|
|
|
|
|
|
|
|
|
|
constructor(props) {
|
|
|
|
constructor(props) {
|
|
|
@ -51,6 +76,8 @@ class EditReleaseModal extends React.Component {
|
|
|
|
specificElements: {}
|
|
|
|
specificElements: {}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
this.lowerOsVersion = null;
|
|
|
|
|
|
|
|
this.upperOsVersion = null;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
componentDidMount = () => {
|
|
|
|
componentDidMount = () => {
|
|
|
@ -117,6 +144,7 @@ class EditReleaseModal extends React.Component {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
showModal = () => {
|
|
|
|
showModal = () => {
|
|
|
|
|
|
|
|
const config = this.props.context;
|
|
|
|
const {app, release} = this.props;
|
|
|
|
const {app, release} = this.props;
|
|
|
|
const {formConfig} = this.state;
|
|
|
|
const {formConfig} = this.state;
|
|
|
|
const {specificElements} = formConfig;
|
|
|
|
const {specificElements} = formConfig;
|
|
|
@ -143,14 +171,19 @@ class EditReleaseModal extends React.Component {
|
|
|
|
}
|
|
|
|
}
|
|
|
|
});
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
// if (specificElements.hasOwnProperty("packageName")) {
|
|
|
|
if ((config.deviceTypes.mobileTypes.includes(this.props.deviceType))) {
|
|
|
|
// this.props.form.setFields({
|
|
|
|
const osVersions = release.supportedOsVersions.split("-");
|
|
|
|
// packageName: {
|
|
|
|
this.lowerOsVersion = osVersions[0];
|
|
|
|
// value: app.packageName
|
|
|
|
this.upperOsVersion = osVersions[1];
|
|
|
|
// }
|
|
|
|
this.props.form.setFields({
|
|
|
|
// });
|
|
|
|
lowerOsVersion: {
|
|
|
|
// }
|
|
|
|
value: osVersions[0]
|
|
|
|
|
|
|
|
},
|
|
|
|
|
|
|
|
upperOsVersion: {
|
|
|
|
|
|
|
|
value: osVersions[1]
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
if (specificElements.hasOwnProperty("version")) {
|
|
|
|
if (specificElements.hasOwnProperty("version")) {
|
|
|
|
this.props.form.setFields({
|
|
|
|
this.props.form.setFields({
|
|
|
|
version: {
|
|
|
|
version: {
|
|
|
@ -232,9 +265,12 @@ class EditReleaseModal extends React.Component {
|
|
|
|
isSharedWithAllTenants,
|
|
|
|
isSharedWithAllTenants,
|
|
|
|
metaData: JSON.stringify(this.state.metaData),
|
|
|
|
metaData: JSON.stringify(this.state.metaData),
|
|
|
|
releaseType: releaseType,
|
|
|
|
releaseType: releaseType,
|
|
|
|
supportedOsVersions: "4-30"
|
|
|
|
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if ((config.deviceTypes.mobileTypes.includes(this.props.deviceType))) {
|
|
|
|
|
|
|
|
release.supportedOsVersions = `${this.lowerOsVersion}-${this.upperOsVersion}`;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
if (specificElements.hasOwnProperty("binaryFile") && binaryFiles.length === 1) {
|
|
|
|
if (specificElements.hasOwnProperty("binaryFile") && binaryFiles.length === 1) {
|
|
|
|
data.append('binaryFile', binaryFiles[0].originFileObj);
|
|
|
|
data.append('binaryFile', binaryFiles[0].originFileObj);
|
|
|
|
}
|
|
|
|
}
|
|
|
@ -322,10 +358,50 @@ class EditReleaseModal extends React.Component {
|
|
|
|
})
|
|
|
|
})
|
|
|
|
};
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
handlePreviewCancel = () => this.setState({previewVisible: false});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
handlePreview = async file => {
|
|
|
|
|
|
|
|
if (!file.url && !file.preview) {
|
|
|
|
|
|
|
|
file.preview = await getBase64(file.originFileObj);
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.setState({
|
|
|
|
|
|
|
|
previewImage: file.url || file.preview,
|
|
|
|
|
|
|
|
previewVisible: true,
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
handleLowerOsVersionChange = (lowerOsVersion) => {
|
|
|
|
|
|
|
|
this.lowerOsVersion = lowerOsVersion;
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
handleUpperOsVersionChange = (upperOsVersion) => {
|
|
|
|
|
|
|
|
this.upperOsVersion = upperOsVersion;
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
render() {
|
|
|
|
render() {
|
|
|
|
const {formConfig, icons, screenshots, loading, binaryFiles, metaData} = this.state;
|
|
|
|
const {
|
|
|
|
|
|
|
|
formConfig,
|
|
|
|
|
|
|
|
icons,
|
|
|
|
|
|
|
|
screenshots,
|
|
|
|
|
|
|
|
loading,
|
|
|
|
|
|
|
|
binaryFiles,
|
|
|
|
|
|
|
|
metaData,
|
|
|
|
|
|
|
|
previewImage,
|
|
|
|
|
|
|
|
previewVisible,
|
|
|
|
|
|
|
|
binaryFileHelperText,
|
|
|
|
|
|
|
|
iconHelperText,
|
|
|
|
|
|
|
|
screenshotHelperText
|
|
|
|
|
|
|
|
} = this.state;
|
|
|
|
const {getFieldDecorator} = this.props.form;
|
|
|
|
const {getFieldDecorator} = this.props.form;
|
|
|
|
const {isAppUpdatable} = this.props;
|
|
|
|
const {isAppUpdatable, supportedOsVersions, deviceType} = this.props;
|
|
|
|
|
|
|
|
const config = this.props.context;
|
|
|
|
|
|
|
|
const uploadButton = (
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
|
|
|
<Icon type="plus"/>
|
|
|
|
|
|
|
|
<div className="ant-upload-text">Select</div>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<div>
|
|
|
|
<div>
|
|
|
@ -340,8 +416,8 @@ class EditReleaseModal extends React.Component {
|
|
|
|
title="Edit release"
|
|
|
|
title="Edit release"
|
|
|
|
visible={this.state.visible}
|
|
|
|
visible={this.state.visible}
|
|
|
|
footer={null}
|
|
|
|
footer={null}
|
|
|
|
onCancel={this.handleCancel}
|
|
|
|
width={580}
|
|
|
|
>
|
|
|
|
onCancel={this.handleCancel}>
|
|
|
|
<div>
|
|
|
|
<div>
|
|
|
|
<Spin tip="Uploading..." spinning={loading}>
|
|
|
|
<Spin tip="Uploading..." spinning={loading}>
|
|
|
|
<Form labelAlign="left" layout="horizontal"
|
|
|
|
<Form labelAlign="left" layout="horizontal"
|
|
|
@ -370,19 +446,6 @@ class EditReleaseModal extends React.Component {
|
|
|
|
</Form.Item>
|
|
|
|
</Form.Item>
|
|
|
|
)}
|
|
|
|
)}
|
|
|
|
|
|
|
|
|
|
|
|
{/*{formConfig.specificElements.hasOwnProperty("packageName") && (*/}
|
|
|
|
|
|
|
|
{/* <Form.Item {...formItemLayout} label="Package Name">*/}
|
|
|
|
|
|
|
|
{/* {getFieldDecorator('packageName', {*/}
|
|
|
|
|
|
|
|
{/* rules: [{*/}
|
|
|
|
|
|
|
|
{/* required: true,*/}
|
|
|
|
|
|
|
|
{/* message: 'Please input the package name'*/}
|
|
|
|
|
|
|
|
{/* }],*/}
|
|
|
|
|
|
|
|
{/* })(*/}
|
|
|
|
|
|
|
|
{/* <Input placeholder="Package Name"/>*/}
|
|
|
|
|
|
|
|
{/* )}*/}
|
|
|
|
|
|
|
|
{/* </Form.Item>*/}
|
|
|
|
|
|
|
|
{/*)}*/}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
{formConfig.specificElements.hasOwnProperty("url") && (
|
|
|
|
{formConfig.specificElements.hasOwnProperty("url") && (
|
|
|
|
<Form.Item {...formItemLayout} label="URL">
|
|
|
|
<Form.Item {...formItemLayout} label="URL">
|
|
|
|
{getFieldDecorator('url', {
|
|
|
|
{getFieldDecorator('url', {
|
|
|
@ -418,19 +481,15 @@ class EditReleaseModal extends React.Component {
|
|
|
|
})(
|
|
|
|
})(
|
|
|
|
<Upload
|
|
|
|
<Upload
|
|
|
|
name="logo"
|
|
|
|
name="logo"
|
|
|
|
|
|
|
|
listType="picture-card"
|
|
|
|
onChange={this.handleIconChange}
|
|
|
|
onChange={this.handleIconChange}
|
|
|
|
beforeUpload={() => false}
|
|
|
|
beforeUpload={() => false}
|
|
|
|
>
|
|
|
|
onPreview={this.handlePreview}>
|
|
|
|
{icons.length !== 1 && (
|
|
|
|
{icons.length === 1 ? null : uploadButton}
|
|
|
|
<Button>
|
|
|
|
|
|
|
|
<Icon type="upload"/> Change
|
|
|
|
|
|
|
|
</Button>
|
|
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
</Upload>,
|
|
|
|
</Upload>,
|
|
|
|
)}
|
|
|
|
)}
|
|
|
|
</Form.Item>
|
|
|
|
</Form.Item>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<Form.Item {...formItemLayout} label="Screenshots">
|
|
|
|
<Form.Item {...formItemLayout} label="Screenshots">
|
|
|
|
{getFieldDecorator('screenshots', {
|
|
|
|
{getFieldDecorator('screenshots', {
|
|
|
|
valuePropName: 'icon',
|
|
|
|
valuePropName: 'icon',
|
|
|
@ -440,15 +499,11 @@ class EditReleaseModal extends React.Component {
|
|
|
|
})(
|
|
|
|
})(
|
|
|
|
<Upload
|
|
|
|
<Upload
|
|
|
|
name="screenshots"
|
|
|
|
name="screenshots"
|
|
|
|
|
|
|
|
listType="picture-card"
|
|
|
|
onChange={this.handleScreenshotChange}
|
|
|
|
onChange={this.handleScreenshotChange}
|
|
|
|
beforeUpload={() => false}
|
|
|
|
beforeUpload={() => false}
|
|
|
|
multiple
|
|
|
|
onPreview={this.handlePreview}>
|
|
|
|
>
|
|
|
|
{screenshots.length >= 3 ? null : uploadButton}
|
|
|
|
{screenshots.length < 3 && (
|
|
|
|
|
|
|
|
<Button>
|
|
|
|
|
|
|
|
<Icon type="upload"/> Click to upload
|
|
|
|
|
|
|
|
</Button>
|
|
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
</Upload>,
|
|
|
|
</Upload>,
|
|
|
|
)}
|
|
|
|
)}
|
|
|
|
</Form.Item>
|
|
|
|
</Form.Item>
|
|
|
@ -475,7 +530,65 @@ class EditReleaseModal extends React.Component {
|
|
|
|
rows={5}/>
|
|
|
|
rows={5}/>
|
|
|
|
)}
|
|
|
|
)}
|
|
|
|
</Form.Item>
|
|
|
|
</Form.Item>
|
|
|
|
|
|
|
|
{(config.deviceTypes.mobileTypes.includes(deviceType)) && (
|
|
|
|
|
|
|
|
<Form.Item {...formItemLayout} label="Supported OS Versions">
|
|
|
|
|
|
|
|
{getFieldDecorator('supportedOS')(
|
|
|
|
|
|
|
|
<div>
|
|
|
|
|
|
|
|
<InputGroup>
|
|
|
|
|
|
|
|
<Row gutter={8}>
|
|
|
|
|
|
|
|
<Col span={11}>
|
|
|
|
|
|
|
|
<Form.Item>
|
|
|
|
|
|
|
|
{getFieldDecorator('lowerOsVersion', {
|
|
|
|
|
|
|
|
rules: [{
|
|
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
|
|
message: 'Please select Value'
|
|
|
|
|
|
|
|
}],
|
|
|
|
|
|
|
|
})(
|
|
|
|
|
|
|
|
<Select
|
|
|
|
|
|
|
|
placeholder="Lower version"
|
|
|
|
|
|
|
|
style={{width: "100%"}}
|
|
|
|
|
|
|
|
onChange={this.handleLowerOsVersionChange}>
|
|
|
|
|
|
|
|
{supportedOsVersions.map(version => (
|
|
|
|
|
|
|
|
<Option key={version.versionName}
|
|
|
|
|
|
|
|
value={version.versionName}>
|
|
|
|
|
|
|
|
{version.versionName}
|
|
|
|
|
|
|
|
</Option>
|
|
|
|
|
|
|
|
))}
|
|
|
|
|
|
|
|
</Select>
|
|
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
</Form.Item>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
<Col span={2}>
|
|
|
|
|
|
|
|
<p> - </p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
<Col span={11}>
|
|
|
|
|
|
|
|
<Form.Item>
|
|
|
|
|
|
|
|
{getFieldDecorator('upperOsVersion', {
|
|
|
|
|
|
|
|
rules: [{
|
|
|
|
|
|
|
|
required: true,
|
|
|
|
|
|
|
|
message: 'Please select Value'
|
|
|
|
|
|
|
|
}],
|
|
|
|
|
|
|
|
})(
|
|
|
|
|
|
|
|
<Select style={{width: "100%"}}
|
|
|
|
|
|
|
|
placeholder="Upper version"
|
|
|
|
|
|
|
|
onChange={this.handleUpperOsVersionChange}>
|
|
|
|
|
|
|
|
{supportedOsVersions.map(version => (
|
|
|
|
|
|
|
|
<Option key={version.versionName}
|
|
|
|
|
|
|
|
value={version.versionName}>
|
|
|
|
|
|
|
|
{version.versionName}
|
|
|
|
|
|
|
|
</Option>
|
|
|
|
|
|
|
|
))}
|
|
|
|
|
|
|
|
</Select>
|
|
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
</Form.Item>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
</InputGroup>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
</Form.Item>
|
|
|
|
|
|
|
|
)}
|
|
|
|
<Form.Item {...formItemLayout} label="Price">
|
|
|
|
<Form.Item {...formItemLayout} label="Price">
|
|
|
|
{getFieldDecorator('price', {
|
|
|
|
{getFieldDecorator('price', {
|
|
|
|
rules: [{
|
|
|
|
rules: [{
|
|
|
@ -575,6 +688,9 @@ class EditReleaseModal extends React.Component {
|
|
|
|
</Form>
|
|
|
|
</Form>
|
|
|
|
</Spin>
|
|
|
|
</Spin>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<Modal visible={previewVisible} footer={null} onCancel={this.handlePreviewCancel}>
|
|
|
|
|
|
|
|
<img alt="Preview Image" style={{width: '100%'}} src={previewImage}/>
|
|
|
|
|
|
|
|
</Modal>
|
|
|
|
</Modal>
|
|
|
|
</Modal>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
);
|
|
|
|