正在显示
7 个修改的文件
包含
161 行增加
和
0 行删除
... | ... | @@ -32,9 +32,11 @@ |
32 | 32 | ] |
33 | 33 | }, |
34 | 34 | "devDependencies": { |
35 | + "@ant-design/icons": "^4.0.0", | |
35 | 36 | "@ant-design/pro-cli": "^1.0.5", |
36 | 37 | "@ant-design/pro-layout": "^4.5.16", |
37 | 38 | "@umijs/fabric": "^2.0.0", |
39 | + "antd": "^4.6.6", | |
38 | 40 | "cross-env": "^6.0.0", |
39 | 41 | "eslint": "^6.8.0", |
40 | 42 | "glob": "^7.1.4", | ... | ... |
templates/login/package.json
0 → 100644
templates/login/src/_mock.js
0 → 100644
templates/login/src/index.js
0 → 100644
1 | +import React, { Component } from 'react'; | |
2 | +import { connect } from 'dva'; | |
3 | +import { Form, Input, Button, Checkbox } from 'antd'; | |
4 | +import { UserOutlined, LockOutlined } from '@ant-design/icons'; | |
5 | + | |
6 | +import styles from './style.less'; | |
7 | + | |
8 | +@connect(({ BLOCK_NAME_CAMEL_CASE }) => BLOCK_NAME_CAMEL_CASE) | |
9 | +class Page extends Component { | |
10 | + componentDidMount() { | |
11 | + const { dispatch } = this.props; | |
12 | + dispatch({ | |
13 | + type: 'BLOCK_NAME_CAMEL_CASE/fetch', | |
14 | + }); | |
15 | + } | |
16 | + onFinish = (values) => { | |
17 | + console.log(values) | |
18 | + } | |
19 | + render() { | |
20 | + const { text } = this.props; | |
21 | + return ( | |
22 | + <div className={styles.container}> | |
23 | + <div className={styles.login_block}> | |
24 | + <img className={styles.bg_img_sub1} src="http://hropublic.oss-cn-beijing.aliyuncs.com/workai-blocks/img/login-sub1.png" alt="" /> | |
25 | + <div className={styles.login_wrap}> | |
26 | + <Form | |
27 | + name="normal_login" | |
28 | + className="login-form" | |
29 | + initialValues={{ remember: true }} | |
30 | + onFinish={this.onFinish} | |
31 | + > | |
32 | + <Form.Item | |
33 | + name="username" | |
34 | + rules={[{ required: true, message: 'Please input your Username!' }]} | |
35 | + > | |
36 | + <Input placeholder="Username" /> | |
37 | + </Form.Item> | |
38 | + <Form.Item | |
39 | + name="password" | |
40 | + rules={[{ required: true, message: 'Please input your Password!' }]} | |
41 | + > | |
42 | + <Input | |
43 | + prefix={<LockOutlined className="site-form-item-icon" />} | |
44 | + type="password" | |
45 | + placeholder="Password" | |
46 | + /> | |
47 | + </Form.Item> | |
48 | + <Form.Item> | |
49 | + <Form.Item name="remember" valuePropName="checked" noStyle> | |
50 | + <Checkbox>记住账号</Checkbox> | |
51 | + </Form.Item> | |
52 | + | |
53 | + <a className="login-form-forgot" href=""> | |
54 | + 忘记密码 | |
55 | + </a> | |
56 | + </Form.Item> | |
57 | + | |
58 | + <Form.Item> | |
59 | + <Button type="primary" htmlType="submit" className={styles.login_form_button}> | |
60 | + 登录 | |
61 | + </Button> | |
62 | + 或 <a href="">现在去注册!</a> | |
63 | + </Form.Item> | |
64 | + </Form> | |
65 | + </div> | |
66 | + </div> | |
67 | + </div> | |
68 | + ); | |
69 | + } | |
70 | +} | |
71 | + | |
72 | +export default Page; | ... | ... |
templates/login/src/model.js
0 → 100644
1 | +import { getText } from './service'; | |
2 | + | |
3 | +export default { | |
4 | + namespace: 'BLOCK_NAME_CAMEL_CASE', | |
5 | + state: { | |
6 | + text: 'loading...', | |
7 | + }, | |
8 | + | |
9 | + effects: { | |
10 | + *fetch(_, { call, put }) { | |
11 | + const { text } = yield call(getText); | |
12 | + yield put({ | |
13 | + type: 'save', | |
14 | + payload: { | |
15 | + text, | |
16 | + }, | |
17 | + }); | |
18 | + }, | |
19 | + }, | |
20 | + | |
21 | + reducers: { | |
22 | + save(state, { payload }) { | |
23 | + return { | |
24 | + ...state, | |
25 | + ...payload, | |
26 | + }; | |
27 | + }, | |
28 | + }, | |
29 | +}; | ... | ... |
templates/login/src/service.js
0 → 100644
templates/login/src/style.less
0 → 100644
1 | +.container { | |
2 | + height: 100vh; | |
3 | + width: 100vw; | |
4 | + margin: 0; | |
5 | + padding: 140px 0 0 0; | |
6 | + background: linear-gradient(to right, #231254 , #1d0592); | |
7 | +} | |
8 | + | |
9 | +.bg{ | |
10 | + width: 600px; | |
11 | +} | |
12 | + | |
13 | +.login_block{ | |
14 | + width: 1100px; | |
15 | + min-height: 520px; | |
16 | + border: 1px solid #231254; | |
17 | + border-radius: 5px; | |
18 | + margin: auto; | |
19 | + background: #fff; | |
20 | + -moz-box-shadow:2px 3px 7px 1px #231254; | |
21 | + -webkit-box-shadow:2px 3px 7px 1px #231254; | |
22 | + box-shadow:2px 3px 7px 1px #231254; | |
23 | + position: relative; | |
24 | +} | |
25 | + | |
26 | +.bg_img_sub1{ | |
27 | + height: 400px; | |
28 | + vertical-align: bottom; | |
29 | +} | |
30 | +.login_wrap{ | |
31 | + width: 330px; | |
32 | + display: inline-block; | |
33 | + padding: 30px 0; | |
34 | +} | |
35 | +.login_form_button{ | |
36 | + width: 100%; | |
37 | +} | |
\ No newline at end of file | ... | ... |
请
注册
或
登录
后发表评论