m52mxtq3o
/
educoder
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

调整实训模块导航 小屏用户有无法使用的情况

Browse Source
dev_ysm
杨树明 5 years ago
parent e4eb27622c
commit 74455b3c86
1 changed files with 82 additions and 127 deletions
Show Stats Download Patch File Download Diff File

209
public/react/src/modules/tpm/shixuns/ShixunSearchBar.js
Unescape View File

@ -1,6 +1,6 @@
import React, { Component } from 'react';
import { Select, Input } from 'antd';
import { Select, Input,Menu, Dropdown } from 'antd';
import 'antd/lib/style/index.css';
@ -115,6 +115,8 @@ shixunsearchAll = (e) => {
//选择Tab页详情
getshixunchildValue = (e) => {
debugger
let id = e.target.name;
let newid=e.target.id;
let list=[{'tag_level':2},{'tag_id':id}];
@ -155,79 +157,54 @@ componentDidMount() {
})
}
// componentWillReceiveProps(nextProps) {
// console.log(nextProps.parsedid)
// if(nextProps.newtag_level===1){
// this.setState({
// InputValue: this.props.keyword,
// shixunsearchAllvalue:nextProps.parsedid
//
// })
// }else if(nextProps.newtag_level===2){
// this.setState({
// InputValue: this.props.keyword,
// shixunsearchAllvalue:nextProps.newpalce,
// shixunchildValues:nextProps.parsedid
//
// })
// }else if(nextProps.newtag_level===3){
// this.setState({
// InputValue: this.props.keyword,
// shixunsearchAllvalue:nextProps.newpalce,
// shixunchildValues:nextProps.parsedid
//
// })
// }
//
//
// }
openStatusOption=()=>{
this.setState({
openLevel:false,
openStatus:true
})
}
openLevelOption=()=>{
this.setState({
openLevel:true,
openStatus:false
})
}
openStatusOptions=()=>{
this.setState({
openLevel:false,
openStatus:false
})
}
Input_searchs = (e) => {
this.setState({
InputValue: e.target.value
})
}
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();
});
// //实训首页筛选的移入和点击事件
// $(".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)=>(
<Menu>
{
item.map((list,k)=>{
return(
<Menu.Item>
<div className="mt5 subshaicontent-part" key={k}>
<a style={{ height: '20px' }} className={ "mb15 shixun_repertoire color-dark"} name={list.id} id={id} onClick={this.getshixunchildValue}>{list.name}</a>
<div className="sub-Item clearfix">
{
list.tags.map((tag,e)=>{
return(
<a className={parseInt(shixunchildValues)===tag.id?"shixun_repertoire active":"shixun_repertoire"} key={e} id={tag.id} name={id} title="subshaicontentshow" rel="subshaicontent" onClick={this.getshixunchildValues}>{tag.name}</a>
)
})
}
</div>
</div>
</Menu.Item>
)
})
}
</Menu>
)
return (
<div className="edu-back-white" >
<div className="educontent">
@ -236,36 +213,39 @@ render() {
<span className="shaiTitle fl mt3">方向：</span>
<div className="fl pr shaiAllItem">
<li className={shixunsearchAllvalue==="a"?"shaiItem shixun_repertoire active":"shaiItem shixun_repertoire"} value= "a" onClick={this.shixunsearchall}>全部</li>
{
shixunhoverData.map((item,key)=>{
return(
<li key={key} className={parseInt(shixunsearchAllvalue)===item.id?"shaiItem shixun_repertoire active":"shaiItem shixun_repertoire"} value={item.id} onClick={this.shixunsearchAll}>
{item.name}
<div className="subshaicontent" id={item.id+"show"} style={{ top: '33px', display: 'none',maxHeight: '400px' }}>
{
item.sub_repertoires.map((list,k)=>{
return(
<div className="mt20 pb10 subshaicontent-part" key={k}>
<a style={{ height: '20px' }} className={ "mb15 shixun_repertoire color-dark"} name={list.id} id={item.id} onClick={this.getshixunchildValue}>{list.name}</a>
<div className="sub-Item clearfix">
{
list.tags.map((tag,e)=>{
return(
<a className={parseInt(shixunchildValues)===tag.id?"shixun_repertoire active":"shixun_repertoire"} key={e} id={tag.id} name={item.id} title="subshaicontentshow" rel="subshaicontent" onClick={this.getshixunchildValues}>{tag.name}</a>
)
})
}
</div>
</div>
)
})
}
</div>
</li>
)
})
}
<style>
{
`
.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;
}
`
}
</style>
{
shixunhoverData.map((item,key)=>{
return(
<Dropdown overlay={overlaymenu(item.sub_repertoires,item.id)} key={key} >
<li key={key} className={parseInt(shixunsearchAllvalue)===item.id?"shaiItem shixun_repertoire active":"shaiItem shixun_repertoire"} value={item.id} onClick={this.shixunsearchAll}>
{item.name}
</li>
</Dropdown>
)
})
}
</div>
</div>
<div className="clearfix">
@ -297,32 +277,7 @@ render() {
<li className={this.state.diff===3?"shaiItems shixun_repertoire active":"shaiItems shixun_repertoire"} onClick={()=>this.diff_search(3)}>高级学员</li>
<li className={this.state.diff===4?"shaiItems shixun_repertoire active":"shaiItems shixun_repertoire"} onClick={()=>this.diff_search(4)}>顶级学员</li>
</div>
{/*<div className="fl" onMouseLeave={this.openStatusOptions} id={"area"}>*/}
{/*/!*<Select className="statusSelect" defaultValue="0" style={{ width: 120 }} onChange={this.status_search} onMouseEnter={this.openStatusOption} open={openStatus}>*!/*/}
{/*/!*<Option value="0" type="status">全部状态</Option>*!/*/}
{/*/!*<Option value="1" type="status">已发布</Option>*!/*/}
{/*/!*<Option value="2" type="status">未发布</Option>*!/*/}
{/*/!*<Option value="3" type="status">已关闭</Option>*!/*/}
{/*/!*</Select>*!/*/}
{/*<Select defaultValue="0" style={{ width: 120 }} onChange={this.diff_search} onMouseEnter={this.openLevelOption} open={openLevel} getPopupContainer={() => document.getElementById("area")}>*/}
{/*<Option value="0">全部难度</Option>*/}
{/*<Option value="1">初级学员</Option>*/}
{/*<Option value="2">中级学员</Option>*/}
{/*<Option value="3">高级学员</Option>*/}
{/*<Option value="4">顶级学员</Option>*/}
{/*</Select>*/}
{/*</div>*/}
{/*<div className="fr mt3">*/}
{/*<Search*/}
{/*style={{ width: 300 }}*/}
{/*class="search-new-input fl"*/}
{/*placeholder="请输入创建者或名称进行搜索"*/}
{/*value={InputValue}*/}
{/*onInput={this.Input_searchs}*/}
{/*onSearch={value => this.Input_search(value)}*/}
{/*enterButton*/}
{/*/>*/}
{/*</div>*/}
</div>
</div>
</div>

Write Preview
Loading…
Cancel
Save