customerSearch.jsx 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. import React from 'react';
  2. import { Icon, Button, Input, Select, Spin, message, Col, Row } from 'antd';
  3. import ajax from 'jquery/src/ajax/xhr.js';
  4. import $ from 'jquery/src/ajax';
  5. import './userList.less';
  6. import { getSearchUrl } from '../../tools.js';
  7. const CustomerSearch = React.createClass({
  8. loadData(pageNo) {
  9. this.setState({
  10. loading: true
  11. });
  12. $.ajax({
  13. method: "get",
  14. dataType: "json",
  15. crossDomain: false,
  16. url: globalConfig.context + "/api/admin/supervise/findUser",
  17. data: {
  18. "name": this.state.searchName,
  19. "mobile": this.state.searchMobile,
  20. "type": Number(this.state.searchType)
  21. },
  22. success: function (data) {
  23. if (data.error && data.error.length) {
  24. message.warning(data.error[0].message);
  25. }
  26. this.setState({
  27. searchResult: data.data ? <span><Icon type="check-circle" style={{ color: '#58a3ff' }} /> 名称为[ {data.data} ]的 {Number(this.state.searchType) ? '[团体]' : '[个人]'} 用户存在</span>
  28. : <span> <Icon type="close-circle" style={{ color: '#ea0862' }} /> 未查找到该用户!</span>
  29. })
  30. }.bind(this),
  31. }).always(function () {
  32. this.setState({
  33. loading: false
  34. });
  35. }.bind(this));
  36. },
  37. getInitialState() {
  38. return {
  39. loading: false,
  40. searchType: '0'
  41. };
  42. },
  43. search() {
  44. this.loadData();
  45. },
  46. reset() {
  47. this.loadData();
  48. },
  49. render() {
  50. return (
  51. <div className="user-content" >
  52. <div className="content-title">
  53. <span>客户查询</span>
  54. </div>
  55. <Row>
  56. <Col span={2}>
  57. <span>用户名称</span>
  58. </Col>
  59. <Col span={5}>
  60. <Input placeholder="请输入用户全称"
  61. value={this.state.searchName}
  62. onChange={(e) => { this.setState({ searchName: e.target.value }) }} />
  63. </Col>
  64. <Col span={1}></Col>
  65. <Col span={2}>
  66. <span>用户登录名</span>
  67. </Col>
  68. <Col span={5}>
  69. <Input placeholder="请输入手机号"
  70. value={this.state.searchMobile}
  71. onChange={(e) => { this.setState({ searchMobile: e.target.value }) }} />
  72. </Col>
  73. <Col span={1}></Col>
  74. <Col span={2}>
  75. <Select style={{ width: 100 }}
  76. value={this.state.searchType}
  77. onChange={(e) => { this.setState({ searchType: e }) }} >
  78. <Select.Option value="0">个人用户</Select.Option>
  79. <Select.Option value="1">组织用户</Select.Option>
  80. </Select>
  81. </Col>
  82. <Col span={2}>
  83. <Button type="primary" onClick={this.search}>搜索</Button>
  84. </Col>
  85. </Row>
  86. <Row>
  87. <Col span={2}>
  88. <span>查询结果</span>
  89. </Col>
  90. <Col>
  91. {this.state.searchResult}
  92. </Col>
  93. </Row>
  94. </div >
  95. );
  96. }
  97. });
  98. export default CustomerSearch;