update styles

2022-01-20 11:50:30 +08:00 · 2022-01-20 11:50:30 +08:00 · 4f9a03a1af
parent ea737f5b61
commit 4f9a03a1af
8 changed files with 85 additions and 77 deletions
--- a/public/css/edu-purge.css
+++ b/public/css/edu-purge.css
@ -3984,14 +3984,30 @@ html>body #ajax-indicator {
  display: block;
  height: 100%;
  width: 100%;
-  color: #fff;
+  color: #333;
  font-size: 16px;
 }

+.publicNav ul#header-nav li a {
+  color: #fff!important;
+}
+.publicNav .head-right i{
+  color: #fff!important;
+}
+
 .head-nav ul#header-nav li a:hover,.head-nav ul#header-nav li.active a {
  color: #5091FF;
 }
-
+.head-nav ul#header-nav li.active a:after {
+  content: "";
+  width: 50%;
+  height: 2px;
+  background-color: #1484ef;
+  left: 50%;
+  margin-left: -25%;
+  bottom: 8px;
+  position: absolute;
+}
 .head-nav ul#header-nav li:last-child {
  margin-right: 0px
 }
--- a/src/App.js
+++ b/src/App.js
@ -128,7 +128,7 @@ const Teaching = Loadable({
 // })

 // 此处仅维护前端可能的一级路由，不用进行项目或者组织判断的字段。
-const keyWord = ["explore", "settings", "setting", "mulan", "wiki", "issues", "setting", "trending", "code", "projects", "pulls", "mine", "login", "register", "email", "export", "nopage", "404", "403", "500", "501", "search", "organize", "login", "register", "resetPassword", "aboutus","educoder"];
+const keyWord = ["explore", "settings", "setting", "mulan", "wiki", "issues", "setting", "trending", "code", "projects", "pulls", "mine", "login", "register", "email", "export", "nopage", "404", "403", "500", "501", "search", "organize", "login", "register", "resetPassword", "aboutus","educoder","task","notice"];

 class App extends Component {
  constructor(props) {
--- a/src/forge/Head/Header.js
+++ b/src/forge/Head/Header.js
@ -196,10 +196,18 @@ class NewHeader extends Component {

  matchpaths = (url) => {
    const { match } = this.props;
+    const hostname = window.location.hostname;
+    const port = window.location.port;
    const isDev = window.location.port == 3007;
-    const isdev2= isDev ?'https://testforgeplus.trustie.net':`https://${window.location.hostname}`;
+    let isdev2= isDev ?'http://192.168.1.40:3000':`http://${hostname}`;
    let str = "";
    if(url.indexOf("http")>-1){
+      if(url.indexOf("https")>-1){
+        isdev2 = `https://${hostname}`;
+      }
+      if(port){
+        isdev2 += `:${port}`;
+      }
      str = isdev2+match.path;
    }else{
      str = match.path;
@ -311,7 +319,7 @@ class NewHeader extends Component {
              :
              ""
            }
-          <div className="head-nav pr" id={"head-navpre1"}>
+          <div id={"head-navpre1"} className={"head-nav pr"}>
            {
              settings && settings.navbar && settings.navbar.length > 0 ?
              <ul id="header-nav">
@ -352,7 +360,8 @@ class NewHeader extends Component {
            {
              current_user && (current_user.main_site || current_user.login) && (settings && settings.add && settings.add.length>0)?
              <Dropdown overlay={this.addMenu(settings && settings.add)} placement="bottomRight">
-                <img src={require(`./img/add.png`)} alt="" width="16px" className="mr15 ml30"/>
+                {/* <img src={require(`./img/add.png`)} alt="" width="16px" className="mr15 ml30"/> */}
+                <i className="iconfont icon-tianjiafangda ml15 mr15 color-grey-6 font-18"></i>
              </Dropdown>:""
            }
            
@ -365,9 +374,10 @@ class NewHeader extends Component {
                onVisibleChange={this.handleVisibleChange}
                destroyTooltipOnHide
              >
-                <Link to={"/settings/notice"} className="message-icon">
+                <Link to={"/settings/notice"} className="message-icon mt3">
                  {current_user && <Badge count={current_user.message_unread_total}>
-                    <img src={require(`./img/ring.png`)} alt="" width="16px" className="ml15 mr15"/>
+                    {/* <img src={require(`./img/ring.png`)} alt="" width="16px" className="ml15 mr15"/> */}
+                    <i className="iconfont icon-xiaoxilingdang ml15 mr15 color-grey-6 font-18"></i>
                  </Badge>}
                </Link>
              </Popover>
@ -376,13 +386,13 @@ class NewHeader extends Component {
          </div>
          {!user || (user && !user.login)  ?
            <span className="font-15 ml30">
-              <a onClick={() => this.educoderlogin()} className="mr5 color-white">登录</a>
+              <a onClick={() => this.educoderlogin()} className="mr5 color-grey-6">登录</a>
              {
                (settings && settings.common && settings.common.register) ?
                  publicNav ? 
                  <a href='/register' className="regBtn">立即注册</a>
                  :
-                  <span><em className="vertical-line"></em><a className="ml5 color-white" href='/register'>注册</a></span>
+                  <span><em className="vertical-line"></em><a className="ml5 color-grey-6" href='/register'>注册</a></span>
                :""
              }
            </span>
--- a/src/forge/Main/Index.js
+++ b/src/forge/Main/Index.js
@ -3,10 +3,10 @@ import { Menu, Input , Spin, Pagination , Popover , Affix } from 'antd';

 import "slick-carousel/slick/slick.css";
 import "slick-carousel/slick/slick-theme.css";
-import '../css/index.scss'
+import '../css/index.scss';
 import './list.scss';
 import './Index.scss';
-import ListItem from './IndexItem'
+import ListItem from './IndexItem';
 import axios from 'axios';
 import img_new from '../Images/new.png';
 import img_array from '../Images/array.png';
@ -122,7 +122,7 @@ class Index extends Component {
    }).catch((error) => { })
  }

-  // 获取类型
+  // 获取语言
  getType = () => {
    const url = `/projects/group_type_list.json`;
    axios.get(url).then((result) => {
@ -131,16 +131,16 @@ class Index extends Component {
          name:'全部语言',
          id:0,
        });
-        this.setTypeList(result.data, 0)
+        this.setTypeList(result.data, undefined)
      }
    }).catch((error) => { })
  }
-
+  // 设置语言list
  setTypeList = (list, active_type) => {
    this.setState({
      typeList: list.map((item, key) => {
        return (
-          <li key={key} className={ parseInt(active_type) === item.id ? 'active' : ''} onClick={() => this.changeType(`${item.id}`, list)}>
+          <li key={key} className={ (active_type && parseInt(active_type) === item.id) ? 'active' : ''} onClick={() => this.changeType(`${item.id}`, list)}>
            <p>
              <span className="font-16">{item.name}</span>
              <span className="color-blue">{item.projects_count}</span>
@ -151,20 +151,20 @@ class Index extends Component {
    })
  }

-  // 切换语言类型
+  // 切换语言
  changeType = (id, list) => {
    this.setState({
      isSpin: true,
      search: undefined,
-      category_id: undefined,
+      languageId: id,
    },()=>{
      this.setTypeList(list, id)
-      const { page , sort , languageId } = this.state;
-      this.getListData(page , undefined, sort, id , languageId);
+      const { page , sort , category_id } = this.state;
+      this.getListData(page , undefined, sort, category_id , id);
    })
  }

-  // 获取类型
+  // 获取项目类别
  getCategory = () => {
    const url = `/project_categories/group_list.json`;

@ -174,24 +174,35 @@ class Index extends Component {
          name:'全部类别',
          id:0,
        });
-        // this.setCategoryList(result.data, 0);
+        this.setCategoryList(result.data, undefined);
      }
    }).catch((error) => { })
  }
-
-  setCategoryList = (list) => {
+  // 设置项目类别list
+  setCategoryList = (list,active_id) => {
    this.setState({
-      CategoryList: list
+      categoryList: list.map((item, key) => {
+        return (
+          <li key={key} className={active_id && parseInt(active_id) === item.id ? 'active' : ''} onClick={() => this.changeCategory(`${item.id}`, list)}>
+            <p>
+              <span className="font-16">{item.name}</span>
+              <span className="color-blue">{item.projects_count}</span>
+            </p>
+          </li>
+        )
+      })
    })
  }
-
+  // 切换项目类别category_id
  changeCategory = (id, list) => {
    this.setState({
      category_id: id,
-      page: 1
+      page: 1,
+      search:undefined
    },()=>{
-      const { sort, project_type , languageId } = this.state;
-      this.getListData(1 , undefined, sort, project_type, id , languageId);
+      this.setCategoryList(list, id)
+      const { sort , languageId } = this.state;
+      this.getListData(1 , undefined, sort, id , languageId);
    });
  }

@ -278,27 +289,6 @@ class Index extends Component {
      isSpin, total, search, limit, page, typeList, categoryList , 
      recommendOriList , CategoryList , category_id } = this.state;

-      // const setting={
-      //   dots: true,
-      //   infinite: true,
-      //   speed: 500,
-      //   slidesToShow: 5,
-      //   slidesToScroll: 5,
-      //   autoplay:false,
-      //   arrows:false,
-      //   adaptiveHeight:true
-      // }
-      // const settings={
-      //   dots: true,
-      //   infinite: true,
-      //   speed: 500,
-      //   slidesToShow: 6,
-      //   slidesToScroll: 6,
-      //   autoplay:false,
-      //   arrows:false,
-      //   adaptiveHeight:true
-      // }
-
    return (
      <div>
        {/* <p className="t_project_banner">
@ -350,20 +340,10 @@ class Index extends Component {
              <div className="list-affix">{typeList}</div>
            </ul>
            <ul className="list-l-Menu">
-              <li className="MenuTitle"><i className="iconfont icon-xiangmuleibie color-grey-9 font-15 mr5"></i>项目类别</li>
-              {
-                CategoryList && CategoryList.length > 0 ? CategoryList.map((item,key)=>{
-                  return(
-                    <li key={key} className={category_id && parseInt(category_id) === item.id ? 'active' : ''} onClick={() => this.changeCategory(`${item.id}`)}>
-                      <p>
-                        <span className="font-16">{item.name}</span>
-                        <span className="color-blue">{item.projects_count}</span>
-                      </p>
-                    </li>
-                  )
-                })
-                :""
-              }
+              <li className="MenuTitle" onClick={() => {this.getCategory();this.changeCategory(undefined, this.state.categoryList);}}>
+                <span><i className="iconfont icon-xiangmuleibie color-grey-9 font-15 mr5"></i>项目类别</span>
+              </li>
+              <div className="list-affix">{categoryList}</div>
            </ul>
          </div>
          </Affix>
--- a/src/forge/Main/Index.scss
+++ b/src/forge/Main/Index.scss
@ -522,4 +522,5 @@
      margin-left: 0px;
    }
  }
-}
+}
+
--- a/src/forge/css/index.scss
+++ b/src/forge/css/index.scss
@ -222,22 +222,22 @@ form{
  }
 }
 .list-l-Menu{
-  margin-bottom: 12px;
+  margin-bottom: 12px!important;
  border-radius:2px;
  background-color: #fff;
  box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
  .list-affix{
    min-height: 20px;
-    max-height: 240px;
+    max-height: 248px;
    overflow-y: auto;
  }
-  &>li{
+  li{
    font-size: 1rem;
    padding:0px 0px 0px 20px;
    box-sizing: border-box;
    color: #333;
    position: relative;
-    & > p{
+    p{
      height: 62px; 
      line-height: 62px;
      width: 100%;
@ -261,10 +261,11 @@ form{
      background-color: #fafafa;
    }
  }
-  & li.active{
+
+  li.active{
    background-color: #fafafa;
  }
-  & li.active::before{
+  li.active::before{
    position: absolute;
    left: 0px;
    top: 15px;
@ -281,14 +282,13 @@ form{
    line-height: 62px;
    border-bottom: 1px solid #E0E0E0;
    font-weight: 400;
-    
+    padding-left: 20px;
    span{
      display: block;
      width: 50%;
      height: 100%;
      cursor: pointer;
    }
-
    span:hover{
      color: #1484EF;

--- a/src/modules/tpm/TPMIndex.css
+++ b/src/modules/tpm/TPMIndex.css
@ -25,12 +25,13 @@ body>.-task-title {
 .newHeaders{
  max-width: unset;
  width: 100%;
-  height:58px;
+  height:70px;
  min-width: 1200px;
  z-index: 1000;
  position: fixed;
-  background: #1B2440;
-  color: #fff;
+  background: #fff;
+  color: #333;
+  box-shadow: 0 0 12px rgb(0 ,0 ,0,10%);
 }
 .newHeaders.publicNav{
  position: absolute;
--- a/src/modules/tpm/TPMIndexHOC.js
+++ b/src/modules/tpm/TPMIndexHOC.js
@ -270,7 +270,7 @@ export function TPMIndexHOC(WrappedComponent, headFoot) {
 						size="large" tip={this._gLoadingTip || "加载中..."}
 					>
 						<div className="newContainer newContainers">
-							{!publicNav && <div style={{height:"58px"}}></div> }
+							{!publicNav && <div style={{height:"70px"}}></div> }
 							{
 								current_user &&
 								<WrappedComponent initCommonState={(user) => this.initCommonState(user)}