react-zeanium-ui-ui
Version:
Zeanium UI Framework for React.js
74 lines (70 loc) • 2.09 kB
JavaScript
var React = require('react');
var BottomPopupView = require('./BottomPopupView');
var ListView = require('./ListView');
module.exports = React.createClass({
displayName:'Menu',
getInitialState:function(){
return {
label: this.props.label,
selectedItem: null
}
},
componentDidMount:function(){
},
__selectItemRender: function (item, index){
var _text = item[this.props.textKey||'text'];
return (this.props.selectItemRender&&this.props.selectItemRender(item, index))||<span key={index}><i style={{margin:5}} className={ "fa " + item.icon }></i>{_text}</span>;
},
__onSelectItemClick: function (event, item){
var _popupview = this.refs.popupview,
_text = item[this.props.textKey||'text'],
_value = item[this.props.valueKey||'value'];
_popupview.active(false);
this.setState({
label: _text,
selectedItem: item
});
this.props.onChange && this.props.onChange(event, {
text: _text,
value: _value,
item: item
}, this);
},
__bottomPopupViewRender: function (){
return (this.props.bottomPopupViewRender && this.props.bottomPopupViewRender(this))||<div className="input">
<div className="label">{this.state.label}</div>
<div className="icon"><i className={"fa " + this.props.icon}></i></div>
</div>;
},
__onBottomPopupViewClick: function (active, self) {
if (active) {
this.refresh();
}
},
refresh: function () {
this.refs.listview.refresh();
},
setValue: function (){
},
render:function(){
return (
<BottomPopupView
ref="popupview"
popupWidth={this.props.popupWidth}
popupPosition={this.props.popupPosition}
style={this.props.style}
onClick={this.__onBottomPopupViewClick}
render={this.__bottomPopupViewRender} >
<ListView
ref="listview"
style={this.props.dataStyle}
className={this.props.dataClassName}
autoLoad={false}
singleSelect={(this.props.singleSelect===undefined?true:this.props.singleSelect)}
onClick={this.__onSelectItemClick}
itemRender={this.__selectItemRender}
data={this.props.data}/>
</BottomPopupView>
);
}
});