myClientDesc.jsx 8.1 KB

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