|
@@ -81,7 +81,7 @@ class SpreadDrop extends Component{
|
|
|
//高度超出时,增加左侧大容器padding
|
|
|
setPosition(e,this.$list.current,setHighter);
|
|
|
// window.event? window.event.cancelBubble = true : e.stopPropagation();
|
|
|
- this.setStateInit(); //恢复初始选中状态
|
|
|
+ this.setStateInit(); //恢复初始选中状态
|
|
|
const that = this;
|
|
|
this.btnClickFlag = false;
|
|
|
clearTimeout(this.state.timer);
|
|
@@ -206,7 +206,7 @@ class SpreadDrop extends Component{
|
|
|
const params = Object.assign({},this.state,{ikey,type,tagType,order,mainSaveText,copyType,value,mainData});
|
|
|
delete params.tmpDom; //避免上面deepClone selecteds报错
|
|
|
handleConfirm&&handleConfirm(params);
|
|
|
- this.btnClickFlag = true;
|
|
|
+ this.btnClickFlag = true;
|
|
|
//点确定后隐藏弹窗
|
|
|
this.props.handleHide();
|
|
|
}
|
|
@@ -293,7 +293,7 @@ class SpreadDrop extends Component{
|
|
|
let existsData = exists;
|
|
|
exists.forEach((it,i)=>{
|
|
|
if(it.id==id){
|
|
|
- existsData.splice(i,1);
|
|
|
+ existsData.splice(i,1);
|
|
|
}
|
|
|
})
|
|
|
exists = existsData;
|
|
@@ -304,7 +304,7 @@ class SpreadDrop extends Component{
|
|
|
let withsData = withs;
|
|
|
withs.forEach((it,i)=>{
|
|
|
if(it.id==id){
|
|
|
- withsData.splice(i,1);
|
|
|
+ withsData.splice(i,1);
|
|
|
}
|
|
|
})
|
|
|
withs = withsData;
|
|
@@ -368,10 +368,10 @@ class SpreadDrop extends Component{
|
|
|
}
|
|
|
const {editable} = this.state;
|
|
|
return <div className={style['container']}
|
|
|
- onFocus={(e)=>e.stopPropagation()}
|
|
|
- onBlur={(e)=>e.stopPropagation()}
|
|
|
- onInput={(e)=>e.stopPropagation()}>
|
|
|
- <div
|
|
|
+ onFocus={(e)=>e.stopPropagation()}
|
|
|
+ onBlur={(e)=>e.stopPropagation()}
|
|
|
+ onInput={(e)=>e.stopPropagation()}>
|
|
|
+ <div
|
|
|
ref={this.$div}
|
|
|
onClick={this.handleShow}
|
|
|
className={this.getClass()}
|
|
@@ -380,10 +380,10 @@ class SpreadDrop extends Component{
|
|
|
onBlur={this.handleBlur}
|
|
|
onInput={this.onChange}
|
|
|
onkeydown={handleEnter}
|
|
|
- >{value||placeholder}</div>
|
|
|
- <ListItems parDiv={this.$list} data={data} order={order} left={left} boxMark={type} tagType={tagType}
|
|
|
- show={show} cliIndex={clickIndx} handleSelect={this.handleSelect} handleConfirm={this.handleConfirm} handleClear={this.handleClear} {...this.state}></ListItems>
|
|
|
- </div>
|
|
|
+ >{value||placeholder}</div>
|
|
|
+ <ListItems parDiv={this.$list} data={data} order={order} left={left} boxMark={type} tagType={tagType}
|
|
|
+ show={show} handleSelect={this.handleSelect} handleConfirm={this.handleConfirm} handleClear={this.handleClear} {...this.state}></ListItems>
|
|
|
+ </div>
|
|
|
}
|
|
|
}
|
|
|
|
|
@@ -433,21 +433,24 @@ class ListItems extends Component{
|
|
|
left:left
|
|
|
}
|
|
|
}
|
|
|
+ searchSelect(item){
|
|
|
+ const {handleSelect,handleConfirm} = this.props;
|
|
|
+ handleSelect&&handleSelect(item); //添加到大数据推送一起选中
|
|
|
+ handleConfirm&&handleConfirm(); //确定事件
|
|
|
+ }
|
|
|
render (){
|
|
|
- const {handleClear,handleConfirm,order,parDiv,boxMark,tagType,show,cliIndex,ban} = this.props;
|
|
|
+ const {handleClear,order,parDiv,boxMark,tagType,show} = this.props;
|
|
|
return <div className={style["drop-list"]} ref={parDiv} style={this.getStyle()} contentEditable="false" onClick={(e)=>{e.stopPropagation();}}>
|
|
|
- <p className={style['orderTips']}>按{order?'从左到右从上到下':'点击'}顺序成文</p>
|
|
|
- {this.getLabels()}
|
|
|
- <div className="oper clearfix">
|
|
|
- <span className={style['clear']} onClick={handleClear}>清空选项</span>
|
|
|
- <span className={style['confirm']} onClick={this.clickConfirm}>确定</span>
|
|
|
- </div>
|
|
|
-
|
|
|
- {boxMark==1 && tagType==11 && <div className="search">
|
|
|
- <div className={style["line"]}></div>
|
|
|
- <SearchBox show={show} cliIndex={cliIndex} onSelect={handleConfirm} onRef={(child)=>{this.child = child;}} ban={ban}/>
|
|
|
- </div>}
|
|
|
+ <p className={style['orderTips']}>按{order?'从左到右从上到下':'点击'}顺序成文</p>
|
|
|
+ {this.getLabels()}
|
|
|
+ {boxMark==1 && tagType==11 && <div className="search">
|
|
|
+ <SearchBox show={show} onSelect={this.searchSelect.bind(this)} onRef={(child)=>{this.child = child;}}/>
|
|
|
+ </div>}
|
|
|
+ <div className="oper clearfix">
|
|
|
+ <span className={style['clear']} onClick={handleClear}>清空选项</span>
|
|
|
+ <span className={style['confirm']} onClick={this.clickConfirm}>确定</span>
|
|
|
</div>
|
|
|
+ </div>
|
|
|
}
|
|
|
}
|
|
|
|
|
@@ -519,20 +522,20 @@ class ListItem extends Component{
|
|
|
const barStyle={background:'#777',width:'100%'};
|
|
|
if(datas&&datas.length>11){
|
|
|
return <ScrollArea speed={0.8}
|
|
|
- horizontal={false}
|
|
|
- stopScrollPropagation={true}
|
|
|
- style={{maxHeight:'330px'}}
|
|
|
- className={style["area"]}
|
|
|
- verticalContainerStyle={contStyle}
|
|
|
- verticalScrollbarStyle={barStyle}
|
|
|
- contentClassName="content">
|
|
|
- {datas&&datas.map((it,i)=>{
|
|
|
- if(isSpecialPos){
|
|
|
- return <li onClick={(e)=>this.handleClick(e,it,i)} className={this.getClass(it.id)}>{it.name}</li>
|
|
|
- }
|
|
|
- return <li onClick={(e)=>this.handleClick(e,it,i)} className={this.getClass(it.id)} title={it.name.length>8?it.name:''}>{it.name&&it.name.length>8?it.name.slice(0,8)+'...':it.name}</li>
|
|
|
- })}
|
|
|
- </ScrollArea>;
|
|
|
+ horizontal={false}
|
|
|
+ stopScrollPropagation={true}
|
|
|
+ style={{maxHeight:'330px'}}
|
|
|
+ className={style["area"]}
|
|
|
+ verticalContainerStyle={contStyle}
|
|
|
+ verticalScrollbarStyle={barStyle}
|
|
|
+ contentClassName="content">
|
|
|
+ {datas&&datas.map((it,i)=>{
|
|
|
+ if(isSpecialPos){
|
|
|
+ return <li onClick={(e)=>this.handleClick(e,it,i)} className={this.getClass(it.id)}>{it.name}</li>
|
|
|
+ }
|
|
|
+ return <li onClick={(e)=>this.handleClick(e,it,i)} className={this.getClass(it.id)} title={it.name.length>8?it.name:''}>{it.name&&it.name.length>8?it.name.slice(0,8)+'...':it.name}</li>
|
|
|
+ })}
|
|
|
+ </ScrollArea>;
|
|
|
}
|
|
|
return datas&&datas.map((it,i)=>{
|
|
|
if(isSpecialPos){
|
|
@@ -546,11 +549,11 @@ class ListItem extends Component{
|
|
|
const {datas,isSpecialPos} = this.props;
|
|
|
return datas&&datas.map((it,i)=>{
|
|
|
return <li onClick={(e)=>this.handleClick(e,it,i)}
|
|
|
- className={this.getClass(it.id)}
|
|
|
- title={it.name.length>4?it.name:''}
|
|
|
- style={{'width':'55px','display':'inline-block'}}>
|
|
|
- {it.name&&it.name.length>4?it.name.slice(0,4)+'...':it.name}
|
|
|
- </li>
|
|
|
+ className={this.getClass(it.id)}
|
|
|
+ title={it.name.length>4?it.name:''}
|
|
|
+ style={{'width':'55px','display':'inline-block'}}>
|
|
|
+ {it.name&&it.name.length>4?it.name.slice(0,4)+'...':it.name}
|
|
|
+ </li>
|
|
|
});
|
|
|
}
|
|
|
|