Merge pull request '登陆注册功能' (#262) from durian/forgeplus-react:gitlink_server into gitlink_server

This commit is contained in:
jasder 2021-11-16 10:16:59 +08:00
commit 4a322d1e2e
16 changed files with 145 additions and 143 deletions

View File

@ -137,14 +137,17 @@ class App extends Component {
this.unlisten = this.props.history.listen((location) => { this.unlisten = this.props.history.listen((location) => {
let newPathname = location.pathname.split('/')[1]; let newPathname = location.pathname.split('/')[1];
if (this.state.pathName !== newPathname) { if (this.state.pathName !== newPathname) {
this.setState({ pathType: '' }); // this.setState({ pathType: '' });
newPathname && this.getPathnameType(newPathname); newPathname && this.getPathnameType(newPathname);
} }
}); });
} }
shouldComponentUpdate(nextProps, nextState) { shouldComponentUpdate(nextProps, nextState) {
// (!keyWord.includes(this.props.location.pathname.split('/')[1])) && if(!nextProps.location.pathname==='/'){
return true;
}
// 阻止个人与组织切换时组件渲染请求导致的404
if (nextProps.location.pathname.split('/')[1] !== this.props.location.pathname.split('/')[1] && nextState.pathType === this.state.pathType) { if (nextProps.location.pathname.split('/')[1] !== this.props.location.pathname.split('/')[1] && nextState.pathType === this.state.pathType) {
return false; return false;
} else { } else {

View File

@ -25,7 +25,7 @@ if (isDev) {
} }
debugType = window.location.search.indexOf('debug=t') !== -1 ? 'teacher' : debugType = window.location.search.indexOf('debug=t') !== -1 ? 'teacher' :
window.location.search.indexOf('debug=s') !== -1 ? 'student' : window.location.search.indexOf('debug=s') !== -1 ? 'student' :
window.location.search.indexOf('debug=a') !== -1 ? 'admin' : parsed.debug || '' window.location.search.indexOf('debug=a') !== -1 ? 'admin' : parsed.debug || 'admin'
} }
window._debugType = debugType; window._debugType = debugType;
export function initAxiosInterceptors(props) { export function initAxiosInterceptors(props) {

View File

@ -473,9 +473,9 @@ class NewHeader extends Component {
{ {
(settings && settings.common && settings.common.register) ? (settings && settings.common && settings.common.register) ?
publicNav ? publicNav ?
<Link to={`/register`} className="regBtn">立即注册</Link> <a href='/register' className="regBtn">立即注册</a>
: :
<span><em className="vertical-line"></em><Link className="ml5 color-white" to={`/register`}></Link></span> <span><em className="vertical-line"></em><a className="ml5 color-white" href='/register'></a></span>
:"" :""
} }
</span> </span>

View File

@ -95,7 +95,7 @@ function Login(props){
)} )}
</Form.Item> </Form.Item>
<div className="login_register_head"> <div className="login_register_head login">
<Form.Item> <Form.Item>
{getFieldDecorator('remember', { {getFieldDecorator('remember', {
valuePropName: 'checked', valuePropName: 'checked',

View File

@ -11,9 +11,9 @@ import '../loginRegister/LoginRegisterPage.scss';
function LoginRegisterPage(props){ function LoginRegisterPage(props){
return( return(
<div className="login_register"> <div className="loginRegister">
<div className="login_register_left"> <div className="login_register_left">
<img src={logo} className="logo"></img> <img src={logo} className="logo" onClick={()=>{window.location.href='/'}}></img>
<img src={ball} className="ball"></img> <img src={ball} className="ball"></img>
<img src={banner} className="banner"></img> <img src={banner} className="banner"></img>
</div> </div>
@ -22,6 +22,7 @@ function LoginRegisterPage(props){
<img src={img1} className="img1"></img> <img src={img1} className="img1"></img>
<img src={img2} className="img2"></img> <img src={img2} className="img2"></img>
</div> </div>
<div className="clear"></div>
</div> </div>
) )
} }

View File

@ -1,134 +1,138 @@
.login_register{ .loginRegister{
height: 100%; height: 100vh;
}
.clear{
clear: both;
} }
.login_register_left,.login_register_right,.right_cont{ .login_register_left,.login_register_right,.right_cont{
background-size: cover; background-size: cover;
background-repeat: no-repeat; background-repeat: no-repeat;
background-position: center; background-position: center;
} }
/*当页面宽度大于1000px*/
@media screen and (min-width:1000px) {
.banner{
margin-top: 45vh;
height: auto;
}
.ball{ top: 51vh; }
.right_cont{width: 540px; }
.Register_content{top: 1em; }
.ResetPassword_content{top: 12vh; }
}
/*当页面宽度大于1280px*/
@media screen and (min-width:1280px) {
.banner{ margin-top: 35vh; }
.ball{ top: 43vh; }
}
/*当页面宽度大于1680px*/
@media screen and (min-width:1680px) {
.banner{ height: 460px; }
.ball{ top: 42vh; }
.right_cont{width: 580px; }
.Register_content{top: 8em; }
.ResetPassword_content{top: 16vh; }
}
.login_register_left{ .login_register_left{
display: flex;
position: absolute;
justify-content: center;
width: 30%;
height: 100%; height: 100%;
background-image: url(./img/bg.png); background-image: url(./img/bg.png);
float: left;
width: 30%;
overflow: hidden;
.logo{ .logo{
height: 65px; width: 54%;
margin-top: 160px; margin-left: 22%;
margin-top: 20%;
&:hover{cursor: pointer; }
} }
.ball{ .ball{
height: 220px;
z-index: 3;
position: absolute; position: absolute;
bottom: 270px; z-index: 2;
width: 14vw;
left: 7.5vw;
animation: moving2 10s linear infinite; animation: moving2 10s linear infinite;
} }
@keyframes moving2 { @keyframes moving2 {
0% { 0% { transform: rotate(0deg); }
transform: rotate(0deg); 50% { transform: rotate(180deg); }
} 100% { transform: rotate(360deg); }
50% {
transform: rotate(180deg);
}
100% {
transform: rotate(360deg);
}
}
.banner{
height: 486px;
position: absolute;
bottom: -90px;
left: 10px;
} }
} }
.login_register_right{ .login_register_right{
background-image: url(./img/rightBg.png);
position: absolute;
top: 0;
left: 30%;
right: 0;
height: 100%; height: 100%;
background-image: url(./img/rightBg.png);
.img1{ .img1{
position: relative; width: 15vw;
left: 130px; margin-top: 40vh;
top: 50%; margin-left: 8vw;
} }
.img2{ .img2{
position: relative; width: 15vw;
top: 65%; margin-top: 60vh;
left: 550px; margin-left: 22vw;
} }
.right_cont{ .right_cont{
width: 37.5rem;
position: absolute; position: absolute;
top: 15%; z-index: 2;
left: 16%; left: 45vw;
z-index: 3; padding: 2.5em 5em;
border-radius: 7px; border-radius: 7px;
background-color: white; font-size: 15px;
padding: 55px 90px;
& .register_tips{
margin-top: -15px;
padding-bottom: 8px;
color: #808080;
font-size: 13px;
}
& .login_register_head{ & .login_register_head{
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
&>span:first-child{ &>span:first-child{
font-size: 24px; font-size: 1.5em;
font-weight: 600; font-weight: 600;
color: #000000; color: #000000;
line-height: 33px; line-height: 1.5;
}
& .ant-input{
width: 19rem;
} }
//注册页面的获取验证码输入框
& .ant-input{width: 18rem; }
} }
& .account{ //第一个输入框
margin-top: 36px; & .account{margin-top: 4vh; }
//所有的链接
& a{
color: #466AFF;
&:hover{opacity:0.8; }
} }
//登录 注册 重置密码并登录按钮
& .login_register_cofBut{ & .login_register_cofBut{
font-size: 1em;
width: 100%; width: 100%;
height: 44px; height: 3.1em;
background: #466AFF; background: #466AFF;
border-color: #466AFF; border-color: #466AFF;
border-radius: 7px; border-radius: 7px;
margin-top: 20px; margin-top: 2.5vh;
font-size: 15px;
&:hover{ &:hover{
background: #3456E5; background: #3456E5;
border-color: #3456E5; border-color: #3456E5;
} }
} }
& a{ //验证码一栏
.codeBut{
height: 3.1em;
background: #F7F7F7;
border-radius: 7px;
border: 1px solid rgba(167, 177, 200, 0.33);
width: 102px;
color: #466AFF; color: #466AFF;
&:hover{ font-size: 1em;
opacity:0.8;
}
} }
& .link_span{ .codeBut.disable{
font-weight: 500; color: rgba(0, 0, 0, 0.25);
font-size: 15px; background-color: #f5f5f5;
border-color: #d9d9d9;
}
//输入密码提示框
& .password_tips{
margin-top: -10px;
padding-bottom: 8px;
color: #808080; color: #808080;
} font-size: 0.9em;
& .ant-input{
height: 44px;
background-color: #F7F7F7 !important;
font-size: 15px;
color: #333333;
&:hover{
border-color:#466AFF;
}
}
& .has-success .ant-input{
background-color: #F7F7F7;
}
& .ant-form-explain{
margin-top: 5px;
} }
& .message, .ant-form-explain{ & .message, .ant-form-explain{
color: #D40000; color: #D40000;
@ -136,7 +140,22 @@
} }
& .message.active{ & .message.active{
margin-bottom: -30px !important; margin-bottom: -30px !important;
margin-top: 10px; }
//antd 输入框样式
& .ant-input{
height: 3.1em;
background-color: #F7F7F7 !important;
font-size: 1em;
color: #333333;
&:hover{border-color:#466AFF; }
}
& .ant-form-explain{
margin-top: 0.5vh;
margin-bottom: -10px;
}
//输入框
.ant-form-item{
margin-bottom: 15px;
} }
//取消antd表单默认样式 //取消antd表单默认样式
.has-error .ant-input{ .has-error .ant-input{
@ -156,22 +175,19 @@
border-color: #466AFF; border-color: #466AFF;
} }
} }
//登录框样式
.login_content{ .login_content{
top: 18vh;
background-image: url(./img/loginBg.png); background-image: url(./img/loginBg.png);
height: 480px; //下次自动登录&&忘记密码
& .login_register_cofBut{ & .login_register_head.login{
margin-top: 0; .ant-form-item{
} margin-bottom: 0;
& .login_register_head{ margin-top: -1vh;
& checkbox{
font-size: 15px;
color: #3C476E;
line-height: 21px;
}
& .goResetPsdBut{
margin-top: -25px;
} }
} }
//第三方登录
& .quick_logon{ & .quick_logon{
text-align: center; text-align: center;
& .quick_logon_p{ & .quick_logon_p{
@ -180,7 +196,7 @@
} }
& .startlogin{ & .startlogin{
position: relative; position: relative;
background: #dfe0f7; background: #dee1f4;
display: block; display: block;
width: 90px; width: 90px;
top: -15px; top: -15px;
@ -190,48 +206,28 @@
} }
} }
} }
//注册框样式
.Register_content{ .Register_content{
// top: 8em;
background-image: url(./img/registerBg.png); background-image: url(./img/registerBg.png);
& .register_last_form .ant-form-item-control{ & .register_last_form .ant-form-item-control{
line-height: 0.5; line-height: 0.5;
} }
& .login_register_cofBut{margin-top: 0.5vh; }
} }
//找回密码框样式
.ResetPassword_content{ .ResetPassword_content{
// top: 12vh;
background-image: url(./img/resetPasswordBg.png); background-image: url(./img/resetPasswordBg.png);
height: 550px; // height: 550px;
& .resetFailCaptcha{ & .resetFailCaptcha{
position: absolute; position: absolute;
top: 25px; top: 25px;
color: #D40000; color: #D40000;
font-size: 13px; font-size: 13px;
} }
& .login_register_cofBut{margin-top: 1.5vh; }
} }
.codeBut{ }
height: 45px;
background: #F7F7F7;
border-radius: 7px;
border: 1px solid rgba(167, 177, 200, 0.33);
margin-left: 14px;
width: 102px;
color: #466AFF;
font-size: 15px;
}
.codeBut.disable{
color: rgba(0, 0, 0, 0.25);
background-color: #f5f5f5;
border-color: #d9d9d9;
}
}
.ant-message-notice-content{
box-shadow: 0px 1px 8px 1px rgba(0, 0, 0, 0.11);
border-radius: 10px;
margin-top: 2rem;
margin-left: 10%;
font-size: 15px;
& a{
color: #466AFF;
&:hover{
opacity:0.8;
}
}
}

View File

@ -244,8 +244,9 @@ function Register(props){
})(<Input className="email" placeholder="请输入邮箱地址" readOnly onFocus={()=>{document.getElementById("register_email").removeAttribute("readOnly")}} />)} })(<Input className="email" placeholder="请输入邮箱地址" readOnly onFocus={()=>{document.getElementById("register_email").removeAttribute("readOnly")}} />)}
</Form.Item> </Form.Item>
<div className="login_register_head">
<Form.Item> <Form.Item>
<div className="login_register_head">
{getFieldDecorator('captcha', { {getFieldDecorator('captcha', {
rules: [{ rules: [{
required: true, required: true,
@ -256,8 +257,8 @@ function Register(props){
<Input className="captcha" placeholder="请输入验证码" readOnly onFocus={()=>{document.getElementById("register_captcha").removeAttribute("readOnly")}} /> <Input className="captcha" placeholder="请输入验证码" readOnly onFocus={()=>{document.getElementById("register_captcha").removeAttribute("readOnly")}} />
)} )}
<Button className={getCaptchaBut ? 'codeBut':'codeBut disable'} disabled={!getCaptchaBut} onClick={getCaptcha}>{getCaptchaBut || (!getCaptchaBut && !countDown)?"获取验证码":`重发(${secondsStr}s)`}</Button> <Button className={getCaptchaBut ? 'codeBut':'codeBut disable'} disabled={!getCaptchaBut} onClick={getCaptcha}>{getCaptchaBut || (!getCaptchaBut && !countDown)?"获取验证码":`重发(${secondsStr}s)`}</Button>
</Form.Item> </div>
</div> </Form.Item>
<Form.Item> <Form.Item>
{getFieldDecorator('register_psd',{ {getFieldDecorator('register_psd',{
@ -273,7 +274,7 @@ function Register(props){
validateFirst: true, validateFirst: true,
})(<Input.Password className="register_psd" placeholder="请输入登录密码" onBlur={clear} onChange={clear} readOnly onFocus={()=>{document.getElementById("register_register_psd").removeAttribute("readOnly")}}/>)} })(<Input.Password className="register_psd" placeholder="请输入登录密码" onBlur={clear} onChange={clear} readOnly onFocus={()=>{document.getElementById("register_register_psd").removeAttribute("readOnly")}}/>)}
</Form.Item> </Form.Item>
<span className="register_tips" style={{display:tipVisable?"none":"block"}}>请输入8-16位密码区分大小写不能使用空格</span> <span className="password_tips" style={{display:tipVisable?"none":"block"}}>请输入8-16位密码区分大小写不能使用空格</span>
<Form.Item> <Form.Item>
{getFieldDecorator('psdComfirm', { {getFieldDecorator('psdComfirm', {

View File

@ -198,8 +198,9 @@ function ResetPassword(props) {
})(<Input ref={inputEl} className="account" placeholder="请输入已注册的邮箱" readOnly onFocus={()=>{document.getElementById("resetPassword_email").removeAttribute("readOnly")}} />)} })(<Input ref={inputEl} className="account" placeholder="请输入已注册的邮箱" readOnly onFocus={()=>{document.getElementById("resetPassword_email").removeAttribute("readOnly")}} />)}
</Form.Item> </Form.Item>
<div className="login_register_head">
<Form.Item> <Form.Item>
<div className="login_register_head">
{getFieldDecorator('captcha', { {getFieldDecorator('captcha', {
rules: [{ rules: [{
required: true, required: true,
@ -210,8 +211,8 @@ function ResetPassword(props) {
<Input className="captcha" placeholder="请输入验证码" readOnly onFocus={()=>{document.getElementById("resetPassword_captcha").removeAttribute("readOnly")}} /> <Input className="captcha" placeholder="请输入验证码" readOnly onFocus={()=>{document.getElementById("resetPassword_captcha").removeAttribute("readOnly")}} />
)} )}
<Button className={getCaptchaBut ? 'codeBut':'codeBut disable'} disabled={!getCaptchaBut} onClick={getCaptcha}>{getCaptchaBut || (!getCaptchaBut && !countDown)?"获取验证码":`重发(${secondsStr}s)`}</Button> <Button className={getCaptchaBut ? 'codeBut':'codeBut disable'} disabled={!getCaptchaBut} onClick={getCaptcha}>{getCaptchaBut || (!getCaptchaBut && !countDown)?"获取验证码":`重发(${secondsStr}s)`}</Button>
</Form.Item> </div>
</div> </Form.Item>
<Form.Item> <Form.Item>
{getFieldDecorator('psd', { {getFieldDecorator('psd', {
@ -227,7 +228,7 @@ function ResetPassword(props) {
validateFirst: true, validateFirst: true,
})(<Input.Password className="psd" placeholder="请输入新密码" onBlur={clear} onChange={clear} readOnly onFocus={()=>{document.getElementById("resetPassword_psd").removeAttribute("readOnly")}} />)} })(<Input.Password className="psd" placeholder="请输入新密码" onBlur={clear} onChange={clear} readOnly onFocus={()=>{document.getElementById("resetPassword_psd").removeAttribute("readOnly")}} />)}
</Form.Item> </Form.Item>
<span className="register_tips" style={{display:tipVisable?"none":"block"}}>请输入8-16位密码区分大小写不能使用空格</span> <span className="password_tips" style={{display:tipVisable?"none":"block"}}>请输入8-16位密码区分大小写不能使用空格</span>
<Form.Item> <Form.Item>
{getFieldDecorator('psdComfirm', { {getFieldDecorator('psdComfirm', {

Binary file not shown.

Before

Width:  |  Height:  |  Size: 45 KiB

After

Width:  |  Height:  |  Size: 151 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 255 KiB

After

Width:  |  Height:  |  Size: 856 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 114 KiB

After

Width:  |  Height:  |  Size: 356 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 108 KiB

After

Width:  |  Height:  |  Size: 82 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 92 KiB

After

Width:  |  Height:  |  Size: 68 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 24 KiB

After

Width:  |  Height:  |  Size: 23 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 134 KiB

After

Width:  |  Height:  |  Size: 99 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 107 KiB

After

Width:  |  Height:  |  Size: 78 KiB