import React from 'react'; import { Button, Input, Select, message, Modal, Checkbox } from 'antd'; import { companySearch } from '../../../tools.js'; import ajax from 'jquery/src/ajax/xhr.js'; import $ from 'jquery/src/ajax'; const ApplyAdd = React.createClass({ getInitialState() { return { visible: false, loading: false }; }, getContactsList(theUid) { $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admin/getContacts?uid=" + theUid, success: function (data) { let theOption = []; if (data.error.length || !data.data) { return; }; for (let item in data.data) { let theData = data.data[item]; theOption.push( <Select.Option value={item} key={item}>{theData}</Select.Option> ); }; this.setState({ contactsOption: theOption }); }.bind(this), }); $.ajax({ method: "get", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admintechproject/getDepartment?uid=" + theUid, success: function (data) { if (data.error.length || !data.data) { message.warning(data.error[0].message); return; }; let theOption = []; for (var item in data.data) { theOption.push( <Select.Option value={item} key={item}>{data.data[item]}</Select.Option> ); }; this.setState({ departmentOption: theOption }) }.bind(this), }); }, componentWillReceiveProps(nextProps) { this.state.visible = nextProps.showAdd }, showModal() { this.setState({ visible: true, }); }, handleOk() { this.setState({ loading: true }); if (!this.state.uid) { message.warning('请选择公司!'); this.setState({ loading: false }); return; } if (!this.state.contacts) { message.warning('请选择一个联系人!'); this.setState({ loading: false }); return; }; $.ajax({ method: "POST", dataType: "json", crossDomain: false, url: globalConfig.context + "/api/admintechproject/applyTechProject", data: { uid: this.state.uid, contacts: this.state.contacts, department: this.state.department, dispatchInfo: this.state.dispatchInfo, projectName: this.state.projectName, projectCatagory: this.state.projectCatagory, techField: this.state.techField, projectDes: this.state.projectDes, projectMode: this.state.projectMode, projectApproval: this.state.projectApproval, subsidy: this.state.subsidy, consultant: this.state.consultant, } }).done(function (data) { if (!data.error.length) { message.success('保存成功!'); this.setState({ visible: false }); this.props.closeAdd(false); } else { message.warning(data.error[0].message); this.setState({ loading: false }); } }.bind(this)); }, handleCancel(e) { this.setState({ visible: false, }); this.props.closeAdd(false); }, spinChange(e) { this.setState({ loading: e }); }, projectEstablishmentCheck(e) { if (e.target.checked == true) { this.state.projectMode = 1; } else if (e.target.checked == false) { this.state.projectMode = 0; }; }, subsidyCheck(e) { if (e.target.checked == true) { this.state.subsidy = 1; } else if (e.target.checked == false) { this.state.subsidy = 0; }; }, render() { return ( <div className="cognizance-add"> <Modal title="新科技项目申请" visible={this.state.visible} onOk={this.handleOk} onCancel={this.handleCancel} width='800px' footer={[ <Button key="submit" type="primary" loading={this.state.loading} onClick={this.handleOk}> 确认 </Button>, <Button key="back" onClick={this.handleCancel}> 取消 </Button>, ]} > <div className="clearfix" style={{ marginBottom: '10px' }}> <div className="half-item"> <span className="item-title">选择公司: </span> <Select placeholder="请选择公司" style={{ width: 200 }} showSearch filterOption={companySearch} onSelect={(e, n) => { this.state.uid = e; this.getContactsList(e); }}> {this.props.companyAddOption} </Select> </div> <div className="half-item"> <span className="item-title">选择联系人: </span> <Select placeholder="请选择联系人" style={{ width: 200 }} onSelect={(e, n) => { this.state.contacts = e }}> {this.state.contactsOption} </Select> </div> </div> <div className="clearfix"> <div className="half-item"> <span className="item-title">选择申报科技部门: </span> <Select placeholder="请选择申报部门" style={{ width: 200 }} onSelect={(e, n) => { this.state.department = e; }}> {this.state.departmentOption} </Select> </div> </div> <div className="clearfix"> <div> <span className="item-title">派单信息: </span> </div> <Input type="textarea" rows={6} onChange={(e) => { this.state.dispatchInfo = e.target.value; }} /> </div> <div className="clearfix"> <div className="half-item"> <span className="item-title">项目名称: </span> <Input style={{ width: 200 }} onChange={(e) => { this.state.projectName = e.target.value; }} /> </div> </div> <div className="clearfix"> <div className="half-item"> <span className="item-title">项目类型: </span> <Input style={{ width: 200 }} onChange={(e) => { this.state.projectCatagory = e.target.value; }} /> </div> </div> <div className="clearfix"> <div className="half-item"> <span className="item-title">技术领域: </span> <Input style={{ width: 200 }} onChange={(e) => { this.state.techField = e.target.value; }} /> </div> </div> <div className="clearfix"> <div> <span className="item-title">项目介绍: </span> </div> <Input type="textarea" rows={6} onChange={(e) => { this.state.projectDes = e.target.value; }} /> </div> <div className="clearfix"> <div className="half-item"> <span className="item-title">是否立项: </span> <Checkbox onChange={this.projectEstablishmentCheck}></Checkbox> </div> <div className="half-item"> <span className="item-title">立项金额: </span> <Input style={{ width: 200 }} onChange={(e) => { this.state.projectApproval = e.target.value; }} /> </div> </div> <div className="clearfix"> <div className="half-item"> <span className="item-title">是否后补助: </span> <Checkbox onChange={this.subsidyCheck}></Checkbox> </div> </div> <div className="clearfix"> <div className="half-item"> <span className="item-title">选择咨询师: </span> <Select placeholder="请选择咨询师" style={{ width: 200 }} onSelect={(e, n) => { this.state.consultant = e }}> {this.props.authorOption} </Select> </div> </div> </Modal> </div> ); } }); export default ApplyAdd;