jurisdiction.jsx 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236
  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, Popconfirm, Spin, Table, Switch, message, DatePicker, Modal, Upload } from 'antd';
  6. import Addjurisdiction from "./addjurisdiction.jsx"
  7. import './userMangagement.less'
  8. import { techAuditStatusList, station, post } from '../../../dataDic.js';
  9. const Jurisdiction = Form.create()(React.createClass({
  10. loadData(pageNo) {
  11. this.state.data = [];
  12. this.setState({
  13. loading: true
  14. });
  15. $.ajax({
  16. method: "post",
  17. dataType: "json",
  18. crossDomain: false,
  19. url: globalConfig.context + '/api/admin/permissions',
  20. success: function(data) {
  21. let thisData = data.data.one;
  22. this.setState({
  23. dataSource: data.data.one,
  24. });
  25. }.bind(this),
  26. }).always(function() {
  27. this.setState({
  28. loading: false
  29. });
  30. }.bind(this));
  31. },
  32. getInitialState() {
  33. return {
  34. datauser: {},
  35. selectedRowKeys: [],
  36. selectedRows: [],
  37. loading: false,
  38. addnextVisible: false,
  39. columns: [{
  40. title: '接口名称',
  41. dataIndex: 'name',
  42. key: 'name',
  43. width: '300px'
  44. }, {
  45. title: '接口路径',
  46. dataIndex: 'url',
  47. key: 'url',
  48. }, {
  49. title: '操作',
  50. dataIndex: 'id',
  51. key: 'id',
  52. render: (text, recard) => {
  53. return(
  54. <div>
  55. <Button type="primary" onClick={(e)=>{e.stopPropagation(),this.addNextURL(recard)}} style={{marginRight:'15px'}}>新建下级权限</Button>
  56. <Popconfirm
  57. title={"是否真的删除?"}
  58. onConfirm={(e)=>{this.delectRow(recard)}}
  59. okText="确认"
  60. cancelText="取消"
  61. placement="topLeft">
  62. <Button type="danger" onClick={(e)=>{e.stopPropagation()}}>删除</Button>
  63. </Popconfirm>
  64. </div>
  65. )
  66. }
  67. }],
  68. dataSource: [],
  69. };
  70. },
  71. componentWillMount() {
  72. this.loadData();
  73. },
  74. tableRowClick(record, index) {
  75. this.state.userDetaile = true;
  76. this.state.datauser = record;
  77. this.setState({
  78. showDesc: true
  79. });
  80. },
  81. //删除(已改接口)
  82. delectRow(ids) {
  83. this.setState({
  84. loading: true
  85. });
  86. $.ajax({
  87. method: "POST",
  88. dataType: "json",
  89. crossDomain: false,
  90. url: globalConfig.context + "/api/admin/deleteById",
  91. data: {
  92. id: ids.id
  93. }
  94. }).done(function(data) {
  95. if(!data.error.length) {
  96. message.success('删除成功!');
  97. this.setState({
  98. loading: false,
  99. });
  100. } else {
  101. message.warning(data.error[0].message);
  102. };
  103. this.loadData();
  104. }.bind(this));
  105. },
  106. addClick() {
  107. this.state.userDetaile = false;
  108. this.setState({
  109. showDesc: true
  110. });
  111. },
  112. closeDesc(e, s) {
  113. this.state.userDetaile = false;
  114. this.state.showDesc = e;
  115. if(s) {
  116. this.loadData();
  117. };
  118. },
  119. //新建下级
  120. addNext() {
  121. this.setState({
  122. addnextVisible: false
  123. })
  124. },
  125. nextCancel() {
  126. this.setState({
  127. addnextVisible: false
  128. })
  129. },
  130. addNextURL(e) {
  131. this.state.name = '';
  132. this.state.url = '';
  133. this.setState({
  134. ids: e.id,
  135. preName: e.name,
  136. addnextVisible: true
  137. })
  138. },
  139. //新建二级接口保存
  140. nextSubmit() {
  141. this.setState({
  142. loading: true
  143. });
  144. $.ajax({
  145. method: "POST",
  146. dataType: "json",
  147. crossDomain: false,
  148. url: globalConfig.context + '/api/admin/addPermission',
  149. data: {
  150. superId: this.state.preName,
  151. name: this.state.name, //接口名称
  152. url: this.state.url //接口路径
  153. }
  154. }).done(function(data) {
  155. this.setState({
  156. loading: false
  157. });
  158. if(!data.error.length) {
  159. message.success('保存成功!');
  160. this.addNext();
  161. this.loadData();
  162. } else {
  163. message.warning(data.error[0].message);
  164. }
  165. }.bind(this));
  166. },
  167. render() {
  168. const FormItem = Form.Item;
  169. const formItemLayout = {
  170. labelCol: { span: 8 },
  171. wrapperCol: { span: 14 },
  172. };
  173. const hasSelected = this.state.selectedRowKeys.length > 0;
  174. return(
  175. <div className="user-content" >
  176. <div className="content-title">
  177. <div className="user-search">
  178. <Button type="primary" className="addButton" onClick={this.addClick} style={{marginBottom:'15px'}}>新增权限<Icon type="user"/></Button>
  179. </div>
  180. <div className="patent-table">
  181. <Spin spinning={this.state.loading}>
  182. <Table columns={this.state.columns}
  183. dataSource={this.state.dataSource}
  184. pagination={false}
  185. onRowClick={this.tableRowClick} />
  186. </Spin>
  187. </div>
  188. <Addjurisdiction
  189. userDetaile={this.state.userDetaile}
  190. datauser={this.state.datauser}
  191. showDesc={this.state.showDesc}
  192. closeDesc={this.closeDesc} />
  193. </div >
  194. <Modal maskClosable={false} visible={this.state.addnextVisible}
  195. onOk={this.addNext} onCancel={this.nextCancel}
  196. width='600px'
  197. title='新建下级权限模块'
  198. footer=''
  199. className="admin-desc-content">
  200. <Form layout="horizontal" onSubmit={this.nextSubmit} id="demand-form">
  201. <Spin spinning={this.state.loading}>
  202. <div className="clearfix">
  203. <FormItem className="half-middle"
  204. {...formItemLayout}
  205. label="接口名称" >
  206. <Input placeholder="接口名称" value={this.state.name} style={{width:'230px'}}
  207. onChange={(e)=>{this.setState({name:e.target.value})}} required="required"/>
  208. <span className="mandatory">*</span>
  209. </FormItem>
  210. <FormItem className="half-middle"
  211. {...formItemLayout}
  212. label="接口路径" >
  213. <Input placeholder="接口路径" value={this.state.url} style={{width:'230px'}}
  214. onChange={(e)=>{this.setState({url:e.target.value})}} required="required"/>
  215. <span className="mandatory">*</span>
  216. </FormItem>
  217. <FormItem className="half-middle"
  218. {...formItemLayout}
  219. label="上级功能模块" >
  220. <span>{this.state.preName}</span>
  221. </FormItem>
  222. </div>
  223. <FormItem wrapperCol={{ span: 12, offset: 4 }} className="half-middle">
  224. <Button className="set-submit" type="primary" htmlType="submit">保存</Button>
  225. <Button className="set-submit" type="ghost" onClick={this.nextCancel}>取消</Button>
  226. </FormItem>
  227. </Spin>
  228. </Form >
  229. </Modal>
  230. </div>
  231. );
  232. }
  233. }));
  234. export default Jurisdiction;