forked from Gitlink/forgeplus-react
个人建站-身份认证
This commit is contained in:
parent
5689a74ddb
commit
4349ace2a4
|
|
@ -66,6 +66,10 @@ const Disposition = Loadable({
|
|||
loader: () => import("./bot/disposition"),
|
||||
loading: Loading,
|
||||
});
|
||||
const Mysite = Loadable({
|
||||
loader: () => import("./website/mySiteList"),
|
||||
loading: Loading,
|
||||
});
|
||||
|
||||
function Index(props){
|
||||
const { current_user,mygetHelmetapi , checkIfLogin } = props;
|
||||
|
|
@ -73,6 +77,8 @@ function Index(props){
|
|||
const notice_url = mygetHelmetapi && mygetHelmetapi.common && mygetHelmetapi.common.notice;
|
||||
|
||||
const [ avatarVisible , setAvatarVisible ] = useState(false);
|
||||
const [active, setActive] = useState(1);
|
||||
console.log('active', active);
|
||||
|
||||
useEffect(()=>{
|
||||
if(checkIfLogin() === false){
|
||||
|
|
@ -80,6 +86,28 @@ function Index(props){
|
|||
}
|
||||
},[])
|
||||
|
||||
useEffect(()=>{
|
||||
console.log('pathname', pathname, ["/settings/profile"].indexOf(pathname));
|
||||
if(["/settings/profile"].indexOf(pathname) !== -1){
|
||||
setActive(1);
|
||||
}else if(["/settings/emails", "/settings/phone", "/settings/password", "/settings/cancel"].indexOf(pathname) !== -1){
|
||||
setActive(2);
|
||||
}else if(["/settings/notice/config"].indexOf(pathname) !== -1){
|
||||
setActive(4);
|
||||
}else if(["/settings/notice"].indexOf(pathname) !== -1){
|
||||
setActive(3);
|
||||
}else if(["/settings/SSH"].indexOf(pathname) !== -1){
|
||||
setActive(5);
|
||||
}else if(["/settings/CLA"].indexOf(pathname) !== -1){
|
||||
setActive(6);
|
||||
}else if(["/settings/mybot"].indexOf(pathname) !== -1){
|
||||
setActive(7);
|
||||
}else if(["/settings/installbot"].indexOf(pathname) !== -1){
|
||||
setActive(8);
|
||||
}else if(["/settings/mysite"].indexOf(pathname) !== -1){
|
||||
setActive(9);
|
||||
}
|
||||
}, [pathname])
|
||||
|
||||
function onCancelAvatar(){
|
||||
setAvatarVisible(false);
|
||||
|
|
@ -108,23 +136,27 @@ function Index(props){
|
|||
</div>
|
||||
<ul className="securityUl ul-border-buttom">
|
||||
<li>个人信息</li>
|
||||
<li className={pathname.indexOf("/settings/profile")>-1 ?"active":""}><Link to={`/settings/profile`}><i className="iconfont icon-gerenziliao mr5 font-14"></i><span className="text-shodow-bold">基本资料</span></Link></li>
|
||||
<li className={(pathname.indexOf("/settings/emails")>-1 || pathname.indexOf("/settings/phone")>-1 || pathname.indexOf("/settings/password")>-1 || pathname.indexOf("/settings/cancel")>-1) ?"active":""}><Link to={`/settings/phone`}><i className="iconfont icon-xuanzhonganquanshezhi_icon mr5 font-14"></i><span className="text-shodow-bold">账号管理</span></Link></li>
|
||||
<li className={active === 1 ?"active":""}><Link to={`/settings/profile`}><i className="iconfont icon-gerenziliao mr5 font-14"></i><span className="text-shodow-bold">基本资料</span></Link></li>
|
||||
<li className={active === 2 ?"active":""}><Link to={`/settings/phone`}><i className="iconfont icon-xuanzhonganquanshezhi_icon mr5 font-14"></i><span className="text-shodow-bold">账号管理</span></Link></li>
|
||||
</ul>
|
||||
{notice_url && <ul className="securityUl ul-border-buttom">
|
||||
<li>消息通知</li>
|
||||
<li className={(pathname.indexOf("/settings/notice")>-1 && pathname.indexOf("/settings/notice/config") == -1) || pathname.indexOf("/settings/notice/privateLetter")>-1 ?"active":""}><Link to={"/settings/notice"}><i className="iconfont icon-wodetongzhi font-14"></i><span className="text-shodow-bold">我的通知</span></Link></li>
|
||||
<li className={pathname.indexOf("/settings/notice/config")>-1 ?"active":""}><Link to={'/settings/notice/config'}><i className="iconfont icon-tongzhiguanli font-14"></i><span className="text-shodow-bold">通知管理</span></Link></li>
|
||||
<li className={active === 3 ?"active":""}><Link to={"/settings/notice"}><i className="iconfont icon-wodetongzhi font-14"></i><span className="text-shodow-bold">我的通知</span></Link></li>
|
||||
<li className={active === 4 ?"active":""}><Link to={'/settings/notice/config'}><i className="iconfont icon-tongzhiguanli font-14"></i><span className="text-shodow-bold">通知管理</span></Link></li>
|
||||
</ul>}
|
||||
<ul className="securityUl ul-border-buttom">
|
||||
<li>安全设置</li>
|
||||
<li className={pathname.indexOf("/settings/SSH")>-1 ?"active":""}><Link to={`/settings/SSH`}><i className="iconfont icon-xuanzhongssh_icon mr5 font-14"></i><span className="text-shodow-bold">SSH密钥</span></Link></li>
|
||||
<li className={pathname.indexOf("/settings/CLA")>-1 ?"active":""}><Link to={`/settings/CLA`}><i className="iconfont icon-a-zu2044 mr5 font-13"></i><span className="text-shodow-bold">我的CLA</span></Link></li>
|
||||
<li className={active === 5 ?"active":""}><Link to={`/settings/SSH`}><i className="iconfont icon-xuanzhongssh_icon mr5 font-14"></i><span className="text-shodow-bold">SSH密钥</span></Link></li>
|
||||
<li className={active === 6 ?"active":""}><Link to={`/settings/CLA`}><i className="iconfont icon-a-zu2044 mr5 font-13"></i><span className="text-shodow-bold">我的CLA</span></Link></li>
|
||||
</ul>
|
||||
<ul className="securityUl ul-border-buttom">
|
||||
<li>Bot开发</li>
|
||||
<li className={active === 7 ?"active":""}><Link to={`/settings/mybot`}><i className="iconfont icon-kaifabot mr5 font-18"></i><span className="text-shodow-bold">我的Bot</span></Link></li>
|
||||
<li className={active === 8 ?"active":""}><Link to={`/settings/installbot`}><i className="iconfont icon-BOTpeizhi mr5 font-17"></i><span className="text-shodow-bold">Bot安装</span></Link></li>
|
||||
</ul>
|
||||
<ul className="securityUl">
|
||||
<li>Bot开发</li>
|
||||
<li className={pathname.indexOf("/settings/mybot")>-1 ?"active":""}><Link to={`/settings/mybot`}><i className="iconfont icon-kaifabot mr5 font-18"></i><span className="text-shodow-bold">我的Bot</span></Link></li>
|
||||
<li className={pathname.indexOf("/settings/installbot")>-1 ?"active":""}><Link to={`/settings/installbot`}><i className="iconfont icon-BOTpeizhi mr5 font-17"></i><span className="text-shodow-bold">Bot安装</span></Link></li>
|
||||
<li>个人建站</li>
|
||||
<li className={active === 9 ?"active":""}><Link to={`/settings/mysite`}><i className="iconfont icon-liebiaoicon mr5 font-15"></i><span className="text-shodow-bold">我的站点</span></Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
<LongWidth>
|
||||
|
|
@ -190,6 +222,12 @@ function Index(props){
|
|||
<Password {...props} {...p}/>
|
||||
)}
|
||||
></Route>
|
||||
<Route
|
||||
path="/settings/verification"
|
||||
render={(p) => (
|
||||
<Password {...props} {...p}/>
|
||||
)}
|
||||
></Route>
|
||||
<Route
|
||||
path="/settings/SSH"
|
||||
render={(p) => (
|
||||
|
|
@ -224,6 +262,13 @@ function Index(props){
|
|||
<Disposition {...props} {...p}/>
|
||||
)}
|
||||
></Route>
|
||||
{/* 个人建站 */}
|
||||
<Route
|
||||
path="/settings/mysite"
|
||||
render={(p) => (
|
||||
<Mysite {...props} {...p}/>
|
||||
)}
|
||||
></Route>
|
||||
</Switch>
|
||||
</Gap>
|
||||
</LongWidth>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,8 @@
|
|||
.default_head{
|
||||
height: 65px;
|
||||
line-height: 64px;
|
||||
border-bottom: 1px solid rgba(224, 230, 245, 1);
|
||||
color:#151d40;
|
||||
font-size:17px;
|
||||
padding-bottom:20px;
|
||||
}
|
||||
|
|
@ -0,0 +1,16 @@
|
|||
import React, { useState, useEffect, Fragment } from "react";
|
||||
import { Button, Icon, message, Modal } from "antd";
|
||||
import './index.scss';
|
||||
|
||||
function MySiteList(props){
|
||||
const {current_user} = props;
|
||||
|
||||
useEffect(()=>{
|
||||
document.title='我的站点';
|
||||
}, [])
|
||||
|
||||
return <Fragment>
|
||||
<div className="default_head">我的站点</div>
|
||||
</Fragment>
|
||||
}
|
||||
export default MySiteList;
|
||||
|
|
@ -13,10 +13,6 @@ export default Form.create()(
|
|||
// const { username } = props && props.match && props.match.params;
|
||||
const { resetUserInfo , current_user } = props;
|
||||
|
||||
useEffect(()=>{
|
||||
document.title="基本资料"
|
||||
}, [])
|
||||
|
||||
useEffect(()=>{
|
||||
if(current_user && current_user.login){
|
||||
setFieldsValue({
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@ import React , { useEffect , useState } from 'react';
|
|||
import { Menu } from 'antd';
|
||||
import Base from './Base';
|
||||
import Password from './Password';
|
||||
import Verification from './verification';
|
||||
import './Index.scss';
|
||||
import '../../SecuritySetting/notice/manager/Index.scss';
|
||||
|
||||
|
|
@ -13,24 +14,35 @@ function Index(props){
|
|||
|
||||
useEffect(()=>{
|
||||
if(pathname){
|
||||
let documentTitle = "基本资料";
|
||||
if(pathname === `/settings/profile`){
|
||||
setKey("0");
|
||||
documentTitle = "基本资料";
|
||||
}else{
|
||||
setKey("1");
|
||||
switch(pathname){
|
||||
case '/settings/phone':
|
||||
documentTitle = "手机号管理";
|
||||
setType('3');
|
||||
break;
|
||||
case '/settings/emails':
|
||||
setType('0');
|
||||
documentTitle = "邮箱管理";
|
||||
break;
|
||||
case '/settings/password':
|
||||
setType('1');
|
||||
documentTitle = "密码管理";
|
||||
break;
|
||||
case '/settings/verification':
|
||||
setType('4');
|
||||
documentTitle = "身份认证";
|
||||
break;
|
||||
default:
|
||||
setType('2');
|
||||
documentTitle = "账号注销";
|
||||
}
|
||||
}
|
||||
document.title = documentTitle;
|
||||
}
|
||||
},[pathname])
|
||||
|
||||
|
|
@ -43,15 +55,13 @@ function Index(props){
|
|||
<Menu.Item key="3" className="font-16" onClick={()=>{props.history.push('/settings/phone')}}>手机号管理</Menu.Item>
|
||||
<Menu.Item key="0" className="font-16" onClick={()=>{props.history.push('/settings/emails')}}>邮箱管理</Menu.Item>
|
||||
<Menu.Item key="1" className="font-16" onClick={()=>{props.history.push('/settings/password')}}>密码管理</Menu.Item>
|
||||
<Menu.Item key="4" className="font-16" onClick={()=>{props.history.push('/settings/verification')}}>身份认证</Menu.Item>
|
||||
<Menu.Item key="2" className="font-16" onClick={()=>{props.history.push('/settings/cancel')}}>账号注销</Menu.Item>
|
||||
</Menu>}
|
||||
</div>
|
||||
<div>
|
||||
{
|
||||
key === "0" ?
|
||||
<Base {...props}/>
|
||||
:
|
||||
<Password {...props} type={type}/>
|
||||
key === "0" ? <Base {...props}/> : type === "4" ? <Verification {...props}/> : <Password {...props} type={type}/>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -57,6 +57,12 @@
|
|||
.spanTil{
|
||||
letter-spacing: normal;
|
||||
}
|
||||
&.errorTip{
|
||||
height: auto;
|
||||
color:red;
|
||||
background-color: rgba($color: red, $alpha: 0.05);
|
||||
border:1px solid red;
|
||||
}
|
||||
}
|
||||
.tipCont{
|
||||
min-height: 330px;
|
||||
|
|
@ -167,4 +173,22 @@
|
|||
}
|
||||
.gotoUpdateEmail{
|
||||
line-height: 40px;
|
||||
}
|
||||
.verificationForm{
|
||||
.ant-form-item-label{
|
||||
width: 125px;
|
||||
}
|
||||
.uploadCard{
|
||||
margin-right: 80px;
|
||||
}
|
||||
.ant-form-extra{
|
||||
text-align: center;
|
||||
}
|
||||
.verUpload{
|
||||
position: relative;
|
||||
.ant-form-explain{
|
||||
position: absolute;
|
||||
bottom: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -24,7 +24,6 @@ export default Form.create()(
|
|||
useEffect(()=>{
|
||||
setPassMap({password: undefined, email: undefined, code: undefined});
|
||||
setUpdatePsdMap({oldPassword: undefined, password: undefined, password1: undefined});
|
||||
document.title = type === '0' ? '邮箱管理' : type === '1' ? '密码管理' : type === '2' ? '账号注销' : '手机号管理';
|
||||
}, type)
|
||||
|
||||
function submit() {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,151 @@
|
|||
import React , { forwardRef, Fragment, useEffect, useState } from 'react';
|
||||
import { Form , Input, Button , Spin, message, Alert } from 'antd';
|
||||
import { AlignCenter, AlignTop } from '../../Component/layout';
|
||||
import './Index.scss';
|
||||
import UploadImage from '../../Team/Component/UploadImage';
|
||||
import axios from 'axios';
|
||||
import { getImageUrl } from '../../../common/UrlTool';
|
||||
|
||||
export default Form.create()(
|
||||
forwardRef((props)=>{
|
||||
const { getFieldDecorator, validateFields , setFieldsValue } = props && props.form;
|
||||
const { resetUserInfo , current_user } = props;
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [data, setData] = useState(undefined);
|
||||
const [reload, setReload] = useState(undefined);
|
||||
|
||||
useEffect(()=>{
|
||||
if(current_user && current_user.login){
|
||||
setLoading(true);
|
||||
// 获取用户身份认证信息
|
||||
axios.get(`http://ng.learnerhub.net/api/identity_verifications.json`).then(res=>{
|
||||
setLoading(false);
|
||||
if(res && res.status === 200){
|
||||
if(res.data && res.data.status === 0){
|
||||
return;
|
||||
}
|
||||
setData(res.data);
|
||||
const {name, number, card_back, card_front, hold_card_back, hold_card_front} = res.data;
|
||||
setFieldsValue({
|
||||
name, number, card_back, card_front, hold_card_back, hold_card_front
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
},[current_user, reload])
|
||||
|
||||
function submit() {
|
||||
validateFields((error, values) => {
|
||||
if (!error) {
|
||||
if(data){
|
||||
axios.put(`http://ng.learnerhub.net/api/identity_verifications/${data.id}.json`, values).then(res => {
|
||||
if(res && res.status === 200){
|
||||
message.success("提交成功");
|
||||
setReload(Math.random());
|
||||
}
|
||||
}).catch((error) => {});
|
||||
}else{
|
||||
// 新增
|
||||
axios.post(`http://ng.learnerhub.net/api/identity_verifications.json`, values).then(res=>{
|
||||
if(res && res.status === 200){
|
||||
message.success("提交成功");
|
||||
setReload(Math.random());
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return (
|
||||
<Spin spinning={loading}>
|
||||
{data && data.state && (
|
||||
<Fragment>
|
||||
{data.state === "待审核" && (
|
||||
<div className="tipsBox mb20">
|
||||
您提供的身份信息正在审核，请耐心等待
|
||||
</div>
|
||||
)}
|
||||
{data.state === "已拒绝" && <div className="tipsBox mb20 errorTip">
|
||||
您提交的身份信息未提供，原因：{data.description || "无，如有需要请联系平台管理员"}
|
||||
</div>}
|
||||
{data.state === "已通过" && <Alert className="mb20" type='success' message="您提交的身份信息已通过" />}
|
||||
</Fragment>
|
||||
)}
|
||||
<Form layout={"inline"} className="verificationForm">
|
||||
<Form.Item label="真实姓名" labelCol={{ span: 4 }}>
|
||||
{getFieldDecorator("name", {
|
||||
rules: [{ required: true, message: "请输入真实姓名" }],
|
||||
})(
|
||||
<Input
|
||||
placeholder="请输入与身份证一致的真实姓名"
|
||||
style={{ width: "400px" }}
|
||||
/>
|
||||
)}
|
||||
</Form.Item>
|
||||
<Form.Item label="身份证号" labelCol={{ span: 4 }}>
|
||||
{getFieldDecorator("number", {
|
||||
rules: [
|
||||
{ required: true, message: "请输入大陆身份证号码" },
|
||||
{ pattern: /^[1-9]\d{5}(19|20)\d{2}(0[1-9]|1[0-2])(0[1-9]|[12]\d|3[01])\d{3}([0-9]|X)$/, message: "请输入正确的中国大陆身份证号码"}
|
||||
],
|
||||
})(
|
||||
<Input placeholder="请输入身份证号" style={{ width: "400px" }} />
|
||||
)}
|
||||
</Form.Item>
|
||||
<AlignTop style={{ alignItems: "flex-end" }}>
|
||||
<Form.Item
|
||||
label="身份证照片"
|
||||
extra="正面"
|
||||
className="uploadCard verUpload"
|
||||
>
|
||||
{getFieldDecorator("card_front", {
|
||||
rules: [{ required: true, message: "请上传照片" }],
|
||||
})(
|
||||
<UploadImage maxSize={5} getImageId={(id)=>{setFieldsValue({'card_front': id})}} url={data && getImageUrl(`/api/attachments/${data.card_front}`)}/>
|
||||
)}
|
||||
</Form.Item>
|
||||
<Form.Item
|
||||
extra="反面"
|
||||
className='verUpload'
|
||||
>
|
||||
{getFieldDecorator("card_back", {
|
||||
rules: [{ required: true, message: "请上传照片" }],
|
||||
})(
|
||||
<UploadImage maxSize={5} getImageId={(id)=>{setFieldsValue({'card_back': id})}} url={data && getImageUrl(`/api/attachments/${data.card_back}`)}/>
|
||||
)}
|
||||
</Form.Item>
|
||||
</AlignTop>
|
||||
<AlignTop style={{ alignItems: "flex-end" }}>
|
||||
<Form.Item
|
||||
label="手持身份证照片"
|
||||
extra="正面"
|
||||
className="uploadCard verUpload"
|
||||
>
|
||||
{getFieldDecorator("hold_card_front", {
|
||||
rules: [{ required: true, message: "请上传照片" }],
|
||||
})(
|
||||
<UploadImage maxSize={5} getImageId={(id)=>{setFieldsValue({'hold_card_front': id})}} url={data && getImageUrl(`/api/attachments/${data.hold_card_front}`)}/>
|
||||
)}
|
||||
</Form.Item>
|
||||
<Form.Item extra="反面" className='verUpload'>
|
||||
{getFieldDecorator("hold_card_back", {
|
||||
rules: [{ required: true, message: "请上传照片" }],
|
||||
})(
|
||||
<UploadImage maxSize={5} getImageId={(id)=>{setFieldsValue({'hold_card_back': id})}} url={data && getImageUrl(`/api/attachments/${data.hold_card_back}`)}/>
|
||||
)}
|
||||
</Form.Item>
|
||||
</AlignTop>
|
||||
{(!data || (data && data.state === "已拒绝")) && (
|
||||
<AlignCenter>
|
||||
<span className="ant-form-item-label"></span>
|
||||
<Button className="but25" type={"primary"} onClick={submit}>
|
||||
提交
|
||||
</Button>
|
||||
</AlignCenter>
|
||||
)}
|
||||
</Form>
|
||||
</Spin>
|
||||
);
|
||||
})
|
||||
)
|
||||
Loading…
Reference in New Issue