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

src/App.js

@@ -137,14 +137,17 @@ class App extends Component {
     this.unlisten = this.props.history.listen((location) => {
       let newPathname = location.pathname.split('/')[1];
       if (this.state.pathName !== newPathname) {
-        this.setState({ pathType: '' });
+        // this.setState({ pathType: '' });
         newPathname && this.getPathnameType(newPathname);
       }
     });
   }
 
   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) {
       return false;
     } else {

src/AppConfig.js

@@ -25,7 +25,7 @@ if (isDev) {
   }
   debugType = window.location.search.indexOf('debug=t') !== -1 ? 'teacher' :
   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;
 export function initAxiosInterceptors(props) {

src/forge/Head/Header.js

@@ -473,9 +473,9 @@ class NewHeader extends Component {
               {
                 (settings && settings.common && settings.common.register) ?
                   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>

src/modules/loginRegister/Login.jsx

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

src/modules/loginRegister/LoginRegisterPage.jsx

@@ -11,9 +11,9 @@ import '../loginRegister/LoginRegisterPage.scss';
 
 function LoginRegisterPage(props){
   return(
-    <div className="login_register">
+    <div className="loginRegister">
       <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={banner} className="banner"></img>
       </div>
@@ -22,6 +22,7 @@ function LoginRegisterPage(props){
         <img src={img1} className="img1"></img>
         <img src={img2} className="img2"></img>
       </div>
+      <div className="clear"></div>
     </div>
   )
 }

src/modules/loginRegister/LoginRegisterPage.scss

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

src/modules/loginRegister/Register.jsx

@@ -244,8 +244,9 @@ function Register(props){
             })(<Input className="email" placeholder="请输入邮箱地址" readOnly onFocus={()=>{document.getElementById("register_email").removeAttribute("readOnly")}} />)}
           </Form.Item>
 
-          <div className="login_register_head">
-            <Form.Item>
+          
+          <Form.Item>
+            <div className="login_register_head">
               {getFieldDecorator('captcha', {
                 rules: [{
                   required: true,
@@ -256,8 +257,8 @@ function Register(props){
                 <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>
-            </Form.Item>
-          </div>
+            </div>
+          </Form.Item>
           
           <Form.Item>
             {getFieldDecorator('register_psd',{
@@ -273,7 +274,7 @@ function Register(props){
               validateFirst: true,
             })(<Input.Password className="register_psd" placeholder="请输入登录密码" onBlur={clear}  onChange={clear} readOnly onFocus={()=>{document.getElementById("register_register_psd").removeAttribute("readOnly")}}/>)}
           </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>
             {getFieldDecorator('psdComfirm', {

src/modules/loginRegister/ResetPassword.jsx

@@ -198,8 +198,9 @@ function ResetPassword(props) {
             })(<Input ref={inputEl} className="account" placeholder="请输入已注册的邮箱" readOnly onFocus={()=>{document.getElementById("resetPassword_email").removeAttribute("readOnly")}} />)}
           </Form.Item>
 
-          <div className="login_register_head">
-            <Form.Item>
+          
+          <Form.Item>
+            <div className="login_register_head">
               {getFieldDecorator('captcha', {
                 rules: [{
                   required: true,
@@ -210,8 +211,8 @@ function ResetPassword(props) {
                 <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>
-            </Form.Item>
-          </div>
+            </div>
+          </Form.Item>
 
           <Form.Item>
             {getFieldDecorator('psd', {
@@ -227,7 +228,7 @@ function ResetPassword(props) {
               validateFirst: true,
             })(<Input.Password className="psd" placeholder="请输入新密码" onBlur={clear} onChange={clear} readOnly onFocus={()=>{document.getElementById("resetPassword_psd").removeAttribute("readOnly")}} />)}
           </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>
             {getFieldDecorator('psdComfirm', {