var Calls = React.createClass({
getInitialState: function() {
return {
visible: false,
products: [],
callType: '1',
type_: 1
};
},componentDidMount: function () {
var _this = this;
axios
.get( 'stat_calls', {
params: {
type: _this.state.type_,
}
}
)
.then(
function (response) {
_this.setState(
{
products: response.data
}
)
}
)
.catch(function (error) {
console.log(error);
})
},
readmoreClick: function(e) {
e.preventDefault();
var flag = this.state.callType;
if(flag == '2') flag = '1'; else flag = '2';
this.setState({callType: flag, type_: flag});
},
render: function() {
return (
<div>
<a href="#" onClick={this.readmoreClick} >{this.state.callType }</a>
<BootstrapTable search={ true } pagination data={this.state.products} striped={true} hover={true}>
<TableHeaderColumn dataField="uniqid" isKey={true} dataAlign="center" dataSort={true}>uniqID</TableHeaderColumn>
<TableHeaderColumn dataField="begin" dataSort={true}>Начало</TableHeaderColumn>
<TableHeaderColumn dataField="talkTime" dataSort={true}>Время разговора (c)</TableHeaderColumn>
<TableHeaderColumn dataField="support" dataSort={true}>Оператор</TableHeaderColumn>
<TableHeaderColumn dataField="number">Номер</TableHeaderColumn>
<TableHeaderColumn dataField='button' dataFormat={this.cellButton.bind(this)} />
</BootstrapTable>
</div>
);
}
});
&#13;
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
&#13;