git merge 70af7dae5f

src/App.js

@@ -17,8 +17,7 @@ import marked from './common/marked';
 import moment from 'moment'
 
 import { MuiThemeProvider, createMuiTheme } from 'material-ui/styles';
-
+import SiderBar from './forge/Component/SiderBar'
-import history from './history';
 
 import { SnackbarHOC } from 'educoder'
 import { initAxiosInterceptors } from './AppConfig'
@@ -124,12 +123,6 @@ class App extends Component {
 	componentDidMount() {
 		document.title = "loading...";
 		this.disableVideoContextMenu();
-		history.listen(() => {
-			this.forceUpdate()
-			const $ = window.$
-			$("html").animate({ scrollTop: $('html').scrollTop() - 0 })
-		});
-
 		initAxiosInterceptors(this.props);
 		this.getAppdata();
 
@@ -212,6 +205,7 @@ class App extends Component {
 				<ConfigProvider locale={zhCN}>
 					<MuiThemeProvider theme={theme}>
 						<LoginDialog {...this.props} {...this.state} Modifyloginvalue={() => this.Modifyloginvalue()}></LoginDialog>
+						<SiderBar />
 						<Router>
 							<Switch>
 								{/*项目*/}

src/forge/Component/Component.scss

@@ -112,6 +112,9 @@ li.ant-menu-item{
   right:240px;
   z-index: 10000;
 }
+.laterest{
+  color: #05690d;
+}
 
 @media screen and (max-width: 1800px){
   .handleBox{
@@ -190,3 +193,138 @@ li.ant-menu-item{
     }
   }
 }
+
+/*-------------------个人主页：右侧提示区域--------------------------*/
+.-task-sidebar {
+  position: fixed;
+  width: 40px;
+  right: 0;
+  bottom: 80px;
+  z-index: 10;
+}
+
+@media screen and (max-width: 1920px){
+  .-task-sidebar{
+    right:240px;
+  }
+}
+@media screen and (max-width: 1500px){
+  .-task-sidebar{
+    right:100px;
+  }
+}
+@media screen and (max-width: 1200px){
+  .-task-sidebar{
+    right:0px;
+  }
+}
+.-task-sidebar>div {
+  height: 40px;
+  line-height: 40px;
+  box-sizing: border-box;
+  width: 40px;
+  color: #999;
+  font-size: 20px;
+  text-align: center;
+  margin-bottom: 20px;
+  border-radius: 50%;
+  background: #FFFFFF;
+  box-shadow: 0px 0px 10px 1px #F1F1F1;
+}
+
+.-task-sidebar>div i {
+  color: #999;
+}
+
+.-task-sidebar>div:hover i {
+  color: #fff !important;
+}
+.-task-sidebar>div:hover{
+  background: #1890FF;
+  box-shadow: 0px 0px 10px 2px #B6D0FC;
+}
+.helpBox{
+  width: 260px;
+  z-index: 103;
+  .ant-popover-inner-content{
+    padding:0px;
+  }
+  p.titlecontent{
+    font-size: 18px;
+    color: #333;
+    line-height: 20px;
+    padding:15px 20px;
+  }
+  .faqUl{
+    padding:0px 20px 10px;
+    max-height: 220px;
+    overflow-y: auto;
+    li{
+      background: #F5F5F5;
+      border-radius: 20px;
+      padding:0px 20px;
+      color: #333;
+      height: 34px;
+      line-height: 34px;
+      margin-bottom: 10px;
+      a{
+        display: block;
+      }
+      &:hover{
+        background-color: #D1E9FF;
+        a{
+          color: #333!important;
+        }
+      }
+    }
+  }
+}
+
+
+
+.-task-desc {
+  background: #494949;
+  width: 90px;
+  line-height: 36px;
+  text-align: center;
+  position: absolute;
+  color: #fff;
+  font-size: 13px;
+  z-index: 999999;
+  opacity: 0;
+}
+
+.-task-desc div {
+  position: absolute;
+  top: 10px;
+  right: -7px;
+  height: 13px;
+}
+
+.-task-desc div img {
+  float: left
+}
+
+.-task-sidebar .scan_ewm {
+  position: absolute !important;
+  right: 45px !important;
+  bottom: 0px !important;
+  background-color: #494949 !important;
+  -webkit-box-sizing: border-box !important;
+  box-sizing: border-box !important;
+  font-size: 14px !important;
+  line-height: 16px !important;
+  display: none;
+  height: 213px !important;
+}
+
+.trangle_right {
+  position: absolute;
+  right: -5px;
+  bottom: 15px;
+  width: 0;
+  height: 0px;
+  border-top: 6px solid transparent;
+  border-left: 5px solid #494949;
+  border-bottom: 6px solid transparent
+}

src/forge/Component/SiderBar.js

@@ -0,0 +1,79 @@
+import React, { useEffect, useState } from 'react';
+import { Popover , Tooltip } from 'antd';
+import './Component.scss';
+import axios from 'axios';
+
+const $ = window.$;
+
+$(window).scroll(function () {
+  if ($(".gotop").length > 0) {
+    if ($(document).scrollTop() > 0) {
+      $(".-task-sidebar .gotop").show();
+      $(".gotop").click(function () {
+        $("html,body").scrollTop(0);
+      });
+    }
+    if ($(document).scrollTop() === 0) {
+      $(".-task-sidebar .gotop").hide();
+    }
+  }
+});
+
+function SiderBar() {
+  const [ data , setData ] = useState([]);
+
+  useEffect(()=>{
+    getFAQ();
+  },[])
+
+  function getFAQ(){
+    const url = `/faqs.json`;
+    axios.get(url).then(result=>{
+      if(result && result.data){
+        setData(result.data);
+      }
+    }).catch(error=>{})
+  }
+  function content(list){
+    return <div>
+      <p className="titlecontent">帮助</p>
+      <ul className="faqUl">
+        {
+          list && list.map((i,k)=>{
+            return(
+              <li><a href={`${i.url}`} target="_blank">{i.question}</a></li>
+            )
+          })
+        }
+      </ul>
+    </div>
+  }
+  return (
+    <div className={"-task-sidebar"} >
+        {
+          data && data.length > 0 && (data[0] && data[0].question) ? 
+          <Popover content={content(data)} overlayClassName="helpBox" placement={"left"}>
+            <div className="feedback">
+              <i className="iconfont icon-bangzhu font-22"></i>
+            </div>
+          </Popover>
+          :""
+        }
+        {/* <div className="scan pr" title="微信扫一扫">
+          <span className="inline erweima"><i className="iconfont icon-erweima color-white font-22 fl"></i></span>
+        </div>
+        <div className="consult" title='在线咨询'>
+          <a target="_blank" className="color_white" href="//shang.qq.com/wpa/qunwpa?idkey=2f2043d88c1bd61d182b98bf1e061c6185e23055bec832c07d8148fe11c5a6cd">
+            <i className="iconfont icon-qqzaixianzixun color-white font-22"></i>
+          </a>
+        </div> */}
+        <div className="gotop">
+          <Tooltip title="返回顶部" placement={"left"}>
+            <a><i className="iconfont icon-huidaodingbu1"></i></a>
+          </Tooltip>
+        </div>
+    </div>
+  )
+}
+
+export default SiderBar;