Fixed application listing and form formatting.

4.x.x
Menaka Jayawardena 7 years ago
parent 0746c2f66c
commit 9ce111b724

@ -17,11 +17,18 @@
*/
import './App.css';
import PropTypes from 'prop-types';
import React, {Component} from 'react';
import createHistory from 'history/createHashHistory';
import {HashRouter as Router, Redirect, Route, Switch} from 'react-router-dom'
import {BaseLayout, ApplicationCreate, ApplicationListing, Login, NotFound, PublisherOverview, PlatformCreate} from './components'
import {
ApplicationCreate,
ApplicationListing,
BaseLayout,
Login,
NotFound,
PlatformCreate,
PlatformListing
} from './components';
const history = createHistory({basename: '/publisher'});
@ -51,9 +58,9 @@ class Base extends Component {
<BaseLayout>
<Switch>
<Redirect exact path={"/"} to={"/assets/apps"}/>
{/*<Route exact path={"/overview"} component={PublisherOverview}/>*/}
<Route exact path={"/assets/apps"} component={ApplicationListing}/>
<Route exact path={"/assets/apps/create"} component={ApplicationCreate}/>
<Route exact path={"/assets/platforms"} component={PlatformListing}/>
<Route exact path={"/assets/platforms/create"} component={PlatformCreate}/>
<Route exact path={"/assets/apps/:app"} />
<Route exact path={"/assets/apps/edit/:app"} />
@ -67,7 +74,6 @@ class Base extends Component {
</div>
)
}
return (<Redirect to={"/login"}/>)
}
}
@ -91,6 +97,4 @@ class Publisher extends Component {
}
}
Publisher.propTypes = {};
export default Publisher;

@ -39,43 +39,43 @@ class ApplicationListing extends Component {
}
}
// data = [
// {
// id: Math.random(),
// applicationName:"Cne",
// platform:'Android',
// category:"Public",
// status: "Created"
// },
// {
// id: Math.random(),
// applicationName:"Gone",
// platform:'IOS',
// category:"Public",
// status: "Created"
// },
// {
// id: Math.random(),
// applicationName:"Ane",
// platform:'Android',
// category:"Public",
// status: "Created"
// },
// {
// id: Math.random(),
// applicationName:"one",
// platform:'Android',
// category:"Public",
// status: "Created"
// },
// {
// id: Math.random(),
// applicationName:"one",
// platform:'Android',
// category:"Public",
// status: "Created"
// },
// ];
data = [
{
id: Math.random(),
applicationName:"Cne",
platform:'Android',
category:"Public",
status: "Created"
},
{
id: Math.random(),
applicationName:"Gone",
platform:'IOS',
category:"Public",
status: "Created"
},
{
id: Math.random(),
applicationName:"Ane",
platform:'Android',
category:"Public",
status: "Created"
},
{
id: Math.random(),
applicationName:"one",
platform:'Android',
category:"Public",
status: "Created"
},
{
id: Math.random(),
applicationName:"one",
platform:'Android',
category:"Public",
status: "Created"
},
];
headers = [
{
@ -156,7 +156,8 @@ class ApplicationListing extends Component {
</CardActions>
<DataTable headers={this.headers}
data={this.data}
handleRowClick={this._onRowClick.bind(this)}/>
handleRowClick={this._onRowClick.bind(this)}
noDataMessage={{type: 'button', text: 'Create Application'}}/>
</Card>
</div>);

@ -51,16 +51,16 @@ class Step1 extends Component {
/**
* Invokes the handleNext function in Create component.
* */
handleNext = () => {
_handleNext = () => {
this.props.handleNext();
};
/**
* Persist the current form data to the state.
* */
setStepData() {
_setStepData() {
this.props.setData("step1", {step: "Dfds"});
this.handleNext.bind(this);
this._handleNext.bind(this);
}
/**
@ -69,22 +69,22 @@ class Step1 extends Component {
* Sets the data to the state.
* Invokes the handleNext method of Create component.
* */
handleClick() {
this.setStepData();
this.handleNext();
_handleClick() {
this._setStepData();
this._handleNext();
}
/**
* Triggers when changing the Platform selection.
* */
onChangePlatform = (event, index, value) => {
_onChangePlatform = (event, index, value) => {
this.setState({platform: value});
};
/**
* Triggers when changing the Store selection.
* */
onChangeStore = (event, index, value) => {
_onChangeStore = (event, index, value) => {
this.setState({store: value});
};
@ -104,7 +104,7 @@ class Step1 extends Component {
floatingLabelText="Store Type*"
value={this.state.store}
floatingLabelFixed={true}
onChange={this.onChangeStore.bind(this)}
onChange={this._onChangeStore.bind(this)}
>
<MenuItem value={1} primaryText="Enterprise"/>
<MenuItem value={2} primaryText="Public"/>
@ -113,7 +113,7 @@ class Step1 extends Component {
floatingLabelText="Platform*"
value={this.state.platform}
floatingLabelFixed={true}
onChange={this.onChangePlatform.bind(this)}
onChange={this._onChangePlatform.bind(this)}
>
<MenuItem value={1} primaryText="Android"/>
<MenuItem value={2} primaryText="iOS"/>
@ -127,7 +127,7 @@ class Step1 extends Component {
<RaisedButton
label="Next >"
primary={true}
onClick={this.handleClick.bind(this)}
onClick={this._handleClick.bind(this)}
/>
</div>
</div>

@ -73,19 +73,19 @@ class Step2 extends Component {
* Clears the tags text field.
* Chip gets two parameters: Key and value.
* */
addTags(event) {
_addTags(event) {
let tags = this.state.tags;
if (event.charCode === 13) {
event.preventDefault();
tags.push({key: Math.floor(Math.random() * 1000), value: event.target.value});
this.setState({tags, defValue: ""}, console.log(this.state.tags));
this.setState({tags, defValue: ""});
}
}
/**
*
* Set the value for tag.
* */
handleTagChange(event) {
_handleTagChange(event) {
let defaultValue = this.state.defValue;
defaultValue = event.target.value;
this.setState({defValue: defaultValue})
@ -94,14 +94,14 @@ class Step2 extends Component {
/**
* Invokes the handleNext function in Create component.
* */
handleNext() {
_handleNext() {
this.props.handleNext();
}
/**
* Invokes the handlePrev function in Create component.
* */
handlePrev() {
_handlePrev() {
this.props.handlePrev();
}
@ -109,7 +109,7 @@ class Step2 extends Component {
* Handles Chip delete function.
* Removes the tag from state.tags
* */
handleRequestDelete = (key) => {
_handleRequestDelete = (key) => {
this.chipData = this.state.tags;
const chipToDelete = this.chipData.map((chip) => chip.key).indexOf(key);
this.chipData.splice(chipToDelete, 1);
@ -119,12 +119,11 @@ class Step2 extends Component {
/**
* Creates Chip array from state.tags.
* */
renderChip(data) {
console.log(data);
_renderChip(data) {
return (
<Chip
key={data.key}
onRequestDelete={() => this.handleRequestDelete(data.key)}
onRequestDelete={() => this._handleRequestDelete(data.key)}
style={this.styles.chip}
>
{data.value}
@ -172,11 +171,11 @@ class Step2 extends Component {
floatingLabelText="Tags*"
floatingLabelFixed={true}
value={this.state.defValue}
onChange={this.handleTagChange.bind(this)}
onKeyPress={this.addTags.bind(this)}
onChange={this._handleTagChange.bind(this)}
onKeyPress={this._addTags.bind(this)}
/><br/>
<div style={this.styles.wrapper}>
{this.state.tags.map(this.renderChip, this)}
{this.state.tags.map(this._renderChip, this)}
</div>
<br/>
<SelectField
@ -216,13 +215,13 @@ class Step2 extends Component {
<FlatButton
label="< Back"
disabled={false}
onClick={this.handlePrev.bind(this)}
onClick={this._handlePrev.bind(this)}
style={{marginRight: 12}}
/>
<RaisedButton
label="Next >"
primary={true}
onClick={this.handleNext.bind(this)}
onClick={this._handleNext.bind(this)}
/>
</div>
</div>

@ -61,21 +61,21 @@ class Step3 extends Component {
* Handles finish button click.
* This invokes handleNext function in parent component.
* */
handleFinish() {
_handleFinish() {
this.props.handleFinish();
}
/**
* Invokes Prev button click.
* */
handlePrev() {
_handlePrev() {
this.props.handlePrev();
}
/**
* Handles release application selection.
* */
handleToggle() {
_handleToggle() {
let hide = this.state.showForm;
this.setState({showForm: !hide});
}
@ -88,7 +88,7 @@ class Step3 extends Component {
<Toggle
label="Release the Application"
labelPosition="right"
onToggle={this.handleToggle.bind(this)}
onToggle={this._handleToggle.bind(this)}
defaultToggled={this.state.showForm}
/>
{/*If toggle is true, the release form will be shown.*/}
@ -114,13 +114,13 @@ class Step3 extends Component {
<FlatButton
label="< Back"
disabled={false}
onClick={this.handlePrev.bind(this)}
onClick={this._handlePrev.bind(this)}
style={{marginRight: 12}}
/>
<RaisedButton
label="Finish"
primary={true}
onClick={this.handleFinish.bind(this)}
onClick={this._handleFinish.bind(this)}
/>
</div>
</div>

Loading…
Cancel
Save