diff --git a/public/react/src/common/mediator.js b/public/react/src/common/mediator.js
new file mode 100644
index 000000000..464a5cbf8
--- /dev/null
+++ b/public/react/src/common/mediator.js
@@ -0,0 +1,46 @@
+function Mediator(obj) {
+  const channels = {}
+
+  const mediator = {
+    subscribe: function (channel, cb) {
+      if (!channels[channel]) {
+        channels[channel] = []
+      }
+      channels[channel].push(cb)
+      return this.unsubscribe.bind(null, channel, cb)
+    },
+
+    unsubscribe: function (channel, cb) {
+      let rs = channels[channel]
+      let index = -1
+      if (rs) {
+        for (let i = 0; i < rs.length; i++) {
+          if (rs[i].name === cb.name) {
+            index = i
+            break
+          }
+        }
+        if (index >= 0) {
+          channels[channel].splice(index, 1)
+          return true
+        }
+      }
+      return false
+    },
+
+    publish: function (channel) {
+      if (!channels[channel]) {
+        return false
+      }
+      const args = Array.prototype.slice.call(arguments, 1)
+      channels[channel].forEach(subscription => {
+        subscription.apply(null, args)
+      })
+      return this
+    },
+  }
+
+  return obj ? Object.assign(obj, mediator) : mediator
+}
+const mediator = new Mediator()
+export default mediator  
diff --git a/public/react/src/modules/courses/coursesHome/CoursesHome.js b/public/react/src/modules/courses/coursesHome/CoursesHome.js
index 586465849..c96426446 100644
--- a/public/react/src/modules/courses/coursesHome/CoursesHome.js
+++ b/public/react/src/modules/courses/coursesHome/CoursesHome.js
@@ -1,11 +1,14 @@
-import React, { Component } from 'react';
+import React, { Component, Fragment } from 'react';
 import { getImageUrl } from 'educoder';
 import CoursesHomeCard from "./CoursesHomeCard.js"
 import axios from 'axios';
-import { Input, Pagination } from 'antd';
+import { Pagination } from 'antd';
 import LoadingSpin from '../../../common/LoadingSpin';
 import UpgradeModals from '../../modals/UpgradeModals';
 import './css/CoursesHome.css';
+import '../../tpm/shixuns/shixun-keyword-list.scss';
+import btnNew from './btn-new.png'
+import btnJoin from './btn-join.png'
 
 class CoursesHome extends Component {
   constructor(props) {
@@ -51,7 +54,7 @@ class CoursesHome extends Component {
   }
 
   componentDidMount() {
-    document.title = "翻转课堂";
+    document.title = "教学课堂";
     const upsystem = `/users/system_update.json`;
     axios.get(upsystem).then((response) => {
       let updata = response.data;
@@ -116,7 +119,9 @@ class CoursesHome extends Component {
   }
   render() {
 
-    let { order, search, page, coursesHomelist } = this.state;
+    const { order, page, coursesHomelist } = this.state;
+    const { user, tojoinclass } = this.props
+    console.log(tojoinclass, '--------------s')
     return (
       <div>
         {this.state.updata === undefined ? "" : <UpgradeModals
@@ -125,7 +130,9 @@ class CoursesHome extends Component {
         <div className="newMain clearfix">
           <style>
             {
-              `
+              `    ::-webkit-scrollbar {
+                      width: 0px !important;
+                    }
 										.courses-head{
 												width: 100%;
 												height: 300px;
@@ -145,13 +152,19 @@ class CoursesHome extends Component {
             </div>
           </div>
 
-          <div className="mt20 educontent mb20 clearfix">
-            <a className={order == "created_at" ? "fl mr20 font-16 bestChoose active" : "fl mr20 font-16 bestChoose"}
-              onClick={() => this.changeStatus("created_at")}>最新</a>
-            <a className={order == "visits" ? "fl mr20 font-16 bestChoose active" : "fl mr20 font-16 bestChoose"}
-              onClick={() => this.changeStatus("visits")}>最热</a>
-            {this.props.user && this.props.user.user_identity === "学生" ? "" : <span className={"fr font-16 bestChoose color-blue"} onClick={(url) => this.getUser("/courses/new")}>+新建翻转课堂</span>}
-
+          <div className="wrapper">
+            <div className="educontent  search-keyword-container" style={{ padding: '20px 0 0 0' }}>
+              <div className="btn-groups">
+                <a id='new' className={order === 'created_at' ? 'active' : ''} onClick={() => this.changeStatus("created_at")} title='最新'>最新</a>
+                <a id='hot' className={order === 'visits' ? 'active' : ''} onClick={() => this.changeStatus("visits")} title='最热'>最热</a>
+              </div>
+            </div>
+            {user && user.user_identity !== '学生' ?
+              <Fragment>
+                <a className="btn-new" style={{ top: '67px' }} onClick={() => { this.getUser("/courses/new") }} > <img src={btnNew} width={40} alt="创建教学课堂" /> </a>
+                <a className="btn-join" style={{ top: '123px' }} onClick={() => { window._header_componentHandler.tojoinclass() }} > <img src={btnJoin} width={40} alt="加入教学课堂" /> </a>
+              </Fragment> : null
+            }
           </div>
 
           {coursesHomelist === undefined ? <LoadingSpin /> : <CoursesHomeCard {...this.props} {...this.state}
diff --git a/public/react/src/modules/courses/coursesHome/btn-join.png b/public/react/src/modules/courses/coursesHome/btn-join.png
new file mode 100644
index 000000000..de1fdb3df
Binary files /dev/null and b/public/react/src/modules/courses/coursesHome/btn-join.png differ
diff --git a/public/react/src/modules/courses/coursesHome/btn-new.png b/public/react/src/modules/courses/coursesHome/btn-new.png
new file mode 100644
index 000000000..af288c560
Binary files /dev/null and b/public/react/src/modules/courses/coursesHome/btn-new.png differ
diff --git a/public/react/src/modules/tpm/NewHeader.js b/public/react/src/modules/tpm/NewHeader.js
index c8d894ecd..1f1f7a7f3 100644
--- a/public/react/src/modules/tpm/NewHeader.js
+++ b/public/react/src/modules/tpm/NewHeader.js
@@ -2,7 +2,9 @@ import React, { Component } from 'react';
 import { Link } from "react-router-dom";
 import AccountProfile from "../user/AccountProfile";
 import Certifiedprofessional from "../../modules/modals/Certifiedprofessional"
+
 import { getImageUrl } from 'educoder'
+
 import axios from 'axios';
 
 import { Modal, Radio, Input, message, notification } from 'antd';
@@ -100,9 +102,6 @@ class NewHeader extends Component {
     }
   }
 
-  componentDidUpdate = (prevProps) => {
-  }
-
   openNotification = (messge) => {
     notification.open({
       message: "提示",
@@ -115,6 +114,9 @@ class NewHeader extends Component {
     this.setState({
       user: newProps.user
     })
+    if (newProps.Headertop != undefined) {
+      old_url = newProps.Headertop.old_url
+    }
 
   }
   getCookie = (key) => {
@@ -343,6 +345,14 @@ class NewHeader extends Component {
       })
       return
     }
+    // }else if(value===0){
+    //   if(tojoinclasstitle.length<5){
+    //     this.setState({
+    //       code_notice:true
+    //     })
+    //     return
+    //   }
+    // }
     if (tojoinclasstitle === "" || tojoinclasstitle === undefined) {
       this.setState({
         code_notice: true
@@ -410,7 +420,6 @@ class NewHeader extends Component {
     }
     this.hidetojoinclass()
   }
-
   // 关闭
   cancelModulationModels = () => {
     this.setState({ isRenders: false })
@@ -568,6 +577,13 @@ class NewHeader extends Component {
     document.head.appendChild(link);
   }
 
+  getAppdata = () => {
+    try {
+      var chromesettingArray = JSON.parse(localStorage.getItem('chromesetting'));
+      var chromesettingresponseArray = JSON.parse(localStorage.getItem('chromesettingresponse'));
+      // console.log("NewHeaderNewHeaderNewHeader");
+      // console.log(chromesettingArray);
+      // console.log(chromesettingresponseArray);
 
   handleVisibleChanges = (boll) => {
     this.setState({
@@ -750,69 +766,69 @@ class NewHeader extends Component {
     }
 
     // console.log(mygetHelmetapi2);
-		// console.log("NewHeadermygetHelmetapi123123123123");
-
-		let shixuntype=false;
-		let pathstype=false;
-		let coursestypes=false;
-		if(this.props&&this.props.mygetHelmetapi!=null){
-			let shixun="/shixuns";
-			let paths="/paths";
-			let courses="/courses";
-			this.props.mygetHelmetapi.navbar.map((item,key)=>{
-				var reg = RegExp(item.link);
-				if(shixun.match(reg)){
-					if(item.hidden===true){
-						shixuntype=true
-					}
-				}
-				if(paths.match(reg)){
-					if(item.hidden===true){
-						pathstype=true
-					}
-				}
-				if(courses.match(reg)){
-					if(item.hidden===true){
-						coursestypes=true
-					}
-				}
-			})
-		}
-
-		const contents = (
-			<div  className="questiontypes"  style={{
-				width:'93px',
-				height:'80px',
-			}}>
-				<Link to={'/question'} className={"popovertests"} ><p className="questiontype">试题库</p></Link>
-				<p className="questiontypeheng"></p>
-				<Link to={'/paperlibrary'} className={"popovertests"} ><p className="questiontype">试卷库</p></Link>
-
-			</div>
-		);
-
-		// console.log("头部");
-		// console.log(this.props);
-		//判断平台身份
-		let Periofters=false;
-		if(this.props){
-			if(this.props.current_user){
-				if(this.props.current_user.admin){
-					Periofters=true;
-				}
-				else if(this.props.current_user.business){
-					Periofters=true;
-				}
-				else if(this.props.current_user.is_teacher){
-					Periofters=true;
-				}else if(this.props.current_user.user_identity !=="学生") {
-					Periofters=true;
-				}
-			}
-		}
-
-
-		return (
+    // console.log("NewHeadermygetHelmetapi123123123123");
+
+    let shixuntype = false;
+    let pathstype = false;
+    let coursestypes = false;
+    if (this.props && this.props.mygetHelmetapi != null) {
+      let shixun = "/shixuns";
+      let paths = "/paths";
+      let courses = "/courses";
+      this.props.mygetHelmetapi.navbar.map((item, key) => {
+        var reg = RegExp(item.link);
+        if (shixun.match(reg)) {
+          if (item.hidden === true) {
+            shixuntype = true
+          }
+        }
+        if (paths.match(reg)) {
+          if (item.hidden === true) {
+            pathstype = true
+          }
+        }
+        if (courses.match(reg)) {
+          if (item.hidden === true) {
+            coursestypes = true
+          }
+        }
+      })
+    }
+
+    const contents = (
+      <div className="questiontypes" style={{
+        width: '93px',
+        height: '80px',
+      }}>
+        <Link to={'/question'} className={"popovertests"} ><p className="questiontype">试题库</p></Link>
+        <p className="questiontypeheng"></p>
+        <Link to={'/paperlibrary'} className={"popovertests"} ><p className="questiontype">试卷库</p></Link>
+
+      </div>
+    );
+
+    // console.log("头部");
+    // console.log(this.props);
+    //判断平台身份
+    let Periofters = false;
+    if (this.props) {
+      if (this.props.current_user) {
+        if (this.props.current_user.admin) {
+          Periofters = true;
+        }
+        else if (this.props.current_user.business) {
+          Periofters = true;
+        }
+        else if (this.props.current_user.is_teacher) {
+          Periofters = true;
+        } else if (this.props.current_user.user_identity !== "学生") {
+          Periofters = true;
+        }
+      }
+    }
+
+
+    return (
 
       <div className="newHeaders" id="nHeader"  >
         <style>{
@@ -917,117 +933,117 @@ class NewHeader extends Component {
 											 padding:0px !important;
 											 }
 												`
-											}
-										</style>
-										{/*{*/}
-										{/*	Periofters===true?*/}
-										{/*		<li className={`pr  questionbanks`}  >*/}
-										{/*			<Popover  className="queyppors" id={"yslpopovers"} placement="bottom"  content={contents} trigger="click" >*/}
-										{/*				<div className=" sortinxdirection mr10">*/}
-										{/*					<div style={{*/}
-										{/*						color:"#fff"*/}
-										{/*					}}>*/}
-										{/*						题库*/}
-										{/*					</div>*/}
-										{/*				</div>*/}
-										{/*			</Popover>*/}
-										{/*		</li>*/}
-										{/*		:""*/}
-										{/*}*/}
-
-
-										<li
-											style={{display: this.props.Headertop === undefined ? 'none' : this.props.Headertop.auth === null ? 'none' : 'block'}}
-										><a href={this.props.Headertop === undefined ? "" : this.props.Headertop.auth}>工程认证</a></li>
-
-										<li className="fl edu-menu-panel  careershover "
-												style={{display: this.props.Headertop === undefined ?'none'  : this.props.Headertop.career_url.length > 0 ? 'block' : 'none'}}>
-											<a>职业路径</a>
-											<div
-												style={{display: this.props.Headertop === undefined ?'none'  : this.props.Headertop.career_url.length > 0 ? 'block' : 'none'}}>
-												<ul className="edu-menu-list edu-menu-listnew " style={{top:'60px'}}>
-													{this.props.Headertop === undefined ? "" : this.props.Headertop.career_url.map((item, key) => {
-														return(
-															<li key={key}><i className="iconfont icon-java left careersiconfont"
-																							 style={{color: '#000 important'}}
-															></i><a style={{width: '83%'}}
-																			href={item.url}>{item.name}</a></li>
-														)
-													})
-													}
-												</ul>
-											</div>
-										</li>
-									</ul>
-								</div>
-								:
-								<div className="head-nav pr" id={"head-navpre3"}>
-
-									<ul id="header-nav">
-										{/*<li className={`${activeIndex === true ? 'active' : ''}`}><a href="/">首页</a></li>*/}
-
-										{/*<li><a href={this.props.Headertop===undefined?"":this.props.Headertop.shixun_paths_url}>实训路径</a></li>*/}
-										<li className={`${activePaths === true ? 'pr active' : 'pr'}`}>
-											<Link to={this.props.Headertop===undefined?"":'/paths'}>实践课程</Link>
-										</li>
-
-										{/*<li><a href={this.props.Headertop===undefined?"":'/courses'}>课堂</a></li>*/}
-										<li className={`${coursestype === true ? 'pr active' : 'pr'}`}>
-											{/*<a href={this.props.Headertop===undefined?"":this.props.Headertop.course_url}>课堂</a>*/}
-											<Link to={this.props.Headertop===undefined?"":'/courses'}>教学课堂</Link>
-										</li>
-										<li className={`${activeShixuns === true ? 'pr active' : 'pr'}`}>
-											<Link to="/shixuns">实训项目</Link>
-											{/*<img src={getImageUrl("images/educoder/hot-h.png")} className="nav-img">*/}
-											{/*</img>*/}
-										</li>
-
-										<li className="fl edu-menu-panel  careershover "
-												style={{display: this.props.Headertop === undefined ?'none'  : this.props.Headertop.career_url.length > 0 ? 'block' : 'none'}}>
-											<a>职业路径</a>
-											<div
-												style={{display: this.props.Headertop === undefined ?'none'  : this.props.Headertop.career_url.length > 0 ? 'block' : 'none'}}>
-												<ul className="edu-menu-list edu-menu-listnew " style={{top:'60px'}}>
-													{this.props.Headertop === undefined ? "" : this.props.Headertop.career_url.map((item, key) => {
-														return(
-															<li key={key}><i className="iconfont icon-java left careersiconfont"
-																							 style={{color: '#000 important'}}
-															></i><a style={{width: '83%'}}
-																			href={item.url}>{item.name}</a></li>
-														)
-													})
-													}
-												</ul>
-											</div>
-										</li>
-
-										{/*<li className=""><a href={"/libraries"}>教学案例</a></li>*/}
-										<li className={`${activeCompetitions === true ? 'pr active' : 'pr'}`}>
-											<a href={this.props.Headertop===undefined?"":this.props.Headertop.competitions_url}>在线竞赛</a>
-											{/*<img className="roundedRectangles"*/}
-											{/*		 src={require('./roundedRectangle.png')}*/}
-											{/*/>*/}
-										</li>
-										<li className={`${activeMoopCases === true ? 'pr active' : 'pr'}`}> <Link to={`/moop_cases`}>教学案例</Link></li>
-										{/*<li className={`${activePackages === true ? 'pr active' : 'pr'}`}>*/}
-										{/*<Link to={'/crowdsourcing'}>众包创新</Link>*/}
-										{/*</li>*/}
-										<li className={`${activeForums === true ? 'active' : ''}`}>	<Link to={this.props.Headertop===undefined?"":this.props.Headertop.topic_url}>交流问答</Link></li>
-										<li
-											style={{display: this.props.Headertop === undefined ? 'none'  : this.props.Headertop.auth===null? 'none' : 'block'}}
-										><a href={this.props.Headertop===undefined?"":this.props.Headertop.auth}>工程认证</a></li>
-									</ul>
-								</div>
-					}
-
-
-
-
-
-
-				<style>
-					{
-						`
+                    }
+                  </style>
+                  {/*{*/}
+                  {/*	Periofters===true?*/}
+                  {/*		<li className={`pr  questionbanks`}  >*/}
+                  {/*			<Popover  className="queyppors" id={"yslpopovers"} placement="bottom"  content={contents} trigger="click" >*/}
+                  {/*				<div className=" sortinxdirection mr10">*/}
+                  {/*					<div style={{*/}
+                  {/*						color:"#fff"*/}
+                  {/*					}}>*/}
+                  {/*						题库*/}
+                  {/*					</div>*/}
+                  {/*				</div>*/}
+                  {/*			</Popover>*/}
+                  {/*		</li>*/}
+                  {/*		:""*/}
+                  {/*}*/}
+
+
+                  <li
+                    style={{ display: this.props.Headertop === undefined ? 'none' : this.props.Headertop.auth === null ? 'none' : 'block' }}
+                  ><a href={this.props.Headertop === undefined ? "" : this.props.Headertop.auth}>工程认证</a></li>
+
+                  <li className="fl edu-menu-panel  careershover "
+                    style={{ display: this.props.Headertop === undefined ? 'none' : this.props.Headertop.career_url.length > 0 ? 'block' : 'none' }}>
+                    <a>职业路径</a>
+                    <div
+                      style={{ display: this.props.Headertop === undefined ? 'none' : this.props.Headertop.career_url.length > 0 ? 'block' : 'none' }}>
+                      <ul className="edu-menu-list edu-menu-listnew " style={{ top: '60px' }}>
+                        {this.props.Headertop === undefined ? "" : this.props.Headertop.career_url.map((item, key) => {
+                          return (
+                            <li key={key}><i className="iconfont icon-java left careersiconfont"
+                              style={{ color: '#000 important' }}
+                            ></i><a style={{ width: '83%' }}
+                              href={item.url}>{item.name}</a></li>
+                          )
+                        })
+                        }
+                      </ul>
+                    </div>
+                  </li>
+                </ul>
+              </div>
+              :
+              <div className="head-nav pr" id={"head-navpre3"}>
+
+                <ul id="header-nav">
+                  {/*<li className={`${activeIndex === true ? 'active' : ''}`}><a href="/">首页</a></li>*/}
+
+                  {/*<li><a href={this.props.Headertop===undefined?"":this.props.Headertop.shixun_paths_url}>实训路径</a></li>*/}
+                  <li className={`${activePaths === true ? 'pr active' : 'pr'}`}>
+                    <Link to={this.props.Headertop === undefined ? "" : '/paths'}>实践课程</Link>
+                  </li>
+
+                  {/*<li><a href={this.props.Headertop===undefined?"":'/courses'}>课堂</a></li>*/}
+                  <li className={`${coursestype === true ? 'pr active' : 'pr'}`}>
+                    {/*<a href={this.props.Headertop===undefined?"":this.props.Headertop.course_url}>课堂</a>*/}
+                    <Link to={this.props.Headertop === undefined ? "" : '/courses'}>教学课堂</Link>
+                  </li>
+                  <li className={`${activeShixuns === true ? 'pr active' : 'pr'}`}>
+                    <Link to="/shixuns">实训项目</Link>
+                    {/*<img src={getImageUrl("images/educoder/hot-h.png")} className="nav-img">*/}
+                    {/*</img>*/}
+                  </li>
+
+                  <li className="fl edu-menu-panel  careershover "
+                    style={{ display: this.props.Headertop === undefined ? 'none' : this.props.Headertop.career_url.length > 0 ? 'block' : 'none' }}>
+                    <a>职业路径</a>
+                    <div
+                      style={{ display: this.props.Headertop === undefined ? 'none' : this.props.Headertop.career_url.length > 0 ? 'block' : 'none' }}>
+                      <ul className="edu-menu-list edu-menu-listnew " style={{ top: '60px' }}>
+                        {this.props.Headertop === undefined ? "" : this.props.Headertop.career_url.map((item, key) => {
+                          return (
+                            <li key={key}><i className="iconfont icon-java left careersiconfont"
+                              style={{ color: '#000 important' }}
+                            ></i><a style={{ width: '83%' }}
+                              href={item.url}>{item.name}</a></li>
+                          )
+                        })
+                        }
+                      </ul>
+                    </div>
+                  </li>
+
+                  {/*<li className=""><a href={"/libraries"}>教学案例</a></li>*/}
+                  <li className={`${activeCompetitions === true ? 'pr active' : 'pr'}`}>
+                    <a href={this.props.Headertop === undefined ? "" : this.props.Headertop.competitions_url}>在线竞赛</a>
+                    {/*<img className="roundedRectangles"*/}
+                    {/*		 src={require('./roundedRectangle.png')}*/}
+                    {/*/>*/}
+                  </li>
+                  <li className={`${activeMoopCases === true ? 'pr active' : 'pr'}`}> <Link to={`/moop_cases`}>教学案例</Link></li>
+                  {/*<li className={`${activePackages === true ? 'pr active' : 'pr'}`}>*/}
+                  {/*<Link to={'/crowdsourcing'}>众包创新</Link>*/}
+                  {/*</li>*/}
+                  <li className={`${activeForums === true ? 'active' : ''}`}>	<Link to={this.props.Headertop === undefined ? "" : this.props.Headertop.topic_url}>交流问答</Link></li>
+                  <li
+                    style={{ display: this.props.Headertop === undefined ? 'none' : this.props.Headertop.auth === null ? 'none' : 'block' }}
+                  ><a href={this.props.Headertop === undefined ? "" : this.props.Headertop.auth}>工程认证</a></li>
+                </ul>
+              </div>
+        }
+
+
+
+
+
+
+        <style>
+          {
+            `
             .posi-searchs{
             opacity: 1;
             position: absolute;
@@ -1088,36 +1104,36 @@ class NewHeader extends Component {
 			      	<em className="vertical-line"></em>
 			      	<%= link_to '注册', user_join_path, :className => "ml5" %>
 			    </span>*/}
-          { user===undefined?
-            <span className="font-15 fr mt17 ml5 mr25">
-                <a onClick={()=>this.educoderlogin()}  className="mr5 color-white">登录</a>
-                <em className="vertical-line"></em>
-                <a href={"/register"} className="mr5 color-white">注册</a>
-            </span> :user.login===""?<span className="font-15 fr mt17 ml5 mr25">
-                <a onClick={()=>this.educoderlogin()}  className="mr5 color-white">登录</a>
-                <em className="vertical-line"></em>
-                <a href={"/register"} className="mr5 color-white">注册</a>
-            </span>:
-            <div className="fr edu-menu-panel mr25" style={{height:'60px'}}>
-              <a href={`/users/${this.props.current_user===undefined?"":this.props.current_user.login}/courses`} className="fl ml15">
+        {user === undefined ?
+          <span className="font-15 fr mt17 ml5 mr25">
+            <a onClick={() => this.educoderlogin()} className="mr5 color-white">登录</a>
+            <em className="vertical-line"></em>
+            <a href={"/register"} className="mr5 color-white">注册</a>
+          </span> : user.login === "" ? <span className="font-15 fr mt17 ml5 mr25">
+            <a onClick={() => this.educoderlogin()} className="mr5 color-white">登录</a>
+            <em className="vertical-line"></em>
+            <a href={"/register"} className="mr5 color-white">注册</a>
+          </span> :
+            <div className="fr edu-menu-panel mr25" style={{ height: '60px' }}>
+              <a href={`/users/${this.props.current_user === undefined ? "" : this.props.current_user.login}/courses`} className="fl ml15">
                 <img alt="头像" className="radius mt13" height="34" id="nh_user_logo" name="avatar_image"
-                     src={getImageUrl(`images/`+user.image_url)} width="34">
+                  src={getImageUrl(`images/` + user.image_url)} width="34">
                 </img>
               </a>
-              <ul className="edu-menu-list" style={{top:'60px'}}>
+              <ul className="edu-menu-list" style={{ top: '60px' }}>
                 {/*<span className="bor-bottom-greyE currentName task-hide">{user.username}</span>*/}
-								<li><Link to={`/users/${this.props.current_user.login}/courses`}>我的个人主页</Link></li>
-								{coursestypes===true?"":<li><Link to={`/users/${this.props.current_user===undefined?"":this.props.current_user.login}/courses`}>{this.props.user&&this.props.user.main_site===false?"我的课堂":"我的教学课堂"}</Link></li>}
+                <li><Link to={`/users/${this.props.current_user.login}/courses`}>我的个人主页</Link></li>
+                {coursestypes === true ? "" : <li><Link to={`/users/${this.props.current_user === undefined ? "" : this.props.current_user.login}/courses`}>{this.props.user && this.props.user.main_site === false ? "我的课堂" : "我的教学课堂"}</Link></li>}
                 {/* p 老师  l 学生 */}
-								{shixuntype===true?"":<li><Link to={`/users/${this.props.current_user===undefined?"":this.props.current_user.login}/shixuns`}>我的实训项目</Link></li>}
-								{pathstype===true?"":<li><Link to={`/users/${this.props.current_user===undefined?"":this.props.current_user.login}/paths`}>{this.props.user&&this.props.user.main_site===false?"我的课程":"我的实践课程"}</Link></li>}
-                {this.props.user&&this.props.user.main_site===true?<li><Link to={`/users/${this.props.current_user===undefined?"":this.props.current_user.login}/projects`}>我的开发项目</Link></li>:""}
-                { Periofters === true &&<li><Link to ={`/problemset`}>我的试题库</Link></li> }
-								{ Periofters === true &&<li><Link to ={`/paperlibrary`}>我的试卷库</Link></li> }
-								{/*<li><Link to={`/users/${this.props.current_user===undefined?"":this.props.current_user.login}/package`}>我的众包</Link></li>*/}
-								<li style={{display: this.props.Headertop === undefined ? 'none'  : this.props.Headertop.customer_management_url===null || this.props.Headertop.customer_management_url===""? 'none' : 'block'}}>
-									<a href={this.props.Headertop === undefined ? ''  : this.props.Headertop.customer_management_url}>客户管理</a>
-								</li>
+                {shixuntype === true ? "" : <li><Link to={`/users/${this.props.current_user === undefined ? "" : this.props.current_user.login}/shixuns`}>我的实训项目</Link></li>}
+                {pathstype === true ? "" : <li><Link to={`/users/${this.props.current_user === undefined ? "" : this.props.current_user.login}/paths`}>{this.props.user && this.props.user.main_site === false ? "我的课程" : "我的实践课程"}</Link></li>}
+                {this.props.user && this.props.user.main_site === true ? <li><Link to={`/users/${this.props.current_user === undefined ? "" : this.props.current_user.login}/projects`}>我的开发项目</Link></li> : ""}
+                {Periofters === true && <li><Link to={`/problemset`}>我的试题库</Link></li>}
+                {Periofters === true && <li><Link to={`/paperlibrary`}>我的试卷库</Link></li>}
+                {/*<li><Link to={`/users/${this.props.current_user===undefined?"":this.props.current_user.login}/package`}>我的众包</Link></li>*/}
+                <li style={{ display: this.props.Headertop === undefined ? 'none' : this.props.Headertop.customer_management_url === null || this.props.Headertop.customer_management_url === "" ? 'none' : 'block' }}>
+                  <a href={this.props.Headertop === undefined ? '' : this.props.Headertop.customer_management_url}>客户管理</a>
+                </li>
                 {
                   this.props.Headertop && this.props.Headertop.college_identifier &&
                   <li><a href={`/colleges/${this.props.Headertop.college_identifier}/statistics`}>学院统计</a></li>
@@ -1132,20 +1148,20 @@ class NewHeader extends Component {
                   {/*<li><a onClick={()=>this.trialapplications()} >试用申请</a> </li>*/}
                   {/*<li><Link to={`/interest`}>兴趣页</Link></li>*/}
 
-                  <li className="bor-top-greyE">
+                <li className="bor-top-greyE">
 
-                    {/*<a onClick={()=>this.educoderlogin()} >登录</a>*/}
-                    <a onClick={() => this.educoderloginysl()}>退出</a>
+                  {/*<a onClick={()=>this.educoderlogin()} >登录</a>*/}
+                  <a onClick={() => this.educoderloginysl()}>退出</a>
 
                 </li>
               </ul>
             </div>
-         }
-          {/*href="https://www.educoder.net/login"*/}
-         <div className="fr head-right">
-            {/*{ loadHeader()}*/}
-					 {showSearchOpentype===true?"":this.props.user&&this.props.user.main_site===true?<a id="search-open" className="fl mr30 headIcon" onClick={(e)=>this.showSearchOpen(e)}>
-              {/*"/images/educoder/icon/search.svg"
+        }
+        {/*href="https://www.educoder.net/login"*/}
+        <div className="fr head-right">
+          {/*{ loadHeader()}*/}
+          {showSearchOpentype === true ? "" : this.props.user && this.props.user.main_site === true ? <a id="search-open" className="fl mr30 headIcon" onClick={(e) => this.showSearchOpen(e)}>
+            {/*"/images/educoder/icon/search.svg"
                              <img src={getImageUrl(`images/educoder/icon/search.svg`)} /> */}
 
             <i className="iconfont icon-sousuo color-white"></i>
@@ -1248,8 +1264,6 @@ class NewHeader extends Component {
             >
               <i className="iconfont icon-xiaoxilingdang color-white"></i>
               <span className="newslight" style={{ display: this.props.Headertop === undefined ? "none" : this.props.Headertop.new_message === true ? "block" : "none" }}>
-                {/*{this.props.Headertop===undefined?"":this.props.Headertop.unread_message_count > 99 ? '99+'*/}
-                {/*: this.props.Headertop===undefined?"":this.props.Headertop.unread_message_count}*/}
               </span>
             </a>
             }
diff --git a/public/react/src/modules/tpm/shixuns/shixun-keyword-list.scss b/public/react/src/modules/tpm/shixuns/shixun-keyword-list.scss
index d3ecd2008..c8a62bdd8 100644
--- a/public/react/src/modules/tpm/shixuns/shixun-keyword-list.scss
+++ b/public/react/src/modules/tpm/shixuns/shixun-keyword-list.scss
@@ -65,6 +65,14 @@
   position: absolute;
   width: 40px;
   right: 39px;
-  top: 76px;
+  top: 77px;
+  z-index: 10;
+}
+
+.btn-join {
+  position: absolute;
+  width: 40px;
+  right: 39px;
+  top: 133px;
   z-index: 10;
 }
\ No newline at end of file