userLibrary.jsx 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185
  1. import { Component } from 'react';
  2. import { Input, Select, Spin, Table, message, Button } from 'antd';
  3. class UserLibrary extends Component {
  4. constructor(props) {
  5. super(props);
  6. this.state = {
  7. loading: false,
  8. dataSource: [],
  9. pagination: {
  10. defaultCurrent: 1,
  11. defaultPageSize: 10,
  12. showQuickJumper: true,
  13. pageSize: 10,
  14. onChange: function(page) {
  15. this.loadData(page);
  16. this.setState({
  17. selectedRowKeys: []
  18. });
  19. }.bind(this),
  20. showTotal: function(total) {
  21. return '共' + total + '条数据';
  22. }
  23. },
  24. columns: [
  25. {
  26. title: '客户名称',
  27. dataIndex: 'name',
  28. key: 'name'
  29. },
  30. {
  31. title: '手机号码',
  32. dataIndex: 'photo',
  33. key: 'photo'
  34. },
  35. {
  36. title: '用户类型',
  37. dataIndex: 'userType',
  38. key: 'userType',
  39. render: (text) => {
  40. return text == '1' ? '企业用户' : '个人用户';
  41. }
  42. },
  43. {
  44. title: '注册时间',
  45. dataIndex: 'createTime',
  46. key: 'createTime'
  47. }
  48. ]
  49. };
  50. }
  51. loadData(pageNo) {
  52. this.state.data = [];
  53. this.setState({
  54. page:pageNo,
  55. loading: true
  56. });
  57. $.ajax({
  58. method: "get",
  59. dataType: "json",
  60. crossDomain: false,
  61. url: globalConfig.context + "/api/user/achievement/lis",
  62. data: {
  63. pageNo: pageNo || 1,
  64. pageSize: this.state.pagination.pageSize,
  65. userType: this.state.userType, //需求名称
  66. userName: this.state.userName,
  67. photo:this.state.photo
  68. },
  69. success: function (data) {
  70. let theArr = [];
  71. if (!data.data || !data.data.list) {
  72. if (data.error && data.error.length) {
  73. message.warning(data.error[0].message);
  74. };
  75. } else {
  76. for (let i = 0; i < data.data.list.length; i++) {
  77. let thisdata = data.data.list[i];
  78. theArr.push({
  79. key: i,
  80. id: thisdata.id,
  81. name: thisdata.name, //编号
  82. photo: thisdata.photo,
  83. userType: thisdata.userType,
  84. createTime:thisdata.createTime?(new Date(thisdata.createTime)).toLocaleString():''
  85. });
  86. };
  87. };
  88. this.state.pagination.current = data.data.pageNo;
  89. this.state.pagination.total = data.data.totalCount;
  90. if(data.data&&data.data.list&&!data.data.list.length){
  91. this.state.pagination.current=0
  92. this.state.pagination.total=0
  93. };
  94. this.setState({
  95. total:data.data.totalCount,
  96. dataSource: theArr,
  97. pagination: this.state.pagination
  98. });
  99. }.bind(this),
  100. }).always(function () {
  101. this.setState({
  102. loading: false
  103. });
  104. }.bind(this));
  105. }
  106. search() {
  107. this.loadData();
  108. }
  109. reset() {
  110. this.state.userName = '';
  111. this.state.userType = undefined;
  112. this.state.photo = '';
  113. this.loadData();
  114. }
  115. componentWillMount() {
  116. this.loadData();
  117. }
  118. render() {
  119. const rowSelection = {
  120. selectedRowKeys: this.state.selectedRowKeys,
  121. onChange: (selectedRowKeys, selectedRows) => {
  122. this.setState({
  123. selectedRows: selectedRows.slice(-1),
  124. selectedRowKeys: selectedRowKeys.slice(-1)
  125. });
  126. }
  127. };
  128. return (
  129. <div className="user-content">
  130. <div className="content-title">
  131. <div className="content-title">
  132. <span>用户库</span>
  133. </div>
  134. <div className="user-search">
  135. <Input
  136. style={{ marginRight: 10 }}
  137. value={this.state.userName}
  138. placeholder="用户名称"
  139. onChange={(e) => {
  140. this.setState({ userName: e.target.value });
  141. }}
  142. />
  143. <Input
  144. style={{ marginRight: 10 }}
  145. value={this.state.photo}
  146. placeholder="手机号码"
  147. onChange={(e) => {
  148. this.setState({ photo: e.target.value });
  149. }}
  150. />
  151. <Select
  152. value={this.state.userType}
  153. style={{ width: 150 }}
  154. placeholder="用户类型"
  155. onChange={(e) => {
  156. this.setState({ userType: e });
  157. }}
  158. >
  159. <Select.Option value="0">个人用户</Select.Option>
  160. <Select.Option value="1">企业用户</Select.Option>
  161. </Select>
  162. <Button type="primary" onClick={this.search.bind(this)} style={{ marginRight: 10 }}>
  163. 搜索
  164. </Button>
  165. <Button onClick={this.reset.bind(this)}>重置</Button>
  166. </div>
  167. <div className="patent-table">
  168. <Spin spinning={this.state.loading}>
  169. <Table
  170. columns={this.state.columns}
  171. dataSource={this.state.dataSource}
  172. rowSelection={rowSelection}
  173. pagination={this.state.pagination}
  174. />
  175. </Spin>
  176. </div>
  177. </div>
  178. </div>
  179. );
  180. }
  181. }
  182. export default UserLibrary;