user.jsx 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391
  1. import React from 'react';
  2. import ReactDom from 'react-dom';
  3. import ajax from 'jquery/src/ajax/xhr.js';
  4. import $ from 'jquery/src/ajax';
  5. import { Form,Radio, Icon, Button, Input, Select, Spin, Table, Switch, message, DatePicker, Modal, Upload } from 'antd';
  6. import Newuser from "./newUser.jsx"
  7. import './userMangagement.less'
  8. import {techAuditStatusList, station,post } from '../../../dataDic.js';
  9. const User=Form.create()(React.createClass({
  10. loadData(pageNo) {
  11. this.state.data = [];
  12. this.setState({
  13. loading: true
  14. });
  15. $.ajax({
  16. method: "get",
  17. dataType: "json",
  18. crossDomain: false,
  19. url: globalConfig.context + '/api/admin/supervise/adminLi',
  20. data: {
  21. pageNo: pageNo || 1,
  22. pageSize: this.state.pagination.pageSize,
  23. userName:this.state.userNameSearch,
  24. organization:this.state.organizationSearch,
  25. role:this.state.rolesSearch,
  26. post:this.state.postSearch,
  27. station:this.state.stationSearch,
  28. status:this.state.statusSeach,
  29. signName:this.state.signNameSearch,
  30. mobile:this.state.mobileSearch,
  31. proName:this.state.proNameSearch
  32. },
  33. success: function (data) {
  34. let theArr = [];
  35. if (!data.data || !data.data.list) {
  36. if (data.error && data.error.length) {
  37. message.warning(data.error[0].message);
  38. };
  39. } else {
  40. for (let i = 0; i < data.data.list.length; i++) {
  41. let thisdata = data.data.list[i];
  42. theArr.push({
  43. key: i,
  44. id: thisdata.id,
  45. mobile: thisdata.mobile,
  46. name: thisdata.name,
  47. email: thisdata.email,
  48. createTime: thisdata.createTime,
  49. number: thisdata.number,
  50. province: thisdata.province,
  51. position: thisdata.position,
  52. superior: thisdata.superior,
  53. superiorId: thisdata.superiorId,
  54. createTimeFormattedDate: thisdata.createTimeFormattedDate
  55. });
  56. };
  57. this.state.pagination.current = data.data.pageNo?data.data.pageNo:'0';
  58. this.state.pagination.total = data.data.totalCount?data.data.totalCount:'0';
  59. };
  60. this.setState({
  61. dataSource: theArr,
  62. pagination: this.state.pagination
  63. });
  64. }.bind(this),
  65. }).always(function () {
  66. this.setState({
  67. loading: false
  68. });
  69. }.bind(this));
  70. },
  71. getInitialState() {
  72. return {
  73. datauser:{},
  74. searchMore: true,
  75. selectedRowKeys: [],
  76. selectedRows: [],
  77. loading: false,
  78. pagination: {
  79. defaultCurrent: 1,
  80. defaultPageSize: 10,
  81. showQuickJumper: true,
  82. pageSize: 10,
  83. onChange: function (page) {
  84. this.loadData(page);
  85. }.bind(this),
  86. showTotal: function (total) {
  87. return '共' + total + '条数据';
  88. }
  89. },
  90. columns: [
  91. {
  92. title: '用户编号',
  93. dataIndex: 'key',
  94. key: 'key',
  95. }, {
  96. title: '登录用户名',
  97. dataIndex: 'name',
  98. key: 'name',
  99. }, {
  100. title: '角色',
  101. dataIndex: 'email',
  102. key: 'email',
  103. }, {
  104. title: '用户姓名',
  105. dataIndex: 'createTime',
  106. key: 'createTime',
  107. }, {
  108. title: '组织机构',
  109. dataIndex: 'number',
  110. key: 'number',
  111. }, {
  112. title: '职务',
  113. dataIndex: 'auditStatus',
  114. key: 'auditStatus',
  115. },
  116. {
  117. title: '岗位',
  118. dataIndex: 'boutique',
  119. key: 'boutique',
  120. },
  121. {
  122. title: '上级主管姓名',
  123. dataIndex: 'province',
  124. key: 'province',
  125. },
  126. {
  127. title: '状态',
  128. dataIndex: 'a',
  129. key: 'a',
  130. }
  131. ],
  132. dataSource: [],
  133. };
  134. },
  135. componentWillMount() {
  136. let organizationArr = [];
  137. techAuditStatusList.map(function (item) {
  138. organizationArr.push(
  139. <Select.Option value={item.value} key={item.key}>{item.key}</Select.Option>
  140. )
  141. });
  142. this.state.organizationList = organizationArr;
  143. this.loadData();
  144. },
  145. tableRowClick(record, index) {
  146. this.state.userDetaile=true;
  147. this.state.datauser = record;
  148. this.setState({
  149. showDesc: true
  150. });
  151. },
  152. //锁定
  153. locking() {
  154. let deletedIds = [];
  155. for (let idx = 0; idx < this.state.selectedRows.length; idx++) {
  156. let rowItem = this.state.selectedRows[idx];
  157. if (rowItem.id) {
  158. deletedIds.push(rowItem.id)
  159. };
  160. };
  161. this.setState({
  162. selectedRowKeys: [],
  163. loading: true
  164. });
  165. $.ajax({
  166. method: "POST",
  167. dataType: "json",
  168. crossDomain: false,
  169. url: globalConfig.context + "/api/admin/achievement/delete",
  170. data: {
  171. ids: deletedIds
  172. }
  173. }).done(function (data) {
  174. if (!data.error.length) {
  175. message.success('锁定成功!');
  176. this.setState({
  177. loading: false,
  178. });
  179. } else {
  180. message.warning(data.error[0].message);
  181. };
  182. this.loadData();
  183. }.bind(this));
  184. },
  185. //激活
  186. activation() {
  187. let deletedIds = [];
  188. for (let idx = 0; idx < this.state.selectedRows.length; idx++) {
  189. let rowItem = this.state.selectedRows[idx];
  190. if (rowItem.id) {
  191. deletedIds.push(rowItem.id)
  192. };
  193. };
  194. this.setState({
  195. selectedRowKeys: [],
  196. loading: true
  197. });
  198. $.ajax({
  199. method: "POST",
  200. dataType: "json",
  201. crossDomain: false,
  202. url: globalConfig.context + "/api/admin/achievement/delete",
  203. data: {
  204. ids: deletedIds
  205. }
  206. }).done(function (data) {
  207. if (!data.error.length) {
  208. message.success('激活成功!');
  209. this.setState({
  210. loading: false,
  211. });
  212. } else {
  213. message.warning(data.error[0].message);
  214. };
  215. this.loadData();
  216. }.bind(this));
  217. },
  218. //删除
  219. delectRow() {
  220. let deletedIds = [];
  221. for (let idx = 0; idx < this.state.selectedRows.length; idx++) {
  222. let rowItem = this.state.selectedRows[idx];
  223. if (rowItem.id) {
  224. deletedIds.push(rowItem.id)
  225. };
  226. };
  227. this.setState({
  228. selectedRowKeys: [],
  229. loading: true
  230. });
  231. $.ajax({
  232. method: "POST",
  233. dataType: "json",
  234. crossDomain: false,
  235. url: globalConfig.context + "/api/admin/achievement/delete",
  236. data: {
  237. ids: deletedIds
  238. }
  239. }).done(function (data) {
  240. if (!data.error.length) {
  241. message.success('删除成功!');
  242. this.setState({
  243. loading: false,
  244. });
  245. } else {
  246. message.warning(data.error[0].message);
  247. };
  248. this.loadData();
  249. }.bind(this));
  250. },
  251. addClick() {
  252. this.state.userDetaile=false;
  253. this.setState({
  254. showDesc: true
  255. });
  256. },
  257. closeDesc(e, s) {
  258. this.state.showDesc = e;
  259. if (s) {
  260. this.loadData();
  261. };
  262. },
  263. search() {
  264. this.loadData();
  265. },
  266. reset() {
  267. this.state.userNameSearch='';
  268. this.state.organizationSearch=undefined;
  269. this.state.rolesSearch=undefined;
  270. this.state.postSearch=undefined;
  271. this.state.stationSearch=undefined;
  272. this.state.statusSeach=undefined;
  273. this.state.signNameSearch='';
  274. this.state.mobileSearch='';
  275. this.state.proNameSearch='';
  276. this.loadData();
  277. },
  278. searchSwitch() {
  279. this.setState({
  280. searchMore: !this.state.searchMore
  281. });
  282. },
  283. render() {
  284. const rowSelection = {
  285. selectedRowKeys: this.state.selectedRowKeys,
  286. onChange: (selectedRowKeys, selectedRows) => {
  287. this.setState({
  288. selectedRows: selectedRows.slice(-1),
  289. selectedRowKeys: selectedRowKeys.slice(-1)
  290. });
  291. },
  292. onSelectAll: (selected, selectedRows, changeRows) => {
  293. this.setState({
  294. selectedRowKeys:[]
  295. })
  296. },
  297. };
  298. const hasSelected = this.state.selectedRowKeys.length > 0;
  299. const { RangePicker } = DatePicker;
  300. return (
  301. <div className="user-content" >
  302. <div className="content-title">
  303. <div className="user-search">
  304. <Input placeholder="用户姓名" style={{width:'150px'}}
  305. value={this.state.userNameSearch}
  306. onChange={(e) => { this.setState({ userNameSearch: e.target.value }); }} />
  307. <Select placeholder="组织机构"
  308. style={{ width: 160 }}
  309. value={this.state.organizationSearch}
  310. onChange={(e) => { this.setState({ organizationSearch: e }) }}>
  311. {this.state.organizationList}
  312. </Select>
  313. <Select placeholder="角色"
  314. style={{ width: 160 }}
  315. value={this.state.rolesSearch}
  316. onChange={(e) => { this.setState({ rolesSearch: e }) }}>
  317. {this.state.organizationList}
  318. </Select>
  319. <Button type="primary" onClick={this.search}>搜索</Button>
  320. <Button onClick={this.reset}>重置</Button>
  321. <Button style={{ background: "red", border: "none", color: "#fff" }}
  322. disabled={!hasSelected}
  323. onClick={this.delectRow}>删除<Icon type="minus" /></Button>
  324. <Button style={{ background: "#333333", border: "none", color: "#fff" }}
  325. disabled={!hasSelected}
  326. onClick={this.locking}>锁定<Icon type="lock" /></Button>
  327. <Button style={{ background: "green", border: "none", color: "#fff" }}
  328. disabled={!hasSelected}
  329. onClick={this.activation}>激活<Icon type="unlock" /></Button>
  330. <span>更多搜索<Switch defaultChecked={false} onChange={this.searchSwitch} /></span>
  331. <Button type="primary" className="addButton" onClick={this.addClick} >新增用户<Icon type="user" /></Button>
  332. <div className="search-more" style={this.state.searchMore ? { display: 'none' } : {}}>
  333. <Select placeholder="职务"
  334. style={{ width: 160 }}
  335. value={this.state.postSearch}
  336. onChange={(e) => { this.setState({ postSearch: e }) }}>
  337. {
  338. post.map(function (item) {
  339. return <Select.Option key={item.value} >{item.key}</Select.Option>
  340. })
  341. }
  342. </Select>
  343. <Select placeholder="岗位"
  344. style={{ width: 160 }}
  345. value={this.state.stationSearch}
  346. onChange={(e) => { this.setState({ stationSearch: e }) }}>
  347. {
  348. station.map(function (item) {
  349. return <Select.Option key={item.value} >{item.key}</Select.Option>
  350. })
  351. }
  352. </Select>
  353. <Select placeholder="状态"
  354. style={{ width: 160 }}
  355. value={this.state.statusSeach}
  356. onChange={(e) => { this.setState({ statusSeach: e }) }}>
  357. {this.state.organizationList}
  358. </Select>
  359. <Input placeholder="登录用户名" style={{width:'150px'}}
  360. value={this.state.signNameSearch}
  361. onChange={(e) => { this.setState({ signNameSearch: e.target.value }); }} />
  362. <Input placeholder="上级主管名称" style={{width:'150px'}}
  363. value={this.state.proNameSearch}
  364. onChange={(e) => { this.setState({ proNameSearch: e.target.value }); }} />
  365. </div>
  366. </div>
  367. <div className="patent-table">
  368. <Spin spinning={this.state.loading}>
  369. <Table columns={this.state.columns}
  370. dataSource={this.state.dataSource}
  371. rowSelection={rowSelection}
  372. pagination={this.state.pagination}
  373. onRowClick={this.tableRowClick} />
  374. </Spin>
  375. </div>
  376. <Newuser
  377. userDetaile={this.state.userDetaile}
  378. datauser={this.state.datauser}
  379. showDesc={this.state.showDesc}
  380. closeDesc={this.closeDesc} />
  381. </div >
  382. </div>
  383. );
  384. }
  385. }));
  386. export default User;