feat: 添加首页，将登录注册移至首页

client/components/Header/Header.js

@@ -32,49 +32,36 @@ ToolGuest.propTypes={
 class Header extends Component {
   constructor(props) {
     super(props);
-    this.state={
-      guestToolShow:true
-    }
   }
   handleLogin = (e) => {
     e.preventDefault();
     this.props.loginTypeAction("1");
-    this.setState({
-      guestToolShow:false
-    })
   }
   handleReg = (e)=>{
     e.preventDefault();
     this.props.loginTypeAction("2");
-    this.setState({
-      guestToolShow:false
-    })
-  }
-  hideGuestTool = (e)=>{
-    e.preventDefault();
-    this.setState({
-      guestToolShow:true
-    })
   }
   render () {
     const { login, user, msg } = this.props;
     return (
       <acticle className="header-box">
         <div className="content">
-          <h1>YAPI</h1>
+          <h1>
+            <Link to={`/`}>YAPI</Link>
+          </h1>
           <ul className="nav-toolbar">
-            <li onClick={this.hideGuestTool}>
+            <li>
               <Link to={`/ProjectGroups`}>分组</Link>
             </li>
-            <li onClick={this.hideGuestTool}>
+            <li>
               <a>我的项目</a>
             </li>
-            <li onClick={this.hideGuestTool}>
+            <li>
               <a>文档</a>
             </li>
           </ul>
           <ul className="user-toolbar">
-            {login?<ToolUser user={user} msg={msg}/>:(this.state.guestToolShow?<ToolGuest onLogin={this.handleLogin} onReg={this.handleReg}/>:'')}
+            {login?<ToolUser user={user} msg={msg}/>:''}
           </ul>
         </div>
       </acticle>

client/components/Header/Header.scss

@@ -21,8 +21,18 @@ $color-grey-deep : #929aac;
   h1 {
     font-size: .25rem;
     float: left;
-    margin: 0 .2rem;
+    margin: 0 .2rem 0 0;
     color: $color-white;
+    cursor: pointer;
+    a{
+      color: $color-white;
+      &:hover {
+        color: $color-white;
+      }
+      &:focus{
+        text-decoration: none;
+      }
+    }
   }
 
   .nav-toolbar {

client/containers/Home/Home.js

@@ -1,5 +1,7 @@
 import './Home.scss'
 import React, { Component } from 'react'
+import Login from '../Login/login-wrap'
+
 
 class Home extends Component {
   constructor(props) {
@@ -8,9 +10,15 @@ class Home extends Component {
 
   render () {
     return (
-      <acticle className="home-main">
-        主页
-      </acticle>
+      <div className="home-main">
+        <div className="main-one">
+          <div className="home-des">
+            <p className="title">YAPI</p>
+            <div className="detail">一个高效，易用，功能强大的api管理系统</div>
+          </div>
+          <Login/>
+        </div>
+      </div>
     )
   }
 }

client/containers/Home/Home.scss

@@ -1,42 +1,27 @@
 @import '../../styles/common.scss';
 /* .home-main.css */
-// .home-main {
-//   display: -webkit-box;
-//   -webkit-box-orient: vertical;
-//   height: 100%;
-// }
+.home-main {
+  display: -webkit-box;
+  max-width: 11rem;
+  margin: 0 auto;
+  -webkit-box-orient: vertical;
+  .main-one{
+    height:calc(100% - .64rem);
+    padding: .5rem 0;
+    .home-des{
+      padding: .3rem 0;
+      .title{
+        font-size: .6rem;
+      }
+      .detail{
+        font-size: .23rem;
+      }
+    }
+    .login-form{
 
-// /* .home-box.css */
-// .home-box {
-//   font-size: 0.14rem;
-//   display: -webkit-box;
-//   -webkit-box-align: center;
-//   -webkit-box-pack: center;
-//   -webkit-box-flex: 1;
+    }
+  }
 
-//   .content {
-//     max-width: 5rem;
-//     min-width: 3rem;
-//     zoom: 1;
-//     overflow: hidden;
-//     margin: -70px 0 0 0;
-//   }
+}
 
-//   h3 {
-//     font-size: 0.2rem;
-//   }
-
-//   a {
-//     font-size: 0.14rem;
-//   }
-
-//   .ant-input-affix-wrapper {
-//     margin: 0 0 20px 0;
-//     height: 35px;
-//   }
-
-//   .login {
-//     float: right;
-//   }
-// }
 

client/containers/Login/Login.scss

@@ -1,7 +0,0 @@
-@import '../../styles/common.scss';
-
-/* .login-main.css */
-.login-form {
-  width: 4rem;
-  margin: 1rem auto;
-}

client/containers/Login/login.scss

@@ -3,5 +3,4 @@
 /* .login-main.css */
 .login-form {
   width: 4rem;
-  margin: 1rem auto;
 }

client/routes.js

@@ -1,13 +1,14 @@
 import React from 'react'
 import { Route, HashRouter } from 'react-router-dom'
-import { Home, Login, ProjectGroups, Interface } from './containers/index'
+import { Home, ProjectGroups, Interface } from './containers/index'
+import Header from './components/Header/Header'
 
 export default () => {
   return (
     <HashRouter>
       <div className="router-main">
+        <Header/>
         <Route path="/" component={ Home } exact />
-        <Route path="/Login" component={ Login } />
         <Route path="/ProjectGroups" component={ ProjectGroups } />
         <Route path="/Interface" component={ Interface } />
       </div>