|
|
import React,{ Component } from "react";
|
|
|
import { Modal,Checkbox,Select,Input,Tooltip,Spin,Icon } from "antd";
|
|
|
import axios from'axios';
|
|
|
import Modals from '../../modals/Modals';
|
|
|
const Search = Input.Search;
|
|
|
class PathModal extends Component{
|
|
|
constructor(props){
|
|
|
super(props);
|
|
|
this.state={
|
|
|
StudentList_value:"",
|
|
|
Searchvalue:undefined,
|
|
|
type:'all',
|
|
|
page:1,
|
|
|
patheditarry:undefined,
|
|
|
newshixunmodallist:undefined,
|
|
|
hometypepvisible: false,
|
|
|
shixunmodallist:undefined,
|
|
|
}
|
|
|
}
|
|
|
|
|
|
hidecouseShixunModal=()=>{
|
|
|
this.props.hidecouseShixunModal()
|
|
|
}
|
|
|
|
|
|
componentDidMount(){
|
|
|
this.setState({
|
|
|
hometypepvisible: true,
|
|
|
patheditarry: [],
|
|
|
checkBoxValues: [],
|
|
|
|
|
|
})
|
|
|
|
|
|
let coursesId = this.props.match.params.coursesId;
|
|
|
let url = "/courses/" + coursesId + "/homework_commons/subjects.json";
|
|
|
|
|
|
axios.get(url).then((result) => {
|
|
|
if (result.status === 200) {
|
|
|
this.setState({
|
|
|
shixunpath: true,
|
|
|
shixunmodallist: result.data,
|
|
|
hometypepvisible: false,
|
|
|
newshixunmodallist: result.data.subject_list,
|
|
|
})
|
|
|
}
|
|
|
}).catch((error) => {
|
|
|
console.log(error);
|
|
|
})
|
|
|
}
|
|
|
funshixunpathlist=(search,type,loading,page)=>{
|
|
|
let{newshixunmodallist}=this.state;
|
|
|
let newshixunmodallists=[]
|
|
|
if(page>1){
|
|
|
newshixunmodallists=newshixunmodallist;
|
|
|
}
|
|
|
this.setState({
|
|
|
hometypepvisible:loading
|
|
|
})
|
|
|
let coursesId=this.props.match.params.coursesId;
|
|
|
let url ="/courses/"+coursesId+"/homework_commons/subjects.json";
|
|
|
|
|
|
axios.get(url, {
|
|
|
params: {
|
|
|
search: search,
|
|
|
type:type,
|
|
|
page:page
|
|
|
}
|
|
|
}).then((result)=>{
|
|
|
if(result.status===200){
|
|
|
|
|
|
let shixun_list=result.data.subject_list;
|
|
|
|
|
|
for(var i=0; i<shixun_list.length;i++){
|
|
|
newshixunmodallists.push(shixun_list[i])
|
|
|
}
|
|
|
this.setState({
|
|
|
shixunpath:true,
|
|
|
shixunmodallist:result.data,
|
|
|
newshixunmodallist:newshixunmodallists,
|
|
|
hometypepvisible:false
|
|
|
})
|
|
|
|
|
|
}
|
|
|
}).catch((error)=>{
|
|
|
console.log(error);
|
|
|
})
|
|
|
}
|
|
|
|
|
|
//tag
|
|
|
changeTag=(types)=>{
|
|
|
let {Searchvalue}=this.state;
|
|
|
this.setState({
|
|
|
type:types,
|
|
|
page:1,
|
|
|
newshixunmodallist:undefined
|
|
|
})
|
|
|
this.funshixunpathlist(Searchvalue,types,true,1)
|
|
|
}
|
|
|
|
|
|
//搜索
|
|
|
SenttotheValue=(e)=>{
|
|
|
this.setState({
|
|
|
Searchvalue:e.target.value
|
|
|
})
|
|
|
}
|
|
|
SenttotheSearch=(value)=>{
|
|
|
this.setState({
|
|
|
page:1,
|
|
|
newshixunmodallist:undefined
|
|
|
})
|
|
|
let{type}=this.state;
|
|
|
this.funshixunpathlist(value,type,true,1)
|
|
|
}
|
|
|
|
|
|
|
|
|
//勾选实训
|
|
|
shixunhomeworkedit=(list)=>{
|
|
|
this.setState({
|
|
|
patheditarry:list
|
|
|
})
|
|
|
// this.props.funpatheditarry(newpatheditarry)
|
|
|
}
|
|
|
|
|
|
contentViewScrolledit=(e)=>{
|
|
|
//滑动到底判断
|
|
|
const {shixunmodallist} = this.state;
|
|
|
|
|
|
if(e.currentTarget.scrollHeight-e.currentTarget.scrollTop===e.currentTarget.clientHeight){
|
|
|
|
|
|
if(shixunmodallist.subject_list.length===0){
|
|
|
return;
|
|
|
}else{
|
|
|
let {Searchvalue,type,page,shixunpathlist}=this.state;
|
|
|
let newpage=page+1
|
|
|
this.funshixunpathlist(Searchvalue,type,true,newpage)
|
|
|
this.setState({
|
|
|
page:newpage
|
|
|
})
|
|
|
}
|
|
|
}
|
|
|
|
|
|
}
|
|
|
//提交
|
|
|
savecouseShixunModal=()=>{
|
|
|
this.setState({
|
|
|
hometypepvisible:true
|
|
|
})
|
|
|
let {patheditarry}=this.state;
|
|
|
let {coursesId}=this.props;
|
|
|
let url="/courses/"+coursesId+"/homework_commons/create_subject_homework.json";
|
|
|
if(patheditarry===undefined){
|
|
|
this.setState({
|
|
|
patheditarrytype:true,
|
|
|
patheditarryvalue:"请先选择实践课程",
|
|
|
hometypepvisible:false
|
|
|
})
|
|
|
return
|
|
|
}else if(patheditarry.length===0){
|
|
|
this.setState({
|
|
|
patheditarrytype:true,
|
|
|
patheditarryvalue:"请先选择实践课程",
|
|
|
hometypepvisible:false
|
|
|
})
|
|
|
return
|
|
|
}
|
|
|
axios.post(url, {
|
|
|
// category_id: datas&&datas.category_name===undefined||datas&&datas.category_name===null?undefined:category_id,
|
|
|
subject_ids:patheditarry,
|
|
|
}
|
|
|
).then((response) => {
|
|
|
if(response.data.status===-1){
|
|
|
// this.setState({
|
|
|
// Modalstype:true,
|
|
|
// Modalstopval:response.data.message,
|
|
|
// ModalsBottomval:"",
|
|
|
// ModalSave:this.cancelmodel,
|
|
|
// Loadtype:true
|
|
|
// })
|
|
|
this.props.showNotification(response.data.message)
|
|
|
|
|
|
}else{
|
|
|
// this.homeworkstart
|
|
|
//调用立即发布弹窗
|
|
|
// this.props.showNotification(response.data.message)
|
|
|
this.props.hidecouseShixunModal();
|
|
|
this.props.updataleftNavfun()
|
|
|
// this.props.courseshomeworkstart(response.data.category_id,response.data.homework_ids)
|
|
|
// this.props.showNotification("选用成功")
|
|
|
// this.props.showNotification(response.data.message)
|
|
|
this.props.homeworkupdatalists(this.props.Coursename,this.props.page,this.props.order);
|
|
|
}
|
|
|
|
|
|
// if(response.status===200) {
|
|
|
// this.props.courseshomeworkstart(response.data.category_id,response.data.homework_ids)
|
|
|
// }
|
|
|
|
|
|
this.setState({
|
|
|
hometypepvisible:false
|
|
|
})
|
|
|
}).catch((error) => {
|
|
|
console.log(error)
|
|
|
})
|
|
|
}
|
|
|
render(){
|
|
|
let {Searchvalue,type,Modalstype,newshixunmodallist,hometypepvisible,shixunmodallist}=this.state;
|
|
|
let {visible}=this.props;
|
|
|
const antIcon = <Icon type="loading" style={{ fontSize: 24 }} spin />;
|
|
|
|
|
|
return(
|
|
|
<div>
|
|
|
{/*提示*/}
|
|
|
{Modalstype&&Modalstype===true?<Modals
|
|
|
modalsType={this.state.Modalstype}
|
|
|
modalsTopval={this.state.Modalstopval}
|
|
|
modalCancel={this.state.ModalCancel}
|
|
|
modalSave={this.state.ModalSave}
|
|
|
modalsBottomval={this.state.ModalsBottomval}
|
|
|
loadtype={this.state.Loadtype}
|
|
|
/>:""}
|
|
|
<Modal
|
|
|
keyboard={false}
|
|
|
title="选择实践课程"
|
|
|
visible={visible}
|
|
|
closable={false}
|
|
|
footer={null}
|
|
|
width="840px"
|
|
|
destroyOnClose={true}
|
|
|
>
|
|
|
<Spin indicator={antIcon} spinning={hometypepvisible} size="large" style={{marginTop:'15%'}}>
|
|
|
<div className="newupload_conbox">
|
|
|
{ shixunmodallist && shixunmodallist.tags.length===0?"":<div className="clearfix mb20 shixun_work_div newshixun_tab_div cdefault" style={{"marginRight":"4px"}} id="shixun_tab_div">
|
|
|
|
|
|
<li className="fl mr5 mt5"> <a onClick={()=>this.changeTag("all")} className={ type==="all" ? "active edu-filter-cir-grey font-12":"edu-filter-cir-grey font-12"}>全部</a></li>
|
|
|
{
|
|
|
shixunmodallist && shixunmodallist.tags.map((item,key)=>{
|
|
|
return(
|
|
|
<li className="fl mr5 mt5" key={key}>
|
|
|
<a onClick={()=>this.changeTag(item.tag_id)} className={ parseInt(type) === parseInt(item.tag_id) ? "active edu-filter-cir-grey font-12":"edu-filter-cir-grey font-12"}>{item.tag_name}</a>
|
|
|
</li>
|
|
|
)
|
|
|
})
|
|
|
}
|
|
|
|
|
|
</div>}
|
|
|
<div className="clearfix mb20" id="shixun_search_form_div" style={{height:"30px"}}>
|
|
|
<span className="fl color-grey-9 font-16 mt3">
|
|
|
<span>共</span>
|
|
|
<span className="color-orange-tip">{shixunmodallist === undefined ? "":shixunmodallist.subjects_count}</span>
|
|
|
<span>个实践课程</span>
|
|
|
</span>
|
|
|
<div className="fr search-new">
|
|
|
<Search
|
|
|
placeholder="请输入创建者或者实训名称进行搜索"
|
|
|
value={Searchvalue}
|
|
|
onInput={this.SenttotheValue}
|
|
|
onSearch={(value) => this.SenttotheSearch(value)}
|
|
|
style={{width: '115%'}}
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
|
<ul className="clearfix greybackHead edu-txt-center">
|
|
|
<li className="fl with40 paddingleft22">实训路径名称</li>
|
|
|
<li className="fl with30 edu-txt-left">已发布实训数</li>
|
|
|
<li className="fl with10">使用人数</li>
|
|
|
<li className="fl with10"></li>
|
|
|
</ul>
|
|
|
|
|
|
<style>
|
|
|
{`
|
|
|
.pl40{
|
|
|
padding-left:40px
|
|
|
}
|
|
|
.newtaskhide{
|
|
|
margin-top:0px !important;
|
|
|
height: 40px;
|
|
|
}
|
|
|
|
|
|
`}
|
|
|
</style>
|
|
|
|
|
|
|
|
|
|
|
|
{ newshixunmodallist === undefined ? <div className="over210 pl20 pr20" style={{height:"204px"}}></div>:newshixunmodallist&&newshixunmodallist.length===0?<div className="alltask edu-back-white">
|
|
|
<div className="edu-tab-con-box clearfix edu-txt-center">
|
|
|
<img className="edu-nodata-img mb20" src="/images/educoder/nodata.png" />
|
|
|
<p className="edu-nodata-p mb20">暂时还没有相关数据哦！</p></div>
|
|
|
</div>:<div className="over210 pl20 pr20"
|
|
|
onScroll={this.contentViewScrolledit}
|
|
|
style={{height:"204px"}}>
|
|
|
<Checkbox.Group style={{ width: '100%' }} onChange={this.shixunhomeworkedit}>
|
|
|
{
|
|
|
|
|
|
newshixunmodallist&&newshixunmodallist.map((item,key)=>{
|
|
|
return(
|
|
|
<div className="clearfix edu-txt-center lineh-40 bor-bottom-greyE" key={key}>
|
|
|
<li className="fl with40 newtaskhide">
|
|
|
<Checkbox
|
|
|
id={"shixun_input_"+item.subject_id}
|
|
|
value={item.subject_id}
|
|
|
key={item.subject_id}
|
|
|
className="task-hide edu-txt-left newtaskhide"
|
|
|
style={{"width":"280px"}}
|
|
|
name="shixun_homework[]"
|
|
|
>
|
|
|
<label style={{"textAlign":"left","color":"#05101A"}} className="task-hide color-grey-name" title={item.subject_name}>{item.subject_name}</label>
|
|
|
</Checkbox>
|
|
|
</li>
|
|
|
<li className="fl with30 edu-txt-left task-hide pl40">{item.shixun_count}</li>
|
|
|
<li className="fl with10 paddingl10">{item.myshixun_count}</li>
|
|
|
<Tooltip title="新窗口查看详情">
|
|
|
<li className="fr with10"><a className="color-blue" href={"/paths/"+item.subject_id} target="_blank">详情</a></li>
|
|
|
</Tooltip>
|
|
|
</div>
|
|
|
)
|
|
|
})
|
|
|
}
|
|
|
</Checkbox.Group>
|
|
|
</div>}
|
|
|
{ this.state.patheditarrytype===true?<span className={"color-red"}>{this.state.patheditarryvalue}</span>:""}
|
|
|
<div className="mt20 marginauto clearfix edu-txt-center">
|
|
|
<a className="pop_close task-btn mr30 margin-tp26" onClick={this.hidecouseShixunModal}>取消</a>
|
|
|
<a className="task-btn task-btn-orange margin-tp26" id="submit_send_shixun" onClick={this.savecouseShixunModal}>确定</a>
|
|
|
</div>
|
|
|
</div>
|
|
|
</Spin>
|
|
|
</Modal>
|
|
|
</div>
|
|
|
)
|
|
|
}
|
|
|
}
|
|
|
export default PathModal;
|
