From a190075fc5296291d83e2879d78936082f2e2704 Mon Sep 17 00:00:00 2001 From: harry Date: Sat, 7 Mar 2020 01:05:06 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AE=9E=E8=AE=AD=E5=A2=9E=E5=8A=A0=E6=90=9C?= =?UTF-8?q?=E7=B4=A2=E5=B9=B6=E8=B0=83=E6=95=B4=E6=96=B0=E5=A2=9E?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- public/react/src/App.js | 352 +++++------ public/react/src/modal/GotoQQgroup.js | 26 +- .../src/modules/tpm/shixuns/ShixunCard.js | 244 -------- .../src/modules/tpm/shixuns/ShixunCardList.js | 316 ---------- .../modules/tpm/shixuns/ShixunSearchBar.js | 301 ---------- .../src/modules/tpm/shixuns/ShixunsIndex.js | 558 +++++++++--------- .../react/src/modules/tpm/shixuns/btn-new.png | Bin 0 -> 1970 bytes .../src/modules/tpm/shixuns/shixun-card.js | 97 +++ .../tpm/shixuns/shixun-keyword-list.jsx | 81 +++ .../tpm/shixuns/shixun-keyword-list.scss | 70 +++ .../tpm/shixuns/shixun-search-bar/A.jsx | 11 + .../tpm/shixuns/shixun-search-bar/index.jsx | 121 ++++ .../tpm/shixuns/shixunCss/ShixunSearchBar.css | 39 +- .../shixuns/shixunCss/shixun-search-bar.scss | 78 +++ .../tpm/shixuns/shixunCss/shixunCard.css | 27 +- .../tpm/shixuns/shixunCss/shixunCard.scss | 101 ++++ 16 files changed, 1035 insertions(+), 1387 deletions(-) delete mode 100644 public/react/src/modules/tpm/shixuns/ShixunCard.js delete mode 100644 public/react/src/modules/tpm/shixuns/ShixunCardList.js delete mode 100644 public/react/src/modules/tpm/shixuns/ShixunSearchBar.js create mode 100644 public/react/src/modules/tpm/shixuns/btn-new.png create mode 100644 public/react/src/modules/tpm/shixuns/shixun-card.js create mode 100644 public/react/src/modules/tpm/shixuns/shixun-keyword-list.jsx create mode 100644 public/react/src/modules/tpm/shixuns/shixun-keyword-list.scss create mode 100644 public/react/src/modules/tpm/shixuns/shixun-search-bar/A.jsx create mode 100644 public/react/src/modules/tpm/shixuns/shixun-search-bar/index.jsx create mode 100644 public/react/src/modules/tpm/shixuns/shixunCss/shixun-search-bar.scss create mode 100644 public/react/src/modules/tpm/shixuns/shixunCss/shixunCard.scss diff --git a/public/react/src/App.js b/public/react/src/App.js index 4c4908771..b49548c09 100644 --- a/public/react/src/App.js +++ b/public/react/src/App.js @@ -1,8 +1,7 @@ -import React, {Component} from 'react'; +import React, { Component } from 'react'; import './public-path'; -import logo from './logo.svg'; import './App.css'; -import {ConfigProvider} from 'antd' +import { ConfigProvider } from 'antd' import zhCN from 'antd/lib/locale-provider/zh_CN'; import { BrowserRouter as Router, @@ -21,9 +20,7 @@ import Trialapplicationreview from './modules/user/Trialapplicationreview'; import Addcourses from "./modules/courses/coursesPublic/Addcourses"; import AccountProfile from "./modules/user/AccountProfile"; import Accountnewprofile from './modules/user/Accountnewprofile'; -import Trialapplication from './modules/login/Trialapplication'; import Certifiedprofessional from './modules/modals/Certifiedprofessional'; -import NotFoundPage from './NotFoundPage' import Loading from './Loading' @@ -32,18 +29,18 @@ import Loadable from 'react-loadable'; import moment from 'moment' -import {MuiThemeProvider, createMuiTheme} from 'material-ui/styles'; +import { MuiThemeProvider, createMuiTheme } from 'material-ui/styles'; // import './AppConfig' import history from './history'; -import {SnackbarHOC} from 'educoder' -import {initAxiosInterceptors} from './AppConfig' +import { SnackbarHOC } from 'educoder' +import { initAxiosInterceptors } from './AppConfig' import { Provider } from 'react-redux'; import configureStore from './redux/stores/configureStore'; // ！！！tpi需要这个来加载css -import {TPMIndexHOC} from './modules/tpm/TPMIndexHOC'; +import { TPMIndexHOC } from './modules/tpm/TPMIndexHOC'; const store = configureStore(); const theme = createMuiTheme({ @@ -52,7 +49,7 @@ const theme = createMuiTheme({ main: '#4CACFF', contrastText: 'rgba(255, 255, 255, 0.87)' }, - secondary: {main: '#4CACFF'}, // #11cb5f This is just green.A700 as hex. + secondary: { main: '#4CACFF' }, // #11cb5f This is just green.A700 as hex. }, }); // @@ -68,23 +65,23 @@ const EducoderLogin = Loadable({ //微信登录 -const Otherlogin=Loadable({ +const Otherlogin = Loadable({ loader: () => import('./modules/login/Otherlogin'), loading: Loading, }) //微信登录 -const Loginqq=Loadable({ +const Loginqq = Loadable({ loader: () => import('./modules/login/Loginqq'), loading: Loading, }) -const Otherloginstart=Loadable({ +const Otherloginstart = Loadable({ loader: () => import('./modules/login/Otherloginstart'), loading: Loading, }) -const Otherloginsqq=Loadable({ +const Otherloginsqq = Loadable({ loader: () => import('./modules/login/Otherloginqq'), loading: Loading, }) @@ -103,24 +100,6 @@ const CommentComponent = Loadable({ loading: Loading, }) -// const TestMaterialDesignComponent = Loadable({ -// loader: () => import('./modules/test/md/TestMaterialDesign'), -// loading: Loading, -// }) -// const TestCodeMirrorComponent = Loadable({ -// loader: () => import('./modules/test/codemirror/TestCodeMirror'), -// loading: Loading, -// }) - -// const TestComponent = Loadable({ -// loader: () => import('./modules/test/TestRC'), -// loading: Loading, -// }) -// const TestUrlQueryComponent = Loadable({ -// loader: () => import('./modules/test/urlquery/TestUrlQuery'), -// loading: Loading, -// }) - const TPMIndexComponent = Loadable({ loader: () => import('./modules/tpm/TPMIndex'), loading: Loading, @@ -254,7 +233,7 @@ const BanksIndex = Loadable({ // 教学案例 -const MoopCases = Loadable({ +const MoopCases = Loadable({ loader: () => import('./modules/moop_cases/index'), loading: Loading, }) @@ -272,23 +251,23 @@ const Interestpage = Loadable({ // }) //竞赛 -const NewCompetitions=Loadable({ +const NewCompetitions = Loadable({ loader: () => import('./modules/competitions/Competitions'), loading: Loading, }) //黑客松定制竞赛 -const Osshackathon=Loadable({ +const Osshackathon = Loadable({ loader: () => import('./modules/osshackathon/Osshackathon'), loading: Loading, }) -const Messagerouting= Loadable({ +const Messagerouting = Loadable({ loader: () => import('./modules/message/js/Messagerouting'), loading: Loading, }) -const Topicbank= Loadable({ +const Topicbank = Loadable({ loader: () => import('./modules/topic_bank/Topic_bank'), loading: Loading, }) @@ -321,28 +300,28 @@ const Questionitem_banks = Loadable({ }) //试卷库 -const Testpaperlibrary= Loadable({ +const Testpaperlibrary = Loadable({ loader: () => import('./modules/testpaper/Testpaperlibrary'), loading: Loading }) //试卷编辑 -const Paperlibraryeditid= Loadable({ +const Paperlibraryeditid = Loadable({ loader: () => import('./modules/testpaper/Paperlibraryeditid'), loading: Loading }) //试卷查看 -const Paperlibraryseeid= Loadable({ +const Paperlibraryseeid = Loadable({ loader: () => import('./modules/testpaper/Paperlibraryseeid'), loading: Loading }) //人工组卷 -const Paperreview= Loadable({ +const Paperreview = Loadable({ loader: () => import('./modules/question/Paperreview'), loading: Loading }) //智能组卷 -const Integeneration= Loadable({ +const Integeneration = Loadable({ loader: () => import('./modules/testpaper/Intecomponents'), loading: Loading }) @@ -387,44 +366,44 @@ class App extends Component { constructor(props) { super(props) this.state = { - Addcoursestype:false, - Addcoursestypes:false, - mydisplay:false, - occupation:0, + Addcoursestype: false, + Addcoursestypes: false, + mydisplay: false, + occupation: 0, mygetHelmetapi: null, } } - HideAddcoursestypess=(i)=>{ + HideAddcoursestypess = (i) => { console.log("调用了"); this.setState({ - Addcoursestype:false, - Addcoursestypes:false, - mydisplay:true, - occupation:i, + Addcoursestype: false, + Addcoursestypes: false, + mydisplay: true, + occupation: i, }) }; - hideAddcoursestypes=()=>{ + hideAddcoursestypes = () => { this.setState({ - Addcoursestypes:false + Addcoursestypes: false }) }; - ModalCancelsy=()=>{ + ModalCancelsy = () => { this.setState({ - mydisplay:false, + mydisplay: false, }) window.location.href = "/"; }; - ModalshowCancelsy=()=>{ + ModalshowCancelsy = () => { this.setState({ - mydisplay:true, + mydisplay: true, }) }; disableVideoContextMenu = () => { - window.$( "body" ).on( "mousedown", "video", function(event) { - if(event.which === 3) { - window.$('video').bind('contextmenu',function () { return false; }); + window.$("body").on("mousedown", "video", function (event) { + if (event.which === 3) { + window.$('video').bind('contextmenu', function () { return false; }); } else { window.$('video').unbind('contextmenu'); } @@ -442,7 +421,7 @@ class App extends Component { }); initAxiosInterceptors(this.props); - this.getAppdata(); + this.getAppdata(); // // axios.interceptors.response.use((response) => { // // console.log("response"+response); @@ -464,9 +443,9 @@ class App extends Component { }); } //修改登录方法 - Modifyloginvalue=()=>{ + Modifyloginvalue = () => { this.setState({ - isRender:false, + isRender: false, }) }; @@ -500,20 +479,20 @@ class App extends Component { } document.head.appendChild(link); } - //获取当前定制信息 - getAppdata=()=>{ + //获取当前定制信息 + getAppdata = () => { let url = "/setting.json"; axios.get(url).then((response) => { // console.log("app.js开始请求/setting.json"); // console.log("获取当前定制信息"); - if(response){ - if(response.data){ + if (response) { + if (response.data) { this.setState({ - mygetHelmetapi:response.data.setting + mygetHelmetapi: response.data.setting }); //存储配置到游览器 - localStorage.setItem('chromesetting',JSON.stringify(response.data.setting)); - localStorage.setItem('chromesettingresponse',JSON.stringify(response)); + localStorage.setItem('chromesetting', JSON.stringify(response.data.setting)); + localStorage.setItem('chromesettingresponse', JSON.stringify(response)); try { if (response.data.setting.tab_logo_url) { this.gettablogourldata(response); @@ -543,57 +522,57 @@ class App extends Component { }; render() { - let{mygetHelmetapi}=this.state; + let { mygetHelmetapi } = this.state; // console.log("appappapp"); // console.log(mygetHelmetapi); return ( - - this.Modifyloginvalue()}> + + this.Modifyloginvalue()}> - this.HideAddcoursestypess(i)}/> - - + this.HideAddcoursestypess(i)} /> + + {/*题库*/} { + render={ + (props) => { - return () - } - }> + return () + } + }> {/*题库*/} { + render={ + (props) => { - return () - } - }> + return () + } + }> {/*/!*众包创新*!/*/} {/**/} {/*竞赛*/} { + render={ + (props) => { - return () - } - }> + return () + } + }> {/*黑客松定制竞赛*/} { - return( + (props) => { + return ( ) } @@ -601,17 +580,17 @@ class App extends Component { /> {/*认证*/} - + {/*403*/} - + - + {/*404*/} - + - + ) } - }> + }> { return () } - }> + }> {/* ()*/} - {/*}*/} + {/*path="/personalcompetit"*/} + {/*render={*/} + {/*(props) => ()*/} + {/*}*/} {/*/>*/} () - }/> + render={ + (props) => () + } /> {/* jupyter */} { - return () + return () } } /> - + {/**/} {/**/} () - } + render={ + (props) => () + } > - {/*列表页 实训项目列表*/} - {/**/} - - () - } + render={ + (props) => () + } > - - - - - {/*实训课程（原实训路径）*/} - () - } + render={ + (props) => () + } > - {/*课堂*/} {/* */} {/* 教学案例 */} - () - }/> + () + } /> () + (props) => () } > - + {/**/} {/**/} {/**/} {/**/} {/**/} {/* ()*/} - {/*}*/} + {/*path="/registration"*/} + {/*render={*/} + {/*(props) => ()*/} + {/*}*/} {/*/>*/} () - } + render={ + (props) => () + } > () - }/> + render={ + (props) => () + } /> () - }/> + render={ + (props) => () + } /> () - } + render={ + (props) => () + } /> () } /> () - }/> + render={ + (props) => () + } /> () - }/> + render={ + (props) => () + } /> () - }/> + render={ + (props) => () + } /> () - }/> + render={ + (props) => () + } /> () - } /> + render={ + (props) => () + } /> () - } /> + render={ + (props) => () + } /> () - } /> + render={ + (props) => () + } /> () - } /> + render={ + (props) => () + } /> () - }/> + render={ + (props) => () + } /> () - }/> + render={ + (props) => () + } /> () - }/> + render={ + (props) => () + } /> () - }/> + render={ + (props) => () + } /> {/*()*/} {/* }*/} {/*/>*/} () - } + // component={ShixunsHome} + render={ + (props) => () + } /> - + @@ -972,4 +940,4 @@ moment.defineLocale('zh-cn', { doy: 4 // The week that contains Jan 4th is the first week of the year. } }); -export default SnackbarHOC()(App) ; +export default SnackbarHOC()(App); diff --git a/public/react/src/modal/GotoQQgroup.js b/public/react/src/modal/GotoQQgroup.js index 0ac34da65..bab39b08f 100644 --- a/public/react/src/modal/GotoQQgroup.js +++ b/public/react/src/modal/GotoQQgroup.js @@ -1,31 +1,25 @@ import React, { Component } from 'react'; -import {getImageUrl} from 'educoder'; -import { Modal} from 'antd'; -import axios from 'axios'; +import { getImageUrl } from 'educoder'; +import { Modal } from 'antd'; import '../modules/user/account/common.css'; import './gotoqqgroup.css' class GotoQQgroup extends Component { constructor(props) { super(props); - this.state={ - - } } - modalCancel=()=>{ + modalCancel = () => { try { this.props.setgoshowqqgtounp(false); - }catch (e) { - + } catch (e) { } } - setDownload=()=>{ - //立即联系 + setDownload = () => { try { this.props.setgoshowqqgtounp(false); - }catch (e) { + } catch (e) { } } @@ -33,7 +27,7 @@ class GotoQQgroup extends Component { render() { - return( + return (

您可以在QQ服务群向管理员申请，获得继续操作的权限

- +

群号：612934990

diff --git a/public/react/src/modules/tpm/shixuns/ShixunCard.js b/public/react/src/modules/tpm/shixuns/ShixunCard.js deleted file mode 100644 index a292f4d87..000000000 --- a/public/react/src/modules/tpm/shixuns/ShixunCard.js +++ /dev/null @@ -1,244 +0,0 @@ -import React, { Component } from 'react'; -import { Redirect } from 'react-router'; - -import { BrowserRouter as Router, Route, Link, Switch } from "react-router-dom"; - -import PropTypes from 'prop-types'; - -import classNames from 'classnames'; - -import { Rating ,Pagination} from "@icedesign/base"; - -import {getImageUrl,setImagesUrl, toPath,getUrl} from 'educoder'; - -import { Spin,Icon,Tooltip ,Rate} from 'antd'; -import LoadingSpin from '../../../common/LoadingSpin'; -import './shixunCss/shixunCard.css'; - -// 引入业务组件样式 - -import axios from 'axios'; - -const $ = window.$; - -class ShixunCard extends Component { - constructor(props) { - super(props) - - this.state = { - startValue:[], - order_by:"", - page:1, - limit:16, - keyword:"", - status:0, - diff:0, - hideme:false, - tag_level:3, - tag_id:'' - } - - } - - PaginationonChange=(pageNumber)=> { - this.props.shixunsPage(pageNumber); - } - - render() { - let {middleshixundata, pagination, typepvisible, pages, totalcount} = this.props; - const MyRate = ({ defaultValue, ...rest }) => { - let myValue = defaultValue; - // console.log(myValue-Math.floor(myValue)) - // if (myValue < Math.ceil(myValue)) { - // myValue = Math.floor(myValue) + 0.5; - // } - - return ; - }; - return ( -
- - - - { middleshixundata === undefined?"":middleshixundata.length === 0 ?
- - -

暂时还没有相关数据哦！

-
:""} - - -
- -
-
- {middleshixundata === undefined || middleshixundata.length === 0?" ":middleshixundata.map((item,key)=>{ - return( -
- - { - item.tag_name === null ? "": -
- {item.tag_name} - {/**/} -
- } - { - item.is_jupyter===true? -
-

Jupyter

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

非试用内容，需要授权

-
- - - {/**/} - - - {/*target="_blank"*/} - -
-

- - {item.name} - -

- - {/*target="_blank"*/} - {/**/} -

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

- -

- {item.is_jupyter===false? - - {item.challenges_count} - - :""} - - {/**/} - {/**/} - {/*{item.exp}*/} - {/**/} - {/**/} - - - - {item.stu_num} - - - - {item.level} -

- -
-
- ) - }) - } - -
- -
- {/*totalcount*/} -
- {/**/} - {/* 不加参数请求的时候，没返回总数了。加了个比较大的数字，让他可以翻页 */} - -
- -
- -
- -
- ) - } -} - -export default ShixunCard; diff --git a/public/react/src/modules/tpm/shixuns/ShixunCardList.js b/public/react/src/modules/tpm/shixuns/ShixunCardList.js deleted file mode 100644 index a0c021980..000000000 --- a/public/react/src/modules/tpm/shixuns/ShixunCardList.js +++ /dev/null @@ -1,316 +0,0 @@ -import React, { Component } from 'react'; -import { Redirect } from 'react-router'; - -import { BrowserRouter as Router, Route} from "react-router-dom"; - -import { Switch ,Input,Tooltip,Icon} from 'antd'; - -import PropTypes from 'prop-types'; - -import classNames from 'classnames' - -import 'antd/lib/switch/style/index.css' - -import './shixunCss/ShixunCardList.css'; -import GotoQQgroup from '../../../modal/GotoQQgroup' - -import { on, off } from 'educoder' - -const $ = window.$; - -const Search = Input.Search; - -class ShixunCardList extends Component { - - constructor(props) { - super(props); - this.state={ - allevent:"desc", - mine:0, - InputValue: props.keyword || "", - typemy:0, - hots:0, - news:0, - shixunid:"", - upcircle:false, - typekeyid:undefined, - goshowqqgtounp:false, - } - } - - componentDidUpdate = (prevProps, prevState) => { - if (this.props.keyword != prevProps.keyword) { - this.setState({ - InputValue: this.props.keyword - }) - } - } - componentDidMount = () => { - on('searchKeywordChange', (event, data) => { - // console.log(data) - this.Input_search(data) - }) - } - componentWillUnmount = () => { - off('searchKeywordChange') - } - - - latestHot=(e,key)=>{ - - let{upcircle,typekeyid}=this.state; - - let id = e.target.id; - $("#"+id).siblings().removeClass("active"); - $("#"+id).addClass("active"); - - let type; - - // if(id==="all"){ - // type="publish_time"; - // } - if(id==="hot"){ - type="hot"; - }else if(id==="new"){ - type="new"; - - } - - if(typekeyid===key){ - if(upcircle===true){ - this.setState({ - upcircle:false, - }) - // this.props.Shixunsupcircles("desc") - }else if(upcircle===false){ - this.setState({ - upcircle:true, - }) - // this.props.Shixunsupcircles("desc") - } - }else{ - this.setState({ - typekeyid:key - }) - } - - - this.props.ShixunsState(false,type,"desc"); - } - - - onSwitchChange=(e,key)=>{ - let id=e.target.id - $("#"+id).siblings().removeClass("active"); - $("#"+id).addClass("active"); - let {typemy,upcircle,typekeyid}=this.state; - - if(typekeyid===key){ - if(upcircle===true){ - this.setState({ - upcircle:false, - }) - this.props.Shixunsupcircles("desc") - }else if(upcircle===false){ - this.setState({ - upcircle:true - }) - this.props.Shixunsupcircles("asc") - } - }else{ - this.setState({ - typekeyid:key - }) - } - - - if(typemy===0){ - this.setState({ - typemy:1 - }) - }else{ - this.setState({ - typemy:0 - }) - } - // allevent - this.props.ShixunsSwitch(); - } - //输入框搜索 - Input_search = (value) => { - this.setState({ - InputValue: value - }) - this.props.OnSearchInput(value,true); - } - - Input_searchs = (e) => { - this.setState({ - InputValue: e.target.value - }) - this.props.OnSearchInput(e.target.value,false); - } - upcircles=(val)=>{ - if(val==="asc"){ - this.setState({ - upcircle:false, - }) - this.props.Shixunsupcircles("desc") - }else if(val==="desc"){ - this.setState({ - upcircle:true - }) - this.props.Shixunsupcircles("asc") - } - } - - //头部获取是否已经登录了 - getUser=(url,type)=>{ - if(this.props.checkIfLogin()===false){ - this.props.showLoginDialog() - return - } - if(this.props.checkIfProfileCompleted()===false){ - this.props.showProfileCompleteDialog() - return - } - if(this.props&&this.props.current_user&&this.props.current_user.is_shixun_marker===false){ - this.setgoshowqqgtounp(true); - return; - } - - if(url !== undefined || url!==""){ - window.location.href = url; - } - - - } - - // 处理弹框 - setgoshowqqgtounp=(bool)=>{ - this.setState({ - goshowqqgtounp:bool - }) - } - render(){ - let {mine,InputValue,upcircle,goshowqqgtounp}=this.state; - - // console.log("NewHeadermygetHelmetapi123123123123"); - let shixuntype=false; - if(this.props&&this.props.mygetHelmetapi!=null){ - let shixun="/shixuns"; - let paths="/paths"; - let courses="/courses"; - this.props.mygetHelmetapi.navbar.map((item,key)=>{ - var reg = RegExp(item.link); - if(shixun.match(reg)){ - if(item.hidden===true){ - shixuntype=true - } - } - }) - } - - - return ( -
-
- - { - goshowqqgtounp===true? - this.setgoshowqqgtounp(bool)}> - : - "" - } - - {/*
this.latestHot(e,1)}>全部*/} - {/*
*/} - {/*
this.onSwitchChange(e,2)}>我的*/} - {/*
*/} - -
this.latestHot(e,4)}>最新 -
- -
this.latestHot(e,3)}>最热 -
- - {shixuntype===true?"":this.getUser("/shixuns/new")}>+新建实训项目} - -
- { - this.props.middleshixundata&&this.props.middleshixundata.search_tags - } -
- {/*
this.upcircles("asc")}*/} - {/*>*/} - {/**/} - {/**/} - {/*/!**!/*/} - {/**/} - {/*
*/} - {/*
this.upcircles("desc")}*/} - {/*style={{display:upcircle===true?"none":"block"}}*/} - {/*>*/} - {/**/} - {/**/} - {/*/!**!/*/} - {/**/} - {/*
*/} - - {/*
*/} - {/* this.Input_search(value)}*/} - {/*enterButton*/} - {/*/>*/} - - {/* this.Input_search(value)} - autoComplete="off" - > */} - {/*
*/} - {/*
*/} - {/*{*/} - {/*this.props.search_tags === null ? "" : this.props.search_tags*/} - {/*}*/} - {/*
*/} - {/*/!*
*/} - {/* *!/*/} - {/**/} - {/*
*/} - {/*隐藏我的*/} - - {/*
*/} - {/**/} -
-
- ); - } -} - -export default ShixunCardList; diff --git a/public/react/src/modules/tpm/shixuns/ShixunSearchBar.js b/public/react/src/modules/tpm/shixuns/ShixunSearchBar.js deleted file mode 100644 index 71f2cce90..000000000 --- a/public/react/src/modules/tpm/shixuns/ShixunSearchBar.js +++ /dev/null @@ -1,301 +0,0 @@ -import React, { Component } from 'react'; - -import { Select, Input,Menu, Dropdown } from 'antd'; - -import 'antd/lib/style/index.css'; - -import 'antd/lib/select/style/index.css'; - -import 'antd/lib/input/style/index.css'; - -import './shixunCss/ShixunSearchBar.css'; - -import axios from 'axios'; - -const $ = window.$; - -const Option = Select.Option; - -const Search = Input.Search; - - -class ShixunSearchBar extends Component { - - constructor(props) { - super(props) - this.state = { - status: undefined, - diff: 0, - InputValue: undefined, - shixunhoverData: [], - shixunchildValues:'', - shixunsearchAllvalue:"a", - openStatus:false, - openLevel:false - } -} - - //状态筛选 - status_search = (value) => { - let newvalue = value; - if (newvalue === "0") { - newvalue = " " - } else if (newvalue === "1") { - newvalue = 2 - } else if (newvalue === "2") { - newvalue = 1 - } else if (newvalue === "3") { - newvalue = 3 - } - - this.setState({ - status: newvalue, - openStatus:false - }) - let list = [{'type': 1}, {'value': newvalue}]; - this.props.StatusEnquiry(list); -} - - //难度筛选 -diff_search = (value) => { - this.setState({ - diff: value, - openLevel:false - }) - let list=[{'type':2},{'value':value}]; - this.props.StatusEnquiry(list); -} - - //输入框搜索 -Input_search = (value) => { - this.setState({ - InputValue: value - }) - this.props.OnSearchInput(value); -} - //查询 -shixunsearchAll = (e) => { - let{shixunsearchAllvalue}=this.state; - let id = e.target.value; - - if(shixunsearchAllvalue===id){ - return - } - if(id===0){ - id=" " - this.setState({ - InputValue: " " - }) - this.props.OnSearchInput(""); - } - let list=[{'tag_level':1},{'tag_id':id}]; - if(id!=undefined){ - this.setState({ - shixunsearchAllvalue:id, - shixunchildValues:"" - }) - this.props.Updatasearchlist(list); - } - -} - - shixunsearchall=(e)=>{ - let{shixunsearchAllvalue}=this.state; - let id = "a"; - - if(shixunsearchAllvalue===id){ - return - } - this.setState({ - shixunsearchAllvalue:"a", - shixunchildValues:"" - }) - this.props.allUpdatashixunlist(); - } - - //选择Tab页详情 - getshixunchildValue = (e) => { - let id = e.target.name; - let newid=e.target.id; - let list=[{'tag_level':2},{'tag_id':id}]; - if(id!=undefined||newid!=undefined){ - this.setState({ - shixunsearchAllvalue:newid - }) - this.props.Updatasearchlist(list); - } - } - -getshixunchildValues = (e) => { - let id = e.target.id; - let newid=e.target.name; - let list=[{'tag_level':3},{'tag_id':id}]; - if(id!=undefined||newid!=undefined){ - this.setState({ - shixunchildValues:id, - shixunsearchAllvalue:newid - }) - this.props.Updatasearchlist(list); - } - -} - -componentDidMount() { - let hoverUrlArr = []; - let hoverUrl = `/shixuns/menus.json`; - axios.get(hoverUrl - ).then((response) => { - hoverUrlArr = response.data; - // hoverUrlArr.reverse(); - this.setState({ - shixunhoverData: hoverUrlArr - }) - }).catch((error) => { - console.log(error) - }) -} - -render() { - let {shixunhoverData, shixunchildValues, shixunsearchAllvalue, InputValue,openStatus,openLevel} = this.state; - let {typepvisible} = this.props; - // //实训首页筛选的移入和点击事件 - // $(".shaiItem").hover(function(){ - // var hei=parseInt($(".shaiAllItem").height())-2; - // $(this).find(".subshaicontent").css("top", '34px'); - // $(this).find(".subshaicontent").show(); - // },function(){ - // $(this).find(".subshaicontent").hide(); - // }); - // - // $(".shaiItem").live("click",function(){ - // $(".shaiItem").removeClass("active"); - // $(this).addClass("active"); - // $(".subshaicontent").hide(); - // }); - // - // $(".subshaicontent").live("click", function(event){ - // $(".subshaicontent").hide(); - // event.stopPropagation(); - // }); - - let overlaymenu=(item,id)=>( - - { - item.map((list,k)=>{ - return( - -
- {list.name} -
- { - list.tags.map((tag,e)=>{ - return( - {tag.name} - ) - }) - } -
-
- - ) - }) - } - - ) - - return ( -
-
-
-
- 方向： -
-
  • 全部
    • - - { - shixunhoverData.map((item,key)=>{ - return( - =8?"bottomLeft":"bottomCenter"}> -
  • - {item.name} -
    • -     - ) - }) - } - - -
    -
    -
    - 筛选： - { - - } -
    -
  • this.diff_search(0)}>全部难度
    • -
  • this.diff_search(1)}>初级
    • -
  • this.diff_search(2)}>中级
    • -
  • this.diff_search(3)}>中高级
    • -
  • this.diff_search(4)}>高级
    • -
    - -
    -
    -
    -
    - ); -} -} - -export default ShixunSearchBar; diff --git a/public/react/src/modules/tpm/shixuns/ShixunsIndex.js b/public/react/src/modules/tpm/shixuns/ShixunsIndex.js index 4e11537dc..e42a2bd36 100644 --- a/public/react/src/modules/tpm/shixuns/ShixunsIndex.js +++ b/public/react/src/modules/tpm/shixuns/ShixunsIndex.js @@ -1,115 +1,99 @@ import React, { Component } from 'react'; - -import { Redirect } from 'react-router'; - -import { BrowserRouter as Router, Route, Link, Switch } from "react-router-dom"; - import axios from 'axios'; - -import { Spin } from 'antd'; - import { TPMIndexHOC } from '../TPMIndexHOC'; - -import { SnackbarHOC,getImageUrl} from 'educoder'; - -import ShixunCardList from './ShixunCardList'; - -import ShixunSearchBar from './ShixunSearchBar'; - -import ShixunCard from './ShixunCard'; - +import { SnackbarHOC, getImageUrl } from 'educoder'; +import ShixunCardList from './shixun-keyword-list'; +import ShixunSearchBar from './shixun-search-bar'; +import ShixunCard from './shixun-card'; import UpgradeModals from '../../modals/UpgradeModals'; - const queryString = require('query-string'); - -const $ = window.$; - +import btnUrl from './btn-new.png' class ShixunsIndex extends Component { constructor(props) { super(props) - this.state={ + this.state = { order_by: "new", - page:1, - limit:16, - keyword:"", - status:0, - diff:0, + page: 1, + limit: 16, + keyword: "", + status: 0, + diff: 0, tag_level: 1, - tag_id:'', - middleshixundata:[], - typepvisible:true, - pages:1, - search_tags:null, - parsedid:undefined, - newtag_level:undefined, - newpalce:undefined, - sort:"desc" + tag_id: '', + middleshixundata: [], + typepvisible: true, + pages: 1, + search_tags: null, + parsedid: undefined, + newtag_level: undefined, + newpalce: undefined, + sort: "desc" } } - componentDidMount(){ + componentDidMount() { - const upsystem=`/users/system_update.json`; - axios.get(upsystem).then((response)=>{ - let updata=response.data; - this.setState({ - updata:updata - }) - }).catch((error)=>{ - console.log(error); - }) + const upsystem = `/users/system_update.json`; + axios.get(upsystem).then((response) => { + let updata = response.data; + this.setState({ + updata: updata + }) + }).catch((error) => { + console.log(error); + }) - let _keyword; + let _keyword; if (window.__headSearchKeyword) { this.setState({ keyword: window.__headSearchKeyword }) _keyword = window.__headSearchKeyword delete window.__headSearchKeyword } const parsed = queryString.parse(this.props.location.search); - if(parsed.id===undefined&&parsed.type===undefined){ - let {order_by, tag_level, tag_id, page, limit, keyword, status, diff} = this.state; - let params={ - order_by:order_by, - tag_level:tag_level, - tag_id:tag_id, - page:page, - limit:limit, - keyword: _keyword || keyword , - status:status, - diff:diff, + if (parsed.id === undefined && parsed.type === undefined) { + let { order_by, tag_level, tag_id, page, limit, keyword, status, diff } = this.state; + let params = { + order_by: order_by, + tag_level: tag_level, + tag_id: tag_id, + page: page, + limit: limit, + keyword: _keyword || keyword, + status: status, + diff: diff, sort: "desc" } this.shixunresultend(params); - }else{ - let {order_by,page, limit, keyword, status, diff} = this.state; - let nawparsed=parsed.type; - let newpalce=parsed.palce; - if(nawparsed==="rep"){ - nawparsed=1 + } else { + let { order_by, page, limit, keyword, status, diff } = this.state; + let nawparsed = parsed.type; + let newpalce = parsed.palce; + if (nawparsed === "rep") { + nawparsed = 1 } - else if(nawparsed==="sub"){ - nawparsed=2 - }else if(nawparsed==="tag"){ - nawparsed=3 + else if (nawparsed === "sub") { + nawparsed = 2 + } else if (nawparsed === "tag") { + nawparsed = 3 } - let params={ - order_by:order_by, - tag_level:nawparsed, - tag_id:parsed.id, - page:page, - limit:limit, + let params = { + order_by: order_by, + tag_level: nawparsed, + tag_id: parsed.id, + page: page, + limit: limit, keyword: _keyword || keyword, - status:status, - diff:diff, + status: status, + diff: diff, sort: "desc" } this.setState({ - parsedid:parsed.id, - newtag_level:nawparsed, - tag_level:nawparsed, - newpalce:newpalce, - tag_id:parsed.id, + parsedid: parsed.id, + newtag_level: nawparsed, + tag_level: nawparsed, + newpalce: newpalce, + tag_id: parsed.id, keyword: _keyword || keyword, }) this.shixunresultend(params); @@ -117,221 +101,219 @@ class ShixunsIndex extends Component { } - allUpdatashixunlist=()=>{ - let{sort,order_by}=this.state; + allUpdatashixunlist = () => { + let { sort, order_by } = this.state; this.setState({ tag_level: 1, - tag_id:'', + tag_id: '', page: 1, limit: 16, - keyword:'', + keyword: '', status: 0, diff: 0, }) - let params={ - order_by:order_by, + let params = { + order_by: order_by, tag_level: 1, - tag_id:'', + tag_id: '', page: 1, limit: 16, - keyword:'', + keyword: '', status: 0, diff: 0, - sort:sort + sort: sort } this.shixunresultend(params) } - Updatasearchlist=(value)=>{ + Updatasearchlist = (value) => { if (value[1].tag_id === " ") { this.setState({ keyword: "" }) } this.setState({ - tag_level:value[0].tag_level, - tag_id:value[1].tag_id, - typepvisible:true + tag_level: value[0].tag_level, + tag_id: value[1].tag_id, + typepvisible: true }) - let {order_by, sort, limit, keyword, status, diff} = this.state; - - let params={ - order_by:order_by, - tag_level:value[0].tag_level, - tag_id:value[1].tag_id, - page:1, - limit:limit, - keyword:keyword, - status:status, - diff:diff, - sort:sort + let { order_by, sort, limit, keyword, status, diff } = this.state; + + let params = { + order_by: order_by, + tag_level: value[0].tag_level, + tag_id: value[1].tag_id, + page: 1, + limit: limit, + keyword: keyword, + status: status, + diff: diff, + sort: sort } this.shixunresultend(params) } - StatusEnquiry=(key)=>{ - - let Vrl=`/shixuns.json`; + StatusEnquiry = (key) => { let newstatus; let newdiff; - if(key[0].type===1){ + if (key[0].type === 1) { this.setState({ status: key[1].value, - typepvisible:true + typepvisible: true }) - newstatus=key[1].value; - newdiff=this.state.diff; - }else if(key[0].type===2){ + newstatus = key[1].value; + newdiff = this.state.diff; + } else if (key[0].type === 2) { this.setState({ diff: key[1].value, - typepvisible:true + typepvisible: true }) - newdiff=key[1].value; - newstatus=this.state.status; + newdiff = key[1].value; + newstatus = this.state.status; } - let params= { - order_by:this.state.order_by, - tag_level:this.state.tag_level, - tag_id:this.state.tag_id, - page:1, - limit:this.state.limit, - keyword:this.state.keyword, - status:newstatus, - diff:newdiff, + let params = { + order_by: this.state.order_by, + tag_level: this.state.tag_level, + tag_id: this.state.tag_id, + page: 1, + limit: this.state.limit, + keyword: this.state.keyword, + status: newstatus, + diff: newdiff, } this.shixunresultend(params) } - OnSearchInput=(value,type)=>{ - if(type===true){ - this.setState({ - keyword:value, - typepvisible:true, - pages:1 - }) - let {order_by, tag_level, tag_id, sort, limit, status, diff} = this.state; - let params= { - order_by:order_by, - tag_level:tag_level, - tag_id:tag_id, - page:1, - limit:limit, - keyword:value, - status:status, - diff:diff, - sort:sort + OnSearchInput = (value, type) => { + if (type === true) { + this.setState({ + keyword: value, + typepvisible: true, + pages: 1 + }) + let { order_by, tag_level, tag_id, sort, limit, status, diff } = this.state; + let params = { + order_by: order_by, + tag_level: tag_level, + tag_id: tag_id, + page: 1, + limit: limit, + keyword: value, + status: status, + diff: diff, + sort: sort + } + this.shixunresultend(params) + } else { + this.setState({ + keyword: value, + pages: 1 + }) } - this.shixunresultend(params) - }else{ - this.setState({ - keyword:value, - pages:1 - }) - } } - ShixunsSwitch=()=>{ + ShixunsSwitch = () => { //types this.setState({ - order_by:"mine", - typepvisible:true, - pages:1, + order_by: "mine", + typepvisible: true, + pages: 1, }) - let{tag_level,tag_id,page,limit,keyword,status,diff,sort}=this.state; - let newsort=sort; - if(newsort===undefined){ - newsort="desc" + let { tag_level, tag_id, page, limit, keyword, status, diff, sort } = this.state; + let newsort = sort; + if (newsort === undefined) { + newsort = "desc" } - let params= { - order_by:"mine", - tag_level:tag_level, - tag_id:tag_id, - page:1, - limit:limit, - keyword:keyword, - status:status, - diff:diff, - sort:newsort + let params = { + order_by: "mine", + tag_level: tag_level, + tag_id: tag_id, + page: 1, + limit: limit, + keyword: keyword, + status: status, + diff: diff, + sort: newsort } this.shixunresultend(params) } - shixunsPage=(value)=>{ + shixunsPage = (value) => { this.setState({ - page:value, - typepvisible:true, - pages:value + page: value, + typepvisible: true, + pages: value }) - let {order_by, tag_level, tag_id, limit, keyword, status, diff,sort} = this.state; - let params= { - order_by:order_by, - tag_level:tag_level, - tag_id:tag_id, - page:value, - limit:limit, - keyword:keyword, - status:status, - diff:diff, - sort:sort + let { order_by, tag_level, tag_id, limit, keyword, status, diff, sort } = this.state; + let params = { + order_by: order_by, + tag_level: tag_level, + tag_id: tag_id, + page: value, + limit: limit, + keyword: keyword, + status: status, + diff: diff, + sort: sort } - let Url=`/shixuns.json`; - axios.get(Url,{ + let Url = `/shixuns.json`; + axios.get(Url, { params - }).then((response)=> { - if(response.status===200){ + }).then((response) => { + if (response.status === 200) { this.setState({ middleshixundata: response.data, - typepvisible:false, + typepvisible: false, }); } - }).catch((error)=>{ + }).catch((error) => { console.log(error) }); } - ShixunsState=(val,type,sorts)=>{ + ShixunsState = (val, type, sorts) => { // sort, - let {tag_level, tag_id, page, limit, keyword, status, diff,sort} = this.state; - let newsort=sorts?sorts:sort; + let { tag_level, tag_id, page, limit, keyword, status, diff, sort } = this.state; + let newsort = sorts ? sorts : sort; this.setState({ - order_by:type, - typepvisible:true, - pages:1, - sort:sorts?sorts:sort + order_by: type, + typepvisible: true, + pages: 1, + sort: sorts ? sorts : sort }) let params // let vals=false - if(newsort===undefined){ - newsort="desc" - }else{ - newsort=sorts?sorts:sort - } - params= { - order_by:type, - tag_level:tag_level, - tag_id:tag_id, - page:1, - limit:limit, - keyword:keyword, - status:status, - diff:diff, - sort:newsort + if (newsort === undefined) { + newsort = "desc" + } else { + newsort = sorts ? sorts : sort + } + params = { + order_by: type, + tag_level: tag_level, + tag_id: tag_id, + page: 1, + limit: limit, + keyword: keyword, + status: status, + diff: diff, + sort: newsort } this.shixunresultend(params) } - Shixunsupcircles=(sort)=>{ + Shixunsupcircles = (sort) => { console.log(sort) this.setState({ - sort:sort + sort: sort }) let { order_by, @@ -345,16 +327,16 @@ class ShixunsIndex extends Component { - let params= { - order_by:order_by, - tag_level:tag_level, - tag_id:tag_id, - page:1, - limit:limit, - keyword:keyword, - status:status, - diff:diff, - sort:sort + let params = { + order_by: order_by, + tag_level: tag_level, + tag_id: tag_id, + page: 1, + limit: limit, + keyword: keyword, + status: status, + diff: diff, + sort: sort } this.shixunresultend(params) } @@ -362,98 +344,98 @@ class ShixunsIndex extends Component { - shixunresultend=(params)=>{ - let Url=`/shixuns.json`; - axios.get(Url,{ + shixunresultend = (params) => { + let Url = `/shixuns.json`; + axios.get(Url, { params - }).then((response)=> { + }).then((response) => { // TODO 有keyword返回值时 显示一共有多少条记录 - if(response.status===200){ + if (response.status === 200) { this.setState({ - search_tags:response.data.search_tags, + search_tags: response.data.search_tags, middleshixundata: response.data, - typepvisible:false, - pages:1 + typepvisible: false, + pages: 1 }); } - }).catch((error)=>{ + }).catch((error) => { console.log(error) }); } render() { - let {middleshixundata, typepvisible, pages, search_tags, keyword,parsedid,newtag_level,newpalce} = this.state; + let { middleshixundata, typepvisible, pages, search_tags, keyword, parsedid, newtag_level, newpalce } = this.state; // console.log(this.state.updata) return (
    - {this.state.updata===undefined?"":} - - { - this.props.mygetHelmetapi&&this.props.mygetHelmetapi.shixun_banner_url? -
    -
    -
    -
    -
    -
    - : - "" - } - - {/**/} - - - - {/*下方图片*/} - + } + + { + this.props.mygetHelmetapi && this.props.mygetHelmetapi.shixun_banner_url ? +
    +
    +
    +
    +
    +
    + : + "" + } + + + + + {/*下方图片*/} + {/*    */}
    ); } } -export default SnackbarHOC() (TPMIndexHOC ( ShixunsIndex )); +export default SnackbarHOC()(TPMIndexHOC(ShixunsIndex)); diff --git a/public/react/src/modules/tpm/shixuns/btn-new.png b/public/react/src/modules/tpm/shixuns/btn-new.png new file mode 100644 index 0000000000000000000000000000000000000000..4b584c54886ffe7cd32cf38eda4f2cd7d2b6a685 GIT binary patch literal 1970 zcmV;j2Tk~iP)5Q9%?>XfAow$bfRU%#LNsaRWjM%PcL_Ofy4E^AMIN zmkNPn`{HjzzodNxi=s%6&%q9j_(hc^WM9^`}^GQ?|0w3zjqn5 z9_(|0&oj`602m8E*mmAT|2F`*VgPHWZer}u#7Bnw;UxQi1Op;W)am=X#o%MDZ`=l^ zRf+gs3DN4b0j${!=bZl;08@H12!P)SNPREJiLS=Efq)pgx~n%_e*$7^Dm_tThR759 zq(N}z+w_Py#hNOt%-M@XMXFKuj8-Jy`)eq)O2k%QG^*n}8wHAeAmRuxDCKpd>=_Nx z;(G!g-a3NKw~iRq@tuv{b6J3mE(^d-4lv5zBL%T!o1!{c&7(< z3&tctT==#)KWaPdc~;m}5{LB#(Os%yG9YFQ7Xx@!;4vH=8x{^Hz8J}M*_dhN39qzZ zTyH9-Fb+Ixh&e)N4LaOtlD7kz49NGgw=l=nmpaz0*TOGr6RxU?knOb>8L9%z$lQnk zYabjL76vxMhTfou{lz7y)hTHklK~lOE`hgDN}VcDS0K4QoBm#IKLb(jE3r!+hn0@A zkfzMXu96dwYpRi=%rQMh?v(^AFt{*!2RsFXk)^tYDc2%UtNllXj)%!8a=&c$5z6qb zECiFUMxdm*`mVS33J~JC6-RJaCEBQZ4M@BaqUXWq5?%-e5Qq4Kz|8~xJwxE<}P zza9he7D!>v=6BU!r|V5RO{a(A12w+m<{kkVVd082&)r7(F(!2_G8>DGYTL0>)Vi~%5OhkqN%0;F++lJO;v;)B|qUiStx$3 zO-G)(4A1l*fgSQ#D4#z5pR!RW5K=WfEPD$It%{B)ar#qvEH=Bnj6)S?kgCjsTvLUc zO{K8r3NTGH3hz2E!1t9&_@nL`EZG(~C|!eh3S%%vFc@S}6_mFRgUsx4-D@vhIo|6S zZ0>-8mtTjxxe8BNI3w9(JA5)ivC(BA1ySkMSYSI5i*J0|H3;eC1D8b*u+0%u@f(f~ zTaVGHYjM?U4_?UHjK7*nI{C56!4EImOh9Du57;(vDZNIPym{(!2-)T^WAU&yZ$Eu{ z|2gI}I9ytS2+3T0Rep*tu%e}FvA*ydRJPQC6#Uvih#fMhq>S38$OD0p5DIY$fHg+| zF2kXY#a3UyZ1FfGDKb%`CEp-{_?pY8XjUM@^K)#M|3uXw)e{Rg9|zo5V?)s)jOjOs zexf9bkgy}_RyNmTg~KeYa`c0L_7=JX7GGF|dR-$OfLwJMR@l!%h$H|9%1$9t{)2HK z1YiJHgz=U#EVrMDWjA+2rPtu}$SpWgbrI7<9<+qBvm}m=B5{hW#WR!zDAZKY+HIKA zi#Sl8NOL4jnTJ!Y2~Adr1pM&rBt)103XP!!nVwM)UYOTOWm|54Y;c}O6a4MM7+T~@ ztWBe#-tEvL?@T0|ELeP4bA&Wr_m?FiR1$!R8R6LC_6ibeQgEd59L5WWz|Y#7E@5vp z%CXRP5;zPS9{t=XEGY@4s|v6pHwt`)OYf8L#dzO!5%!fP(0qy<_$nr(hqZ$!bV{i8 zEr@WQORp1227_Rw7)zNrQ>5Dx%3*oaDTHMgycYm z=N>w8Yx4F(YtYhAIy!Vc&5QCD1+85r*I&o8qEU#E1$P>GG6fUoI!@DX=6r#ZHJ2&K zc%h8e!zNh{$2R$o=*KqeJ_wQZtjAWY%RhiHr$7{FDxlG85g_(~(Fu%1px7cnn;;Jt}*;>2~&i|T*QO9GhjW50#vJRQ5LTo8MhJ>0c(6>G} z$bBEWEJnEVO9;x{htCGT0r!;UnAm@K_d%wMM$;)(sZ(Q|P>N+ad+?=u5d989es=^R z$(iI4iPMU7I=_?eB*mIagiGe&^U`=)F(JDVeo>_3mb#MK9V>LF;poD*K}h~VIz5L< z0%<5ml_emmGy%;9Ee=XoBdf8Po+l+&->c#DS=Q|wA)^r}o`4k&Gx3Q$mO8n~Wg&Hv z$V?PCTc1f2c%+3Jriw;lcWFG__;#3KV<lYH`kED+)EY zajGU2$E(hxPN$+GF<|h#wKoM^nHvT2iJ91F(l^r?YfouBE;ZbwP$ay_Gw!TMBqn71 zn_JXQU-~@VXEqGXDGls>V|scnAm?HkYj2Hx-ECP8Mlr2qf`07*qoM6N<$ EfE-T(jq literal 0 HcmV?d00001 diff --git a/public/react/src/modules/tpm/shixuns/shixun-card.js b/public/react/src/modules/tpm/shixuns/shixun-card.js new file mode 100644 index 000000000..5fe07d074 --- /dev/null +++ b/public/react/src/modules/tpm/shixuns/shixun-card.js @@ -0,0 +1,97 @@ +import React from 'react'; +import { getImageUrl, setImagesUrl, getUrl } from 'educoder'; +import { Spin, Tooltip, Rate, Pagination } from 'antd'; +import './shixunCss/shixunCard.scss'; + +export default ({ middleshixundata, pagination, typepvisible, pages, totalcount, shixunsPage }) => { + function onPageChange(number) { + shixunsPage(number) + } + + return ( +
    + + {middleshixundata === undefined ? "" : middleshixundata.length === 0 ?
    + +

    暂时还没有相关数据哦！

    +
    : ""} + +
    +
    +
    + {middleshixundata === undefined || middleshixundata.length === 0 ? " " : middleshixundata.map((item, key) => { + return ( +
    + { + item.tag_name === null ? "" : +
    + {item.tag_name} +
    + } + { + item.is_jupyter === true ? +
    +

    Jupyter

    +
    + : ""} + +
    + +

    非试用内容，需要授权

    +
    + + + + + +
    +

    + + {item.name} + +

    + +

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

    + +

    + {item.is_jupyter === false ? + + {item.challenges_count} + + : ""} + + + + {item.stu_num} + + + + {item.level} +

    + +
    +
    + ) + }) + } + +
    +
    +
    + +
    + +
    + +
    +     +
    + ) +} \ No newline at end of file diff --git a/public/react/src/modules/tpm/shixuns/shixun-keyword-list.jsx b/public/react/src/modules/tpm/shixuns/shixun-keyword-list.jsx new file mode 100644 index 000000000..ca0fc5025 --- /dev/null +++ b/public/react/src/modules/tpm/shixuns/shixun-keyword-list.jsx @@ -0,0 +1,81 @@ +import React, { useState, Fragment } from 'react'; +import GotoQQgroup from '../../../modal/GotoQQgroup' +import { Input, Icon } from 'antd' +import './shixun-keyword-list.scss' + +function AddonAfter({ callback }) { + return + + 搜索 + +} +export default ({ onChangeLabel, btnUrl, OnSearchInput, checkIfLogin, showLoginDialog, checkIfProfileCompleted, showProfileCompleteDialog, current_user }) => { + const [data, setData] = useState({ + type: 'new', + showQQ: false, + keyword: '', + }) + + function onChangeTag(e) { + const id = e.target.id + setData({ ...data, type: id }) + onChangeLabel(false, id, "desc") + } + function onSetKeyword(e) { + setData({ ...data, keyword: e.target.value }) + } + + function callback() { + if (keyword) { + OnSearchInput(keyword, true) + } + } + + function setShowQQ(v) { + setData({ ...data, showQQ: v }) + } + + function onNewShiXun() { + if (!checkIfLogin()) { + showLoginDialog() + return + } + if (!checkIfProfileCompleted()) { + showProfileCompleteDialog() + return + } + if (current_user && current_user.is_shixun_marker === false) { + setShowQQ(true) + return + } + window.location.href = '/shixuns/new' + } + + const { type, keyword, showQQ } = data + return ( + +
    +
    +
    + 最新 + 最热 +
    +
    + } defaultValue="" placeholder='请输入课程名称进行搜索' /> +
    +
    + + 创建实训 + +
    + + { + showQQ ? + + : + "" + } +     + + ) +} diff --git a/public/react/src/modules/tpm/shixuns/shixun-keyword-list.scss b/public/react/src/modules/tpm/shixuns/shixun-keyword-list.scss new file mode 100644 index 000000000..d3ecd2008 --- /dev/null +++ b/public/react/src/modules/tpm/shixuns/shixun-keyword-list.scss @@ -0,0 +1,70 @@ +.search-keyword-container { + display: flex; + flex-flow: row nowrap; + justify-content: space-between; + align-items: center; + padding: 20px 0; + + .ant-input-group-addon { + background-color: #4CACFF; + } + + .ant-input:focus+.ant-input-group-addon { + background-color: #4CACFF !important; + } + + .search-container { + width: 320px; + } + + .btn-search { + display: block; + text-align: center; + color: #fff; + + span { + margin-left: 5px; + } + } + + + .btn-groups { + display: flex; + flex-flow: row nowrap; + align-items: center; + justify-content: start; + + a { + display: block; + width: 60px; + border-radius: 14px; + text-align: center; + height: 28px; + line-height: 28px; + + &:first-child { + margin-right: 20px; + } + + color: #999; + background-color: #eee; + + &.active { + color: #fff; + background-color: #4CACFF; + } + } + } +} + +.wrapper { + position: relative; +} + +.btn-new { + position: absolute; + width: 40px; + right: 39px; + top: 76px; + z-index: 10; +} \ No newline at end of file diff --git a/public/react/src/modules/tpm/shixuns/shixun-search-bar/A.jsx b/public/react/src/modules/tpm/shixuns/shixun-search-bar/A.jsx new file mode 100644 index 000000000..7e933462e --- /dev/null +++ b/public/react/src/modules/tpm/shixuns/shixun-search-bar/A.jsx @@ -0,0 +1,11 @@ +import React from 'react' +export default ({ + activeId, id, callback, text +}) => { + function onClickHandler() { + callback(id) + } + return ( + {text} + ) +} \ No newline at end of file diff --git a/public/react/src/modules/tpm/shixuns/shixun-search-bar/index.jsx b/public/react/src/modules/tpm/shixuns/shixun-search-bar/index.jsx new file mode 100644 index 000000000..29a3b8485 --- /dev/null +++ b/public/react/src/modules/tpm/shixuns/shixun-search-bar/index.jsx @@ -0,0 +1,121 @@ +import React, { useState, useEffect } from 'react' +import { Menu, Dropdown } from 'antd' +import 'antd/lib/style/index.css'; +import '../shixunCss/shixun-search-bar.scss' +import axios from 'axios' +import A from './A.jsx' + +const DiffObject = [ + { id: 0, text: '全部难度' }, + { id: 1, text: '初级' }, + { id: 2, text: '中级' }, + { id: 3, text: '中高级' }, + { id: 4, text: '高级' } +] +export default ({ StatusEnquiry, allUpdatashixunlist, Updatasearchlist }) => { + const [data, setData] = useState({ + diff: 0, + searchValue: 'a', + navs: [], + searchKey: '', + childValue: '' + }) + const { diff, searchValue, navs, childValue, searchKey } = data + function diffSearch(diff) { + setData({ + ...data, + diff + }) + StatusEnquiry([{ 'type': 2 }, { 'value': diff }]) + } + function onSearchAll() { + if (searchValue !== 'a') { + setData({ ...data, searchValue: 'a', childValue: '' }) + allUpdatashixunlist() + } + } + function getChildValue(e) { + let id = e.target.name + let newid = e.target.id + if (id || newid) { + setData({ ...data, searchValue: newid }) + Updatasearchlist([{ 'tag_level': 2 }, { 'tag_id': id }]) + } + } + function getChildValues(e) { + let id = e.target.id; + let newid = e.target.name; + if (id || newid) { + setData({ ...data, searchValue: newid, childValue: id }) + Updatasearchlist([{ 'tag_level': 3 }, { 'tag_id': id }]) + } + } + function onSearchBranch(e) { + const id = e.target.value + if (id != searchValue) { + setData({ ...data, searchValue: id, childValue: '' }) + Updatasearchlist([{ 'tag_level': 1 }, { 'tag_id': id }]) + } + + } + function overlayMenu(item, id) { + return + { + item.map((list, k) => +
    + {list.name} +
    + { + list.tags.map((tag, e) => {tag.name} + ) + } +
    +
    +     + ) + } +     + + } + useEffect(() => { + async function init() { + const response = await axios.get('/shixuns/menus.json') + setData({ ...data, navs: response.data }) + } + init() + }, []) + return ( +
    +
    +
    +
    + 方向： +
    + 全部 + { + navs.map((item, key) => { + return ( + = 8 ? "bottomLeft" : "bottomCenter"}> +
  • + {item.name} +
    • +     + ) + }) + } + + +
    +
    +
    + 筛选： +
    + {DiffObject.map(item => )} +
    + +
    +
    +
    +
    + ) +} diff --git a/public/react/src/modules/tpm/shixuns/shixunCss/ShixunSearchBar.css b/public/react/src/modules/tpm/shixuns/shixunCss/ShixunSearchBar.css index 7ea80bd26..433bd4693 100644 --- a/public/react/src/modules/tpm/shixuns/shixunCss/ShixunSearchBar.css +++ b/public/react/src/modules/tpm/shixuns/shixunCss/ShixunSearchBar.css @@ -1,23 +1,26 @@ -.iconfontShixunSearchBar{ - z-index: 1000; - position: absolute; - right: 3px; - top: 0px; +.iconfontShixunSearchBar { + z-index: 1000; + position: absolute; + right: 3px; + top: 0px; } -.pt_b_26{ - padding:26px 0px; + +.pt_b_26 { + padding: 26px 0px; +} + +.diffSelect { + margin-left: 20px !important; } -.diffSelect{ - margin-left:20px !important; - } - .ant-input-search-button{ - /*margin-right: 10px;*/ - border: 1px solid transparent; - } -.Mousebox{ - width: 800px !important; +.ant-input-search-button { + border: 1px solid transparent; } -.subshaicontent a{ - height:30px; + +.Mousebox { + width: 800px !important; +} + +.subshaicontent a { + height: 30px; } \ No newline at end of file diff --git a/public/react/src/modules/tpm/shixuns/shixunCss/shixun-search-bar.scss b/public/react/src/modules/tpm/shixuns/shixunCss/shixun-search-bar.scss new file mode 100644 index 000000000..1195598cd --- /dev/null +++ b/public/react/src/modules/tpm/shixuns/shixunCss/shixun-search-bar.scss @@ -0,0 +1,78 @@ +.iconfontShixunSearchBar { + z-index: 1000; + position: absolute; + right: 3px; + top: 0px; +} + +.pt_b_26 { + padding: 26px 0px; +} + +.diffSelect { + margin-left: 20px !important; +} + +.ant-input-search-button { + border: 1px solid transparent; +} + +.Mousebox { + width: 800px !important; +} + +.subshaicontent a { + height: 30px; +} + +.ant-dropdown { + width: 800px; +} + +.shixun_repertoire { + cursor: pointer; + float: left; + margin-right: 20px; + color: #999; + cursor: pointer; + margin-bottom: 10px; +} + +.ant-dropdown-menu-item, +.ant-dropdown-menu-submenu-title { + padding: 0px 12px; +} + +.ant-dropdown-menu-item:hover, +.ant-dropdown-menu-submenu-title:hover { + background: transparent !important; +} + +.shaiContent li.shaiItem { + padding: 0px 15px; + line-height: 32px; + height: 32px +} + +.shaiTitle { + height: 32px; + line-height: 32px; +} + +.shaiItems { + padding: 0px 15px; + line-height: 32px; + height: 32px; + float: left; + border-radius: 4px; + color: #4C4C4C; + cursor: pointer; + margin-right: 15px; + display: block; + float: left; +} + +.shaiItems.active { + background-color: #4CACFF !important; + color: #fff !important; +} \ No newline at end of file diff --git a/public/react/src/modules/tpm/shixuns/shixunCss/shixunCard.css b/public/react/src/modules/tpm/shixuns/shixunCss/shixunCard.css index 1ec00a26e..ccb51ed13 100644 --- a/public/react/src/modules/tpm/shixuns/shixunCss/shixunCard.css +++ b/public/react/src/modules/tpm/shixuns/shixunCss/shixunCard.css @@ -6,29 +6,32 @@ margin-left: 32%; } -.square-img{ - min-height: 210px; +.square-img { + min-height: 210px; } -.task-hide{ + +.task-hide { margin-bottom: 0em; } -.backFAFAFA{ - background:#FAFAFA; + +.backFAFAFA { + background: #FAFAFA; } .demo { width: 500px; background-color: #0dcecb; text-align: center; - padding:50px; + padding: 50px; } + .next-loading { margin-bottom: 5px; - width:100%; + width: 100%; } -.next-rating-overlay .next-icon{ - color: #FFA800!important; +.next-rating-overlay .next-icon { + color: #FFA800 !important; } .custom-pagination { @@ -36,7 +39,7 @@ margin-left: 10px; } -.ml425{ - margin-left:42.5%; - margin-top:20px; +.ml425 { + margin-left: 42.5%; + margin-top: 20px; } \ No newline at end of file diff --git a/public/react/src/modules/tpm/shixuns/shixunCss/shixunCard.scss b/public/react/src/modules/tpm/shixuns/shixunCss/shixunCard.scss new file mode 100644 index 000000000..8ff3390a3 --- /dev/null +++ b/public/react/src/modules/tpm/shixuns/shixunCss/shixunCard.scss @@ -0,0 +1,101 @@ +.ml350 { + margin-left: 40%; +} + +.ml32 { + margin-left: 32%; +} + +.square-img { + min-height: 210px; +} + +.task-hide { + margin-bottom: 0em; +} + +.backFAFAFA { + background: #FAFAFA; +} + +.demo { + width: 500px; + background-color: #0dcecb; + text-align: center; + padding: 50px; +} + +.next-loading { + margin-bottom: 5px; + width: 100%; +} + +.next-rating-overlay .next-icon { + color: #FFA800 !important; +} + +.custom-pagination { + display: inline-block; + margin-left: 10px; +} + +.ml425 { + margin-left: 42.5%; + margin-top: 20px; +} + +.shixun-card { + + .edu-tab-con-box { + padding: 100px 0px; + } + + .ant-modal-body .edu-tab-con-box { + padding: 0px !important; + } + + img.edu-nodata-img { + margin: 40px auto 20px; + } + + .square-list { + margin-top: 5px; + } + + .tag-green { + position: absolute; + left: 10px; + bottom: 125px; + } + + .tag-org { + position: absolute; + left: 0px; + top: 20px; + } + + .tag-org-name { + width: 66px; + height: 28px; + background: #FF6802; + width: 66px; + height: 28px; + border-radius: 0px 20px 20px 0px; + } + + .tag-org-name-test { + width: 45px; + height: 23px; + font-size: 14px; + color: #FFFFFF; + line-height: 19px; + margin-right: 6px; + } + + .intermediatecenter { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + } +} \ No newline at end of file