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.
571 lines
17 KiB
571 lines
17 KiB
import React, { Component } from 'react';
|
|
import { SnackbarHOC } from 'educoder';
|
|
import {BrowserRouter as Router,Route,Switch,Link} from 'react-router-dom';
|
|
import {Tooltip,Menu,Pagination,Spin, Dropdown,Checkbox} from 'antd';
|
|
import axios from 'axios';
|
|
import {getImageUrl,WordsBtn} from 'educoder';
|
|
import moment from 'moment';
|
|
import Modals from '../../modals/Modals';
|
|
import SendTopics from '../../modals/SendTopics'
|
|
import NoneData from '../../courses/coursesPublic/NoneData';
|
|
import "./usersInfo.css";
|
|
import Withoutpermission from './Withoutpermission.png';
|
|
|
|
|
|
|
|
class InfosTopics extends Component{
|
|
constructor(props){
|
|
super(props);
|
|
this.state={
|
|
isSpin:false,
|
|
category:"normal",
|
|
course_list_id:undefined,
|
|
sort_by:"updated_at",
|
|
sort_direction:"desc",
|
|
page:1,
|
|
data:undefined,
|
|
checkBoxValues:[],
|
|
per_page:15,
|
|
isshowprofes:false
|
|
}
|
|
}
|
|
|
|
componentDidMount(){
|
|
let types=this.props.match.params.topicstype;
|
|
let professional_certification=this.props.current_user&&this.props.current_user.professional_certification;
|
|
|
|
if(professional_certification===false&&types==="publicly"){
|
|
this.setState({
|
|
isshowprofes:true
|
|
})
|
|
}else{
|
|
this.updataslist()
|
|
}
|
|
}
|
|
componentDidUpdate(prevProps) {
|
|
|
|
if(prevProps.current_user!=this.props.current_user){
|
|
let types=this.props.match.params.topicstype;
|
|
let professional_certification=this.props.current_user&&this.props.current_user.professional_certification;
|
|
|
|
console.log(professional_certification)
|
|
if(professional_certification===false&&types==="publicly"){
|
|
this.setState({
|
|
isshowprofes:true
|
|
})
|
|
}else{
|
|
this.updataslist()
|
|
}
|
|
}
|
|
}
|
|
updataslist=()=>{
|
|
let types=this.props.match.params.topicstype;
|
|
let { category,course_list_id,sort_by,sort_direction,page}=this.state;
|
|
this.searchAlldata(types,category,course_list_id,sort_by,sort_direction,page)
|
|
}
|
|
searchAlldata=(type,category,course_list_id,sort_by,sort_direction,page)=>{
|
|
|
|
// if(this.props.current_user.login!=this.props.match.params.username){
|
|
// return
|
|
// }else{
|
|
//
|
|
// }
|
|
this.setState({
|
|
isSpin:true
|
|
})
|
|
let user_id=this.props.match.params&&this.props.match.params.username;
|
|
if(user_id!=undefined){
|
|
let {per_page}=this.state;
|
|
let url=`/users/${user_id}/question_banks.json`;
|
|
axios.get(url,{params:{
|
|
type,
|
|
object_type:category,
|
|
course_list_id,
|
|
sort_by,
|
|
sort_direction,
|
|
page,
|
|
per_page
|
|
}
|
|
}).then((response) => {
|
|
this.setState({
|
|
data:response.data,
|
|
checkBoxValues:[],
|
|
isSpin:false
|
|
})
|
|
}).catch((error) => {
|
|
this.setState({
|
|
isSpin:false
|
|
})
|
|
});
|
|
}
|
|
}
|
|
|
|
searchCategory=(type)=>{
|
|
this.setState({
|
|
category:type,
|
|
course_list_id:undefined,
|
|
})
|
|
|
|
let types=this.props.match.params.topicstype;
|
|
let { category,course_list_id,sort_by,sort_direction,page}=this.state;
|
|
this.searchAlldata(types,type,undefined,sort_by,sort_direction,page)
|
|
}
|
|
|
|
searchCourselistid=(id)=>{
|
|
this.setState({
|
|
course_list_id:id
|
|
})
|
|
|
|
let types=this.props.match.params.topicstype;
|
|
let { category,course_list_id,sort_by,sort_direction,page}=this.state;
|
|
this.searchAlldata(types,category,id,sort_by,sort_direction,page)
|
|
}
|
|
|
|
onCheckBoxChange=(checkedValues)=>{
|
|
if(checkedValues.length>15){
|
|
this.props.showNotification("选择条数不能大于15条")
|
|
}else{
|
|
this.setState({
|
|
checkBoxValues:checkedValues
|
|
})
|
|
}
|
|
|
|
}
|
|
|
|
updatedlist=(updatedtype)=>{
|
|
let types=this.props.match.params.topicstype;
|
|
let { category,course_list_id,sort_by,sort_direction,page}=this.state;
|
|
if(updatedtype===sort_by){
|
|
if(sort_direction==="desc"){
|
|
this.setState({
|
|
sort_direction:"asc",
|
|
sort_by:updatedtype
|
|
})
|
|
this.searchAlldata(types,category,course_list_id,updatedtype,"asc",page)
|
|
}else{
|
|
this.setState({
|
|
sort_direction:"desc",
|
|
sort_by:updatedtype
|
|
})
|
|
this.searchAlldata(types,category,course_list_id,updatedtype,"desc",page)
|
|
}
|
|
}else{
|
|
this.setState({
|
|
sort_direction:"desc",
|
|
sort_by:updatedtype
|
|
})
|
|
this.searchAlldata(types,category,course_list_id,updatedtype,"desc",page)
|
|
}
|
|
}
|
|
|
|
|
|
changePage=(pageNumber)=>{
|
|
let types=this.props.match.params.topicstype;
|
|
let { category,course_list_id,sort_by,sort_direction,page}=this.state;
|
|
this.searchAlldata(types,category,course_list_id,sort_by,sort_direction,pageNumber)
|
|
this.setState({
|
|
page:pageNumber,
|
|
checkBoxValues:[]
|
|
})
|
|
}
|
|
|
|
deletecheckBoxValues=()=>{
|
|
let {checkBoxValues}=this.state;
|
|
|
|
if(checkBoxValues.length===0){
|
|
this.props.showNotification("请选择题库")
|
|
}else{
|
|
this.setState({
|
|
Modalstype:true,
|
|
Modalstopval:"是否确认删除？",
|
|
ModalCancel:this.topicscancelmodel,
|
|
ModalSave:this.topicssavedelete,
|
|
})
|
|
}
|
|
}
|
|
|
|
topicssavedelete=()=>{
|
|
let {checkBoxValues,category}=this.state;
|
|
const url = `/question_banks/multi_delete.json`;
|
|
axios.delete(url, { data: {
|
|
object_id: checkBoxValues,
|
|
object_type:category
|
|
}})
|
|
.then((response) => {
|
|
if(response.data.status===0){
|
|
this.updataslist()
|
|
this.props.showNotification(response.data.message)
|
|
}else{
|
|
this.props.showNotification(response.data.message)
|
|
}
|
|
})
|
|
.catch(function (error) {
|
|
console.log(error);
|
|
});
|
|
|
|
this.topicscancelmodel()
|
|
}
|
|
|
|
|
|
topicscancelmodel=()=>{
|
|
this.setState({
|
|
Modalstype:false,
|
|
Loadtype:false,
|
|
visible:false,
|
|
Modalstopval:"",
|
|
ModalCancel:"",
|
|
ModalSave:"",
|
|
checkBoxValues:[],
|
|
checkedtype:false
|
|
})
|
|
|
|
}
|
|
openTopics=(id)=>{
|
|
this.setState({
|
|
Modalstype:true,
|
|
Modalstopval:"公开后不能重设为私有",
|
|
ModalsBottomval:"是否确认设为公开？",
|
|
ModalCancel:this.topicscancelmodel,
|
|
ModalSave:()=>this.topicssaveonOpen(id),
|
|
})
|
|
}
|
|
|
|
topicssaveonOpen=(id)=>{
|
|
|
|
let {category}=this.state;
|
|
const url = `/question_banks/multi_public.json`;
|
|
axios.post(url,{
|
|
object_id:[id],
|
|
object_type:category
|
|
}).then((response) => {
|
|
if(response.data.status===0){
|
|
this.updataslist()
|
|
this.props.showNotification(response.data.message)
|
|
}else{
|
|
this.props.showNotification(response.data.message)
|
|
}
|
|
}).catch(function (error) {
|
|
console.log(error);
|
|
});
|
|
|
|
this.topicscancelmodel()
|
|
}
|
|
|
|
|
|
sendTopics=()=>{
|
|
let {checkBoxValues}=this.state;
|
|
if(checkBoxValues.length===0){
|
|
this.props.showNotification("请选择题库")
|
|
}else{
|
|
this.setState({
|
|
visible:true
|
|
})
|
|
}
|
|
|
|
}
|
|
render(){
|
|
let{
|
|
category,
|
|
course_list_id,
|
|
isSpin,
|
|
data,
|
|
page,
|
|
sort_direction,
|
|
sort_by,
|
|
checkBoxValues,
|
|
Modalstype,
|
|
visible,
|
|
isshowprofes
|
|
} = this.state;
|
|
let {
|
|
is_current,
|
|
current_user,
|
|
}=this.props;
|
|
|
|
let categorylist=[
|
|
{val:"普通作业",type:"normal"},
|
|
{val:"分组作业",type:"group"},
|
|
{val:"毕设选题",type:"gtopic"},
|
|
{val:"毕设任务",type:"gtask"},
|
|
{val:"试卷",type:"exercise"},
|
|
{val:"问卷",type:"poll"},
|
|
]
|
|
|
|
let types=this.props.match.params.topicstype;
|
|
let username=this.props.match.params.username;
|
|
|
|
|
|
//types===publicly 公共
|
|
//types===personal 私有
|
|
let user_id=this.props.current_user&&this.props.current_user.user_id;
|
|
let user_type=this.props.current_user&&this.props.current_user.user_identity;
|
|
let targetuserid=this.props.data&&this.props.data.id;
|
|
|
|
|
|
|
|
// console.log(is_current)
|
|
// console.log(current_user)
|
|
// console.log(current_user.is_teacher)
|
|
// console.log(current_user.admin)
|
|
const menu = (
|
|
<Menu>
|
|
<Menu.Item onClick={()=>this.updatedlist("updated_at")}>
|
|
最近更新
|
|
</Menu.Item>
|
|
<Menu.Item onClick={()=>this.updatedlist("name")}>
|
|
题目名称
|
|
</Menu.Item>
|
|
{types==="publicly"?<Menu.Item onClick={()=>this.updatedlist("contributor")}>
|
|
贡献者
|
|
</Menu.Item>:""}
|
|
</Menu>
|
|
);
|
|
return(
|
|
<div className="educontent mb50 mt40">
|
|
{/*提示*/}
|
|
<style>
|
|
{
|
|
`
|
|
.mt40{
|
|
margin-top: 40px !important;
|
|
}
|
|
`
|
|
}
|
|
</style>
|
|
{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}
|
|
/>:""}
|
|
|
|
{/*发送至弹窗*/}
|
|
{
|
|
visible&&visible===true?
|
|
<SendTopics
|
|
{...this.state}
|
|
{...this.props}
|
|
visible={visible}
|
|
updataslist={()=>this.updataslist()}
|
|
topicscancelmodel={()=>this.topicscancelmodel()}
|
|
/>:""
|
|
}
|
|
<style>
|
|
|
|
{
|
|
`
|
|
::-webkit-scrollbar-thumb {
|
|
background-color: #cde5fe;
|
|
|
|
box-shadow: 0px 0px black;
|
|
}
|
|
|
|
|
|
::-webkit-scrollbar-track {
|
|
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0);
|
|
background-color: #fff;
|
|
}
|
|
|
|
.shaiContent li.shaiItem {
|
|
padding: 0px 9px;
|
|
float: left;
|
|
border-radius: 4px;
|
|
cursor: pointer;
|
|
margin-right: 15px !important;
|
|
display: block;
|
|
margin-bottom: 2px;
|
|
color: #666;
|
|
}
|
|
|
|
.maxwidth900{
|
|
max-width: 900px;
|
|
overflow:hidden;
|
|
text-overflow:ellipsis;
|
|
white-space:nowrap
|
|
}
|
|
|
|
.homepagePostSettingname{
|
|
width:192px !important;
|
|
}
|
|
|
|
.homepagePostSettingbox{
|
|
width:139px !important;
|
|
}
|
|
.marright0{
|
|
margin-right: 0px !important;
|
|
}
|
|
`
|
|
}
|
|
</style>
|
|
|
|
<Spin size="large" spinning={isSpin}>
|
|
<div className="clearfix topicsbox">
|
|
{types==="publicly"?<div className={"topcschild"}>
|
|
<a className={types==="personal"?"topicstopfont fr ":"topicstopfont fr topcsactive"}
|
|
href={`/users/${username}/topics/personal`}>我的题库</a>
|
|
<div className={types==="publicly"?"topicstopfont fl ":"topicstopfont fl topcsactive"}
|
|
>公共题库</div>
|
|
</div>:<div className={"topcschild"}>
|
|
<div className={types==="personal"?"topicstopfont fl ":"topicstopfont fl topcsactive"}
|
|
>我的题库</div>
|
|
<a className={types==="publicly"?"topicstopfont fr ":"topicstopfont fr topcsactive"}
|
|
href={`/topicbank/${username}/publicly`}
|
|
>公共题库</a>
|
|
</div>}
|
|
|
|
{isshowprofes===false?
|
|
<div>
|
|
|
|
<div className={"topcsmid"}>
|
|
{categorylist.map((item,key)=>{
|
|
return(
|
|
<span key={key} className={category===item.type?"topicsmidfont fl mr30 topcsactive":"topicsmidfont fl mr30"} onClick={()=>this.searchCategory(item.type)}>{item.val}</span>
|
|
)
|
|
})}
|
|
|
|
</div>
|
|
|
|
{data&&data.count===undefined?"":data&&data.count===0?"":<div className={data===undefined?"":data.course_list===undefined||data.course_list.length===0?"shaiContent mb45":"shaiContent"}>
|
|
<li className={course_list_id===undefined?"shaiItem shixun_repertoire active fl":"shaiItem shixun_repertoire fl"} onClick={()=>this.searchCourselistid(undefined)}>全部</li>
|
|
<div className="fl pr topicsItem mb20">
|
|
{data===undefined?"":data.course_list===undefined||data.course_list.length===0?"":data.course_list.map((item,key)=>{
|
|
return(
|
|
<li key={key} className={course_list_id===item.id?"shaiItem shixun_repertoire active marright0":"shaiItem shixun_repertoire marright0"} onClick={()=>this.searchCourselistid(item.id)}>{item.name}</li>
|
|
)
|
|
})}
|
|
</div>
|
|
</div>}
|
|
|
|
</div>:<div className={"professional_certificationbox"}>
|
|
<p className="clearfix ">
|
|
<div className={"stud-class-set pd115200 coursenavbox edu-back-white"}>
|
|
<div className={"sumbtongs mb10"}><img className={"topicsItemimg"} src={Withoutpermission}/></div>
|
|
<div className={"terraces mb5 topicsItemfont"}>通过职业认证的教师才能访问公共题库</div>
|
|
<div className="clearfix mt30 mb30 padding251">
|
|
<a className="defalutSubmitbtn fl ml60 defalutSubmitbtns" target="_blank" href="/account/certification">立即认证</a>
|
|
</div>
|
|
</div>
|
|
</p>
|
|
</div>}
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
{isshowprofes===false?<div className="clearfix font-12 mt20">
|
|
<p className="font-12 ml5 fl">
|
|
<span className="fl color-grey-9 mr20">共 <span className={"color-orange"}>{data&&data.count===undefined?0:data&&data.count}</span> 个</span>
|
|
<span className="fr color-grey-9">已选择 <span className={"color-orange"}>{checkBoxValues.length}</span> 个 (不支持跨页勾选)</span>
|
|
</p>
|
|
<p className="font-12 alltopiscright ml25 fr">
|
|
<style>
|
|
{
|
|
`
|
|
.yslbottomsj{
|
|
position: absolute;
|
|
bottom: -8px;
|
|
}
|
|
`
|
|
}
|
|
</style>
|
|
<Dropdown overlay={menu}>
|
|
<span className="fr color-grey-9 mr10 pointer ">
|
|
<span>{sort_by==="updated_at"?'最近更新':sort_by==="name"?'题目名称':sort_by==="contributor"?"贡献者":""}</span>
|
|
<sapn className="relativef ml10" onClick={()=>this.updatedlist(sort_by)}>
|
|
<i className={sort_direction==="asc"?
|
|
"iconfont icon-sanjiaoxing-up font-12 topsj color-blue" :"iconfont icon-sanjiaoxing-up font-12 topsj"}></i>
|
|
<i className={sort_direction==="desc"?
|
|
"iconfont icon-sanjiaoxing-down font-12 yslbottomsj color-blue":"iconfont icon-sanjiaoxing-down font-12 yslbottomsj"}></i>
|
|
</sapn>
|
|
</span>
|
|
</Dropdown>
|
|
{user_type!="学生"?<span className="fr mr30 topcsactive pointer" onClick={()=>this.sendTopics()}>发送</span>:""}
|
|
{types==="personal"?((is_current && current_user && current_user.is_teacher ) || current_user && current_user.admin)
|
|
&&<span className="fr mr30 topcsactive pointer" onClick={()=>this.deletecheckBoxValues()}>删除</span>:""}
|
|
</p>
|
|
</div>:""}
|
|
|
|
|
|
{isshowprofes===true?"":data===undefined?<NoneData></NoneData>:data.question_banks===undefined||data.question_banks.length===0?<NoneData></NoneData>:
|
|
<Checkbox.Group style={{ width: '100%' ,minHeight:'297px'}} onChange={this.onCheckBoxChange} value={checkBoxValues}>
|
|
{data.question_banks.map((item,key)=>{
|
|
return(
|
|
<div className="mt20 edu-back-white pd1323 relativef" key={key} >
|
|
<div className="clearfix">
|
|
<div className="item-body">
|
|
|
|
<div className="clearfix ds pr pt5 contentSection" >
|
|
{user_type!="学生"?<Checkbox value={item.id} key={item.id} className={"fl mt5"}></Checkbox>:""}
|
|
|
|
|
|
<a title={item.name.length>55?item.name:""} className="ml10 fl mt3 font-16 color-dark maxwidth900" href={
|
|
category==="normal"?`/banks/normal/${item.id}/${types}/details`:
|
|
category==="group"?`/banks/group/${item.id}/${types}/details`:
|
|
category==="poll"?`/banks/poll/${item.id}/${types}`:
|
|
category==="exercise"?`/banks/exercise/${item.id}/${types}`:
|
|
category==="gtask"?`/banks/gtask/${item.id}/${types}`:
|
|
category==="gtopic"?`/banks/gtopic/${item.id}/${types}`:""
|
|
}
|
|
>
|
|
{item.name}
|
|
</a>
|
|
|
|
{item.is_public===true?types==="publicly"?"":<span className="edu-filter-btn edu-filter-btn-4CACFF ml15 fl typestyle mt3">公开</span>:""}
|
|
|
|
|
|
|
|
<div className="cl"></div>
|
|
|
|
<p className="color-grey panel-lightgrey mt16 fl">
|
|
<span className={"topicswidth600"}>
|
|
{types==="publicly"?<span className="topsics135 color-grey9 mr50">{item.creator_name}</span>:""}
|
|
<span className="mr50 color-grey9">{item.quotes_count} 次引用</span>
|
|
<span className="mr50 color-grey9">{item.solve_count} 次答题</span>
|
|
<span className="mr50 color-grey9">{moment(item.updated_at).fromNow()}</span>
|
|
</span>
|
|
{item.course_list_name===null?"":<span className={"topsicrelative topsicinline"} title={item.course_list_name}>
|
|
<div className={types==="personal"?"topicsbtn topsicsmax550":"topsicsmax550 topicsbtn"}>{item.course_list_name}</div>
|
|
</span>}
|
|
</p>
|
|
|
|
<div className="homepagePostSetting homepagePostSettingname topscisright">
|
|
{types==="personal"?((is_current && current_user && current_user.is_teacher ) || current_user && current_user.admin)
|
|
&&<a className="btn colorblue mr25 font-16 fr"
|
|
href={category==="normal"?`/banks/normal/${item.id}/edit/${types}`:
|
|
category==="group"?`/banks/group/${item.id}/edit/${types}`:
|
|
category==="poll"?`/banks/poll/${item.id}/edit/${types}`:
|
|
category==="exercise"?`/banks/exercise/${item.id}/edit/${types}`:
|
|
category==="gtask"?`/banks/gtask/${item.id}/edit/${types}`:
|
|
category==="gtopic"?`/banks/gtopic/${item.id}/edit/${types}`:""
|
|
}
|
|
>编辑</a>
|
|
:""}
|
|
{types==="personal"&&item.is_public===false?((is_current && current_user && current_user.is_teacher ) || current_user && current_user.admin)
|
|
&&<a className="btn colorblue mr25 fr font-16" onClick={()=>this.openTopics(item.id)}>设为公开</a>:""}
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
)})}
|
|
</Checkbox.Group>
|
|
}
|
|
|
|
{
|
|
isshowprofes===true?"":data&&data.count >15 &&
|
|
<div className="mt30 mb50 edu-txt-center">
|
|
<Pagination showQuickJumper total={data&&data.count} onChange={this.changePage} pageSize={15} current={page}/>
|
|
</div>
|
|
}
|
|
|
|
</Spin>
|
|
</div>
|
|
)
|
|
}
|
|
}
|
|
export default InfosTopics; |