jurisdiction.jsx 7.4 KB

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