| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289 | import React from 'react';import { Icon,  Modal, message,  AutoComplete,Spin, Input, Select, Button, Form,Upload } from 'antd';import ajax from 'jquery/src/ajax/xhr.js';import $ from 'jquery/src/ajax';import './userMangagement.less';import {urlType} from '../../../dataDic.js';const Option = AutoComplete.Option;const Addjurisdiction = Form.create()(React.createClass({    getInitialState() {        return {            loading: false,            visible:false        };    },    //保存    handleSubmit(e) {    	e.preventDefault();    	let theType;    	if(this.props.userDetaile){			if (!this.state.auto) {				message.warning('请输入上级模块')				return false;			}		}    	if(!this.state.urlType){							message.warning('请选择接口类型')				return false;		}    	let api=this.props.userDetaile?'/api/admin/updateById':'/api/admin/addSupPermission';        this.props.form.validateFields((err, values) => {             if (!err) {                this.setState({                    loading: true                });                $.ajax({                    method: "POST",                    dataType: "json",                    crossDomain: false,                    url: globalConfig.context + api,                    data: {                    	id:this.state.ids,                        name:this.state.name, //接口名称						url:this.state.url,//接口路径						type:this.state.urlType,						superId:this.state.auto,//接口上级模板功能                    }                }).done(function (data) {                     this.setState({                        loading: false                    });                    if (!data.error.length) {                        message.success('保存成功!');                        this.props.closeDesc(false,true);                    } else {                        message.warning(data.error[0].message);                    }                }.bind(this));            }        });    },    //主管初始加载(自动补全)	supervisor(e){ 		$.ajax({            method: "post",            dataType: "json",            crossDomain: false,            url: globalConfig.context + "/api/admin/selectName",            data:{            	name:e            },            success: function (data) {                	  				       let thedata=data.data;				    if (!thedata) {                    if (data.error && data.error.length) {                        message.warning(data.error[0].message);                    };	                    thedata = {};               }; 					this.setState({						customerArr:thedata,	                    });				}.bind(this),			}).always(function () {            this.setState({                loading: false            });        }.bind(this));  	},	//上级主管输入框失去焦点是判断客户是否存在	selectAuto(value,options){		this.setState({			auto:value		})	},	blurChange(e){		let theType;		let contactLists=this.state.customerArr||[];			if (e) {            contactLists.map(function (item) {                if (item.name == e.toString()) {                    theType=item.id                }           });        	    }		this.setState({			theTypes:theType		})	},	//值改变时请求客户名称	httpChange(e){		if(e.length>=1){			this.supervisor(e); 		}			this.setState({			auto:e		})	},	//查看基本详情基本信息    loaduser(record){    	if(record){    	$.ajax({            method: "post",            dataType: "json",            crossDomain: false,            url: globalConfig.context + '/api/admin/selectAllById',            data: {              id: record.id            },            success: function (data) {                let thisData = data.data;                                if (!thisData) {                    if (data.error && data.error.length) {                        message.warning(data.error[0].message);                    };                    thisData = {};                };                 this.setState({                	ids:thisData.id,                	name:thisData.name, //接口名称                	urlType:thisData.type.toString(),					url:thisData.url,//接口路径					preModule:thisData.preModule,//接口上级模板功能                	createId:thisData.createId,                	createTime:(new Date(thisData.createTime)).toLocaleString(),                	updateTime:(new Date(thisData.updateTime)).toLocaleString(),                	autNo:thisData.autNo,                	auto:thisData.superId,                });                              }.bind(this),       }).always(function () {            this.setState({                 loading: false            });        }.bind(this));         }    },    handleOk(e) {        this.setState({            visible: false,        });        this.props.closeDesc(false, true);    },    handleCancel(e) {        this.setState({            visible: false,        });        this.props.closeDesc(false);    },    componentWillReceiveProps(nextProps) {    	this.state.visible = nextProps.showDesc;    	this.state.Detaile=nextProps.userDetaile;		if(!nextProps.userDetaile){			this.state.name='';			this.state.url='';			this.state.urlType=undefined;   		}else{    		this.loaduser(nextProps.datauser)    	   }           },    render() {        const theData = this.state.datauser||{};        const { getFieldDecorator } = this.props.form;        const FormItem = Form.Item        const formItemLayout = {            labelCol: { span: 8 },            wrapperCol: { span: 14 },        };         const dataSources=this.state.customerArr || [];        const options = dataSources.map((group,index) =>				      <Option key={index} value={group.name}>{group.name}</Option>				     )        return (        <div>           <Modal maskClosable={false} visible={this.state.visible}                        onOk={this.handleOk} onCancel={this.handleCancel}                        width='600px'                        title={this.props.userDetaile?'权限详情':'新建权限'}                                              footer=''                        className="admin-desc-content">			            <Form layout="horizontal" onSubmit={this.handleSubmit} id="demand-form">			                <Spin spinning={this.state.loading}>			                        <div className="clearfix">				                    	<FormItem className="half-middle"					                            {...formItemLayout}					                            label="接口名称" >   			                           				                                    <Input placeholder="接口名称" value={this.state.name} style={{width:'230px'}}				                                    onChange={(e)=>{this.setState({name:e.target.value})}} required="required"/>					                   			<span className="mandatory">*</span>					                   </FormItem>					                    <FormItem className="half-middle"					                            {...formItemLayout}					                            label="接口路径" >   				                                    <Input placeholder="接口路径" value={this.state.url} style={{width:'230px'}}				                                    onChange={(e)=>{this.setState({url:e.target.value})}} required="required"/>					                    		<span className="mandatory">*</span>						                    </FormItem>					                    <FormItem className="half-middle"					                            {...formItemLayout}					                            label="接口类型" >   			                                    <Select placeholder="选择接口类型" style={{width:'230px'}}						                            value={this.state.urlType}						                            onChange={(e) => { this.setState({ urlType: e }) }}>						                            {					                                    urlType.map(function (item) {					                                            return <Select.Option key={item.value} >{item.key}</Select.Option>					                                    })					                                }							                    </Select> 					                    		<span className="mandatory">*</span>						                    </FormItem>				                    </div>				                    <div className="clearfix" style={{display:this.props.userDetaile?'block':'none'}}>				                    	<FormItem className="half-middle"					                            {...formItemLayout}					                            label="上级功能模块" >   				                                    <AutoComplete											        className="certain-category-search"											        dropdownClassName="certain-category-search-dropdown"											        dropdownMatchSelectWidth={false}											        dropdownStyle={{ width: 230 }}											        size="large"											        style={{ width: '230px' }}											        dataSource={options}											        placeholder="输入名称"											        value={this.state.auto}											        onChange={this.httpChange}											        filterOption={true}											        onBlur={this.blurChange}											        onSelect={this.selectAuto}											      >											        <Input/>											      </AutoComplete> 											      <span className="mandatory">*</span>					                    </FormItem>				                    	<FormItem className="half-middle"					                            {...formItemLayout}					                            label="权限编号" >   					                            <span>{this.state.autNo}</span>					                    </FormItem>					                    <FormItem className="half-middle"					                            {...formItemLayout}					                            label="创建人" >   					                            <span>{this.state.createId}</span>					                    </FormItem>			                   		    <FormItem className="half-middle"					                            {...formItemLayout}					                            label="创建时间" >   					                            <span>{this.state.createTime}</span>					                    </FormItem>					                    <FormItem className="half-middle"					                            {...formItemLayout}					                            label="更新时间" >   					                           <span>{this.state.updateTime}</span>					                    </FormItem>				                    </div>				                    <FormItem className="half-middle">			                        <Button className="set-submit" type="primary" htmlType="submit" style={{marginLeft:'150px'}}>保存</Button>  			                        <Button className="set-submit" type="ghost" onClick={this.handleCancel}>取消</Button>			                    </FormItem> 			                </Spin>			            </Form >			        </Modal>        	    </div>        )    }}));export default Addjurisdiction;
 |