forked from Gitlink/forgeplus-react
git merge 70af7dae5f
This commit is contained in:
parent
712de65d40
commit
fccb96ebb5
10
src/App.js
10
src/App.js
|
|
@ -17,8 +17,7 @@ import marked from './common/marked';
|
|||
import moment from 'moment'
|
||||
|
||||
import { MuiThemeProvider, createMuiTheme } from 'material-ui/styles';
|
||||
|
||||
import history from './history';
|
||||
import SiderBar from './forge/Component/SiderBar'
|
||||
|
||||
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>
|
||||
{/*项目*/}
|
||||
|
|
|
|||
|
|
@ -112,6 +112,9 @@ li.ant-menu-item{
|
|||
right:240px;
|
||||
z-index: 10000;
|
||||
}
|
||||
.laterest{
|
||||
color: #05690d;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1800px){
|
||||
.handleBox{
|
||||
|
|
@ -189,4 +192,139 @@ li.ant-menu-item{
|
|||
border-right: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*-------------------个人主页：右侧提示区域--------------------------*/
|
||||
.-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
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
Loading…
Reference in New Issue