newRole.jsx 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255
  1. import React from 'react';
  2. import { Icon, Table, Modal, message, Spin, Input, Select, Button, Form } from 'antd';
  3. import ajax from 'jquery/src/ajax/xhr.js';
  4. import $ from 'jquery/src/ajax';
  5. import './userMangagement.less';
  6. import {} from '../../../dataDic.js';
  7. const Newrole = Form.create()(React.createClass({
  8. addloadData() {
  9. this.setState({
  10. loading: true
  11. });
  12. $.ajax({
  13. method: "post",
  14. dataType: "json",
  15. crossDomain: false,
  16. url: globalConfig.context + '/api/admin/permissions',
  17. data: {
  18. pageNo: 1,
  19. pageSize: 10,
  20. },
  21. success: function(data) {
  22. let theArr = [];
  23. if(!data.data || !data.data.one) {
  24. if(data.error && data.error.length) {
  25. message.warning(data.error[0].message);
  26. };
  27. } else {
  28. this.setState({
  29. Interface: data.data.one,
  30. });
  31. };
  32. }.bind(this),
  33. }).always(function() {
  34. this.setState({
  35. loading: false
  36. });
  37. }.bind(this));
  38. },
  39. getInitialState() {
  40. return {
  41. orgCodeUrl: [],
  42. loading: false,
  43. visible: false,
  44. addColumns: [{
  45. title: '选择角色权限',
  46. dataIndex: 'name',
  47. key: 'name',
  48. }, {
  49. title: '',
  50. dataIndex: 'Interface',
  51. key: 'Interface',
  52. }],
  53. };
  54. },
  55. handleSubmit(e) {
  56. e.preventDefault();
  57. //let api=this.props.userDetaile?'编辑':'新建';
  58. this.props.form.validateFields((err, values) => {
  59. var tmp = [];
  60. let selectAllId=this.state.selectedRowKeyst;
  61. for(var i in selectAllId){
  62. //该元素在tmp内部不存在才允许追加
  63. if(tmp.indexOf(selectAllId[i])==-1){
  64. tmp.push(selectAllId[i]);
  65. }
  66. }
  67. if(!err) {
  68. this.setState({
  69. loading: true
  70. });
  71. $.ajax({
  72. method: "POST",
  73. dataType: "json",
  74. crossDomain: false,
  75. url: globalConfig.context + 'api',
  76. data: {
  77. roleName: this.state.roleName,
  78. id:JSON.stringify(tmp)
  79. }
  80. }).done(function(data) {
  81. this.setState({
  82. loading: false
  83. });
  84. if(!data.error.length) {
  85. message.success('保存成功!');
  86. this.handleCancel()
  87. } else {
  88. message.warning(data.error[0].message);
  89. }
  90. }.bind(this));
  91. }
  92. });
  93. },
  94. //查看基本详情基本信息
  95. loaduser(record) {
  96. if(record) {
  97. $.ajax({
  98. method: "get",
  99. dataType: "json",
  100. crossDomain: false,
  101. url: globalConfig.context + '/api/admin/customer/toUpdateBusiness',
  102. data: {
  103. businessId: record.id
  104. },
  105. success: function(data) {
  106. let thisData = data.data;
  107. if(!thisData) {
  108. if(data.error && data.error.length) {
  109. message.warning(data.error[0].message);
  110. };
  111. thisData = {};
  112. };
  113. this.setState({
  114. roleName: thisData.roleName,
  115. selectedRowKeyst:["f9ded9d3-7987-417b-90e8-1ddd9622ada5", "cf637978-ebe8-4be6-9356-f50bc1b81172", "470aad28-e980-4bc5-a8fb-60992c6ee345"],
  116. });
  117. }.bind(this),
  118. }).always(function() {
  119. this.setState({
  120. loading: false
  121. });
  122. }.bind(this));
  123. }
  124. },
  125. handleOk(e) {
  126. this.setState({
  127. visible: false,
  128. });
  129. this.props.closeDesc(false, true);
  130. },
  131. handleCancel(e) {
  132. this.setState({
  133. visible: false,
  134. });
  135. this.props.closeDesc(false);
  136. },
  137. componentWillMount() {
  138. this.addloadData()
  139. },
  140. componentWillReceiveProps(nextProps) { //props改变时触发
  141. this.state.visible = nextProps.showDesc;
  142. if(nextProps.userDetaile && nextProps.showDesc) {
  143. if(nextProps.datauser && nextProps.datauser.id) {
  144. this.loaduser(nextProps.datauser);
  145. }
  146. }
  147. this.setState({
  148. selectedRowKeyst: [],
  149. datauser: {},
  150. })
  151. },
  152. tableRowClick(record, index) {
  153. console.log(record)
  154. },
  155. render() {
  156. const FormItem = Form.Item
  157. const formItemLayout = {
  158. labelCol: { span: 8 },
  159. wrapperCol: { span: 14 },
  160. };
  161. const rowSelection = {
  162. selectedRowKeys: this.state.selectedRowKeyst,
  163. onChange: (selectedRowKeys, selectedRows) => {
  164. let allList = this.state.Interface
  165. let allId = [];
  166. let autAll = [];
  167. let selectId = [];
  168. let rowKey = selectedRowKeys;
  169. selectedRows.map(function(item, index) {
  170. if(item.autNo.length == 4) {
  171. let autoNo = item.autNo
  172. allList.map(function(item) {
  173. autAll.push(item.autNo);
  174. allId.push(item.id)
  175. if(item.children.length) {
  176. item.children.map(function(ttm) {
  177. autAll.push(ttm.autNo)
  178. allId.push(ttm.id)
  179. if(ttm.children.length) {
  180. ttm.children.map(function(itt) {
  181. autAll.push(itt.autNo)
  182. allId.push(itt.id)
  183. })
  184. }
  185. })
  186. }
  187. })
  188. for(var i = 0; i < autAll.length; i++) {
  189. if(autAll[i].indexOf(autoNo)) {} else {
  190. selectId.push(allId[i])
  191. }
  192. }
  193. rowKey = selectId
  194. if(rowKey.length==2){
  195. rowKey = selectedRowKeys
  196. }
  197. return rowKey;
  198. }
  199. if(item.autNo.length > 4) {
  200. rowKey = selectedRowKeys
  201. }
  202. })
  203. this.setState({
  204. selectedRowst: selectedRows,
  205. selectedRowKeyst: rowKey
  206. });
  207. console.log(rowKey)
  208. },
  209. };
  210. return(
  211. <div>
  212. <Modal maskClosable={false} visible={this.state.visible}
  213. onOk={this.handleOk} onCancel={this.handleCancel}
  214. width='1000px'
  215. title={!this.props.userDetaile?'添加角色':'编辑角色'}
  216. footer=''
  217. className="admin-desc-content">
  218. <Form layout="horizontal" onSubmit={this.handleSubmit} id="demand-form" style={{paddingBottom:'40px'}} required="required">
  219. <Spin spinning={this.state.loading}>
  220. <div className="clearfix">
  221. <div className="clearfix">
  222. <FormItem className="half-item"
  223. {...formItemLayout}
  224. label="角色名称" >
  225. <Input placeholder="角色名称" value={this.state.roleName} onChange={(e)=>{this.setState({roleName:e.target.value})}} style={{width:'200px'}} required="required"/>
  226. <span className="mandatory">*</span>
  227. </FormItem>
  228. <FormItem className="half-item"
  229. {...formItemLayout}
  230. label="" >
  231. <Button className="set-submit" type="primary" htmlType="submit">保存</Button>
  232. <Button className="set-submit" type="ghost" onClick={this.handleCancel}>返回</Button>
  233. </FormItem>
  234. </div>
  235. <div className="clearfix">
  236. <Table columns={this.state.addColumns}
  237. dataSource={this.state.Interface}
  238. rowSelection={rowSelection}
  239. onRowClick={this.tableRowClick}
  240. scroll={{ y: 500 }}
  241. pagination={false}
  242. />
  243. </div>
  244. </div>
  245. </Spin>
  246. </Form >
  247. </Modal>
  248. </div>
  249. )
  250. }
  251. }));
  252. export default Newrole;