customerSearch.jsx 3.6 KB

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