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

Add UI improvements

See merge request entgra/carbon-device-mgt!176
feature/appm-store/pbac
Dharmakeerthi Lasantha 6 years ago
commit 1ec26cef06

@ -29,6 +29,7 @@
"react-scripts": "2.1.8", "react-scripts": "2.1.8",
"react-star-ratings": "^2.3.0", "react-star-ratings": "^2.3.0",
"redux-thunk": "^2.3.0", "redux-thunk": "^2.3.0",
"shade-blend-color": "^1.0.0",
"storm-react-diagrams": "^5.2.1" "storm-react-diagrams": "^5.2.1"
}, },
"devDependencies": { "devDependencies": {

@ -1,7 +1,9 @@
{ {
"theme": { "theme": {
"type": "default", "type": "default",
"value": "lightBaseTheme" "value": "lightBaseTheme",
"logo" : "https://entgra.io/assets/images/svg/logo.svg",
"primaryColor": "rgb(24, 144, 255)"
}, },
"serverConfig": { "serverConfig": {
"protocol": "https", "protocol": "https",
@ -18,16 +20,24 @@
}, },
"defaultPlatformIcons": { "defaultPlatformIcons": {
"default": { "default": {
"icon": "mobile", "icon": "global",
"color": "#535c68" "color": "#535c68",
"theme": "outlined"
}, },
"android": { "android": {
"icon": "android", "icon": "android",
"color": "#7db343" "color": "#7db343",
"theme": "filled"
}, },
"ios": { "ios": {
"icon": "apple", "icon": "apple",
"color": "#535c68" "color": "#535c68",
"theme": "filled"
},
"windows": {
"icon": "windows",
"color": "#008cc4",
"theme": "filled"
} }
} }
} }

@ -21,14 +21,14 @@
padding: 5px; padding: 5px;
} }
.logo { .logo-image {
width: 120px; /*width: 120px;*/
height: 31px; height: 31px;
margin: 0 0 16px 20px; margin: 0 5px 16px 24px;
float: left; float: left;
} }
.logo img{ .logo-image img{
height: 35px; height: 35px;
} }

@ -1,5 +1,5 @@
import React from "react"; import React from "react";
import "antd/dist/antd.css"; import "antd/dist/antd.less";
import RouteWithSubRoutes from "./components/RouteWithSubRoutes"; import RouteWithSubRoutes from "./components/RouteWithSubRoutes";
import { import {
BrowserRouter as Router, BrowserRouter as Router,

@ -1,5 +1,5 @@
import React from "react"; import React from "react";
import {Row, Typography, Icon} from "antd"; import {Row, Typography, Icon, message} from "antd";
import StarRatings from "react-star-ratings"; import StarRatings from "react-star-ratings";
import "./DetailedRating.css"; import "./DetailedRating.css";
import config from "../../../../public/conf/config.json"; import config from "../../../../public/conf/config.json";
@ -41,8 +41,10 @@ class DetailedRating extends React.Component{
} }
}).catch(function (error) { }).catch(function (error) {
if (error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login';
} else {
message.error('Something went wrong while trying to load rating for the release... :(');
} }
}); });
}; };

@ -24,6 +24,7 @@ import config from "../../../../../public/conf/config.json";
import ReactQuill from "react-quill"; import ReactQuill from "react-quill";
import ReactHtmlParser, {processNodes, convertNodeToElement, htmlparser2} from 'react-html-parser'; import ReactHtmlParser, {processNodes, convertNodeToElement, htmlparser2} from 'react-html-parser';
import "./AppDetailsDrawer.css"; import "./AppDetailsDrawer.css";
import pSBC from "shade-blend-color";
const {Text, Title} = Typography; const {Text, Title} = Typography;
const {Option} = Select; const {Option} = Select;
@ -91,10 +92,8 @@ class AppDetailsDrawer extends React.Component {
getCategories = () => { getCategories = () => {
axios.get( axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories", config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories"
{ ).then(res => {
headers: {'X-Platform': config.serverConfig.platform}
}).then(res => {
if (res.status === 200) { if (res.status === 200) {
const categories = JSON.parse(res.data.data); const categories = JSON.parse(res.data.data);
@ -114,10 +113,10 @@ class AppDetailsDrawer extends React.Component {
} }
}).catch((error) => { }).catch((error) => {
if (error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
} else { } else {
message.warning('Something went wrong'); message.warning('Something went wrong while trying to load app details... :(');
} }
this.setState({ this.setState({
@ -128,10 +127,8 @@ class AppDetailsDrawer extends React.Component {
getTags = () => { getTags = () => {
axios.get( axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags", config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags"
{ ).then(res => {
headers: {'X-Platform': config.serverConfig.platform}
}).then(res => {
if (res.status === 200) { if (res.status === 200) {
const tags = JSON.parse(res.data.data); const tags = JSON.parse(res.data.data);
@ -151,10 +148,10 @@ class AppDetailsDrawer extends React.Component {
} }
}).catch((error) => { }).catch((error) => {
if (error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
} else { } else {
message.warning('Something went wrong'); message.warning('Something went wrong when trying to load tags.');
} }
this.setState({ this.setState({
@ -171,14 +168,12 @@ class AppDetailsDrawer extends React.Component {
const data = {name: name}; const data = {name: name};
axios.put( axios.put(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/" + id, config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/" + id,
data, data
{
headers: {'X-Platform': config.serverConfig.platform}
}
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
notification["success"]({ notification["success"]({
message: 'Saved!' message: 'Saved!',
description: 'App name updated successfully!'
}); });
this.setState({ this.setState({
loading: false, loading: false,
@ -191,7 +186,7 @@ class AppDetailsDrawer extends React.Component {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
} else { } else {
message.error('Something went wrong... :('); message.error('Something went wrong when trying to save the app name... :(');
} }
this.setState({loading: false}); this.setState({loading: false});
@ -230,7 +225,6 @@ class AppDetailsDrawer extends React.Component {
}); });
}; };
// handle description change // handle description change
handleCategoryChange = (temporaryCategories) => { handleCategoryChange = (temporaryCategories) => {
this.setState({temporaryCategories}) this.setState({temporaryCategories})
@ -249,14 +243,12 @@ class AppDetailsDrawer extends React.Component {
const data = {categories: temporaryCategories}; const data = {categories: temporaryCategories};
axios.put( axios.put(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/" + id, config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/" + id,
data, data
{
headers: {'X-Platform': config.serverConfig.platform}
}
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
notification["success"]({ notification["success"]({
message: 'Saved!' message: 'Saved!',
description: 'App categories updated successfully!'
}); });
this.setState({ this.setState({
loading: false, loading: false,
@ -270,7 +262,7 @@ class AppDetailsDrawer extends React.Component {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
} else { } else {
message.error('Something went wrong... :('); message.error('Something went wrong when trying to updating categories');
} }
this.setState({loading: false}); this.setState({loading: false});
@ -296,7 +288,7 @@ class AppDetailsDrawer extends React.Component {
this.setState({temporaryTags}) this.setState({temporaryTags})
}; };
// change app categories // change app tags
handleTagsSave = () => { handleTagsSave = () => {
const {id} = this.props.app; const {id} = this.props.app;
const {temporaryTags, tags} = this.state; const {temporaryTags, tags} = this.state;
@ -310,14 +302,12 @@ class AppDetailsDrawer extends React.Component {
const data = {tags: temporaryTags}; const data = {tags: temporaryTags};
axios.put( axios.put(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/" + id, config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/" + id,
data, data
{
headers: {'X-Platform': config.serverConfig.platform}
}
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
notification["success"]({ notification["success"]({
message: 'Saved!' message: 'Saved!',
description: 'App tags updated successfully!'
}); });
this.setState({ this.setState({
loading: false, loading: false,
@ -330,7 +320,7 @@ class AppDetailsDrawer extends React.Component {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
} else { } else {
message.error('Something went wrong... :('); message.error('Something went wrong when trying to update tags');
} }
this.setState({loading: false}); this.setState({loading: false});
@ -348,14 +338,12 @@ class AppDetailsDrawer extends React.Component {
const data = {description: temporaryDescription}; const data = {description: temporaryDescription};
axios.put( axios.put(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/" + id, config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/" + id,
data, data
{
headers: {'X-Platform': config.serverConfig.platform}
}
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
notification["success"]({ notification["success"]({
message: 'Saved!' message: 'Saved!',
description: 'App description updated successfully!'
}); });
this.setState({ this.setState({
loading: false, loading: false,
@ -456,7 +444,7 @@ class AppDetailsDrawer extends React.Component {
{!isDescriptionEditEnabled && ( {!isDescriptionEditEnabled && (
<Text <Text
style={{ style={{
color: "#1890ff", color: config.theme.primaryColor,
cursor: "pointer" cursor: "pointer"
}} }}
onClick={this.enableDescriptionEdit}> onClick={this.enableDescriptionEdit}>
@ -492,7 +480,7 @@ class AppDetailsDrawer extends React.Component {
<Divider dashed={true}/> <Divider dashed={true}/>
<Text strong={true}>Categories </Text> <Text strong={true}>Categories </Text>
{!isCategoriesEditEnabled && (<Text {!isCategoriesEditEnabled && (<Text
style={{color: "#1890ff", cursor: "pointer"}} style={{color: config.theme.primaryColor, cursor: "pointer"}}
onClick={this.enableCategoriesEdit}> onClick={this.enableCategoriesEdit}>
<Icon type="edit"/> <Icon type="edit"/>
</Text> </Text>
@ -525,7 +513,8 @@ class AppDetailsDrawer extends React.Component {
<span>{ <span>{
categories.map(category => { categories.map(category => {
return ( return (
<Tag color="#108ee9" key={category} style={{marginBottom: 5}}> <Tag color={pSBC(0.30, config.theme.primaryColor)} key={category}
style={{marginBottom: 5}}>
{category} {category}
</Tag> </Tag>
); );
@ -537,7 +526,7 @@ class AppDetailsDrawer extends React.Component {
<Divider dashed={true}/> <Divider dashed={true}/>
<Text strong={true}>Tags </Text> <Text strong={true}>Tags </Text>
{!isTagsEditEnabled && (<Text {!isTagsEditEnabled && (<Text
style={{color: "#1890ff", cursor: "pointer"}} style={{color: config.theme.primaryColor, cursor: "pointer"}}
onClick={this.enableTagsEdit}> onClick={this.enableTagsEdit}>
<Icon type="edit"/> <Icon type="edit"/>
</Text> </Text>

@ -1,10 +1,10 @@
import React from "react"; import React from "react";
import {Avatar, Card, Col, Row, Table, Typography, Input, Divider, Checkbox, Select, Button, Form, message} from "antd"; import {Card, Col, Row,Typography, Input, Divider, Icon, Select, Button, Form, message, Radio} from "antd";
import axios from "axios"; import axios from "axios";
import config from "../../../../public/conf/config.json"; import config from "../../../../public/conf/config.json";
const {Option} = Select; const {Option} = Select;
const {Title, Text} = Typography; const {Title} = Typography;
class FiltersForm extends React.Component { class FiltersForm extends React.Component {
@ -26,10 +26,17 @@ class FiltersForm extends React.Component {
} }
} }
if(values.hasOwnProperty("deviceType") && values.deviceType==="all"){ if(values.hasOwnProperty("deviceType") && values.deviceType==="ALL"){
delete values["deviceType"]; delete values["deviceType"];
} }
if(values.hasOwnProperty("subscriptionType") && values.subscriptionType==="ALL"){
delete values["subscriptionType"];
}
if(values.hasOwnProperty("appType") && values.appType==="ALL"){
delete values["appType"];
}
this.props.setFilters(values); this.props.setFilters(values);
}); });
}; };
@ -42,10 +49,8 @@ class FiltersForm extends React.Component {
getCategories = () => { getCategories = () => {
axios.get( axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories", config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories"
{ ).then(res => {
headers: {'X-Platform': config.serverConfig.platform}
}).then(res => {
if (res.status === 200) { if (res.status === 200) {
let categories = JSON.parse(res.data.data); let categories = JSON.parse(res.data.data);
this.setState({ this.setState({
@ -55,10 +60,10 @@ class FiltersForm extends React.Component {
} }
}).catch((error) => { }).catch((error) => {
if (error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
} else { } else {
message.warning('Something went wrong'); message.warning('Something went wrong while trying to load categories... :(');
} }
this.setState({ this.setState({
@ -69,10 +74,8 @@ class FiltersForm extends React.Component {
getTags = () => { getTags = () => {
axios.get( axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags", config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags"
{ ).then(res => {
headers: {'X-Platform': config.serverConfig.platform}
}).then(res => {
if (res.status === 200) { if (res.status === 200) {
let tags = JSON.parse(res.data.data); let tags = JSON.parse(res.data.data);
this.setState({ this.setState({
@ -82,10 +85,10 @@ class FiltersForm extends React.Component {
} }
}).catch((error) => { }).catch((error) => {
if (error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
} else { } else {
message.warning('Something went wrong'); message.warning('Something went wrong when trying to load tags');
} }
this.setState({ this.setState({
@ -97,10 +100,8 @@ class FiltersForm extends React.Component {
getDeviceTypes = () => { getDeviceTypes = () => {
axios.get( axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.deviceMgt + "/device-types", config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.deviceMgt + "/device-types"
{ ).then(res => {
headers: {'X-Platform': config.serverConfig.platform}
}).then(res => {
if (res.status === 200) { if (res.status === 200) {
const deviceTypes = JSON.parse(res.data.data); const deviceTypes = JSON.parse(res.data.data);
this.setState({ this.setState({
@ -110,10 +111,10 @@ class FiltersForm extends React.Component {
} }
}).catch((error) => { }).catch((error) => {
if (error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
} else { } else {
message.warning('Something went wrong'); message.warning('Something went wrong when trying to load device types');
} }
this.setState({ this.setState({
@ -152,6 +153,15 @@ class FiltersForm extends React.Component {
</Col> </Col>
</Row> </Row>
<Form.Item>
{getFieldDecorator('serach', {})(
<Input
prefix={<Icon type="user" style={{ color: 'rgba(0,0,0,.25)' }} />}
placeholder="Username"
/>,
)}
</Form.Item>
<Form.Item label="Categories"> <Form.Item label="Categories">
{getFieldDecorator('categories', { {getFieldDecorator('categories', {
rules: [{ rules: [{
@ -202,8 +212,7 @@ class FiltersForm extends React.Component {
}) })
} }
<Option <Option
key="all"> key="ALL">All
all
</Option> </Option>
</Select> </Select>
)} )}
@ -244,6 +253,7 @@ class FiltersForm extends React.Component {
<Option value="ENTERPRISE">Enterprise</Option> <Option value="ENTERPRISE">Enterprise</Option>
<Option value="PUBLIC">Public</Option> <Option value="PUBLIC">Public</Option>
<Option value="WEB_CLIP">Web APP</Option> <Option value="WEB_CLIP">Web APP</Option>
<Option value="ALL">All</Option>
</Select> </Select>
)} )}
</Form.Item> </Form.Item>
@ -251,10 +261,11 @@ class FiltersForm extends React.Component {
<Form.Item label="Subscription Type"> <Form.Item label="Subscription Type">
{getFieldDecorator('subscriptionType', {})( {getFieldDecorator('subscriptionType', {})(
<Checkbox.Group style={{width: '100%'}}> <Radio.Group style={{width: '100%'}}>
<Checkbox value="FREE">Free</Checkbox><br/> <Radio value="FREE">Free</Radio>
<Checkbox value="PAID">Paid</Checkbox><br/> <Radio value="PAID">Paid</Radio>
</Checkbox.Group>, <Radio value="ALL">All</Radio>
</Radio.Group>,
)} )}
</Form.Item> </Form.Item>
<Divider/> <Divider/>

@ -1,6 +1,7 @@
import React from "react"; import React from "react";
import {Avatar, Card, Col, Row, Table, Typography, Tag, Icon, message} from "antd"; import {Avatar, Table, Tag, Icon, message} from "antd";
import axios from "axios"; import axios from "axios";
import pSBC from 'shade-blend-color';
import config from "../../../../../public/conf/config.json"; import config from "../../../../../public/conf/config.json";
import "./AppsTable.css"; import "./AppsTable.css";
@ -30,7 +31,7 @@ const columns = [
<span> <span>
{categories.map(category => { {categories.map(category => {
return ( return (
<Tag color="blue" key={category}> <Tag color={pSBC ( 0.30, config.theme.primaryColor )} key={category}>
{category} {category}
</Tag> </Tag>
); );
@ -45,12 +46,14 @@ const columns = [
const defaultPlatformIcons = config.defaultPlatformIcons; const defaultPlatformIcons = config.defaultPlatformIcons;
let icon = defaultPlatformIcons.default.icon; let icon = defaultPlatformIcons.default.icon;
let color = defaultPlatformIcons.default.color; let color = defaultPlatformIcons.default.color;
let theme = defaultPlatformIcons.default.theme;
if (defaultPlatformIcons.hasOwnProperty(platform)) { if (defaultPlatformIcons.hasOwnProperty(platform)) {
icon = defaultPlatformIcons[platform].icon; icon = defaultPlatformIcons[platform].icon;
color = defaultPlatformIcons[platform].color; color = defaultPlatformIcons[platform].color;
theme = defaultPlatformIcons[platform].theme;
} }
return (<span style={{fontSize: 20, color: color, textAlign: "center"}}><Icon type={icon} return (<span style={{fontSize: 20, color: color, textAlign: "center"}}><Icon type={icon}
theme="filled"/></span>) theme={theme}/></span>)
} }
}, },
{ {
@ -152,7 +155,7 @@ class AppsTable extends React.Component {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login';
} else { } else {
message.error('Something went wrong... :('); message.error('Something went wrong while trying to load apps... :(');
} }
this.setState({loading: false}); this.setState({loading: false});

@ -55,10 +55,9 @@ class LifeCycle extends React.Component {
fetchData = () => { fetchData = () => {
axios.get(config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/lifecycle-config", axios.get(
{ config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/lifecycle-config"
headers: {'X-Platform': config.serverConfig.platform} ).then(res => {
}).then(res => {
if (res.status === 200) { if (res.status === 200) {
const lifecycle = res.data.data; const lifecycle = res.data.data;
this.setState({ this.setState({
@ -69,6 +68,8 @@ class LifeCycle extends React.Component {
}).catch(function (error) { }).catch(function (error) {
if (error.hasOwnProperty("response") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
} else {
message.error('Something went wrong when trying to load lifecycle configuration');
} }
}); });
}; };
@ -105,11 +106,10 @@ class LifeCycle extends React.Component {
isConfirmButtonLoading: true, isConfirmButtonLoading: true,
}); });
axios.post(config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/life-cycle/" + uuid, axios.post(
data, config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/life-cycle/" + uuid,
{ data
headers: {'X-Platform': config.serverConfig.platform} ).then(res => {
}).then(res => {
if (res.status === 201) { if (res.status === 201) {
this.setState({ this.setState({
isReasonModalVisible: false, isReasonModalVisible: false,
@ -133,7 +133,7 @@ class LifeCycle extends React.Component {
notification["error"]({ notification["error"]({
message: "Error", message: "Error",
description: description:
"Something went wrong", "Something went wrong when trying to add lifecycle",
}); });
} }
this.setState({ this.setState({

@ -31,20 +31,18 @@ class Reviews extends React.Component {
const {uuid, type} = this.props; const {uuid, type} = this.props;
axios.get( axios.get(
config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher+"/admin/reviews/"+type+"/"+uuid, config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/admin/reviews/" + type + "/" + uuid
{ ).then(res => {
headers: {'X-Platform': config.serverConfig.platform}
}).then(res => {
if (res.status === 200) { if (res.status === 200) {
let reviews = res.data.data.data; let reviews = res.data.data.data;
callback(reviews); callback(reviews);
} }
}).catch(function (error) { }).catch(function (error) {
if (error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
} else { } else {
message.warning('Something went wrong'); message.warning('Something went wrong when trying to load reviews');
} }
}); });

@ -3,6 +3,7 @@ import {Card, Tag, message, Icon, Input, notification, Divider, Button, Spin, To
import axios from "axios"; import axios from "axios";
import config from "../../../../public/conf/config.json"; import config from "../../../../public/conf/config.json";
import {TweenOneGroup} from 'rc-tween-one'; import {TweenOneGroup} from 'rc-tween-one';
import pSBC from "shade-blend-color";
class ManageCategories extends React.Component { class ManageCategories extends React.Component {
@ -32,7 +33,7 @@ class ManageCategories extends React.Component {
} }
}).catch((error) => { }).catch((error) => {
if (error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login';
} else { } else {
message.warning('Something went wrong'); message.warning('Something went wrong');
@ -79,11 +80,11 @@ class ManageCategories extends React.Component {
} }
}).catch((error) => { }).catch((error) => {
if (error.response.hasOwnProperty("status") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login';
} else { } else {
message.warning('Something went wrong'); message.warning('Something went wrong when trying to load categories');
} }
this.setState({ this.setState({
loading: false loading: false
@ -95,14 +96,14 @@ class ManageCategories extends React.Component {
const categoryName = category.categoryName; const categoryName = category.categoryName;
const tagElem = ( const tagElem = (
<Tag <Tag
color="blue" color={pSBC ( 0.30, config.theme.primaryColor )}
> >
{categoryName} {categoryName}
<Divider type="vertical"/> <Divider type="vertical"/>
<Tooltip title="edit"> <Tooltip title="edit">
<Icon onClick={() => { <Icon onClick={() => {
this.openEditModal(categoryName) this.openEditModal(categoryName)
}} style={{color: 'rgba(0,0,0,0.45)'}} type="edit"/> }} type="edit"/>
</Tooltip> </Tooltip>
<Divider type="vertical"/> <Divider type="vertical"/>
<Tooltip title="delete"> <Tooltip title="delete">
@ -122,7 +123,7 @@ class ManageCategories extends React.Component {
okText="Yes" okText="Yes"
cancelText="No" cancelText="No"
> >
<Icon style={{color: 'rgba(0,0,0,0.45)'}} type="delete"/> <Icon type="delete"/>
</Popconfirm> </Popconfirm>
</Tooltip> </Tooltip>
</Tag> </Tag>
@ -218,11 +219,11 @@ class ManageCategories extends React.Component {
} }
}).catch((error) => { }).catch((error) => {
if (error.response.hasOwnProperty("status") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login';
} else { } else {
message.warning('Something went wrong'); message.warning('Something went wrong when trying to add categories');
} }
this.setState({ this.setState({
loading: false loading: false
@ -280,11 +281,11 @@ class ManageCategories extends React.Component {
} }
}).catch((error) => { }).catch((error) => {
if (error.response.hasOwnProperty("status") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login';
} else { } else {
message.warning('Something went wrong'); message.warning('Something went wrong when trying to delete the category');
} }
this.setState({ this.setState({
loading: false, loading: false,
@ -306,7 +307,7 @@ class ManageCategories extends React.Component {
const categoriesElements = categories.map(this.renderElement); const categoriesElements = categories.map(this.renderElement);
const temporaryElements = tempElements.map(this.renderTempElement); const temporaryElements = tempElements.map(this.renderTempElement);
return ( return (
<div> <div style={{marginBottom: 16}}>
<Card title="Categories"> <Card title="Categories">
<Spin tip="Working on it..." spinning={this.state.loading}> <Spin tip="Working on it..." spinning={this.state.loading}>
{!isAddNewVisible && {!isAddNewVisible &&

@ -32,10 +32,10 @@ class ManageTags extends React.Component {
} }
}).catch((error) => { }).catch((error) => {
if (error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login';
} else { } else {
message.warning('Something went wrong'); message.warning('Something went wrong when trying to load tags');
} }
this.setState({ this.setState({
@ -58,10 +58,8 @@ class ManageTags extends React.Component {
}); });
axios.delete( axios.delete(
config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher+"/admin/applications/tags/"+id, config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher+"/admin/applications/tags/"+id
{ ).then(res => {
headers: {'X-Platform': config.serverConfig.platform}
}).then(res => {
if (res.status === 200) { if (res.status === 200) {
notification["success"]({ notification["success"]({
message: "Done!", message: "Done!",
@ -82,11 +80,11 @@ class ManageTags extends React.Component {
} }
}).catch((error) => { }).catch((error) => {
if (error.response.hasOwnProperty("status") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login';
} else { } else {
message.warning('Something went wrong'); message.warning('Something went wrong when trying to delete the tag');
} }
this.setState({ this.setState({
loading: false loading: false
@ -98,14 +96,14 @@ class ManageTags extends React.Component {
const tagName = tag.tagName; const tagName = tag.tagName;
const tagElem = ( const tagElem = (
<Tag <Tag
color="gold" color="#34495e"
> >
{tagName} {tagName}
<Divider type="vertical"/> <Divider type="vertical"/>
<Tooltip title="edit"> <Tooltip title="edit">
<Icon onClick={() => { <Icon onClick={() => {
this.openEditModal(tagName) this.openEditModal(tagName)
}} style={{color: 'rgba(0,0,0,0.45)'}} type="edit"/> }} type="edit"/>
</Tooltip> </Tooltip>
<Divider type="vertical"/> <Divider type="vertical"/>
<Tooltip title="delete"> <Tooltip title="delete">
@ -125,7 +123,7 @@ class ManageTags extends React.Component {
okText="Yes" okText="Yes"
cancelText="No" cancelText="No"
> >
<Icon style={{color: 'rgba(0,0,0,0.45)'}} type="delete"/> <Icon type="delete"/>
</Popconfirm> </Popconfirm>
</Tooltip> </Tooltip>
</Tag> </Tag>
@ -219,11 +217,11 @@ class ManageTags extends React.Component {
} }
}).catch((error) => { }).catch((error) => {
if (error.response.hasOwnProperty("status") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login';
} else { } else {
message.warning('Something went wrong'); message.warning('Something went wrong when trying to delete tag');
} }
this.setState({ this.setState({
loading: false loading: false
@ -281,11 +279,11 @@ class ManageTags extends React.Component {
} }
}).catch((error) => { }).catch((error) => {
if (error.response.hasOwnProperty("status") && error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login';
} else { } else {
message.warning('Something went wrong'); message.warning('Something went wrong when trying to edit tag');
} }
this.setState({ this.setState({
loading: false, loading: false,
@ -307,7 +305,7 @@ class ManageTags extends React.Component {
const tagsElements = tags.map(this.renderElement); const tagsElements = tags.map(this.renderElement);
const temporaryElements = tempElements.map(this.renderTempElement); const temporaryElements = tempElements.map(this.renderTempElement);
return ( return (
<div> <div style={{marginBottom: 16}}>
<Card title="Tags"> <Card title="Tags">
<Spin tip="Working on it..." spinning={this.state.loading}> <Spin tip="Working on it..." spinning={this.state.loading}>
{!isAddNewVisible && {!isAddNewVisible &&

@ -1,5 +1,4 @@
import React from "react"; import React from "react";
import "antd/dist/antd.css";
import { import {
Card, Card,
Button, Button,
@ -55,10 +54,8 @@ class AddNewAppFormComponent extends React.Component {
getCategories = () => { getCategories = () => {
axios.get( axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories", config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/categories"
{ ).then(res => {
headers: {'X-Platform': config.serverConfig.platform}
}).then(res => {
if (res.status === 200) { if (res.status === 200) {
let categories = JSON.parse(res.data.data); let categories = JSON.parse(res.data.data);
this.setState({ this.setState({
@ -68,10 +65,10 @@ class AddNewAppFormComponent extends React.Component {
} }
}).catch((error) => { }).catch((error) => {
if (error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
} else { } else {
message.warning('Something went wrong'); message.warning('Something went wrong when trying to load categories');
} }
this.setState({ this.setState({
@ -82,10 +79,8 @@ class AddNewAppFormComponent extends React.Component {
getTags = () => { getTags = () => {
axios.get( axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags", config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/tags"
{ ).then(res => {
headers: {'X-Platform': config.serverConfig.platform}
}).then(res => {
if (res.status === 200) { if (res.status === 200) {
let tags = JSON.parse(res.data.data); let tags = JSON.parse(res.data.data);
this.setState({ this.setState({
@ -95,10 +90,10 @@ class AddNewAppFormComponent extends React.Component {
} }
}).catch((error) => { }).catch((error) => {
if (error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
} else { } else {
message.warning('Something went wrong'); message.warning('Something went wrong when trying to load tags');
} }
this.setState({ this.setState({
@ -210,7 +205,7 @@ class AddNewAppFormComponent extends React.Component {
} }
}).catch((error) => { }).catch((error) => {
if (error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
} else { } else {
notification["error"]({ notification["error"]({

@ -1,12 +1,15 @@
import axios from "axios"; import axios from "axios";
import ActionTypes from "../constants/ActionTypes"; import ActionTypes from "../constants/ActionTypes";
import config from "../../../public/conf/config.json"; import config from "../../../public/conf/config.json";
import {message} from "antd";
export const getApps = () => dispatch => { export const getApps = () => dispatch => {
const request = "method=post&content-type=application/json&payload={}&api-endpoint=/application-mgt-publisher/v1.0/applications"; const request = "method=post&content-type=application/json&payload={}&api-endpoint=/application-mgt-publisher/v1.0/applications";
return axios.post(config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher, request return axios.post(
config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher,
request
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
let apps = []; let apps = [];
@ -18,8 +21,10 @@ export const getApps = () => dispatch => {
} }
}).catch(function (error) { }).catch(function (error) {
if (error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login';
} else {
message.error('Something went wrong when trying to load applications... :(');
} }
}); });
@ -29,7 +34,8 @@ export const getRelease = (uuid) => dispatch => {
const request = "method=get&content-type=application/json&payload={}&api-endpoint=/application-mgt-publisher/v1.0/applications/release/" + uuid; const request = "method=get&content-type=application/json&payload={}&api-endpoint=/application-mgt-publisher/v1.0/applications/release/" + uuid;
return axios.post(config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher, request return axios.post(
config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher, request
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
let release = res.data.data; let release = res.data.data;
@ -37,8 +43,10 @@ export const getRelease = (uuid) => dispatch => {
} }
}).catch(function (error) { }).catch(function (error) {
if (error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login';
} else {
message.error('Something went wrong... :(');
} }
}); });
@ -73,7 +81,8 @@ export const closeLifecycleModal = () => dispatch => {
export const getLifecycle = () => dispatch => { export const getLifecycle = () => dispatch => {
const request = "method=get&content-type=application/json&payload={}&api-endpoint=/application-mgt-publisher/v1.0/applications/lifecycle-config"; const request = "method=get&content-type=application/json&payload={}&api-endpoint=/application-mgt-publisher/v1.0/applications/lifecycle-config";
return axios.post(config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher, request return axios.post(
config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher, request
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
let lifecycle = res.data.data; let lifecycle = res.data.data;
@ -81,8 +90,10 @@ export const getLifecycle = () => dispatch => {
} }
}).catch(function (error) { }).catch(function (error) {
if (error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login';
} else {
message.error('Something went wrong... :(');
} }
}); });
}; };
@ -97,7 +108,8 @@ export const updateLifecycleState = (uuid, nextState, reason) => dispatch => {
const request = "method=post&content-type=application/json&payload=" + JSON.stringify(payload) + "&api-endpoint=/application-mgt-publisher/v1.0/applications/life-cycle/" + uuid; const request = "method=post&content-type=application/json&payload=" + JSON.stringify(payload) + "&api-endpoint=/application-mgt-publisher/v1.0/applications/life-cycle/" + uuid;
return axios.post(config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher, request return axios.post(
config.serverConfig.protocol + "://"+config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri +config.serverConfig.invoker.publisher, request
).then(res => { ).then(res => {
if (res.status === 201) { if (res.status === 201) {
let release = res.data.data; let release = res.data.data;
@ -110,7 +122,7 @@ export const updateLifecycleState = (uuid, nextState, reason) => dispatch => {
} }
}).catch(function (error) { }).catch(function (error) {
if (error.response.status === 401) { if (error.hasOwnProperty("response") && error.response.status === 401) {
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort+'/publisher/login';
} else if (error.response.status === 500) { } else if (error.response.status === 500) {
alert("error"); alert("error");

@ -0,0 +1,44 @@
@-moz-keyframes spin {
0% {
-moz-transform: rotate(0deg) scale(1.0);
}
100% {
-moz-transform: rotate(360deg) scale(0.1);
}
}
@-webkit-keyframes spin {
0% {
-webkit-transform: rotate(0deg) scale(1.0);
}
100% {
-webkit-transform: rotate(360deg) scale(0.1);
}
}
@keyframes spin {
0% {
-webkit-transform: rotate(0deg) scale(1.0);
}
100% {
-webkit-transform: rotate(360deg) scale(0.1);
transform: rotate(360deg) scale(0.1);
}
}
.background {
position: absolute;
height: 100%;
width: 100%;
z-index: 0;
background-image: url('https://gw.alipayobjects.com/zos/rmsportal/TVYTbAXWheQpRcWDaDMu.svg');
background-repeat: no-repeat;
background-position: center 110px;
background-size: 100%;
animation: spin 200s infinite linear;
}
.content {
position: relative;
z-index: 1;
}

@ -1,8 +1,9 @@
import React from "react"; import React from "react";
import {Typography, Row, Col, Form, Icon, Input, Button, Checkbox} from 'antd'; import {Typography, Row, Col, Form, Icon, Input, Button, Checkbox, message} from 'antd';
import styles from './Login.less'; import './Login.css';
import axios from 'axios'; import axios from 'axios';
import config from "../../public/conf/config.json"; import config from "../../public/conf/config.json";
import "./Login.css";
const {Title} = Typography; const {Title} = Typography;
const {Text} = Typography; const {Text} = Typography;
@ -10,18 +11,27 @@ const {Text} = Typography;
class Login extends React.Component { class Login extends React.Component {
render() { render() {
return ( return (
<div className={styles.main}> <div>
<div className={styles.content}> <div className="background">
</div>
<div className="content">
<Row> <Row>
<Col span={4} offset={10}> <Col xs={3} sm={3} md={10}>
</Col>
<Col xs={18} sm={18} md={4}>
<Row style={{marginBottom: 20}}> <Row style={{marginBottom: 20}}>
<Col> <Col style={{textAlign: "center"}}>
<img className={styles.logo} src={require('../../public/images/logo.svg')}/> <img style={
{
marginTop: 36,
height: 60
}
}
src={config.theme.logo}/>
</Col> </Col>
</Row> </Row>
<Title type="secondary" level={2}>Login</Title> <Title level={2}>Login</Title>
<WrappedNormalLoginForm/> <WrappedNormalLoginForm/>
</Col> </Col>
</Row> </Row>
<Row> <Row>
@ -42,7 +52,7 @@ class NormalLoginForm extends React.Component {
super(props); super(props);
this.state = { this.state = {
inValid: false, inValid: false,
loading : false loading: false
}; };
} }
@ -65,18 +75,22 @@ class NormalLoginForm extends React.Component {
const request = Object.keys(parameters).map(key => key + '=' + parameters[key]).join('&'); const request = Object.keys(parameters).map(key => key + '=' + parameters[key]).join('&');
axios.post(config.serverConfig.protocol + "://"+config.serverConfig.hostname+':'+config.serverConfig.httpsPort+config.serverConfig.loginUri, request axios.post(config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.loginUri, request
).then(res => { ).then(res=>{
if (res.status === 200) { if (res.status === 200) {
window.location = res.data.url; window.location = res.data.url;
} }
}).catch(function (error) { }).catch(function (error) {
if (error.response.status === 400) { if (error.hasOwnProperty("response") && error.response.status === 400) {
thisForm.setState({ thisForm.setState({
inValid: true, inValid: true
loading: false
}); });
} else {
message.error('Something went wrong when trying to login... :(');
} }
thisForm.setState({
loading: false
});
}); });
} }
@ -97,7 +111,7 @@ class NormalLoginForm extends React.Component {
<Form onSubmit={this.handleSubmit} className="login-form"> <Form onSubmit={this.handleSubmit} className="login-form">
<Form.Item> <Form.Item>
{getFieldDecorator('username', { {getFieldDecorator('username', {
rules: [{required: true, message: 'Please input your username!'}], rules: [{required: true, message: 'Please enter your username'}],
})( })(
<Input style={{height: 32}} prefix={<Icon type="user" style={{color: 'rgba(0,0,0,.25)'}}/>} <Input style={{height: 32}} prefix={<Icon type="user" style={{color: 'rgba(0,0,0,.25)'}}/>}
placeholder="Username"/> placeholder="Username"/>
@ -105,9 +119,9 @@ class NormalLoginForm extends React.Component {
</Form.Item> </Form.Item>
<Form.Item> <Form.Item>
{getFieldDecorator('password', { {getFieldDecorator('password', {
rules: [{required: true, message: 'Please input your Password!'}], rules: [{required: true, message: 'Please enter your password'}],
})( })(
<Input style={{height: 32}} className={styles.input} <Input style={{height: 32}}
prefix={<Icon type="lock" style={{color: 'rgba(0,0,0,.25)'}}/>} type="password" prefix={<Icon type="lock" style={{color: 'rgba(0,0,0,.25)'}}/>} type="password"
placeholder="Password"/> placeholder="Password"/>
)} )}

@ -1,34 +0,0 @@
@nice-blue: #5B83AD;
@light-blue: @nice-blue + #111;
.header {
color: @nice-blue;
}
.main{
background-image: url('https://gw.alipayobjects.com/zos/rmsportal/TVYTbAXWheQpRcWDaDMu.svg');
background-repeat: no-repeat;
background-position: center 110px;
background-size: 100%;
.header {
color: @nice-blue;
}
}
.content{
padding-top: 128px;
}
.logo{
height: 44px;
margin: auto;
width: 100%;
}
input{
min-height: 0;
}

@ -1,10 +1,10 @@
import React from "react"; import React from "react";
import {Layout, Menu, Icon} from 'antd'; import {Layout, Menu, Icon} from 'antd';
import Logo from "../../../public/images/logo.svg";
import {Switch, Link} from "react-router-dom"; import {Switch, Link} from "react-router-dom";
import RouteWithSubRoutes from "../../components/RouteWithSubRoutes" import RouteWithSubRoutes from "../../components/RouteWithSubRoutes"
import {Redirect} from 'react-router' import {Redirect} from 'react-router'
import "../../App.css"; import "../../App.css";
import config from "../../../public/conf/config.json";
const {Header, Content, Footer} = Layout; const {Header, Content, Footer} = Layout;
const {SubMenu} = Menu; const {SubMenu} = Menu;
@ -15,15 +15,17 @@ class Dashboard extends React.Component {
this.state = { this.state = {
routes: props.routes routes: props.routes
}; };
this.Logo = config.theme.logo;
} }
render() { render() {
return ( return (
<div> <div>
<Layout className="layout"> <Layout className="layout">
<Header> <Header style={{paddingLeft: 0, paddingRight: 0}}>
<div className="logo"> <div className="logo-image">
<img src={Logo}/> <img alt="logo" src={this.Logo}/>
</div> </div>
<Menu <Menu
theme="light" theme="light"
@ -40,9 +42,12 @@ class Dashboard extends React.Component {
</span> </span>
} }
> >
<Menu.Item key="setting:1"><Link to="/publisher/add-new-app/public">Public APP</Link></Menu.Item> <Menu.Item key="setting:1"><Link to="/publisher/add-new-app/public">Public
<Menu.Item key="setting:2"><Link to="/publisher/add-new-app/enterprise">Enterprise APP</Link></Menu.Item> APP</Link></Menu.Item>
<Menu.Item key="setting:3"><Link to="/publisher/add-new-app/web-clip">Web Clip</Link></Menu.Item> <Menu.Item key="setting:2"><Link to="/publisher/add-new-app/enterprise">Enterprise
APP</Link></Menu.Item>
<Menu.Item key="setting:3"><Link to="/publisher/add-new-app/web-clip">Web
Clip</Link></Menu.Item>
</SubMenu> </SubMenu>
<Menu.Item key="2"><Link to="/publisher/manage"><Icon <Menu.Item key="2"><Link to="/publisher/manage"><Icon
type="control"/>Manage</Link></Menu.Item> type="control"/>Manage</Link></Menu.Item>
@ -50,7 +55,7 @@ class Dashboard extends React.Component {
</Header> </Header>
</Layout> </Layout>
<Layout> <Layout>
<Content style={{padding: '0 0'}}> <Content style={{marginTop: 2}}>
<Switch> <Switch>
<Redirect exact from="/publisher" to="/publisher/apps"/> <Redirect exact from="/publisher" to="/publisher/apps"/>
{this.state.routes.map((route) => ( {this.state.routes.map((route) => (

@ -1,5 +1,4 @@
import React from "react"; import React from "react";
import "antd/dist/antd.css";
import { import {
PageHeader, PageHeader,
Typography Typography
@ -11,7 +10,7 @@ const Paragraph = Typography;
const formConfig = { const formConfig = {
installationType: "ENTERPRISE", installationType: "ENTERPRISE",
endpoint: "/ent-app", endpoint: "/ent-app",
jsonPayloadName:"application", jsonPayloadName: "application",
releaseWrapperName: "entAppReleaseWrappers", releaseWrapperName: "entAppReleaseWrappers",
specificElements: { specificElements: {
binaryFile: { binaryFile: {
@ -42,11 +41,9 @@ class AddNewEnterpriseApp extends React.Component {
title="Add New Enterprise App" title="Add New Enterprise App"
> >
<div className="wrap"> <div className="wrap">
<div className="content"> <Paragraph>
<Paragraph> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo. </Paragraph>
</Paragraph>
</div>
</div> </div>
</PageHeader> </PageHeader>
<div style={{background: '#f0f2f5', padding: 24, minHeight: 720}}> <div style={{background: '#f0f2f5', padding: 24, minHeight: 720}}>

@ -1,5 +1,4 @@
import React from "react"; import React from "react";
import "antd/dist/antd.css";
import { import {
PageHeader, PageHeader,
Typography Typography
@ -45,11 +44,9 @@ class AddNewEnterpriseApp extends React.Component {
title="Add New Public App" title="Add New Public App"
> >
<div className="wrap"> <div className="wrap">
<div className="content"> <Paragraph>
<Paragraph> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo. </Paragraph>
</Paragraph>
</div>
</div> </div>
</PageHeader> </PageHeader>
<div style={{background: '#f0f2f5', padding: 24, minHeight: 720}}> <div style={{background: '#f0f2f5', padding: 24, minHeight: 720}}>

@ -1,5 +1,4 @@
import React from "react"; import React from "react";
import "antd/dist/antd.css";
import { import {
PageHeader, PageHeader,
Typography Typography
@ -45,11 +44,9 @@ class AddNewEnterpriseApp extends React.Component {
title="Add New Web Clip" title="Add New Web Clip"
> >
<div className="wrap"> <div className="wrap">
<div className="content"> <Paragraph>
<Paragraph> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo. </Paragraph>
</Paragraph>
</div>
</div> </div>
</PageHeader> </PageHeader>
<div style={{background: '#f0f2f5', padding: 24, minHeight: 720}}> <div style={{background: '#f0f2f5', padding: 24, minHeight: 720}}>

@ -1,5 +1,4 @@
import React from "react"; import React from "react";
import "antd/dist/antd.css";
import { import {
PageHeader, PageHeader,
Typography Typography

@ -1,5 +1,4 @@
import React from "react"; import React from "react";
import "antd/dist/antd.css";
import {PageHeader, Typography,Input, Button, Row, Col} from "antd"; import {PageHeader, Typography,Input, Button, Row, Col} from "antd";
import ListApps from "../../../components/apps/list-apps/ListApps"; import ListApps from "../../../components/apps/list-apps/ListApps";

@ -47,9 +47,6 @@ class Release extends React.Component {
//send request to the invoker //send request to the invoker
axios.get( axios.get(
config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/release/"+ uuid, config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.invoker.uri + config.serverConfig.invoker.publisher + "/applications/release/"+ uuid,
{
headers: {'X-Platform': config.serverConfig.platform}
}
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
const app = res.data.data; const app = res.data.data;
@ -70,7 +67,7 @@ class Release extends React.Component {
message.error('You are not logged in'); message.error('You are not logged in');
window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login'; window.location.href = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + '/publisher/login';
} else { } else {
message.error('Something went wrong... :('); message.error('Something went wrong when trying to load the release... :(');
} }
this.setState({loading: false}); this.setState({loading: false});

@ -1,5 +1,4 @@
import React from "react"; import React from "react";
import "antd/dist/antd.css";
import {PageHeader, Typography, Input, Button, Row, Col} from "antd"; import {PageHeader, Typography, Input, Button, Row, Col} from "antd";
import ManageCategories from "../../../components/manage/categories/ManageCategories"; import ManageCategories from "../../../components/manage/categories/ManageCategories";
import ManageTags from "../../../components/manage/categories/ManageTags"; import ManageTags from "../../../components/manage/categories/ManageTags";
@ -36,21 +35,23 @@ class Manage extends React.Component {
<div> <div>
<PageHeader <PageHeader
// breadcrumb={{routes}} // breadcrumb={{routes}}
title = "Manage" title="Manage"
> >
<div className="wrap"> <div className="wrap">
<div className="content"> <Paragraph>
<Paragraph> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempo. </Paragraph>
</Paragraph>
</div>
</div> </div>
</PageHeader> </PageHeader>
<div style={{background: '#f0f2f5', padding: 24, minHeight: 780}}> <div style={{background: '#f0f2f5', padding: 24, minHeight: 780}}>
<ManageCategories/> <Row gutter={16}>
<br/> <Col sm={24} md={12}>
<ManageTags/> <ManageCategories/>
</Col>
<Col sm={24} md={12}>
<ManageTags/>
</Col>
</Row>
</div> </div>
</div> </div>

@ -18,11 +18,12 @@
var path = require('path'); var path = require('path');
const HtmlWebPackPlugin = require("html-webpack-plugin"); const HtmlWebPackPlugin = require("html-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin"); const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const configurations = require("./public/conf/config.json");
const config = { const config = {
devtool: "source-map", devtool: "source-map",
output: { output: {
publicPath: '/publisher/' // <---- this publicPath: '/publisher/'
}, },
watch: false, watch: false,
resolve: { resolve: {
@ -48,7 +49,7 @@ const config = {
use: [ use: [
{ {
loader: "html-loader", loader: "html-loader",
options: { minimize: true } options: {minimize: true}
} }
] ]
}, },
@ -59,7 +60,7 @@ const config = {
{ {
test: /\.scss$/, test: /\.scss$/,
use: [ use: [
MiniCssExtractPlugin.loader, MiniCssExtractPlugin.loader,
"css-loader", "css-loader",
"postcss-loader", "postcss-loader",
"sass-loader" "sass-loader"
@ -67,7 +68,7 @@ const config = {
}, },
{ {
test: /\.scss$/, test: /\.scss$/,
use: [ 'style-loader', 'scss-loader' ] use: ['style-loader', 'scss-loader']
}, },
{ {
test: /\.less$/, test: /\.less$/,
@ -77,14 +78,16 @@ const config = {
}, },
{ {
loader: "css-loader", loader: "css-loader",
options: {
sourceMap: true,
modules: true,
localIdentName: "[local]___[hash:base64:5]"
}
}, },
{ {
loader: "less-loader" loader: "less-loader",
options: {
modifyVars: {
'primary-color': configurations.theme.primaryColor,
'link-color': configurations.theme.primaryColor,
},
javascriptEnabled: true,
},
} }
] ]
}, },
@ -95,16 +98,16 @@ const config = {
{ {
test: /\.(png|jpe?g)/i, test: /\.(png|jpe?g)/i,
use: [ use: [
{ {
loader: "url-loader", loader: "url-loader",
options: { options: {
name: "./img/[name].[ext]", name: "./img/[name].[ext]",
limit: 10000 limit: 10000
} }
}, },
{ {
loader: "img-loader" loader: "img-loader"
} }
] ]
} }
] ]

@ -10,24 +10,22 @@
}, },
"license": "Apache License 2.0", "license": "Apache License 2.0",
"dependencies": { "dependencies": {
"acorn": "^6.1.1", "acorn": "^6.2.0",
"antd": "^3.15.0", "antd": "^3.20.1",
"axios": "^0.18.0", "axios": "^0.18.1",
"d3": "^5.9.2", "d3": "^5.9.7",
"dagre": "^0.8.4", "dagre": "^0.8.4",
"javascript-time-ago": "^2.0.1", "javascript-time-ago": "^2.0.1",
"keymirror": "^0.1.1", "keymirror": "^0.1.1",
"lodash.debounce": "^4.0.8", "lodash.debounce": "^4.0.8",
"rc-viewer": "0.0.9", "rc-viewer": "0.0.9",
"react": "^16.8.4", "react-d3-graph": "^2.1.0",
"react-d3-graph": "^2.0.2",
"react-dom": "^16.8.4",
"react-highlight-words": "^0.16.0", "react-highlight-words": "^0.16.0",
"react-image-viewer-zoom": "^1.0.36", "react-image-viewer-zoom": "^1.0.36",
"react-infinite-scroller": "^1.2.4", "react-infinite-scroller": "^1.2.4",
"react-router": "latest", "react-router": "^5.0.1",
"react-router-config": "^5.0.0", "react-router-config": "^5.0.1",
"react-router-dom": "latest", "react-router-dom": "^5.0.1",
"react-scripts": "2.1.8", "react-scripts": "2.1.8",
"react-star-ratings": "^2.3.0", "react-star-ratings": "^2.3.0",
"react-twemoji": "^0.2.3", "react-twemoji": "^0.2.3",
@ -36,16 +34,16 @@
"storm-react-diagrams": "^5.2.1" "storm-react-diagrams": "^5.2.1"
}, },
"devDependencies": { "devDependencies": {
"@babel/core": "^7.0.0", "@babel/core": "^7.5.4",
"@babel/plugin-proposal-class-properties": "^7.0.0", "@babel/plugin-proposal-class-properties": "^7.5.0",
"@babel/preset-env": "^7.0.0", "@babel/preset-env": "^7.5.4",
"@babel/preset-react": "^7.0.0", "@babel/preset-react": "^7.0.0",
"@babel/register": "^7.0.0", "@babel/register": "^7.4.4",
"babel-loader": "^8.0.0", "babel-loader": "^8.0.6",
"body-parser": "^1.18.3", "body-parser": "^1.19.0",
"chai": "^4.1.2", "chai": "^4.1.2",
"css-loader": "^0.28.11", "css-loader": "^0.28.11",
"express": "^4.16.4", "express": "^4.17.1",
"express-pino-logger": "^4.0.0", "express-pino-logger": "^4.0.0",
"file-loader": "^2.0.0", "file-loader": "^2.0.0",
"html-loader": "^0.5.5", "html-loader": "^0.5.5",
@ -58,20 +56,20 @@
"mocha": "^5.2.0", "mocha": "^5.2.0",
"mock-local-storage": "^1.0.5", "mock-local-storage": "^1.0.5",
"node-env-run": "^3.0.2", "node-env-run": "^3.0.2",
"node-sass": "^4.11.0", "node-sass": "^4.12.0",
"nodemon": "^1.18.9", "nodemon": "^1.19.1",
"npm-run-all": "^4.1.5", "npm-run-all": "^4.1.5",
"pino-colada": "^1.4.4", "pino-colada": "^1.4.5",
"postcss-loader": "^3.0.0", "postcss-loader": "^3.0.0",
"react": "^15.6.2", "react": "^16.8.6",
"react-dom": "^15.6.2", "react-dom": "^16.8.6",
"react-intl": "^2.4.0", "react-intl": "^2.9.0",
"sass-loader": "^6.0.7", "sass-loader": "^6.0.7",
"style-loader": "^0.18.2", "style-loader": "^0.18.2",
"url-loader": "^1.1.2", "url-loader": "^1.1.2",
"webpack": "^4.27.1", "webpack": "^4.35.3",
"webpack-cli": "^3.1.2", "webpack-cli": "^3.3.5",
"webpack-dev-server": "^3.1.10" "webpack-dev-server": "^3.7.2"
}, },
"scripts": { "scripts": {
"start": "webpack-dev-server --mode development --open", "start": "webpack-dev-server --mode development --open",

@ -1,7 +1,9 @@
{ {
"theme": { "theme": {
"type": "default", "type": "default",
"value": "lightBaseTheme" "value": "lightBaseTheme",
"logo" : "https://entgra.io/assets/images/svg/logo.svg",
"primaryColor": "rgb(24, 144, 255)"
}, },
"serverConfig": { "serverConfig": {
"protocol": "https", "protocol": "https",

@ -2,16 +2,15 @@
height: 170px; height: 170px;
} }
.release-icon img{
width: 100%;
border-radius: 28%;
}
.release .release-icon{ .release .release-icon{
margin-right: 15px; margin-right: 15px;
} }
.appCard .release-icon{
margin-bottom: 10px; .release .release-icon img{
width: 100%;
border-radius: 28%;
} }
.release .release-title{ .release .release-title{
margin-left: 15px; margin-left: 15px;
} }
@ -22,14 +21,14 @@
padding: 5px; padding: 5px;
} }
.logo { .logo-image {
width: 120px; /*width: 120px;*/
height: 31px; height: 31px;
margin: 0 0 16px 20px; margin: 0 5px 16px 24px;
float: left; float: left;
} }
.logo img{ .logo-image img{
height: 35px; height: 35px;
} }

@ -1,5 +1,5 @@
import React from "react"; import React from "react";
import "antd/dist/antd.css"; import "antd/dist/antd.less";
import RouteWithSubRoutes from "./components/RouteWithSubRoutes"; import RouteWithSubRoutes from "./components/RouteWithSubRoutes";
import { import {
BrowserRouter as Router, BrowserRouter as Router,
@ -15,7 +15,6 @@ class App extends React.Component {
} }
render() { render() {
// console.log(this.routes);
return ( return (
<Router> <Router>
<div> <div>

@ -0,0 +1,44 @@
@-moz-keyframes spin {
0% {
-moz-transform: rotate(0deg) scale(1.0);
}
100% {
-moz-transform: rotate(360deg) scale(0.1);
}
}
@-webkit-keyframes spin {
0% {
-webkit-transform: rotate(0deg) scale(1.0);
}
100% {
-webkit-transform: rotate(360deg) scale(0.1);
}
}
@keyframes spin {
0% {
-webkit-transform: rotate(0deg) scale(1.0);
}
100% {
-webkit-transform: rotate(360deg) scale(0.1);
transform: rotate(360deg) scale(0.1);
}
}
.background {
position: absolute;
height: 100%;
width: 100%;
z-index: 0;
background-image: url('https://gw.alipayobjects.com/zos/rmsportal/TVYTbAXWheQpRcWDaDMu.svg');
background-repeat: no-repeat;
background-position: center 110px;
background-size: 100%;
animation: spin 200s infinite linear;
}
.content {
position: relative;
z-index: 1;
}

@ -1,6 +1,6 @@
import React from "react"; import React from "react";
import {Typography, Row, Col, Form, Icon, Input, Button, Checkbox} from 'antd'; import {Typography, Row, Col, Form, Icon, Input, Button, Checkbox} from 'antd';
import styles from './Login.less'; import './Login.css';
import axios from 'axios'; import axios from 'axios';
import config from "../../public/conf/config.json"; import config from "../../public/conf/config.json";
@ -10,16 +10,27 @@ const {Text} = Typography;
class Login extends React.Component { class Login extends React.Component {
render() { render() {
return ( return (
<div className={styles.main}> <div>
<div className={styles.content}> <div className="background">
</div>
<div className="content">
<Row> <Row>
<Col span={4} offset={10}> <Col xs={3} sm={3} md={10}>
</Col>
<Col xs={18} sm={18} md={4}>
<Row style={{marginBottom: 20}}> <Row style={{marginBottom: 20}}>
<Col> <Col style={{textAlign: "center"}}>
<img className={styles.logo} src={require('../../public/images/logo.svg')}/> <img style={
{
marginTop: 36,
height: 60
}
}
src={config.theme.logo}/>
</Col> </Col>
</Row> </Row>
<Title type="secondary" level={2}>Login</Title> <Title level={2}>Login</Title>
<WrappedNormalLoginForm/> <WrappedNormalLoginForm/>
</Col> </Col>
@ -42,7 +53,7 @@ class NormalLoginForm extends React.Component {
super(props); super(props);
this.state = { this.state = {
inValid: false, inValid: false,
loading : false loading: false
}; };
} }
@ -65,10 +76,10 @@ class NormalLoginForm extends React.Component {
const request = Object.keys(parameters).map(key => key + '=' + parameters[key]).join('&'); const request = Object.keys(parameters).map(key => key + '=' + parameters[key]).join('&');
axios.post(config.serverConfig.protocol + "://"+config.serverConfig.hostname+':'+config.serverConfig.httpsPort+config.serverConfig.loginUri, request axios.post(config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + config.serverConfig.loginUri, request
).then(res => { ).then(res => {
if (res.status === 200) { if (res.status === 200) {
window.location = config.serverConfig.protocol + "://"+config.serverConfig.hostname+':'+config.serverConfig.httpsPort+"/store"; window.location = config.serverConfig.protocol + "://" + config.serverConfig.hostname + ':' + config.serverConfig.httpsPort + "/store";
} }
}).catch(function (error) { }).catch(function (error) {
if (error.response.status === 400) { if (error.response.status === 400) {
@ -99,7 +110,8 @@ class NormalLoginForm extends React.Component {
{getFieldDecorator('username', { {getFieldDecorator('username', {
rules: [{required: true, message: 'Please input your username!'}], rules: [{required: true, message: 'Please input your username!'}],
})( })(
<Input name="username" style={{height: 32}} prefix={<Icon type="user" style={{color: 'rgba(0,0,0,.25)'}}/>} <Input name="username" style={{height: 32}}
prefix={<Icon type="user" style={{color: 'rgba(0,0,0,.25)'}}/>}
placeholder="Username"/> placeholder="Username"/>
)} )}
</Form.Item> </Form.Item>
@ -107,7 +119,7 @@ class NormalLoginForm extends React.Component {
{getFieldDecorator('password', { {getFieldDecorator('password', {
rules: [{required: true, message: 'Please input your Password!'}], rules: [{required: true, message: 'Please input your Password!'}],
})( })(
<Input name="password" style={{height: 32}} className={styles.input} <Input name="password" style={{height: 32}}
prefix={<Icon type="lock" style={{color: 'rgba(0,0,0,.25)'}}/>} type="password" prefix={<Icon type="lock" style={{color: 'rgba(0,0,0,.25)'}}/>} type="password"
placeholder="Password"/> placeholder="Password"/>
)} )}

@ -1,34 +0,0 @@
@nice-blue: #5B83AD;
@light-blue: @nice-blue + #111;
.header {
color: @nice-blue;
}
.main{
background-image: url('https://gw.alipayobjects.com/zos/rmsportal/TVYTbAXWheQpRcWDaDMu.svg');
background-repeat: no-repeat;
background-position: center 110px;
background-size: 100%;
.header {
color: @nice-blue;
}
}
.content{
padding-top: 128px;
}
.logo{
height: 44px;
margin: auto;
width: 100%;
}
input{
min-height: 0;
}

@ -1,13 +1,11 @@
import React from "react"; import React from "react";
import {Layout, Menu, Icon} from 'antd'; import {Layout, Menu, Icon} from 'antd';
const {Header, Content, Footer} = Layout; const {Header, Content, Footer} = Layout;
import {Link} from "react-router-dom";
import Logo from "../../../public/images/logo.svg";
import {Link, NavLink} from "react-router-dom";
import RouteWithSubRoutes from "../../components/RouteWithSubRoutes" import RouteWithSubRoutes from "../../components/RouteWithSubRoutes"
import {Switch, Redirect} from 'react-router' import {Switch} from 'react-router'
import "../../App.css"; import "../../App.css";
import config from "../../../public/conf/config.json";
class Dashboard extends React.Component { class Dashboard extends React.Component {
constructor(props) { constructor(props) {
@ -15,7 +13,8 @@ class Dashboard extends React.Component {
this.state = { this.state = {
routes: props.routes, routes: props.routes,
selectedKeys : [] selectedKeys : []
} };
this.Logo = config.theme.logo;
} }
changeSelectedMenuItem = (key) =>{ changeSelectedMenuItem = (key) =>{
@ -29,14 +28,14 @@ class Dashboard extends React.Component {
return ( return (
<div> <div>
<Layout className="layout"> <Layout className="layout">
<Header> <Header style={{paddingLeft: 0, paddingRight: 0}}>
<div className="logo"> <div className="logo-image">
<img src={Logo}/> <img alt="logo" src={this.Logo}/>
</div> </div>
<Menu <Menu
theme="light" theme="light"
mode="horizontal" mode="horizontal"
selectedKeys={selectedKeys} defaultSelectedKeys={selectedKeys}
style={{lineHeight: '64px'}} style={{lineHeight: '64px'}}
> >
<Menu.Item key="android"><Link to="/store/android"><Icon type="android" theme="filled"/>Android</Link></Menu.Item> <Menu.Item key="android"><Link to="/store/android"><Icon type="android" theme="filled"/>Android</Link></Menu.Item>

@ -1,5 +1,4 @@
import React from "react"; import React from "react";
import "antd/dist/antd.css";
import { import {
PageHeader, PageHeader,
Typography, Typography,

@ -1,5 +1,4 @@
import React from "react"; import React from "react";
import "antd/dist/antd.css";
import AppList from "../../../components/apps/AppList"; import AppList from "../../../components/apps/AppList";
class Apps extends React.Component { class Apps extends React.Component {

@ -18,11 +18,12 @@
var path = require('path'); var path = require('path');
const HtmlWebPackPlugin = require("html-webpack-plugin"); const HtmlWebPackPlugin = require("html-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin"); const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const configurations = require("./public/conf/config.json");
const config = { const config = {
devtool: "source-map", devtool: "source-map",
output: { output: {
publicPath: '/store/' // <---- this publicPath: '/store/'
}, },
watch: false, watch: false,
resolve: { resolve: {
@ -77,14 +78,16 @@ const config = {
}, },
{ {
loader: "css-loader", loader: "css-loader",
options: {
sourceMap: true,
modules: true,
localIdentName: "[local]___[hash:base64:5]"
}
}, },
{ {
loader: "less-loader" loader: "less-loader",
options: {
modifyVars: {
'primary-color': configurations.theme.primaryColor,
'link-color': configurations.theme.primaryColor,
},
javascriptEnabled: true,
},
} }
] ]
}, },

Loading…
Cancel
Save