You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
274 lines
8.7 KiB
274 lines
8.7 KiB
import React, { Component } from 'react';
|
|
import axios from 'axios';
|
|
import {Dropdown,Menu} from 'antd';
|
|
import {getImageUrl} from 'educoder';
|
|
import PathCard from "./ShixunPathCard";
|
|
import UpgradeModals from '../modals/UpgradeModals';
|
|
import Pagination from '@icedesign/base/lib/pagination';
|
|
import '@icedesign/base/lib/pagination/style.js';
|
|
import './ShixunPaths.css';
|
|
|
|
class ShixunPathSearch extends Component{
|
|
constructor(props) {
|
|
super(props)
|
|
this.state = {
|
|
order:"updated_at",
|
|
select:undefined,
|
|
search:"",
|
|
page:1,
|
|
pathList:null,
|
|
sortList:'',
|
|
total_count:0,
|
|
sort:"desc",
|
|
limit:16,
|
|
discipline_id:undefined,
|
|
sub_discipline_id:undefined
|
|
}
|
|
}
|
|
|
|
|
|
//切换列表状态
|
|
changeStatus=(value)=>{
|
|
|
|
let {discipline_id,sub_discipline_id }=this.state;
|
|
this.setState({
|
|
order:value,
|
|
page:1
|
|
})
|
|
this.getList(value,discipline_id,sub_discipline_id,1);
|
|
}
|
|
|
|
|
|
//选择页数
|
|
onChange=(pageNumber)=> {
|
|
|
|
let { order,discipline_id,sub_discipline_id }=this.state;
|
|
this.setState({
|
|
page:pageNumber
|
|
})
|
|
this.getList(order,discipline_id,sub_discipline_id,pageNumber);
|
|
}
|
|
|
|
//顶部分类
|
|
changeSelect=(e,tag_id,sum)=>{
|
|
|
|
this.setState({
|
|
order:"updated_at",
|
|
discipline_id:tag_id,
|
|
page:1,
|
|
sub_discipline_id:undefined
|
|
})
|
|
let { order }=this.state;
|
|
this.getList(order,tag_id,undefined,1 );
|
|
e.stopPropagation();
|
|
}
|
|
|
|
|
|
componentDidMount(){
|
|
document.title="实践课程";
|
|
const upsystem=`/users/system_update.json`;
|
|
axios.get(upsystem).then((response)=>{
|
|
let updata=response.data;
|
|
this.setState({
|
|
updata:updata
|
|
})
|
|
}).catch((error)=>{
|
|
console.log(error);
|
|
})
|
|
this.getdisciplines()
|
|
let { order,discipline_id,sub_discipline_id,page }=this.state;
|
|
this.getList(order,discipline_id,sub_discipline_id,page );
|
|
|
|
}
|
|
|
|
getdisciplines=()=>{
|
|
let url='/disciplines.json';
|
|
axios.get(url,{params:{
|
|
source:"subject"
|
|
}}).then((result)=>{
|
|
if(result.status==200){
|
|
// console.log(result.data.disciplines)
|
|
this.setState({
|
|
sortList:result.data.disciplines
|
|
})
|
|
}
|
|
}).catch((error)=>{
|
|
console.log(error);
|
|
})
|
|
}
|
|
|
|
getList=(order,discipline_id,sub_discipline_id,page )=>{
|
|
|
|
let url='/paths.json';
|
|
axios.get(url,{params:{
|
|
sort:"desc",
|
|
limit:16,
|
|
order:order,
|
|
page:page,
|
|
discipline_id:discipline_id,
|
|
sub_discipline_id:sub_discipline_id
|
|
}}).then((result)=>{
|
|
if(result.status==200){
|
|
this.setState({
|
|
pathList:result.data.subjects,
|
|
total_count:result.data.total_count
|
|
})
|
|
}
|
|
}).catch((error)=>{
|
|
console.log(error);
|
|
})
|
|
}
|
|
|
|
//头部获取是否已经登录了
|
|
getUser=(url,type)=>{
|
|
if(this.props.checkIfLogin()===false){
|
|
this.props.showLoginDialog()
|
|
return
|
|
}
|
|
if(this.props.checkIfProfileCompleted()===false){
|
|
this.props.showProfileCompleteDialog()
|
|
return
|
|
}
|
|
|
|
if(url !== undefined || url!==""){
|
|
this.props.history.push(url);
|
|
}
|
|
|
|
|
|
}
|
|
|
|
getshixunchildValues=(e,id,item)=>{
|
|
|
|
this.setState({
|
|
discipline_id:item.id,
|
|
sub_discipline_id:id,
|
|
})
|
|
let { order,page }=this.state;
|
|
this.getList(order,item.id,id,page );
|
|
e.stopPropagation();
|
|
}
|
|
|
|
getmenu=(list,item)=>{
|
|
return(
|
|
<Menu>
|
|
<Menu.Item>
|
|
<div className="mt5 subshaicontent-part">
|
|
<div className="sub-Item clearfix">
|
|
{
|
|
list.map((tag,e)=>{
|
|
return(
|
|
<a className={parseInt(this.state.sub_discipline_id)===tag.id?"shixun_repertoire mr20 color-blue":"shixun_repertoire mr20"}
|
|
key={e} id={tag.id} name={tag.id} rel="subshaicontent" onClick={(e)=>this.getshixunchildValues(e,tag.id,item)}>{tag.name}</a>
|
|
)
|
|
})
|
|
}
|
|
</div>
|
|
</div>
|
|
</Menu.Item>
|
|
</Menu>
|
|
)
|
|
}
|
|
render() {
|
|
let { order,sortList,search,page,total_count,discipline_id }=this.state;
|
|
let pathstype=false;
|
|
if(this.props&&this.props.mygetHelmetapi!=null){
|
|
let paths="/paths";
|
|
this.props.mygetHelmetapi.navbar.map((item,key)=>{
|
|
var reg = RegExp(item.link);
|
|
if(paths.match(reg)){
|
|
if(item.hidden===true){
|
|
pathstype=true
|
|
}
|
|
}
|
|
|
|
})
|
|
}
|
|
|
|
return (
|
|
<div>
|
|
{this.state.updata===undefined?"":<UpgradeModals
|
|
{...this.state}
|
|
/>}
|
|
|
|
<style>
|
|
{
|
|
`
|
|
::-webkit-scrollbar {
|
|
width: 0px !important;
|
|
}
|
|
.pathImg{
|
|
width: 100%;
|
|
height: 300px;
|
|
background-image: url(${getImageUrl(this.props.mygetHelmetapi&&this.props.mygetHelmetapi.subject_banner_url===null?`images/path/path.png`:this.props.mygetHelmetapi&&this.props.mygetHelmetapi.subject_banner_url)});
|
|
background-color: #000a4f;
|
|
/* background-size: cover; */
|
|
background-position: center;
|
|
background-repeat: no-repeat;
|
|
}
|
|
.ant-dropdown-menu{
|
|
max-width:1000px;
|
|
}
|
|
.ant-dropdown-menu-item, .ant-dropdown-menu-submenu-title{
|
|
white-space: normal !important;
|
|
line-height: 28px !important;
|
|
}
|
|
.ant-dropdown-menu-item:hover, .ant-dropdown-menu-submenu-title:hover{
|
|
background-color: #fff !important;
|
|
}
|
|
a{text-decoration:none !important;}
|
|
`
|
|
}
|
|
</style>
|
|
<div className="pr">
|
|
<div className="pathImg"></div>
|
|
<div className="edu-back-white padding20 pathIndexNav">
|
|
<ul className="educontent clearfix">
|
|
<li className={discipline_id > 0 ? "" : "active"}><a onClick={(e)=>this.changeSelect(e,undefined)}>全部</a></li>
|
|
{
|
|
sortList && sortList.map((item,key)=>{
|
|
return(
|
|
<li className={discipline_id == `${item.id}` ? "active" : ""} onClick={(e)=>this.changeSelect(e,`${item.id}`,item.sub_disciplines.length)} key={key}>
|
|
<Dropdown disabled={item.sub_disciplines.length===0} overlay={()=>this.getmenu(item.sub_disciplines,item)} placement="bottomCenter">
|
|
<a value={item.id}>{item.name}</a>
|
|
</Dropdown>
|
|
</li>
|
|
)
|
|
})
|
|
}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div className="mt20 educontent mb20 clearfix mainPageArray">
|
|
{/*<a href="javascript:void(0)" className={ order == "publish_time" ? "fl mr20 font-16 bestChoose active" : "fl mr20 font-16 bestChoose"} onClick={ () => this.changeStatus("publish_time")}>全部</a>*/}
|
|
{/*<a href="javascript:void(0)" className={ order == "mine" ? "fl mr20 font-16 bestChoose active" : "fl mr20 font-16 bestChoose"} onClick={ () => this.changeStatus("mine")}>我的</a>*/}
|
|
<span className={ order == "updated_at" ? "active" : ""} onClick={ () => this.changeStatus("updated_at")}>最新</span>
|
|
<span className={ order == "myshixuns_count" ? "active" : ""} onClick={ () => this.changeStatus("myshixuns_count")}>最热</span>
|
|
{this.props.user&&this.props.user.main_site===false?"":this.props.Headertop===undefined?"":<a className={ "fr font-16 bestChoose color-blue" } onClick={(url)=>this.getUser("/paths/new")}>+新建实践课程</a>}
|
|
{this.props.user&&this.props.user.main_site===true?"":this.props.Headertop===undefined?"":
|
|
pathstype===true?"":this.props.user&&this.props.user.admin===true||this.props.user&&this.props.user.is_teacher===true||this.props.user&&this.props.user.business===true?<a className={ "fr font-16 bestChoose color-blue" } onClick={(url)=>this.getUser("/paths/new")}>+新建实践课程</a>:""
|
|
}
|
|
{/*<div className="fr mr5 search-new">*/}
|
|
{/*/!* <Search*/}
|
|
{/*placeholder="请输入路径名称进行搜索"*/}
|
|
{/*id="subject_search_input"*/}
|
|
{/*value={search}*/}
|
|
{/*onInput={this.inputSearchValue}*/}
|
|
{/*onSearch={this.searchValue}*/}
|
|
{/*autoComplete="off"*/}
|
|
{/*></Search> *!/*/}
|
|
{/*</div>*/}
|
|
</div>
|
|
<PathCard {...this.props} {...this.state}></PathCard>
|
|
{
|
|
this.state.pathList===null?"":total_count > 16 &&
|
|
<div className="educontent mb80 edu-txt-center mt10">
|
|
<Pagination current={page} total={ total_count || 1299 } type="mini" pageSize={16} onChange={this.onChange} />
|
|
</div>
|
|
}
|
|
|
|
</div>
|
|
)
|
|
}
|
|
}
|
|
export default ShixunPathSearch;
|