54 lines
2.2 KiB
JavaScript
54 lines
2.2 KiB
JavaScript
import React from 'react';
|
|
import Styles from './web.module.less';
|
|
import { Form, Input, Button, Radio } from 'antd';
|
|
export default function Render(props) {
|
|
const { methods, data } = props;
|
|
const { t, update, onConfirm } = methods;
|
|
const { oakFullpath, idState, name, idNumber, idCardType, idCardTypeArr, idStateStr, } = data;
|
|
const disabled = !idState || ['verified', 'verifying'].includes(idState);
|
|
return (<div className={Styles.pageBody}>
|
|
<Form layout="horizontal" labelCol={{ span: 4 }} wrapperCol={{ span: 20 }}>
|
|
<Form.Item label={t('user:attr.name')} required>
|
|
<Input disabled={idState !== 'unverified'} value={name} onChange={(e) => {
|
|
update({
|
|
name: e.target.value,
|
|
});
|
|
}} placeholder={t('please input name')}/>
|
|
</Form.Item>
|
|
<Form.Item label={t('user:attr.idCardType')} required>
|
|
<Radio.Group disabled={idState !== 'unverified'} onChange={(e) => {
|
|
if (idCardType === e.target.value) {
|
|
return;
|
|
}
|
|
update({
|
|
idCardType: e.target.value,
|
|
idNumber: '',
|
|
});
|
|
}} value={idCardType}>
|
|
{idCardTypeArr.map((ele, index) => {
|
|
return <Radio key={ele.value} value={ele.value}>{ele.label}</Radio>;
|
|
})}
|
|
</Radio.Group>
|
|
</Form.Item>
|
|
<Form.Item label={t('user:attr.idNumber')} required>
|
|
<Input value={idNumber} disabled={!idCardType || idState !== 'unverified'} onChange={(e) => {
|
|
update({
|
|
idNumber: e.target.value,
|
|
});
|
|
}} placeholder={t('please input idNumber')}/>
|
|
</Form.Item>
|
|
</Form>
|
|
{disabled ?
|
|
(<div className={Styles.idState}>
|
|
{idStateStr}
|
|
</div>) :
|
|
(<div className={Styles.btnBox}>
|
|
<Button type="primary" size="large" onClick={() => {
|
|
onConfirm();
|
|
}}>
|
|
{t('commit')}
|
|
</Button>
|
|
</div>)}
|
|
</div>);
|
|
}
|