Skip to content

hfpp2012 / react-spd

Go to a project
Commit f4edc185 by hfpp2012 yinsigan
Options

fix es6

1 parent 813d5d22
Inline Side-by-side
Showing 4 changed files with 74 additions and 26 deletions
src/components/Header.js
......@@ -2,7 +2,7 @@ import React from 'react'
import ModalRepoForm from './ModalRepoForm'
import ReactAddonsUpdate from 'react-addons-update'
import Loader from 'halogen/PulseLoader'
import { Link } from 'react-router'
import { Link } from 'react-router-dom'
export default class Header extends React.Component {
constructor(props){
......@@ -15,7 +15,8 @@ export default class Header extends React.Component {
componentDidMount() {
this.props.promise.then(
value => this.setState({loading: false, data: value}),
error => this.setState({loading: false, error: error}))
error => this.setState({loading: false, error: error})
)
}
addRepo(repo) {
......@@ -24,30 +25,28 @@ export default class Header extends React.Component {
}
render() {
let result = null;
if (this.state.loading) {
result = <Loader color="#286090" size="12px" margin="4px"/>;
}
else if (this.state.error !== null) {
result = <span>Error: {this.state.error.message}</span>;
}
else {
let data = this.state.data.map((repo) => {
let url = `/regional_design/${repo.id}?object=repo`
return (
<Link key={ repo.id } className='btn btn-default mr15' to={ url }>{ repo.name }</Link>
)
})
result = data;
}
return (
<div className="text-left top-header">
<ModalRepoForm handleNewRepo={ this.addRepo } />
<div className='col-md-10'>
{function(){
if (this.state.loading) {
return (
<Loader color="#286090" size="12px" margin="4px"/>
)
}
else if (this.state.error !== null) {
return <span>Error: {this.state.error.message}</span>
}
else {
const data = this.state.data.map(function(repo) {
const url = `/regional_design/${repo.id}?object=repo`
return (
<Link key={ repo.id } activeClassName='btn-primary' className='btn btn-default mr15' to={ url }>{ repo.name }</Link>
)
})
return data
}
}.call(this)}
{ result }
</div>
<div className="clearfix"></div>
</div>
......
src/index.html
......@@ -3,6 +3,55 @@
<head>
<meta charset="utf-8">
<title>React App Setup</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<style>
.meta-element {
border: 1px solid #eee;
padding: 10px;
margin-bottom: 10px;
width: 100px;
}
.input-meta-element {
border: 1px solid #eee;
margin-bottom: 10px;
width: 100px;
}
.dropzone {
border: 1px solid #999;
min-height: 600px;
position: relative;
border-top: none;
border-bottom: none;
padding: 10px;
}
.top-header {
padding: 20px;
border: 1px solid #999;
}
.sidebar {
padding-left: 25px;
}
#app {
border-bottom: 1px solid #999;
}
.sidebar-header {
margin-left: 55px;
}
.alert {
padding: 0;
}
.mr15 {
margin-right: 15px;
}
</style>
</head>
<body>
<div id="root">
......
src/index.js
......@@ -2,7 +2,7 @@ import React from 'react'
import ReactDOM from 'react-dom'
import Spd from './containers/Spd'
import {
BrowserRouter as Router,
HashRouter as Router,
Route,
Link
} from 'react-router-dom'
......@@ -11,9 +11,9 @@ import RegionalDesign from './components/RegionalDesign'
ReactDOM.render(
<Router handler={Spd} history={Router}>
<Route path="/" component={Spd}>
<Spd>
<Route path="/regional_design/:id" component={RegionalDesign} />
</Route>
</Spd>
</Router>,
document.getElementById('root')
);
webpack.config.js
......@@ -36,7 +36,7 @@ module.exports = {
inline: true,
port: 3000,
proxy: {
"/regional_design/repos": {
"/regional_design": {
target: "http://localhost:3001",
}
}
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!