From fccb96ebb5ca910b9ba16c93699663088d2e486d Mon Sep 17 00:00:00 2001 From: caishi <1149225589@qq.com> Date: Fri, 14 May 2021 14:37:59 +0800 Subject: [PATCH] git merge 70af7dae5f4e55fe89b24e3344afa76594f0edbf --- src/App.js | 10 +-- src/forge/Component/Component.scss | 140 ++++++++++++++++++++++++++++- src/forge/Component/SiderBar.js | 79 ++++++++++++++++ 3 files changed, 220 insertions(+), 9 deletions(-) create mode 100644 src/forge/Component/SiderBar.js diff --git a/src/App.js b/src/App.js index 789c0af2f..65a223535 100644 --- a/src/App.js +++ b/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 { this.Modifyloginvalue()}> + {/*项目*/} diff --git a/src/forge/Component/Component.scss b/src/forge/Component/Component.scss index 46aa8fcce..ef2bd2b52 100644 --- a/src/forge/Component/Component.scss +++ b/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{ @@ -189,4 +192,139 @@ li.ant-menu-item{ border-right: none; } } -} \ No newline at end of file +} + +/*-------------------个人主页：右侧提示区域--------------------------*/ +.-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 +} diff --git a/src/forge/Component/SiderBar.js b/src/forge/Component/SiderBar.js new file mode 100644 index 000000000..c70191ee6 --- /dev/null +++ b/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
+

帮助

+
    + { + list && list.map((i,k)=>{ + return( +
  • {i.question}
    • + ) + }) + } +
+
+ } + return ( +
+ { + data && data.length > 0 && (data[0] && data[0].question) ? + +
+ +
+ + :"" + } + {/*
+ +
+
+ + + +
*/} +
+ + + +
+
+ ) +} + +export default SiderBar;