Common

package.json

@@ -8,8 +8,8 @@
     "precommit": "lint-staged"
   },
   "devDependencies": {
-    "babel-eslint": "^9.0.0",
-    "eslint": "^5.4.0",
+    "babel-eslint": "^7.2.3",
+    "eslint": "^4.19.1",
     "eslint-config-umi": "^0.1.5",
     "eslint-plugin-flowtype": "^2.50.0",
     "eslint-plugin-import": "^2.14.0",
@@ -30,17 +30,23 @@
     "node": ">=8.0.0"
   },
   "dependencies": {
-    "@material-ui/core": "^3.7.1",
+    "@material-ui/core": "^3.9.0",
     "@material-ui/icons": "^3.0.1",
+    "@material-ui/styles": "^3.0.0-alpha.8",
     "axios": "^0.18.0",
+    "dva-core": "1.1.0",
     "eslint-config-alloy": "^1.4.2",
     "eslint-plugin-typescript": "^0.14.0",
+    "jss": "10.0.0-alpha.3",
     "mockjs": "^1.0.1-beta3",
     "nprogress": "^0.2.0",
-    "react": "16.7.0-alpha.0",
-    "react-dom": "16.7.0-alpha.0",
+    "react": "16.7.0-alpha.2",
+    "react-dom": "16.7.0-alpha.2",
+    "react-router": "4.4.0-beta.1",
+    "redbox-react": "1.x",
+    "redux": "3.x",
+    "typescript": "*",
     "typescript-eslint-parser": "^21.0.1",
-    "typings-for-css-modules-loader": "^1.7.0",
     "webpack-bundle-analyzer": "^3.0.3"
   }
 }

src/component/common/BasicHeader/index.tsx

@@ -1,8 +1,10 @@
 import React, { Component } from 'react';
 import styles from './index.less';
 import { Menu, Icon } from 'antd';
-import logo from 'assets/images/home/logo@2x.png';
+import logo from 'assets/svg/logo@2x.svg';
 import router from 'umi/router';
+import Nav from './nav';
+import Search from '@material-ui/icons/Search';
 
 export default class BasicHeader extends Component {
   state = {
@@ -17,23 +19,24 @@ export default class BasicHeader extends Component {
   };
 
   render() {
-    const Nav = props => (
-      <Menu onClick={props.handleClick} selectedKeys={[props.current]} mode="horizontal">
-        <Menu.Item key="home">首页</Menu.Item>
-        <Menu.Item key="project-center">项目中心</Menu.Item>
-        <Menu.Item key="talent-plaza">人才广场</Menu.Item>
-      </Menu>
-    );
+    // const Nav = props => (
+    //   <Menu onClick={props.handleClick} selectedKeys={[props.current]} mode="horizontal">
+    //     <Menu.Item key="home">首页</Menu.Item>
+    //     <Menu.Item key="project-center">项目中心</Menu.Item>
+    //     <Menu.Item key="talent-plaza">人才广场</Menu.Item>
+    //   </Menu>
+    // );
     return (
       <header className={styles['cr-header']}>
         <div className={'cr-logo'}>
           <img src={logo} alt="" />
         </div>
         <div className={'cr-nav'}>
-          <Nav handleClick={this.handleClick} current={this.state.current} />
+          {/* <Nav handleClick={this.handleClick} current={this.state.current} /> */}
+          <Nav />
         </div>
         <div className={'cr-user'}>
-          <Icon type="search" />
+          <Search style={{ width: 30, height: 30, verticalAlign: 'middle' }} />
           <span
             onClick={() => {
               router.push('/user');
@@ -43,7 +46,7 @@ export default class BasicHeader extends Component {
           </span>
           <span
             onClick={() => {
-              router.push('/user');
+              router.push('/user/register');
             }}
           >
             注册

src/component/common/BasicHeader/nav.tsx

@@ -0,0 +1,51 @@
+import React from 'react';
+import { makeStyles, withStyles } from '@material-ui/styles';
+import Paper from '@material-ui/core/Paper';
+import Tabs from '@material-ui/core/Tabs';
+import Tab from '@material-ui/core/Tab';
+
+const useStyles = makeStyles({
+  root: {
+    flexGrow: 1,
+  },
+  labelFont: {
+    fontSize: '20px !important',
+    lineHeight: '60px !important',
+    color: '#40aea8 !important',
+    // borderBottom: '4px solid #40aea8 !important',
+  },
+});
+
+const MTabs = withStyles({
+  indicator: {
+    height: '4px !important',
+    backgroundColor: '#40aea8 !important',
+  },
+})(Tabs);
+
+function Nav() {
+  const classes = useStyles();
+  const [value, setValue] = React.useState(0);
+
+  function handleChange(event, newValue) {
+    setValue(newValue);
+  }
+
+  return (
+    <Paper className={classes.root}>
+      <MTabs
+        value={value}
+        onChange={handleChange}
+        indicatorColor="primary"
+        textColor="primary"
+        centered
+      >
+        <Tab className={classes.labelFont} label="首页" />
+        <Tab className={classes.labelFont} label="项目中心" />
+        <Tab className={classes.labelFont} label="人才广场" />
+      </MTabs>
+    </Paper>
+  );
+}
+
+export default Nav;

src/index.d.ts

@@ -1,2 +1,3 @@
 declare module '*.png';
+declare module '*.svg';
 declare module 'component/*';

src/pages/coderiver/index.tsx

@@ -1,9 +1,9 @@
-import React, { Component } from 'react';
+import React, { Component, ReactNode } from 'react';
 import HomeTitle from 'component/home/HomeTitle';
 import bgimg from 'assets/images/home/bg@2x(1).png';
 
 export default class Home extends Component {
-  render() {
+  render(): ReactNode {
     return (
       <div>
         <img style={{ width: '100%' }} src={bgimg} alt="" />