Commit 66c48f6d authored by 前端-许佳敏's avatar 前端-许佳敏

feat:add register ui

parent df93cdf0
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
"@ant-design/icons": "^4.2.1", "@ant-design/icons": "^4.2.1",
"@umijs/preset-react": "1.x", "@umijs/preset-react": "1.x",
"@umijs/test": "^3.2.0", "@umijs/test": "^3.2.0",
"god": "0.0.21", "god": "0.0.22",
"lint-staged": "^10.0.7", "lint-staged": "^10.0.7",
"mobx": "^5.15.4", "mobx": "^5.15.4",
"mobx-react": "^6.2.2", "mobx-react": "^6.2.2",
......
...@@ -28,7 +28,7 @@ ...@@ -28,7 +28,7 @@
// footer // footer
.@{prefix}-user-footer { .@{prefix}-user-footer {
padding-top: 32px; padding: 32px 0;
font-size: 14px; font-size: 14px;
color: #97A0AF; color: #97A0AF;
text-align: center; text-align: center;
......
...@@ -45,7 +45,8 @@ ...@@ -45,7 +45,8 @@
.registerBox { .registerBox {
width: 100%; width: 100%;
height: 700px; min-height: 700px;
padding-bottom: 40px;
background: #fff; background: #fff;
} }
...@@ -101,4 +102,11 @@ ...@@ -101,4 +102,11 @@
text-align: center; text-align: center;
height: 48px; height: 48px;
line-height: 48px; line-height: 48px;
}
.btnCenter {
width: 320px;
margin-left: auto;
margin-right: auto;
display: block;
} }
\ No newline at end of file
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
// Please do not change this file! // Please do not change this file!
interface CssExports { interface CssExports {
'agreement': string; 'agreement': string;
'btnCenter': string;
'checkTypes': string; 'checkTypes': string;
'default': string; 'default': string;
'form-box': string; 'form-box': string;
......
import React, { useState } from 'react' import React, { useState, useRef } from 'react'
import { Input, Form, Steps, Button, Row, Space } from 'antd' import { Input, Form, Steps, Button, Row, Space } from 'antd'
import styles from './index.less' import styles from './index.less'
import globalStyles from '@/global.less' import globalStyles from '@/global.less'
...@@ -8,6 +8,7 @@ import { IFormControllers, IFormButtonTypes } from 'god/dist/src/form-page' ...@@ -8,6 +8,7 @@ import { IFormControllers, IFormButtonTypes } from 'god/dist/src/form-page'
import { Link } from 'umi' import { Link } from 'umi'
import ListCard from '@/components/ListCard' import ListCard from '@/components/ListCard'
import ButtonList from './components/ButtonList' import ButtonList from './components/ButtonList'
import { FormInstance } from 'antd/lib/form'
const Step = Steps.Step const Step = Steps.Step
...@@ -122,6 +123,7 @@ const nextForms: mixinForm[] = [ ...@@ -122,6 +123,7 @@ const nextForms: mixinForm[] = [
{ {
type: 'Input', type: 'Input',
name: 'companyName', name: 'companyName',
span: 12,
inputProps: { inputProps: {
placeholder: '请输入公司名称 (必填)' placeholder: '请输入公司名称 (必填)'
} }
...@@ -129,6 +131,7 @@ const nextForms: mixinForm[] = [ ...@@ -129,6 +131,7 @@ const nextForms: mixinForm[] = [
{ {
type: 'Input', type: 'Input',
name: 'companyType', name: 'companyType',
span: 12,
inputProps: { inputProps: {
placeholder: '请输入企业类型 (必填)' placeholder: '请输入企业类型 (必填)'
} }
...@@ -136,24 +139,64 @@ const nextForms: mixinForm[] = [ ...@@ -136,24 +139,64 @@ const nextForms: mixinForm[] = [
], ],
[ [
{ {
type: 'Input', type: 'DatePicker',
name: 'companyType123', name: 'companyType123',
inputProps: { datePicker: {
placeholder: '请输入住所 (必填)' style: {width: '100%'},
placeholder: '请输入营业期限 (必填)',
}, },
span: 12,
}, },
{ {
type: 'Input', type: 'DatePicker',
name: '1444', name: '1444',
inputProps: { span: 12,
placeholder: '请输入法定代表人 (必填)' datePicker: {
}, style: {width: '100%'},
placeholder: '请输入成立日期 (必填)',
}
} }
] ],
{
type: 'TextArea',
name: 'demo1',
span: 24,
textAreaProps: {
placeholder: '请输入经营范围 (必填)'
}
},
{
type: 'Upload',
name: 'up1',
uploadProps: {
text: '上传营业执照附件',
afterText: '附件大小不能超过 5M'
}
}
]
const form2: mixinForm[] = [
{
type: 'Input',
name: 'jjj'
}
] ]
const UserRegistry = () => { const UserRegistry = () => {
const [current, setCurrent] = useState(1) const [current, setCurrent] = useState(1)
const [next, setNext] = useState(true) const [next, setNext] = useState(true)
const form1Ref = useRef<{action?: FormInstance}>({})
const form2Ref = useRef<{action?: FormInstance}>({})
const handleForm = () => {
(form1Ref.current.action as FormInstance).validateFields().then(values => {
console.log(values)
});
(form2Ref.current.action as FormInstance).validateFields().then(values => {
console.log(values)
});
}
return ( return (
<div className={cx(styles.register, globalStyles.lingxiBusinessContent1024)}> <div className={cx(styles.register, globalStyles.lingxiBusinessContent1024)}>
<h3>欢迎您注册数商云账号</h3> <h3>欢迎您注册数商云账号</h3>
...@@ -182,14 +225,18 @@ const UserRegistry = () => { ...@@ -182,14 +225,18 @@ const UserRegistry = () => {
<> <>
<ListCard title='请填写营业执照信息'> <ListCard title='请填写营业执照信息'>
<FormPage <FormPage
formRef={form1Ref}
renderFormLists={nextForms} renderFormLists={nextForms}
/> />
</ListCard> </ListCard>
<ListCard title='请填写法定代表人信息'> <ListCard title='请填写法定代表人信息'>
<FormPage <FormPage
renderFormLists={nextForms} formRef={form2Ref}
renderFormLists={form2}
/> />
</ListCard> </ListCard>
<Button size='large' type='primary' className={styles.btnCenter} onClick={() => {handleForm()}}>提交注册资料</Button>
</> </>
: :
<> <>
......
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