Commit e8fb82bd authored by 2breakegg's avatar 2breakegg
parents e99aece6 770b9761
...@@ -3,7 +3,6 @@ ...@@ -3,7 +3,6 @@
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
<title>Dva Demo</title>
<link rel="stylesheet" href="index.css" /> <link rel="stylesheet" href="index.css" />
</head> </head>
<body> <body>
......
import React from 'react';
import styles from './Haha.css';
function Haha() {
return (
<div className={styles.normal}>
Component: Haha
</div>
);
}
export default Haha;
...@@ -16,11 +16,13 @@ import Reset from './routes/Reset.js'; ...@@ -16,11 +16,13 @@ import Reset from './routes/Reset.js';
import Verify from "./routes/Verify.js"; import Verify from "./routes/Verify.js";
import Index from "./routes/Index.js";
function RouterConfig({ history }) { function RouterConfig({ history }) {
return ( return (
<Router history={history}> <Router history={history}>
<Redirect from="/" to="/signin"/> <Redirect from="/" to="/signin"/>
<Route path="/"> <Route path="/" component={Index} >
<Route path="/signin" component={Login}/> <Route path="/signin" component={Login}/>
<Route path="/forgot" component={Forgot}/> <Route path="/forgot" component={Forgot}/>
<Route path="/signup" component={Register}/> <Route path="/signup" component={Register}/>
......
...@@ -55,16 +55,20 @@ class Login extends React.Component { ...@@ -55,16 +55,20 @@ class Login extends React.Component {
<Step title={messages['verify-email']} icon={<Icon type="mail" />} /> <Step title={messages['verify-email']} icon={<Icon type="mail" />} />
</Steps> </Steps>
<FormItem style={{ marginTop: '28px'}}> <FormItem style={{ marginTop: '28px' }}>
{getFieldDecorator('email', { {getFieldDecorator('email', {
rules: [{ required: true, message: 'Please input your username or email!' }], rules: [{ required: true, message: 'Please input your username or email!' }],
})( })(
<Input prefix={<Icon type="user" style={{ fontSize: 13 }}/>} placeholder={messages['email-address-or-username']} />, <Input prefix={<Icon type="user" style={{ fontSize: 13 }} />} placeholder={messages['email-address-or-username']} />,
)} )}
</FormItem> </FormItem>
<Button type="primary" htmlType="submit" className="login-form-button">
<Format id={'send-email'} /> <FormItem>
</Button> <Button type="primary" htmlType="submit" className="login-form-button">
<Format id={'send-email'} />
</Button>
</FormItem>
<div> <div>
<Link to="/signin"><Format id={'sign-in'} /></Link> <Link to="/signin"><Format id={'sign-in'} /></Link>
</div> </div>
......
import React from 'react';
import { connect } from 'dva';
import styles from './Index.less';
import Particles from 'react-particles-js'
import DocumentTitle from 'react-document-title'
function Index({ children, messages }) {
return (
<div style={{ height: "100%" }}>
<DocumentTitle title={messages['title'] || 'Moe Cube'}>
<Particles
params={{
'particles': {
'number': {
'value': 20,
'density': {
'enable': true,
'value_area': 1000
}
},
'color': {
'value': '#888',
'opacity': 0.4
},
'shape': {
'type': 'circle',
'stroke': {
'width': 4,
'color': '#888',
'opacity': 0.4
},
'polygon': {
'nb_sides': 5
},
'image': {
'src': 'img/github.svg',
'width': 100,
'height': 100
}
},
'opacity': {
'value': 0.5,
'random': false,
'anim': {
'enable': false,
'speed': 1,
'opacity_min': 0.1,
'sync': false
}
},
'size': {
'value': 3,
'random': true,
'anim': {
'enable': false,
'speed': 1,
'size_min': 0.1,
'sync': false
}
},
'line_linked': {
'enable': true,
'distance': 150,
'color': '#888',
'opacity': 0.4,
'width': 1
},
'move': {
'enable': true,
'speed': 1,
'direction': 'none',
'random': false,
'straight': false,
'out_mode': 'out',
'bounce': false,
'attract': {
'enable': false,
'rotateX': 600,
'rotateY': 1200
}
}
},
'interactivity': {
'detect_on': 'canvas',
'events': {
'onhover': {
'enable': true,
'mode': 'grab',
'nb': 2
},
'onclick': {
'enable': true,
'mode': 'push'
},
'resize': true
},
'modes': {
'grab': {
'distance': 400,
'line_linked': {
'opacity': 0.4
}
},
'bubble': {
'distance': 400,
'size': 20,
'duration': 2,
'opacity': 8,
'speed': 1
},
'repulse': {
'distance': 200,
'duration': 0.4
},
'push': {
'particles_nb': 4
},
'remove': {
'particles_nb': 2
}
}
},
'retina_detect': true
}}
style={{
position: "fixed"
}}
/>
</DocumentTitle>
{children}
</div>
);
}
function mapStateToProps(state) {
const {
common: {messages}
} = state
return {
messages
};
}
export default connect(mapStateToProps)(Index);
.particles {
position: fixed;
top: 0;
left: 0;
z-index: 1;
width: 100%;
height: 100%;
}
\ No newline at end of file
.normal {
font-family: Georgia, sans-serif;
margin-top: 3em;
text-align: center;
}
.title {
font-size: 2.5rem;
font-weight: normal;
letter-spacing: -1px;
}
.welcome {
height: 328px;
background: url(../assets/yay.jpg) no-repeat center 0;
background-size: 388px 328px;
}
.list {
font-size: 1.2em;
margin-top: 1.8em;
list-style: none;
line-height: 1.5em;
}
.list code {
background: #f7f7f7;
}
import { connect } from 'dva';
import React from 'react';
import styles from './IndexPage.css';
function IndexPage() {
return (
<div className={styles.normal}>
<h1 className={styles.title}>Yay! Welcome to dva!</h1>
<div className={styles.welcome}/>
<ul className={styles.list}>
<li>To get started, edit <code>src/index.js</code> and save to reload.</li>
<li><a href="https://github.com/dvajs/dva-docs/blob/master/v1/en-us/getting-started.md">Getting Started</a></li>
</ul>
</div>
);
}
IndexPage.propTypes = {};
export default connect()(IndexPage);
...@@ -3,6 +3,7 @@ import { connect } from 'dva'; ...@@ -3,6 +3,7 @@ import { connect } from 'dva';
import { Link } from 'dva/router'; import { Link } from 'dva/router';
import React, { PropTypes } from 'react'; import React, { PropTypes } from 'react';
import { FormattedMessage as Format } from 'react-intl'; import { FormattedMessage as Format } from 'react-intl';
import logo from '../assets/MoeCube.png'
import './Login.less'; import './Login.less';
const FormItem = Form.Item; const FormItem = Form.Item;
...@@ -37,6 +38,9 @@ class Login extends React.Component { ...@@ -37,6 +38,9 @@ class Login extends React.Component {
return ( return (
<div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '100%' }}> <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', height: '100%' }}>
<Spin spinning={loading} delay={100}> <Spin spinning={loading} delay={100}>
<FormItem style={{display: 'flex', justifyContent:'center'}}>
<img src={logo} style={{height:'20vw', width: '20vw'}}/>
</FormItem>
<Form onSubmit={this.onSubmitLogin} className="login-form"> <Form onSubmit={this.onSubmitLogin} className="login-form">
<FormItem> <FormItem>
{getFieldDecorator('account', { {getFieldDecorator('account', {
...@@ -58,6 +62,7 @@ class Login extends React.Component { ...@@ -58,6 +62,7 @@ class Login extends React.Component {
<Format id={'sign-in'} /> <Format id={'sign-in'} />
</Button> </Button>
</FormItem> </FormItem>
<div> <div>
<Link to="/signup"><Format id={'sign-up'} /></Link> <Link to="/signup"><Format id={'sign-up'} /></Link>
<Link to="/forgot" className="login-form-forgot"><Format id={'forgot-password'} /></Link> <Link to="/forgot" className="login-form-forgot"><Format id={'forgot-password'} /></Link>
......
...@@ -104,7 +104,7 @@ class Profiles extends React.Component { ...@@ -104,7 +104,7 @@ class Profiles extends React.Component {
return ( return (
<Spin spinning={loading} delay={100}> <Spin spinning={loading} delay={100}>
<Tabs defaultActiveKey="1" className="app-detail-nav"> <Tabs defaultActiveKey="1" className="app-detail-nav">
<TabPane tab={<span><Icon type="setting" /><Format id={'user-info'} /> </span>} key="1"> <TabPane tab={<span><Icon type="user" /><Format id={'user-info'} /> </span>} key="1">
<Form onSubmit={this.onUpdateSubmit}> <Form onSubmit={this.onUpdateSubmit}>
<FormItem style={{ display: 'flex', justifyContent: 'center' }}> <FormItem style={{ display: 'flex', justifyContent: 'center' }}>
......
...@@ -85,7 +85,7 @@ class Register extends React.Component { ...@@ -85,7 +85,7 @@ class Register extends React.Component {
<Step title={messages['verify-email']} icon={<Icon type="mail" />} /> <Step title={messages['verify-email']} icon={<Icon type="mail" />} />
</Steps> </Steps>
<Form onSubmit={this.onSubmitLogin} className="login-form" style={{ marginTop: '24px'}}> <Form onSubmit={this.onSubmitLogin} className="login-form" style={{ marginTop: '24px' }}>
<FormItem {...emailProps} > <FormItem {...emailProps} >
{getFieldDecorator('email', { {getFieldDecorator('email', {
rules: [{ rules: [{
...@@ -106,7 +106,7 @@ class Register extends React.Component { ...@@ -106,7 +106,7 @@ class Register extends React.Component {
pattern: /^[A-Za-z0-9_\u4E00-\u9FD5\u3400-\u4DBF\u{20000}-\u{2A6DF}\u{2A700}-\u{2CEAF}\uF900–\uFAFF\u{2F800}-\u{2FA1D}\uAC00–\uD7AF\u3040-\u30FF\u31F0–\u31FF\u{1B000}–\u{1B0FF}\u3005]+$/u, pattern: /^[A-Za-z0-9_\u4E00-\u9FD5\u3400-\u4DBF\u{20000}-\u{2A6DF}\u{2A700}-\u{2CEAF}\uF900–\uFAFF\u{2F800}-\u{2FA1D}\uAC00–\uD7AF\u3040-\u30FF\u31F0–\u31FF\u{1B000}–\u{1B0FF}\u3005]+$/u,
}], }],
}, {})( }, {})(
<Input {...usernameInputProps}/>, <Input {...usernameInputProps} />,
)} )}
</FormItem> </FormItem>
...@@ -114,12 +114,12 @@ class Register extends React.Component { ...@@ -114,12 +114,12 @@ class Register extends React.Component {
{getFieldDecorator('password', { {getFieldDecorator('password', {
rules: [{ required: true, message: messages['Password-length-must-be-between-8-and-24-characters.'], pattern: /^.{8,24}$/ }], rules: [{ required: true, message: messages['Password-length-must-be-between-8-and-24-characters.'], pattern: /^.{8,24}$/ }],
}, { }, {
validator: this.checkConfirm, validator: this.checkConfirm,
})( })(
<Input <Input
prefix={<Icon type="lock" style={{ fontSize: 13 }}/>} prefix={<Icon type="lock" style={{ fontSize: 13 }} />}
type="password" type="password"
placeholder={messages.password}/>, placeholder={messages.password} />,
)} )}
</FormItem> </FormItem>
...@@ -132,16 +132,19 @@ class Register extends React.Component { ...@@ -132,16 +132,19 @@ class Register extends React.Component {
}], }],
})( })(
<Input <Input
prefix={<Icon type="lock" style={{ fontSize: 13 }}/>} prefix={<Icon type="lock" style={{ fontSize: 13 }} />}
type="password" type="password"
onBlur={this.handleConfirmBlur} onBlur={this.handleConfirmBlur}
placeholder={messages['password-again']}/>, placeholder={messages['password-again']} />,
)} )}
</FormItem> </FormItem>
<Button type="primary" htmlType="submit" className="login-form-button"> <FormItem>
<Format id={'sign-up'} /> <Button type="primary" htmlType="submit" className="login-form-button">
</Button> <Format id={'sign-up'} />
</Button>
</FormItem>
<div> <div>
<Link to="/signin"><Format id={'sign-in'} /></Link> <Link to="/signin"><Format id={'sign-in'} /></Link>
</div> </div>
......
import request from '../utils/request';
export async function query() {
return request('/api/users');
}
...@@ -2,6 +2,20 @@ ...@@ -2,6 +2,20 @@
# yarn lockfile v1 # yarn lockfile v1
"@types/node@^7.0.8":
version "7.0.12"
resolved "https://registry.yarnpkg.com/@types/node/-/node-7.0.12.tgz#ae5f67a19c15f752148004db07cbbb372e69efc9"
"@types/react-dom@^0.14.23":
version "0.14.23"
resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-0.14.23.tgz#cecfcfad754b4c2765fe5d29b81b301889ad6c2e"
dependencies:
"@types/react" "*"
"@types/react@*", "@types/react@^15.0.16":
version "15.0.21"
resolved "https://registry.yarnpkg.com/@types/react/-/react-15.0.21.tgz#29d849427237c1463abfb7b370755ee3e5b5b375"
abbrev@1, abbrev@1.0.x: abbrev@1, abbrev@1.0.x:
version "1.0.9" version "1.0.9"
resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.0.9.tgz#91b4792588a7738c25f35dd6f63752a2f8776135" resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.0.9.tgz#91b4792588a7738c25f35dd6f63752a2f8776135"
...@@ -2073,6 +2087,10 @@ eventsource@^0.1.3: ...@@ -2073,6 +2087,10 @@ eventsource@^0.1.3:
dependencies: dependencies:
original ">=0.0.5" original ">=0.0.5"
exenv@^1.2.1:
version "1.2.1"
resolved "https://registry.yarnpkg.com/exenv/-/exenv-1.2.1.tgz#75de1c8dee02e952b102aa17f8875973e0df14f9"
exit-hook@^1.0.0: exit-hook@^1.0.0:
version "1.1.1" version "1.1.1"
resolved "https://registry.yarnpkg.com/exit-hook/-/exit-hook-1.1.1.tgz#f05ca233b48c05d54fff07765df8507e95c02ff8" resolved "https://registry.yarnpkg.com/exit-hook/-/exit-hook-1.1.1.tgz#f05ca233b48c05d54fff07765df8507e95c02ff8"
...@@ -4504,6 +4522,12 @@ react-dev-utils@^0.4.2: ...@@ -4504,6 +4522,12 @@ react-dev-utils@^0.4.2:
sockjs-client "1.0.3" sockjs-client "1.0.3"
strip-ansi "3.0.1" strip-ansi "3.0.1"
react-document-title@^2.0.2:
version "2.0.2"
resolved "https://registry.yarnpkg.com/react-document-title/-/react-document-title-2.0.2.tgz#1e42b672d300f8f90d8d05544b0d71f0ca7860aa"
dependencies:
react-side-effect "^1.0.2"
react-dom@^0.14.0: react-dom@^0.14.0:
version "0.14.8" version "0.14.8"
resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-0.14.8.tgz#0f1c547514263f771bd31814a739e5306575069e" resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-0.14.8.tgz#0f1c547514263f771bd31814a739e5306575069e"
...@@ -4543,6 +4567,15 @@ react-lazy-load@^3.0.10: ...@@ -4543,6 +4567,15 @@ react-lazy-load@^3.0.10:
lodash.debounce "^4.0.0" lodash.debounce "^4.0.0"
lodash.throttle "^4.0.0" lodash.throttle "^4.0.0"
react-particles-js@^1.5.0:
version "1.5.0"
resolved "https://registry.yarnpkg.com/react-particles-js/-/react-particles-js-1.5.0.tgz#d30313c52941282b8f8f58eaf909056bcf57a2ba"
dependencies:
"@types/node" "^7.0.8"
"@types/react" "^15.0.16"
"@types/react-dom" "^0.14.23"
react "^15.4.1"
react-redux@4.4.x: react-redux@4.4.x:
version "4.4.6" version "4.4.6"
resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-4.4.6.tgz#4b9d32985307a11096a2dd61561980044fcc6209" resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-4.4.6.tgz#4b9d32985307a11096a2dd61561980044fcc6209"
...@@ -4574,6 +4607,13 @@ react-router@^2.8.1: ...@@ -4574,6 +4607,13 @@ react-router@^2.8.1:
loose-envify "^1.2.0" loose-envify "^1.2.0"
warning "^3.0.0" warning "^3.0.0"
react-side-effect@^1.0.2:
version "1.1.0"
resolved "https://registry.yarnpkg.com/react-side-effect/-/react-side-effect-1.1.0.tgz#57209f7ebc940d55e0fda82fe51422654175d609"
dependencies:
exenv "^1.2.1"
shallowequal "^0.2.2"
react-slick@~0.14.2: react-slick@~0.14.2:
version "0.14.7" version "0.14.7"
resolved "https://registry.yarnpkg.com/react-slick/-/react-slick-0.14.7.tgz#5035f8b070f26fd18be1f6d3adc7dd2ab4b0bc2f" resolved "https://registry.yarnpkg.com/react-slick/-/react-slick-0.14.7.tgz#5035f8b070f26fd18be1f6d3adc7dd2ab4b0bc2f"
...@@ -4591,7 +4631,7 @@ react@^0.14.0: ...@@ -4591,7 +4631,7 @@ react@^0.14.0:
envify "^3.0.0" envify "^3.0.0"
fbjs "^0.6.1" fbjs "^0.6.1"
react@^15.4.0: react@^15.4.0, react@^15.4.1:
version "15.4.2" version "15.4.2"
resolved "https://registry.yarnpkg.com/react/-/react-15.4.2.tgz#41f7991b26185392ba9bae96c8889e7e018397ef" resolved "https://registry.yarnpkg.com/react/-/react-15.4.2.tgz#41f7991b26185392ba9bae96c8889e7e018397ef"
dependencies: dependencies:
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment