diff --git a/public/react/src/App.js b/public/react/src/App.js index adb964d06..7dcc982d4 100644 --- a/public/react/src/App.js +++ b/public/react/src/App.js @@ -110,7 +110,7 @@ const Newshixuns = Loadable({ //实训首页 const ShixunsHome = Loadable({ - loader: () => import('./modules/home/shixunsHome'), + loader: () => import('./modules/home'), loading: Loading, }) diff --git a/public/react/src/components/loading.jsx b/public/react/src/components/loading.jsx index d7594a4b0..daf92f828 100644 --- a/public/react/src/components/loading.jsx +++ b/public/react/src/components/loading.jsx @@ -1,5 +1,10 @@ import React from 'react' +import './loading.less' export default () => { - return
loading ...
+ return
+

+ loading ... +

+
} \ No newline at end of file diff --git a/public/react/src/components/loading.less b/public/react/src/components/loading.less new file mode 100644 index 000000000..9d33b1ad7 --- /dev/null +++ b/public/react/src/components/loading.less @@ -0,0 +1,9 @@ +.loading-tip { + display: flex; + flex-flow: column nowrap; + justify-content: center; + align-items: center; + height: 100%; + background: #213857; + color: #fff; +} \ No newline at end of file diff --git a/public/react/src/modules/home/index.jsx b/public/react/src/modules/home/index.jsx index c46f0bf25..d44a4bcbc 100644 --- a/public/react/src/modules/home/index.jsx +++ b/public/react/src/modules/home/index.jsx @@ -1,10 +1,84 @@ -import React, { useEffect, useState } from 'react' +import React, { useEffect, useState, Fragment } from 'react' +import axios from 'axios' +import UpgradeModals from '../modals/UpgradeModals' +import Loading from '../../components/loading' +import ShixunCardList from '../../components/shixun-card-list' +import TPMIndexHOC from '../tpm/TPMIndexHOC' +import ListContainer from './list-container' +import { SnackbarHOC, getImageUrl, configShareForIndex } from 'educoder' +import ShixunPathCard from '../paths/ShixunPathCard' -export default () => { +function Home({ mygetHelmetapi }) { - return ( -
+ const [resource, setResource] = useState({ + loading: true, + data: {}, + updata: null + }) + + useEffect(() => { + async function init() { + const sys = await axios.get('/users/system_update.json') + const home = await axios.get('/home/index.json') + setResource({ + ...resource, + loading: false, + updata: sys.data, + data: home.data + }) + } + try { + init() + } catch (error) { + console.log(error, '---in home init-----') + } + + }, []) + + let shixuntype = false + let pathstype = false + if (mygetHelmetapi) { + let shixun = "/shixuns"; + let paths = "/paths"; + mygetHelmetapi.navbar.map(item => { + 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 + } + } + }) + } -
+ const { loading, updata, data } = resource + const { shixuns, subjects } = data + + return ( + + {loading ? : +
+ {updata ? : null} + {pathstype || subjects.length > 0 ? + + + + : null} + { + (shixuntype || shixuns.length > 0) ? + + + + : null + } +
+ } + ) -} \ No newline at end of file +} + +export default SnackbarHOC()(TPMIndexHOC(Home)) \ No newline at end of file diff --git a/public/react/src/modules/home/list-container.jsx b/public/react/src/modules/home/list-container.jsx new file mode 100644 index 000000000..4de3adaab --- /dev/null +++ b/public/react/src/modules/home/list-container.jsx @@ -0,0 +1,17 @@ +import React from 'react' +import { Link } from "react-router-dom" + +export default ({ children, title, titleEn, to }) => { + return ( +
+
+

{title}

+

{titleEn}

+
+ 更多 +
+ {children} +
+
+ ) +} \ No newline at end of file diff --git a/public/react/src/modules/home/shixunsHome.js b/public/react/src/modules/home/shixunsHome.js index e1e2eb8b3..bdb3a1f74 100644 --- a/public/react/src/modules/home/shixunsHome.js +++ b/public/react/src/modules/home/shixunsHome.js @@ -303,17 +303,18 @@ class ShixunsHome extends Component { } {/*精选实训 改为 开发社区*/} - {shixuntype === true || homedatalist === undefined ? "" : homedatalist.shixuns.length === 0 ? "" :
-
-

实训项目

-

DEVELOPMENT COMMUNITY

-
- 更多 - -
- - {homedatalist === undefined ? "" : homedatalist.shixuns.map((item, key) => { - return ( -
- -
- {item.tag_name} - {/**/} -
- { - item.is_jupyter === true ? -
-

Jupyter

- {/**/} -
- : ""} -
- -

非试用内容，需要授权

-
+ } + + {homedatalist === undefined ? "" : homedatalist.shixuns.map((item, key) => { + return ( +
- - - - -
-

- - {item.name} - -

- -

- - - - {item.score_info === null ? "5分" : item.score_info + "分"} -

- -

- - - - {item.challenges_count} - - +

+ {item.tag_name} + {/**/} +
+ { + item.is_jupyter === true ? +
+

Jupyter

+ {/**/} +
+ : ""} +
+ +

非试用内容，需要授权

+
+ + + + +
+

+ + {item.name} + +

- - - {item.stu_num} +

+ + - + {item.score_info === null ? "5分" : item.score_info + "分"} +

+ +

+ + + + {item.challenges_count} + + + + + + + {item.stu_num} + + - {item.level} -

+ {item.level} +

+
-
- ) - }) - } + ) + }) + } -
-
} +
+ } diff --git a/public/react/src/modules/modals/UpgradeModals.js b/public/react/src/modules/modals/UpgradeModals.js index e3d882ff4..b870db3e9 100644 --- a/public/react/src/modules/modals/UpgradeModals.js +++ b/public/react/src/modules/modals/UpgradeModals.js @@ -1,82 +1,72 @@ import React, { Component } from 'react'; -import {getImageUrl} from 'educoder'; -import { Spin, Icon , Modal} from 'antd'; +import { Modal } from 'antd'; import moment from 'moment'; class UpgradeModals extends Component { - constructor(props) { - super(props); - this.state = { - system_updates:false - } - } + constructor(props) { + super(props); + this.state = { + system_updates: false + } + } - updatasmodals=()=>{ - let {updata} = this.props; - if(updata&&updata.system_update===true){ + updatasmodals = () => { + let { updata } = this.props; + if (updata && updata.system_update === true) { let SystemUpdateEndTime = localStorage.getItem('SystemUpdateEndTime'); - if(SystemUpdateEndTime===null){ + if (SystemUpdateEndTime === null) { this.setState({ - system_updates:true + system_updates: true }) - }else if(SystemUpdateEndTime===undefined){ + } else if (SystemUpdateEndTime === undefined) { this.setState({ - system_updates:true + system_updates: true }) - }else if(moment(SystemUpdateEndTime) < moment(updata.end_time)){ + } else if (moment(SystemUpdateEndTime) < moment(updata.end_time)) { this.setState({ - system_updates:true + system_updates: true }) } } } componentDidMount() { - this.updatasmodals() + this.updatasmodals() } - componentDidUpdate(prevProps){ - // if (prevProps.data!=this.props.updata){ - // this.updatasmodals() - // } - } - setmodalSave=()=>{ - let {updata}=this.props; - localStorage.setItem('SystemUpdateEndTime',updata.end_time); + setmodalSave = () => { + let { updata } = this.props; + localStorage.setItem('SystemUpdateEndTime', updata.end_time); this.setState({ - system_updates:false + system_updates: false }) } -render() { - // const antIcons = - {/**/} + render() { - {/**/} - let {system_updates}=this.state; - let {updata}=this.props; - return( - -
- 
{updata&&updata.system_score}
-
- this.setmodalSave()}>知道啦 -
-
- - ) - } + let { system_updates } = this.state; + let { updata } = this.props; + return ( + +
+ 
{updata && updata.system_score}
+
+ this.setmodalSave()}>知道啦 +
+
+ + ) + } } export default UpgradeModals; \ No newline at end of file diff --git a/public/react/src/modules/paths/ShixunPathCard.js b/public/react/src/modules/paths/ShixunPathCard.js index 66f236692..814938ce9 100644 --- a/public/react/src/modules/paths/ShixunPathCard.js +++ b/public/react/src/modules/paths/ShixunPathCard.js @@ -1,86 +1,54 @@ import React, { Component } from 'react'; -import {getImageUrl , setImagesUrl } from 'educoder'; -import { BrowserRouter as Router, Route, Link } from "react-router-dom"; -import { Tooltip} from 'antd'; +import { setImagesUrl } from 'educoder'; +import { Link } from "react-router-dom"; import LoadingSpin from '../../common/LoadingSpin'; +import NodataPanel from '../../components/nodata-panel'; +import './ShixunPaths.css'; - -class ShixunPathCard extends Component{ +class ShixunPathCard extends Component { constructor(props) { super(props) } - render(){ - let {pathList}=this.props; - return( + render() { + let { pathList } = this.props; + return (
{ - pathList===null? - : pathList && pathList.length > 0 ? - ( -
- { - pathList && pathList.map((item,key)=>{ - - return( -
- {/* item.tag_name === null ? "" : -
- {item.tag_name} - -
*/} - - { - item.excellent === false ? "" : -
- 开放课程 + pathList === null ? + : pathList && pathList.length > 0 ? + ( +
+ { + pathList && pathList.map((item, key) => { + return ( +
+ { + item.excellent === false ? "" : +
+ 开放课程 +
+ } + + 详情图片 + +
+

+ {item.name} +

+

+ 章节: {item.stages_count} + 学习人数: {item.members_count} +

+
- } - - {/*
- -

非试用内容，需要授权

-
*/} - - - {/*target="_blank"*/} - 详情图片 - -
-

- {item.name} - {/*target="_blank"*/} -

-

- - {/* */} - {/* */} - 章节: {item.stages_count} - {/* */} - - {/**/} - {/*{item.shixuns_count}*/} - {/**/} - {/* */} - {/* */} - 学习人数: {item.members_count} - {/* */} -

-
-
- ) - }) - } -
- ):( -
- -

暂时还没有相关数据哦！

-
- ) + ) + }) + } +
+ ) : } - +
) } diff --git a/public/react/src/modules/tpm/TPMIndexHOC.js b/public/react/src/modules/tpm/TPMIndexHOC.js index 19d6b6d35..d9e43da97 100644 --- a/public/react/src/modules/tpm/TPMIndexHOC.js +++ b/public/react/src/modules/tpm/TPMIndexHOC.js @@ -10,6 +10,7 @@ import './TPMIndex.css'; import LoginDialog from '../login/LoginDialog'; import AccountProfile from '../user/AccountProfile'; import AccountPhoneemail from '../user/AccountPhoneemail'; +import Loading from '../../Loading'; const $ = window.$; @@ -638,12 +639,11 @@ export default function TPMIndexHOC(WrappedComponent) { .newContainers{ min-width: 1200px; max-width: unset; - height: 100%; - min-height: 100%; + margin: 0 auto; overflow: hidden; + position: realtive; } .newHeaders{ - // position: fixed; max-width: unset; background: #24292D !important; width: 100%; @@ -675,27 +675,24 @@ export default function TPMIndexHOC(WrappedComponent) { } - - -
- this.initCommonState(user)} - {...this.props} {...this.state} - showShixun={this.showShixun} aboutFocus={this.aboutFocus} - {...common} - > - - -
- - - - + {this.state.globalLoading ? : + + +
+ this.initCommonState(user)} + {...this.props} {...this.state} + showShixun={this.showShixun} aboutFocus={this.aboutFocus} + {...common} + > + + +
+ + + }
);