jurisdiction.jsx 7.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243
  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(e) {
  147. e.preventDefault();
  148. this.setState({
  149. loading: true
  150. });
  151. $.ajax({
  152. method: "POST",
  153. dataType: "json",
  154. crossDomain: false,
  155. url: globalConfig.context + '/api/admin/addPermission',
  156. data: {
  157. superId: this.state.preName,
  158. name: this.state.name, //接口名称
  159. url: this.state.url //接口路径
  160. }
  161. }).done(function(data) {
  162. this.setState({
  163. loading: false
  164. });
  165. if(!data.error.length) {
  166. message.success('保存成功!');
  167. this.addNext();
  168. this.loadData();
  169. } else {
  170. message.warning(data.error[0].message);
  171. }
  172. }.bind(this));
  173. },
  174. render() {
  175. const FormItem = Form.Item;
  176. const formItemLayout = {
  177. labelCol: { span: 8 },
  178. wrapperCol: { span: 14 },
  179. };
  180. const hasSelected = this.state.selectedRowKeys.length > 0;
  181. return(
  182. <div className="user-content" >
  183. <div className="content-title">
  184. <div className="user-search">
  185. <Button type="primary" className="addButton" onClick={this.addClick} style={{marginBottom:'15px'}}>新增权限<Icon type="user"/></Button>
  186. </div>
  187. <div className="patent-table">
  188. <Spin spinning={this.state.loading}>
  189. <Table columns={this.state.columns}
  190. dataSource={this.state.dataSource}
  191. pagination={false}
  192. onRowClick={this.tableRowClick} />
  193. </Spin>
  194. </div>
  195. <Addjurisdiction
  196. userDetaile={this.state.userDetaile}
  197. datauser={this.state.datauser}
  198. showDesc={this.state.showDesc}
  199. closeDesc={this.closeDesc} />
  200. </div >
  201. <Modal maskClosable={false} visible={this.state.addnextVisible}
  202. onOk={this.addNext} onCancel={this.nextCancel}
  203. width='600px'
  204. title='新建下级权限模块'
  205. footer=''
  206. className="admin-desc-content">
  207. <Form layout="horizontal" onSubmit={this.nextSubmit} id="demand-form">
  208. <Spin spinning={this.state.loading}>
  209. <div className="clearfix">
  210. <FormItem className="half-middle"
  211. {...formItemLayout}
  212. label="接口名称" >
  213. <Input placeholder="接口名称" value={this.state.name} style={{width:'230px'}}
  214. onChange={(e)=>{this.setState({name:e.target.value})}} required="required"/>
  215. <span className="mandatory">*</span>
  216. </FormItem>
  217. <FormItem className="half-middle"
  218. {...formItemLayout}
  219. label="接口路径" >
  220. <Input placeholder="接口路径" value={this.state.url} style={{width:'230px'}}
  221. onChange={(e)=>{this.setState({url:e.target.value})}} required="required"/>
  222. <span className="mandatory">*</span>
  223. </FormItem>
  224. <FormItem className="half-middle"
  225. {...formItemLayout}
  226. label="上级功能模块" >
  227. <span>{this.state.preName}</span>
  228. </FormItem>
  229. </div>
  230. <FormItem wrapperCol={{ span: 12, offset: 4 }} className="half-middle">
  231. <Button className="set-submit" type="primary" htmlType="submit">保存</Button>
  232. <Button className="set-submit" type="ghost" onClick={this.nextCancel}>取消</Button>
  233. </FormItem>
  234. </Spin>
  235. </Form >
  236. </Modal>
  237. </div>
  238. );
  239. }
  240. }));
  241. export default Jurisdiction;