正在显示
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 | ... | ... |
请
注册
或
登录
后发表评论