forked from community/device-mgt-core
Merge pull request #1022 from menakaj/application-mgt
Publisher UI improvements.feature/appm-store/pbac
commit
9eb25444a7
File diff suppressed because it is too large
Load Diff
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
After Width: | Height: | Size: 35 KiB |
@ -1,48 +0,0 @@
|
|||||||
/*
|
|
||||||
* Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
|
||||||
*
|
|
||||||
* WSO2 Inc. licenses this file to you under the Apache License,
|
|
||||||
* Version 2.0 (the "License"); you may not use this file except
|
|
||||||
* in compliance with the License.
|
|
||||||
* You may obtain a copy of the License at
|
|
||||||
*
|
|
||||||
* http://www.apache.org/licenses/LICENSE-2.0
|
|
||||||
*
|
|
||||||
* Unless required by applicable law or agreed to in writing,
|
|
||||||
* software distributed under the License is distributed on an
|
|
||||||
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
|
||||||
* KIND, either express or implied. See the License for the
|
|
||||||
* specific language governing permissions and limitations
|
|
||||||
* under the License.
|
|
||||||
*/
|
|
||||||
|
|
||||||
.chip {
|
|
||||||
display: inline-block;
|
|
||||||
padding: 0 25px;
|
|
||||||
height: 50px;
|
|
||||||
font-size: 16px;
|
|
||||||
line-height: 50px;
|
|
||||||
border-radius: 25px;
|
|
||||||
background-color: #f1f1f1;
|
|
||||||
}
|
|
||||||
|
|
||||||
.chip img {
|
|
||||||
float: left;
|
|
||||||
margin: 0 10px 0 -25px;
|
|
||||||
height: 50px;
|
|
||||||
width: 50px;
|
|
||||||
border-radius: 50%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.close-btn {
|
|
||||||
padding-left: 10px;
|
|
||||||
color: #888;
|
|
||||||
font-weight: bold;
|
|
||||||
float: right;
|
|
||||||
font-size: 20px;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.close-btn:hover {
|
|
||||||
color: #000;
|
|
||||||
}
|
|
@ -0,0 +1,123 @@
|
|||||||
|
/*
|
||||||
|
* Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||||
|
*
|
||||||
|
* WSO2 Inc. licenses this file to you under the Apache License,
|
||||||
|
* Version 2.0 (the "License"); you may not use this file except
|
||||||
|
* in compliance with the License.
|
||||||
|
* You may obtain a copy of the License at
|
||||||
|
*
|
||||||
|
* http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
*
|
||||||
|
* Unless required by applicable law or agreed to in writing,
|
||||||
|
* software distributed under the License is distributed on an
|
||||||
|
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||||
|
* KIND, either express or implied. See the License for the
|
||||||
|
* specific language governing permissions and limitations
|
||||||
|
* under the License.
|
||||||
|
*/
|
||||||
|
|
||||||
|
import React, {Component} from 'react';
|
||||||
|
import {Button, Col, Collapse, Row} from "reactstrap";
|
||||||
|
import {FormattedMessage} from "react-intl";
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Platform component.
|
||||||
|
* In Platform listing, this component will be displayed as cards.
|
||||||
|
* */
|
||||||
|
class Platform extends Component {
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
super();
|
||||||
|
this.unFold = this.unFold.bind(this);
|
||||||
|
this.state = {
|
||||||
|
isOpen: false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
unFold() {
|
||||||
|
let isOpen = this.state.isOpen;
|
||||||
|
this.setState({isOpen: !isOpen})
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const {platform} = this.props;
|
||||||
|
return (
|
||||||
|
<div className="platform-content">
|
||||||
|
<Row>
|
||||||
|
<Col>
|
||||||
|
<div className="platform-text-container">
|
||||||
|
<p className="app-view-field">{platform.name}</p>
|
||||||
|
<p className="app-view-text">{platform.enabled ? "Active" : "Disabled"}</p>
|
||||||
|
</div>
|
||||||
|
</Col>
|
||||||
|
<Col>
|
||||||
|
<div className="platform-icon-container">
|
||||||
|
<p className="platform-icon-letter">{platform.name.charAt(0)}</p>
|
||||||
|
</div>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
<Row>
|
||||||
|
<div className="platform-content-footer">
|
||||||
|
<Button className="custom-flat grey">{platform.enabled ?
|
||||||
|
<FormattedMessage id="Disable" defaultMessage="Disable"/> :
|
||||||
|
<FormattedMessage id="Activate" defaultMessage="Activate"/>}
|
||||||
|
</Button>
|
||||||
|
<Button className="custom-flat grey">
|
||||||
|
<FormattedMessage id="Share.With.Tenants" defaultMessage="Share.With.Tenants"/>
|
||||||
|
</Button>
|
||||||
|
<Button className="custom-flat grey circle-button" onClick={this.unFold}>
|
||||||
|
{this.state.isOpen ? <i className="fw fw-up"></i> : <i className="fw fw-down"></i>}
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</Row>
|
||||||
|
<div className="platform-content-more-outer">
|
||||||
|
<Row>
|
||||||
|
<Col>
|
||||||
|
<Collapse isOpen={this.state.isOpen}>
|
||||||
|
<div className="platform-content-more">
|
||||||
|
<Row>
|
||||||
|
<Col>
|
||||||
|
<p className="app-view-field">
|
||||||
|
<FormattedMessage id="Description" defaultMessage="Description"/>
|
||||||
|
</p>
|
||||||
|
</Col>
|
||||||
|
<Col><p className="app-view-text">{platform.description}</p></Col>
|
||||||
|
</Row>
|
||||||
|
<Row>
|
||||||
|
<Col>
|
||||||
|
<p className="app-view-field">
|
||||||
|
<FormattedMessage id="File.Based" defaultMessage="File.Based"/>
|
||||||
|
</p>
|
||||||
|
</Col>
|
||||||
|
<Col>
|
||||||
|
<p className="app-view-text">{platform.fileBased ?
|
||||||
|
<FormattedMessage id="Yes" defaultMessage="Yes"/>
|
||||||
|
: <FormattedMessage id="No" defaultMessage="No"/>}</p>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
<Row>
|
||||||
|
<Col><p className="app-view-field">
|
||||||
|
<FormattedMessage id="Tags" defaultMessage="Tags"/>
|
||||||
|
</p></Col>
|
||||||
|
<Col>
|
||||||
|
<p className="app-view-text">
|
||||||
|
{platform.tags.length > 0 ?
|
||||||
|
platform.tags :
|
||||||
|
<FormattedMessage
|
||||||
|
id="No.Platform.Tags"
|
||||||
|
defaultMessage="No.Platform.Tags"/>
|
||||||
|
}
|
||||||
|
</p>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</div>
|
||||||
|
</Collapse>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Platform;
|
1
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/themes/default/appImage.css → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/AppImage/appImage.css
1
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/themes/default/appImage.css → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/AppImage/appImage.css
@ -0,0 +1,70 @@
|
|||||||
|
/*
|
||||||
|
* Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||||
|
*
|
||||||
|
* WSO2 Inc. licenses this file to you under the Apache License,
|
||||||
|
* Version 2.0 (the "License"); you may not use this file except
|
||||||
|
* in compliance with the License.
|
||||||
|
* You may obtain a copy of the License at
|
||||||
|
*
|
||||||
|
* http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
*
|
||||||
|
* Unless required by applicable law or agreed to in writing,
|
||||||
|
* software distributed under the License is distributed on an
|
||||||
|
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||||
|
* KIND, either express or implied. See the License for the
|
||||||
|
* specific language governing permissions and limitations
|
||||||
|
* under the License.
|
||||||
|
*/
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Chip component with the material design specs.
|
||||||
|
* Chip with a close button.
|
||||||
|
* (-12px-{text (Roboto-Regular 13px)}-4px-{close button}-4px-)
|
||||||
|
*/
|
||||||
|
.chip {
|
||||||
|
margin-right: 5px;
|
||||||
|
height: 32px;
|
||||||
|
background-color: #f1f1f1;
|
||||||
|
border-radius: 16px;
|
||||||
|
border: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.chip-content {
|
||||||
|
display: flex;
|
||||||
|
margin: 4px 4px 4px 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.chip-text {
|
||||||
|
height: 24px;
|
||||||
|
font-family: "Roboto-Regular";
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 400;
|
||||||
|
color: rgba(0, 0, 0, 0.87);
|
||||||
|
line-height: 20px;
|
||||||
|
padding-top: 4px;
|
||||||
|
margin-right: 4px;
|
||||||
|
user-select: none;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.chip-close-btn {
|
||||||
|
align-content: center;
|
||||||
|
padding-left: 4px;
|
||||||
|
padding-top: 1px;
|
||||||
|
display: inline-block;
|
||||||
|
height: 24px;
|
||||||
|
width: 24px;
|
||||||
|
user-select: none;
|
||||||
|
transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.chip-close-btn i {
|
||||||
|
color: #a9a9a9;
|
||||||
|
color: rgba(0, 0, 0, 0.258824);
|
||||||
|
fill: rgba(0, 0, 0, 0.258824);
|
||||||
|
}
|
||||||
|
|
||||||
|
.chip-close-btn i:hover {
|
||||||
|
color: #959595;
|
||||||
|
}
|
@ -0,0 +1,80 @@
|
|||||||
|
/*
|
||||||
|
* Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||||
|
*
|
||||||
|
* WSO2 Inc. licenses this file to you under the Apache License,
|
||||||
|
* Version 2.0 (the "License"); you may not use this file except
|
||||||
|
* in compliance with the License.
|
||||||
|
* You may obtain a copy of the License at
|
||||||
|
*
|
||||||
|
* http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
*
|
||||||
|
* Unless required by applicable law or agreed to in writing,
|
||||||
|
* software distributed under the License is distributed on an
|
||||||
|
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||||
|
* KIND, either express or implied. See the License for the
|
||||||
|
* specific language governing permissions and limitations
|
||||||
|
* under the License.
|
||||||
|
*/
|
||||||
|
|
||||||
|
import Theme from '../../../theme';
|
||||||
|
import PropTypes from 'prop-types';
|
||||||
|
import React, {Component} from 'react';
|
||||||
|
import FlatButton from 'material-ui/FlatButton';
|
||||||
|
import {TableHeaderColumn} from 'material-ui/Table';
|
||||||
|
import {Col, Row} from "reactstrap";
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Data Table header component.
|
||||||
|
* This component creates the header elements of the table.
|
||||||
|
* */
|
||||||
|
class HeaderCell extends Component {
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
super();
|
||||||
|
this.tableHeaderClick = this.tableHeaderClick.bind(this);
|
||||||
|
this.scriptId = "data-table";
|
||||||
|
}
|
||||||
|
|
||||||
|
componentWillMount() {
|
||||||
|
/**
|
||||||
|
*Loading the theme files based on the the user-preference.
|
||||||
|
*/
|
||||||
|
Theme.insertThemingScripts(this.scriptId);
|
||||||
|
}
|
||||||
|
|
||||||
|
componentWillUnmount() {
|
||||||
|
Theme.removeThemingScripts(this.scriptId);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* The onClick function of the table header.
|
||||||
|
* Invokes the function passed in the header object.
|
||||||
|
* */
|
||||||
|
tableHeaderClick() {
|
||||||
|
this.props.header.sort();
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
/*margin-top: 30px
|
||||||
|
* margin-bottom: 10px
|
||||||
|
* */
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Row className="data-table-header">
|
||||||
|
{this.props.headers.map(header => {
|
||||||
|
|
||||||
|
let headerStyle = header.size;
|
||||||
|
|
||||||
|
return <Col className={headerStyle}>{header.label}</Col>
|
||||||
|
})}
|
||||||
|
</Row>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
DataTableHeader.prototypes = {
|
||||||
|
headers: PropTypes.array
|
||||||
|
};
|
||||||
|
|
||||||
|
export default HeaderCell;
|
36
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/themes/default/floatingButton.css → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/FloatingButton/floatingButton.css
36
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/themes/default/floatingButton.css → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/FloatingButton/floatingButton.css
0
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/themes/default/imageUploader.css → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/ImageUploader/imageUploader.css
0
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/themes/default/imageUploader.css → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/ImageUploader/imageUploader.css
@ -0,0 +1,59 @@
|
|||||||
|
/*
|
||||||
|
* Copyright (c) 2017, WSO2 Inc. (http://www.wso2.org) All Rights Reserved.
|
||||||
|
*
|
||||||
|
* WSO2 Inc. licenses this file to you under the Apache License,
|
||||||
|
* Version 2.0 (the "License"); you may not use this file except
|
||||||
|
* in compliance with the License.
|
||||||
|
* You may obtain a copy of the License at
|
||||||
|
*
|
||||||
|
* http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
*
|
||||||
|
* Unless required by applicable law or agreed to in writing,
|
||||||
|
* software distributed under the License is distributed on an
|
||||||
|
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
|
||||||
|
* KIND, either express or implied. See the License for the
|
||||||
|
* specific language governing permissions and limitations
|
||||||
|
* under the License.
|
||||||
|
*/
|
||||||
|
|
||||||
|
import PropTypes from 'prop-types';
|
||||||
|
import React, {Component} from 'react';
|
||||||
|
import Axios from 'axios';
|
||||||
|
|
||||||
|
const imageLocation = "/images/";
|
||||||
|
|
||||||
|
class Logo extends Component {
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
super();
|
||||||
|
this.state = {
|
||||||
|
image: ""
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
componentWillMount() {
|
||||||
|
let url = imageLocation + this.props.image_name;
|
||||||
|
Axios.get(url, {responseType: 'arraybuffer'}).then(
|
||||||
|
response => {
|
||||||
|
let image = "data:image/jpeg;base64," + new Buffer(response.data, 'binary').toString('base64');
|
||||||
|
this.setState({image: image});
|
||||||
|
}
|
||||||
|
).catch(err => {
|
||||||
|
console.log(err);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<img className={this.props.className} src={this.state.image} />
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
Logo.prototypes = {
|
||||||
|
className: PropTypes.string,
|
||||||
|
image_name: PropTypes.string
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Logo;
|
0
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/themes/default/notification.css → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/Notifications/notification.css
0
components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/public/themes/default/notification.css → components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/Notifications/notification.css
Loading…
Reference in new issue