myClientDesc.jsx 7.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212
  1. import React from 'react';
  2. import { Icon, Modal, message, Spin, Input, Select, Button, Form } from 'antd';
  3. import './myClient.less';
  4. import ajax from 'jquery/src/ajax/xhr.js';
  5. import $ from 'jquery/src/ajax';
  6. import {socialAttribute} from '../../../dataDic.js';
  7. const AchievementDetailForm = Form.create()(React.createClass({
  8. getInitialState() {
  9. return {
  10. loading: false,
  11. data: {},
  12. };
  13. },
  14. handleSubmit(e) {
  15. if(this.state.companyNamet.length>64){
  16. message.warning('客户名称字数不超过64个')
  17. return false;
  18. };
  19. if(this.state.content.length>32){
  20. message.warning('联系人字数不超过32个')
  21. return false;
  22. };
  23. if(this.state.telnum.length>13){
  24. message.warning('电话号码字数不超过13个')
  25. return false;
  26. };
  27. if(this.state.societyTagt==undefined){
  28. message.warning('请填写社会属性!')
  29. return false;
  30. };
  31. e.preventDefault();
  32. this.props.form.validateFields((err, values) => {
  33. if (!err) {
  34. this.setState({
  35. loading: true
  36. });
  37. $.ajax({
  38. method: "POST",
  39. dataType: "json",
  40. crossDomain: false,
  41. url: globalConfig.context + '/api/admin/customer/addCustomer',
  42. data: {
  43. name: this.state.companyNamet,
  44. contacts:this.state.content,
  45. contactMobile: this.state.telnum,
  46. societyTag:this.state.societyTagt,
  47. type:'1'
  48. }
  49. }).done(function (data) {
  50. this.setState({
  51. loading: false
  52. });
  53. if (!data.error.length) {
  54. message.success('保存成功!');
  55. this.props.handleOk();
  56. } else {
  57. message.warning(data.error[0].message);
  58. }
  59. }.bind(this));
  60. }
  61. });
  62. },
  63. //去完善
  64. addContent(){
  65. let telnum=this.state.telnum;
  66. let companyName=this.state.companyNamet;
  67. let content=this.state.content;
  68. if(!telnum||!companyName||!content){
  69. message.warning('此3项都要填');
  70. }else{
  71. this.props.newmodal(true);
  72. this.props.closeDesc(false);
  73. }
  74. },
  75. componentWillMount() {
  76. this.state.companyNamet='';
  77. this.state.content='';
  78. this.state.telnum='';
  79. this.state.societyTagt=undefined;
  80. },
  81. componentWillReceiveProps(nextProps) {
  82. if (!this.props.visible && nextProps.visible) {
  83. this.state.companyNamet='';
  84. this.state.content='';
  85. this.state.telnum='';
  86. this.state.societyTagt=undefined;
  87. this.props.form.resetFields();
  88. };
  89. },
  90. render() {
  91. const theData = this.state.data || {};
  92. const { getFieldDecorator } = this.props.form;
  93. const FormItem = Form.Item
  94. const formItemLayout = {
  95. labelCol: { span: 8 },
  96. wrapperCol: { span: 14 },
  97. };
  98. return (
  99. <div>
  100. <Form horizontal onSubmit={this.handleSubmit} id="demand-form">
  101. <Spin spinning={this.state.loading}>
  102. <div className="clearfix">
  103. <FormItem className="half-item"
  104. {...formItemLayout}
  105. label="公司名称" >
  106. <Input value={this.state.companyNamet} placeholder="公司名称(64字以内)"
  107. onChange={(e) => { this.setState({ companyNamet: e.target.value }); }} required="required"/>
  108. </FormItem>
  109. </div>
  110. <div className="clearfix">
  111. <FormItem className="half-item"
  112. {...formItemLayout}
  113. label="联系人" >
  114. <Input value={this.state.content} placeholder="联系人"
  115. onChange={(e) => { this.setState({ content: e.target.value }); }} required="required"/>
  116. </FormItem>
  117. </div>
  118. <div className="clearfix">
  119. <FormItem className="half-item"
  120. {...formItemLayout}
  121. label="联系电话" >
  122. <Input value={this.state.telnum} placeholder="联系电话"
  123. onChange={(e) => { this.setState({ telnum: e.target.value }); }} required="required"/>
  124. </FormItem>
  125. </div>
  126. <div className="clearfix">
  127. <FormItem className="half-item"
  128. {...formItemLayout}
  129. label="社会属性"
  130. >
  131. <Select placeholder="客户社会属性" value={this.state.societyTagt} onChange={(e) => { this.setState({ societyTagt: e}); }}>
  132. {
  133. socialAttribute.map(function (item) {
  134. return <Select.Option key={item.value} >{item.key}</Select.Option>
  135. })
  136. }
  137. </Select>
  138. </FormItem>
  139. </div>
  140. <FormItem wrapperCol={{ span: 12, offset: 4 }}>
  141. <Button className="set-submit" type="primary" htmlType="submit">保存</Button>
  142. {/*<Button className="set-submit" type="primary" onClick={(e)=>{this.addContent();this.props.closeDesc}}>去完善</Button>*/}
  143. <Button className="set-submit" type="ghost" onClick={this.props.closeDesc}>取消</Button>
  144. </FormItem>
  145. </Spin>
  146. </Form >
  147. </div>
  148. )
  149. }
  150. }));
  151. const CustomerDetail = React.createClass({
  152. getInitialState() {
  153. return {
  154. visible: false,
  155. tabsKey: 1,
  156. loading: false,
  157. dataSource: [],
  158. };
  159. },
  160. handleCancel(e) {
  161. this.setState({
  162. visible: false,
  163. });
  164. this.props.closeDesc(false);
  165. },
  166. handleOk(e) {
  167. this.setState({
  168. visible: false,
  169. });
  170. this.props.closeDesc(false, true);
  171. },
  172. componentWillReceiveProps(nextProps) {
  173. if (!this.state.visible && nextProps.showDesc) {
  174. this.state.tabsKey = "1";
  175. };
  176. this.state.visible = nextProps.showDesc;
  177. },
  178. render() {
  179. return (
  180. <div className="patent-desc">
  181. <Modal maskClosable={false} visible={this.state.visible}
  182. onOk={this.checkPatentProcess} onCancel={this.handleCancel}
  183. width='800px'
  184. title='新建客户'
  185. footer=''
  186. className="admin-desc-content">
  187. <Spin spinning={this.state.loading}>
  188. <AchievementDetailForm
  189. data={this.props.data}
  190. newmodal={this.props.newmodal}
  191. closeDesc={this.handleCancel}
  192. visible={this.state.visible}
  193. handleOk={this.handleOk} />
  194. </Spin>
  195. </Modal>
  196. </div>
  197. );
  198. },
  199. });
  200. export default CustomerDetail;