orgList.jsx 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193
  1. import React from 'react';
  2. import { Icon, Button, Input, Select, Spin, Table, Switch, message, DatePicker } from 'antd';
  3. import ajax from 'jquery/src/ajax/xhr.js';
  4. import $ from 'jquery/src/ajax';
  5. import './userList.less';
  6. import OrgDesc from './orgDesc.jsx';
  7. import { auditStatusList } from '../../dataDic.js';
  8. const UserList = React.createClass({
  9. loadData(pageNo) {
  10. this.state.data = [];
  11. this.setState({
  12. loading: true
  13. });
  14. $.ajax({
  15. method: "post",
  16. dataType: "json",
  17. crossDomain: false,
  18. url: globalConfig.context + "/api/admin/orgList",
  19. data: {
  20. pageNo: pageNo || 1,
  21. pageSize: this.state.pagination.pageSize,
  22. mobile: this.state.searchMobile, //登录名
  23. createTime: this.state.searchTime,
  24. number: this.state.searchNumber, //阿凡提号
  25. auditStatus: this.state.searchAudit
  26. },
  27. success: function (data) {
  28. if (data.error.length || !data.data || !data.data.list) {
  29. message.warning(data.error[0].message);
  30. return;
  31. }
  32. for (let i = 0; i < data.data.list.length; i++) {
  33. let thisdata = data.data.list[i];
  34. this.state.data.push({
  35. key: i,
  36. id: thisdata.id,
  37. mobile: thisdata.mobile,
  38. email: thisdata.email,
  39. createTime: thisdata.createTime,
  40. aftUsername: thisdata.aftUsername,
  41. number: thisdata.number,
  42. createTimeFormattedDate: thisdata.createTimeFormattedDate
  43. });
  44. };
  45. this.state.pagination.current = data.data.pageNo;
  46. this.state.pagination.total = data.data.totalCount;
  47. this.setState({
  48. dataSource: this.state.data,
  49. pagination: this.state.pagination
  50. });
  51. }.bind(this),
  52. }).always(function () {
  53. this.setState({
  54. loading: false
  55. });
  56. }.bind(this));
  57. },
  58. getInitialState() {
  59. return {
  60. searchMore: true,
  61. data: [],
  62. loading: false,
  63. pagination: {
  64. defaultCurrent: 1,
  65. defaultPageSize: 10,
  66. showQuickJumper: true,
  67. pageSize: 10,
  68. onChange: function (page) {
  69. this.loadData(page);
  70. }.bind(this),
  71. showTotal: function (total) {
  72. return '共' + total + '条数据';
  73. }
  74. },
  75. columns: [
  76. {
  77. title: '阿凡提号',
  78. dataIndex: 'number',
  79. key: 'number',
  80. }, {
  81. title: '登录名',
  82. dataIndex: 'mobile',
  83. key: 'mobile',
  84. }, {
  85. title: '认证状态',
  86. dataIndex: 'auditStatus',
  87. key: 'auditStatus',
  88. render: text => {
  89. if (text == 5) {
  90. return "已认证"
  91. } else {
  92. return "未认证"
  93. }
  94. },
  95. }, {
  96. title: '注册时间',
  97. dataIndex: 'createTimeFormattedDate',
  98. key: 'createTimeFormattedDate',
  99. }, {
  100. title: '认证名称',
  101. dataIndex: 'aftUsername',
  102. key: 'aftUsername',
  103. }, {
  104. title: '联系方式',
  105. dataIndex: 'email',
  106. key: 'email',
  107. }, {
  108. title: '业务员',
  109. dataIndex: 'author',
  110. key: 'author',
  111. }
  112. ],
  113. dataSource: []
  114. };
  115. },
  116. componentWillMount() {
  117. this.loadData();
  118. },
  119. tableRowClick(record, index) {
  120. this.state.RowData = record;
  121. this.setState({
  122. showDesc: true
  123. });
  124. },
  125. closeDesc(e) {
  126. this.state.showDesc = e;
  127. this.loadData();
  128. },
  129. search() {
  130. this.loadData();
  131. },
  132. reset() {
  133. this.state.searchAftId = "";
  134. this.state.searchLoginId = "";
  135. this.state.searchAuditStatus = "";
  136. this.state.searchAftUsername = "";
  137. this.state.searchEmail = "";
  138. this.state.searchTime = [];
  139. this.loadData();
  140. },
  141. searchSwitch() {
  142. this.setState({
  143. searchMore: !this.state.searchMore
  144. });
  145. },
  146. searchcreateTime(date, dateString) {
  147. this.state.createTime = dateString;
  148. },
  149. render() {
  150. const { RangePicker } = DatePicker;
  151. return (
  152. <div className="user-content" >
  153. <div className="content-title">
  154. <span>组织用户管理</span>
  155. </div>
  156. <div className="user-search">
  157. <Input placeholder="阿凡提号" onChange={(e) => { this.state.searchAftId = e.target.value; }} />
  158. <Input placeholder="登录号" onChange={(e) => { this.state.searchLoginId = e.target.value; }} />
  159. <Select placeholder="选择认证状态" style={{ width: 200 }}
  160. onChange={(e) => { this.state.searchAuditStatus = e }}>
  161. {
  162. auditStatusList.map(function (item, i) {
  163. return <Select.Option key={i} value={item.value} >{item.key}</Select.Option>
  164. })
  165. }
  166. </Select>
  167. <Input placeholder="认证名称" onChange={(e) => { this.state.searchAftUsername = e.target.value; }} />
  168. <Input placeholder="联系方式" onChange={(e) => { this.state.searchEmail = e.target.value; }} />
  169. <Button type="primary" onClick={this.search}>搜索</Button>
  170. <Button onClick={this.reset}>重置</Button>
  171. <span>更多搜索<Switch defaultChecked={false} onChange={this.searchSwitch} /></span>
  172. <div className="search-more" style={this.state.searchMore ? { display: 'none' } : {}}>
  173. <p>
  174. <span>注册时间:</span><RangePicker onChange={(data,dataString)=>{this.state.searchTime = dataString }} />
  175. </p>
  176. </div>
  177. </div>
  178. <div className="patent-table">
  179. <Spin spinning={this.state.loading}>
  180. <Table columns={this.state.columns}
  181. dataSource={this.state.dataSource}
  182. pagination={this.state.pagination}
  183. onRowClick={this.tableRowClick} />
  184. </Spin>
  185. </div>
  186. <OrgDesc data={this.state.RowData} showDesc={this.state.showDesc} closeDesc={this.closeDesc} />
  187. </div >
  188. );
  189. }
  190. });
  191. export default UserList;