community
/
device-mgt-core
12
0
Fork 47
Code Issues Pull Requests 15 Packages Projects Releases Wiki Activity

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

Browse Source 
Complete add app functionality in APPM UI

See merge request entgra/carbon-device-mgt!152
merge-requests/153/head
Dharmakeerthi Lasantha 6 years ago
parent d110aa66d5 e5c37ca208
commit 79543df6d1
8 changed files with 579 additions and 535 deletions
Show Stats Download Patch File Download Diff File

2
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/AppDetailsDrawer.js vendored
Unescape View File

@ -41,7 +41,7 @@ class AppDetailsDrawer extends React.Component {
<br/> <br/>
<br/> <br/>
<span> <span>
{app.appCategories.map(category => { {app.categories.map(category => {
return ( return (
<Tag color="blue" key={category} style={{paddingBottom: 5}}> <Tag color="blue" key={category} style={{paddingBottom: 5}}>
{category} {category}

14
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/apps/list-apps/AppsTable.js vendored
Unescape View File

@ -28,10 +28,10 @@ const columns = [
}, },
{ {
title: 'Categories', title: 'Categories',
dataIndex: 'appCategories', dataIndex: 'categories',
render: appCategories => ( render: categories => (
<span> <span>
{appCategories.map(category => { {categories.map(category => {
return ( return (
<Tag color="blue" key={category}> <Tag color="blue" key={category}>
{category} {category}
@ -104,17 +104,13 @@ class AppsTable extends React.Component {
params.page = 1; params.page = 1;
} }
const extraParams = { const data = {
offset: 10 * (params.page - 1), offset: 10 * (params.page - 1),
limit: 10 limit: 10
}; };
// note: encode with '%26' not '&'
const encodedExtraParams = Object.keys(extraParams).map(key => key + '=' + extraParams[key]).join('&');
const data = {
};
axios.post( axios.post(
config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher+"/applications?"+encodedExtraParams, config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher+"/applications",
data, data,
{ {
headers: { 'X-Platform': config.serverConfig.platform } headers: { 'X-Platform': config.serverConfig.platform }

467
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/components/new-app/AddNewAppForm.js vendored
Unescape View File

@ -1,72 +1,35 @@
import React from "react"; import React from "react";
import "antd/dist/antd.css"; import "antd/dist/antd.css";
import { import {
PageHeader,
Typography,
Card, Card,
Steps,
Button, Button,
message, message,
Row, Row,
Col, Col,
Tag,
Tooltip,
Input, Input,
Icon, Icon,
Select, Select,
Switch, Switch,
Form, Form,
Upload, Upload,
Divider, notification Divider,
notification,
Spin
} from "antd"; } from "antd";
import IconImage from "./IconImg";
import UploadScreenshots from "./UploadScreenshots";
import axios from "axios"; import axios from "axios";
import {withRouter} from 'react-router-dom'
import config from "../../../public/conf/config.json"; import config from "../../../public/conf/config.json";
const Paragraph = Typography;
const Dragger = Upload.Dragger;
const props = {
name: 'file',
multiple: false,
action: '//jsonplaceholder.typicode.com/posts/',
onChange(info) {
const status = info.file.status;
if (status !== 'uploading') {
console.log(info.file, info.fileList);
}
if (status === 'done') {
message.success(`${info.file.name} file uploaded successfully.`);
} else if (status === 'error') {
message.error(`${info.file.name} file upload failed.`);
}
},
};
//
// const steps = [{
// title: 'First',
// content: Step1
// }, {
// title: 'Second',
// content: Step2,
// }, {
// title: 'Last',
// content: Step3,
// }];
const {Option} = Select; const {Option} = Select;
const {TextArea} = Input; const {TextArea} = Input;
const InputGroup = Input.Group; const InputGroup = Input.Group;
const formItemLayout = { const formItemLayout = {
labelCol: { labelCol: {
span: 4, span: 5,
}, },
wrapperCol: { wrapperCol: {
span: 20, span: 19,
}, },
}; };
@ -79,7 +42,9 @@ class AddNewAppFormComponent extends React.Component {
categories: [], categories: [],
tags: [], tags: [],
icons: [], icons: [],
screenshots: [] screenshots: [],
loading: false,
binaryFiles: []
}; };
} }
@ -148,144 +113,119 @@ class AddNewAppFormComponent extends React.Component {
handleSubmit = e => { handleSubmit = e => {
e.preventDefault(); e.preventDefault();
const {formConfig} = this.props;
const {specificElements} = formConfig;
this.props.form.validateFields((err, values) => { this.props.form.validateFields((err, values) => {
if (!err) { if (!err) {
const {name, description, appCategories, tags, deviceType, price, isSharedWithAllTenants, binaryFile, icon, screenshots} = values; this.setState({
const payload = { loading: true
binaryFile: binaryFile[0].originFileObj, });
icon: icon[0].originFileObj, const {name, description, categories, tags, price, isSharedWithAllTenants, binaryFile, icon, screenshots, releaseDescription,releaseType} = values;
screenshot1: screenshots[0].originFileObj, const application = {
screenshot2: screenshots[1].originFileObj,
screenshot3: screenshots[2].originFileObj,
application: {
name, name,
description, description,
appCategories, categories,
subType: (price === undefined || parseInt(price) === 0) ? "FREE" : "PAID", subMethod: (price === undefined || parseInt(price) === 0) ? "FREE" : "PAID",
tags, tags,
unrestrictedRoles: [], unrestrictedRoles: [],
deviceType, };
entAppReleaseWrappers: [{
description, const data = new FormData();
if (formConfig.installationType !== "WEB_CLIP") {
application.deviceType = values.deviceType;
}else{
application.type = "WEB_CLIP";
application.deviceType ="ALL";
}
if (specificElements.hasOwnProperty("binaryFile")) {
data.append('binaryFile', binaryFile[0].originFileObj);
}
//add release data
const release = {
description: releaseDescription,
price: (price === undefined) ? 0 : parseInt(price), price: (price === undefined) ? 0 : parseInt(price),
isSharedWithAllTenants, isSharedWithAllTenants,
metaData: "string", metaData: "string",
supportedOsVersions: "4.0-10.0" releaseType: releaseType
}]
}
}; };
console.log(payload); if (formConfig.installationType !== "WEB_CLIP") {
release.supportedOsVersions = "4.0-10.0";
// let data = new FormData(); }
//
// const url = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/ent-app"; if (specificElements.hasOwnProperty("version")) {
// release.version = values.version;
// data.append('binaryFile', binaryFile[0].originFileObj); }
// data.append('icon', icon[0].originFileObj); if (specificElements.hasOwnProperty("url")) {
// data.append('screenshot1', screenshots[0].originFileObj); release.url = values.url;
// data.append('screenshot2', screenshots[1].originFileObj); }
// data.append('screenshot3', screenshots[2].originFileObj); if (specificElements.hasOwnProperty("packageName")) {
// data.append('application', JSON.toString(payload.application)); release.packageName = values.packageName;
}
// let request = new XMLHttpRequest();
// request.open('POST', url); //add release wrapper
// request.send(data); application[formConfig.releaseWrapperName] = [release];
// var xhr = new XMLHttpRequest();
// // xhr.withCredentials = true;
//
// xhr.addEventListener("readystatechange", function () {
// if (this.readyState === 4) {
// console.log(this.responseText);
// }
// });
//
// xhr.open("POST", "https://localhost:9443/ui-request-handler/invoke/application-mgt-publisher/v1.0/applications/ent-app");
// xhr.open("GET", "https://localhost:9443/ui-request-handler/invoke/application-mgt-publisher/v1.0/applications/tags");
// xhr.setRequestHeader("Content-Type", "multipart/mixed");
// xhr.setRequestHeader("X-Platform", "publisher");
//
// // xhr.setRequestHeader("Accept", "*/*");
//
// xhr.send(data);
// xhr.send();
// const options = {method: 'POST', body: data};
//
// fetch(url, options).then(function (response) {
// console.log(response);
// });
// axios.post(
// url,
// data,
// {
// headers:{
// 'X-Platform': config.serverConfig.platform,
// 'Content-Type': 'multipart/mixed',
// 'content-type': 'multipart/form-data'
// },
// 'Content-Type': 'multipart/mixed',
// 'content-type': 'multipart/form-data'
// }
// ).then(res => {
// if (res.status === 201) {
// this.setState({
// loading: false,
// });
//
// notification["success"]({
// message: "Done!",
// description:
// "New app was added successfully",
// });
// }
//
// }).catch((error) => {
// if (error.response.status === 401) {
// window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
// } else {
// message.warning('Something went wrong');
//
// }
// this.setState({
// loading: false
// });
// });
let data = new FormData();
data.append('binaryFile', binaryFile[0].originFileObj);
data.append('icon', icon[0].originFileObj); data.append('icon', icon[0].originFileObj);
data.append('screenshot1', screenshots[0].originFileObj); data.append('screenshot1', screenshots[0].originFileObj);
data.append('screenshot2', screenshots[1].originFileObj); data.append('screenshot2', screenshots[1].originFileObj);
data.append('screenshot3', screenshots[2].originFileObj); data.append('screenshot3', screenshots[2].originFileObj);
const json = JSON.stringify(payload.application);
const json = JSON.stringify(application);
const blob = new Blob([json], { const blob = new Blob([json], {
type: 'application/json' type: 'application/json'
}); });
data.append('application', blob); data.append(formConfig.jsonPayloadName, blob);
console.log(application);
const url = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications" + formConfig.endpoint;
axios.post(
url,
data,
{
headers: {
'X-Platform': config.serverConfig.platform
},
}
).then(res => {
if (res.status === 201) {
this.setState({
loading: false,
});
notification["success"]({
message: "Done!",
description:
"New app was added successfully",
});
let xhr = new XMLHttpRequest(); this.props.history.push('/publisher/apps');
xhr.withCredentials = true;
// window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/apps';
xhr.addEventListener("readystatechange", function () {
if (this.readyState === 4) {
console.log(this.responseText);
} }
}).catch((error) => {
if (error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
} else {
notification["error"]({
message: "Something went wrong!",
description:
"Sorry, we were unable to complete your request.",
}); });
const url = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/ent-app"; }
xhr.open("POST", url); this.setState({
xhr.setRequestHeader("X-Platform", "publisher"); loading: false
xhr.send(data); });
});
} }
}); });
}; };
@ -299,6 +239,7 @@ class AddNewAppFormComponent extends React.Component {
}; };
handleIconChange = ({fileList}) => this.setState({icons: fileList}); handleIconChange = ({fileList}) => this.setState({icons: fileList});
handleBinaryFileChange = ({fileList}) => this.setState({icons: fileList});
handleScreenshotChange = ({fileList}) => this.setState({screenshots: fileList}); handleScreenshotChange = ({fileList}) => this.setState({screenshots: fileList});
@ -311,10 +252,12 @@ class AddNewAppFormComponent extends React.Component {
}; };
render() { render() {
const {categories, tags, icons, screenshots} = this.state; const {categories, tags, icons, screenshots, loading, binaryFiles} = this.state;
const {getFieldDecorator} = this.props.form; const {getFieldDecorator} = this.props.form;
const {formConfig} = this.props;
return ( return (
<div> <div>
<Spin tip="Uploading..." spinning={loading}>
<Row> <Row>
<Col span={20} offset={2}> <Col span={20} offset={2}>
<Card> <Card>
@ -324,29 +267,35 @@ class AddNewAppFormComponent extends React.Component {
<Row> <Row>
<Col span={12}> <Col span={12}>
<div> <div>
{/*device type*/}
{formConfig.installationType !== "WEB_CLIP" && (
<Form.Item {...formItemLayout} label="Device Type"> <Form.Item {...formItemLayout} label="Device Type">
{getFieldDecorator('deviceType', { {getFieldDecorator('deviceType', {
rules: [{ rules: [
required: false, {
required: true,
message: 'Please select device type' message: 'Please select device type'
}, },
{ {
validator: this.validateIcon validator: this.validateIcon
}], }
})( ],
}
)(
<Select placeholder="select device type"> <Select placeholder="select device type">
<Option key="android">Android</Option> <Option key="android">Android</Option>
<Option key="ios">iOS</Option> <Option key="ios">iOS</Option>
</Select> </Select>
)} )}
</Form.Item> </Form.Item>
)}
{/*app name*/} {/*app name*/}
<Form.Item {...formItemLayout} label="App Name"> <Form.Item {...formItemLayout} label="App Name">
{getFieldDecorator('name', { {getFieldDecorator('name', {
rules: [{ rules: [{
required: false, required: true,
message: 'Please input a name' message: 'Please input a name'
}], }],
})( })(
@ -358,7 +307,7 @@ class AddNewAppFormComponent extends React.Component {
<Form.Item {...formItemLayout} label="Description"> <Form.Item {...formItemLayout} label="Description">
{getFieldDecorator('description', { {getFieldDecorator('description', {
rules: [{ rules: [{
required: false, required: true,
message: 'Please enter a description' message: 'Please enter a description'
}], }],
})( })(
@ -366,9 +315,9 @@ class AddNewAppFormComponent extends React.Component {
)} )}
</Form.Item> </Form.Item>
<Form.Item {...formItemLayout} label="Categories"> <Form.Item {...formItemLayout} label="Categories">
{getFieldDecorator('appCategories', { {getFieldDecorator('categories', {
rules: [{ rules: [{
required: false, required: true,
message: 'Please select categories' message: 'Please select categories'
}], }],
})( })(
@ -391,32 +340,11 @@ class AddNewAppFormComponent extends React.Component {
</Select> </Select>
)} )}
</Form.Item> </Form.Item>
<Form.Item {...formItemLayout} label="Price">
{getFieldDecorator('price', {
rules: [{
required: false
}],
})(
<Input prefix="$" placeholder="00.00"/>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Is Shared?">
{getFieldDecorator('isSharedWithAllTenants', {
rules: [{
required: false,
message: 'Please select'
}],
})(
<Switch checkedChildren={<Icon type="check"/>}
unCheckedChildren={<Icon type="close"/>} defaultChecked/>
)}
</Form.Item>
<Divider/> <Divider/>
<Form.Item {...formItemLayout} label="Tags"> <Form.Item {...formItemLayout} label="Tags">
{getFieldDecorator('tags', { {getFieldDecorator('tags', {
rules: [{ rules: [{
required: false, required: true,
message: 'Please select tags' message: 'Please select tags'
}], }],
})( })(
@ -438,7 +366,7 @@ class AddNewAppFormComponent extends React.Component {
</Select> </Select>
)} )}
</Form.Item> </Form.Item>
<Form.Item {...formItemLayout} label="Meta Daa"> <Form.Item {...formItemLayout} label="Meta Data">
<InputGroup> <InputGroup>
<Row gutter={8}> <Row gutter={8}>
<Col span={10}> <Col span={10}>
@ -453,46 +381,39 @@ class AddNewAppFormComponent extends React.Component {
</Row> </Row>
</InputGroup> </InputGroup>
</Form.Item> </Form.Item>
<Form.Item wrapperCol={{span: 12, offset: 5}}>
<Button type="primary" htmlType="submit">
Submit
</Button>
</Form.Item>
</div> </div>
</Col> </Col>
<Col span={12} style={{paddingLeft: 20}}> <Col span={12} style={{paddingLeft: 20}}>
<Form.Item label="Application"> <p>Release Data</p>
<div className="dropbox">
{formConfig.specificElements.hasOwnProperty("binaryFile") && (
<Form.Item {...formItemLayout} label="Application">
{getFieldDecorator('binaryFile', { {getFieldDecorator('binaryFile', {
valuePropName: 'fileList', valuePropName: 'binaryFile',
getValueFromEvent: this.normFile, getValueFromEvent: this.normFile,
required: false, required: true,
message: 'Please select tags' message: 'Please select application'
})( })(
<Upload.Dragger <Upload
name="files" name="binaryFile"
onChange={this.handleBinaryFileChange}
beforeUpload={() => false} beforeUpload={() => false}
multiple={false}
> >
<p className="ant-upload-drag-icon"> {binaryFiles.length !== 1 && (
<Icon type="inbox"/> <Button>
</p> <Icon type="upload"/> Click to upload
<p className="ant-upload-text">Click or drag file to this area </Button>
to upload</p> )}
<p className="ant-upload-hint">Support for a single or bulk </Upload>,
upload.</p>
</Upload.Dragger>,
)} )}
</div>
</Form.Item> </Form.Item>
)}
<Row> <Form.Item {...formItemLayout} label="Icon">
<Col span={12}>
<Form.Item label="Icon">
{getFieldDecorator('icon', { {getFieldDecorator('icon', {
valuePropName: 'icon', valuePropName: 'icon',
getValueFromEvent: this.normFile, getValueFromEvent: this.normFile,
required: false, required: true,
message: 'Please select a icon' message: 'Please select a icon'
})( })(
<Upload <Upload
@ -500,28 +421,26 @@ class AddNewAppFormComponent extends React.Component {
onChange={this.handleIconChange} onChange={this.handleIconChange}
beforeUpload={() => false} beforeUpload={() => false}
> >
{icons.length !== 1 && ( {icons.length !== 1 && (
<Button> <Button>
<Icon type="upload"/> Click to upload <Icon type="upload"/> Click to upload
</Button> </Button>
)} )}
</Upload>, </Upload>,
)} )}
</Form.Item> </Form.Item>
</Col>
</Row>
<Row style={{marginTop: 40}}> <Row style={{marginTop: 40}}>
<Col span={24}> <Col span={24}>
<Form.Item label="Screenshots">
</Col>
</Row>
<Form.Item {...formItemLayout} label="Screenshots">
{getFieldDecorator('screenshots', { {getFieldDecorator('screenshots', {
valuePropName: 'icon', valuePropName: 'icon',
getValueFromEvent: this.normFile, getValueFromEvent: this.normFile,
required: false, required: true,
message: 'Please select a icon' message: 'Please select a icon'
})( })(
<Upload <Upload
@ -541,22 +460,110 @@ class AddNewAppFormComponent extends React.Component {
</Upload>, </Upload>,
)} )}
</Form.Item> </Form.Item>
</Col>
</Row>
{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") && (
<Form.Item {...formItemLayout} label="URL">
{getFieldDecorator('url', {
rules: [{
required: true,
message: 'Please input the url'
}],
})(
<Input placeholder="url"/>
)}
</Form.Item>
)}
{formConfig.specificElements.hasOwnProperty("version") && (
<Form.Item {...formItemLayout} label="Version">
{getFieldDecorator('version', {
rules: [{
required: true,
message: 'Please input the version'
}],
})(
<Input placeholder="Version"/>
)}
</Form.Item>
)}
<Form.Item {...formItemLayout} label="Release Type">
{getFieldDecorator('releaseType', {
rules: [{
required: true,
message: 'Please input the Release Type'
}],
})(
<Input placeholder="Release Type"/>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Description">
{getFieldDecorator('releaseDescription', {
rules: [{
required: true,
message: 'Please enter a description for release'
}],
})(
<TextArea placeholder="Enter a description for release" rows={5}/>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Price">
{getFieldDecorator('price', {
rules: [{
required: false
}],
})(
<Input prefix="$" placeholder="00.00"/>
)}
</Form.Item>
<Form.Item {...formItemLayout} label="Is Shared?">
{getFieldDecorator('isSharedWithAllTenants', {
rules: [{
required: true,
message: 'Please select'
}],
initialValue: false
})(
<Switch checkedChildren={<Icon type="check"/>}
unCheckedChildren={<Icon type="close"/>}
/>
)}
</Form.Item>
</Col> </Col>
</Row> </Row>
<Form.Item style={{float: "right"}}>
<Button type="primary" htmlType="submit">
Submit
</Button>
</Form.Item>
</Form> </Form>
</Card> </Card>
</Col> </Col>
</Row> </Row>
</Spin>
</div> </div>
); );
} }
} }
const AddNewAppForm = Form.create({name: 'add-new-app'})(AddNewAppFormComponent); const AddNewAppForm = withRouter(Form.create({name: 'add-new-app'})(AddNewAppFormComponent));
export default AddNewAppForm; export default AddNewAppForm;

10
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/index.js vendored
Unescape View File

@ -6,9 +6,11 @@ import Login from "./pages/Login";
import Dashboard from "./pages/dashboard/Dashboard"; import Dashboard from "./pages/dashboard/Dashboard";
import Apps from "./pages/dashboard/apps/Apps"; import Apps from "./pages/dashboard/apps/Apps";
import Release from "./pages/dashboard/apps/release/Release"; import Release from "./pages/dashboard/apps/release/Release";
import AddNewApp from "./pages/dashboard/add-new-app/AddNewApp"; import AddNewEnterpriseApp from "./pages/dashboard/add-new-app/AddNewEnterpriseApp";
import Mange from "./pages/dashboard/manage/Manage"; import Mange from "./pages/dashboard/manage/Manage";
import './index.css'; import './index.css';
import AddNewPublicApp from "./pages/dashboard/add-new-app/AddNewPublicApp";
import AddNewWebClip from "./pages/dashboard/add-new-app/AddNewWebClip";
const routes = [ const routes = [
@ -34,17 +36,17 @@ const routes = [
}, },
{ {
path: '/publisher/add-new-app/enterprise', path: '/publisher/add-new-app/enterprise',
component: AddNewApp, component: AddNewEnterpriseApp,
exact: true exact: true
}, },
{ {
path: '/publisher/add-new-app/public', path: '/publisher/add-new-app/public',
component: AddNewApp, component: AddNewPublicApp,
exact: true exact: true
}, },
{ {
path: '/publisher/add-new-app/web-clip', path: '/publisher/add-new-app/web-clip',
component: AddNewApp, component: AddNewWebClip,
exact: true exact: true
}, },
{ {

153
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/add-new-app/AddNewApp.js vendored
Unescape View File

@ -1,153 +0,0 @@
import React from "react";
import "antd/dist/antd.css";
import {
PageHeader,
Typography,
Card,
Steps,
Button,
message,
Row,
Col,
Tag,
Tooltip,
Input,
Icon,
Select,
Switch,
Form,
Upload,
Divider
} from "antd";
import axios from "axios";
import AddNewAppForm from "../../../components/new-app/AddNewAppForm"
import config from "../../../../public/conf/config.json";
const Paragraph = Typography;
const Dragger = Upload.Dragger;
const props = {
name: 'file',
multiple: false,
action: '//jsonplaceholder.typicode.com/posts/',
onChange(info) {
const status = info.file.status;
if (status !== 'uploading') {
console.log(info.file, info.fileList);
}
if (status === 'done') {
message.success(`${info.file.name} file uploaded successfully.`);
} else if (status === 'error') {
message.error(`${info.file.name} file upload failed.`);
}
},
};
//
// const steps = [{
// title: 'First',
// content: Step1
// }, {
// title: 'Second',
// content: Step2,
// }, {
// title: 'Last',
// content: Step3,
// }];
const {Option} = Select;
const {TextArea} = Input;
const InputGroup = Input.Group;
const formItemLayout = {
labelCol: {
span: 4,
},
wrapperCol: {
span: 20,
},
};
class AddNewApp extends React.Component {
constructor(props) {
super(props);
this.state = {
current: 0,
categories: []
};
}
componentDidMount() {
// this.getCategories();
}
next() {
const current = this.state.current + 1;
this.setState({current});
}
prev() {
const current = this.state.current - 1;
this.setState({current});
}
getCategories = () => {
axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories",
{
headers: {'X-Platform': config.serverConfig.platform}
}).then(res => {
if (res.status === 200) {
let categories = JSON.parse(res.data.data);
this.setState({
categories: categories,
loading: false
});
}
}).catch((error) => {
if (error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
} else {
message.warning('Something went wrong');
}
this.setState({
loading: false
});
});
};
handleCategoryChange = (value) => {
console.log(`selected ${value}`);
};
render() {
const {categories} = this.state;
return (
<div>
<PageHeader
title="Add New App"
>
<div className="wrap">
<div className="content">
<Paragraph>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo.
</Paragraph>
</div>
</div>
</PageHeader>
<div style={{background: '#f0f2f5', padding: 24, minHeight: 720}}>
<AddNewAppForm/>
</div>
</div>
);
}
}
export default AddNewApp;

62
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/add-new-app/AddNewEnterpriseApp.js vendored
Unescape View File

@ -0,0 +1,62 @@
import React from "react";
import "antd/dist/antd.css";
import {
PageHeader,
Typography
} from "antd";
import AddNewAppForm from "../../../components/new-app/AddNewAppForm";
const Paragraph = Typography;
const formConfig = {
installationType: "ENTERPRISE",
endpoint: "/ent-app",
jsonPayloadName:"application",
releaseWrapperName: "entAppReleaseWrappers",
specificElements: {
binaryFile: {
required: true
}
}
};
class AddNewEnterpriseApp extends React.Component {
constructor(props) {
super(props);
this.state = {
current: 0,
categories: []
};
}
componentDidMount() {
// this.getCategories();
}
render() {
return (
<div>
<PageHeader
title="Add New Enterprise App"
>
<div className="wrap">
<div className="content">
<Paragraph>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo.
</Paragraph>
</div>
</div>
</PageHeader>
<div style={{background: '#f0f2f5', padding: 24, minHeight: 720}}>
<AddNewAppForm formConfig={formConfig}/>
</div>
</div>
);
}
}
export default AddNewEnterpriseApp;

65
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/add-new-app/AddNewPublicApp.js vendored
Unescape View File

@ -0,0 +1,65 @@
import React from "react";
import "antd/dist/antd.css";
import {
PageHeader,
Typography
} from "antd";
import AddNewAppForm from "../../../components/new-app/AddNewAppForm";
const Paragraph = Typography;
const formConfig = {
installationType: "PUBLIC",
endpoint: "/public-app",
jsonPayloadName:"public-app",
releaseWrapperName: "publicAppReleaseWrappers",
specificElements: {
packageName : {
required: true
},
version : {
required: true
}
}
};
class AddNewEnterpriseApp extends React.Component {
constructor(props) {
super(props);
this.state = {
current: 0,
categories: []
};
}
componentDidMount() {
// this.getCategories();
}
render() {
return (
<div>
<PageHeader
title="Add New Public App"
>
<div className="wrap">
<div className="content">
<Paragraph>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo.
</Paragraph>
</div>
</div>
</PageHeader>
<div style={{background: '#f0f2f5', padding: 24, minHeight: 720}}>
<AddNewAppForm formConfig={formConfig}/>
</div>
</div>
);
}
}
export default AddNewEnterpriseApp;

65
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/react-app/src/pages/dashboard/add-new-app/AddNewWebClip.js vendored
Unescape View File

@ -0,0 +1,65 @@
import React from "react";
import "antd/dist/antd.css";
import {
PageHeader,
Typography
} from "antd";
import AddNewAppForm from "../../../components/new-app/AddNewAppForm";
const Paragraph = Typography;
const formConfig = {
installationType: "WEB_CLIP",
endpoint: "/web-app",
jsonPayloadName:"webapp",
releaseWrapperName: "webAppReleaseWrappers",
specificElements: {
url : {
required: true
},
version : {
required: true
}
}
};
class AddNewEnterpriseApp extends React.Component {
constructor(props) {
super(props);
this.state = {
current: 0,
categories: []
};
}
componentDidMount() {
// this.getCategories();
}
render() {
return (
<div>
<PageHeader
title="Add New Web Clip"
>
<div className="wrap">
<div className="content">
<Paragraph>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo.
</Paragraph>
</div>
</div>
</PageHeader>
<div style={{background: '#f0f2f5', padding: 24, minHeight: 720}}>
<AddNewAppForm formConfig={formConfig}/>
</div>
</div>
);
}
}
export default AddNewEnterpriseApp;
Write Preview
Loading…
Cancel
Save