| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368 | 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;			}		}    	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 || "0",                    superId: this.state.auto, //接口上级模板功能                    showOrder: this.state.showOrder,                  },                }).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,                  showOrder: thisData.showOrder,                });            }.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="接口类型"                    >                      {this.props.userDetaile ? (                        <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>导航</span>                      )}                    </FormItem>                  </div>                    {this.props.userDetaile ? <div                    className="clearfix"                  >                    <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="排序"                    >                      <Input                        placeholder="排序数字"                        value={this.state.showOrder}                        style={{ width: "230px" }}                        onChange={(e) => {                          this.setState({ showOrder: e.target.value });                        }}                        required="required"                      />                    </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> : null}                  <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;
 |