addContact.jsx 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170
  1. import React from 'react';
  2. import { Modal, message, layout, Spin, Input, Button, Form, Row, Col, Radio } from 'antd';
  3. import ajax from 'jquery/src/ajax/xhr.js';
  4. import $ from 'jquery/src/ajax';
  5. const FormItem =Form.Item;
  6. const AddContact = React.createClass({
  7. getInitialState() {
  8. return {
  9. addcontactModul: false,
  10. }
  11. },
  12. addcontactModulOK() {
  13. this.setState({
  14. addcontactModul: false
  15. })
  16. this.props.closeFollow(true, true)
  17. },
  18. addcontactModulcancel() {
  19. this.setState({
  20. addcontactModul: false
  21. })
  22. this.props.closeFollow(false, false)
  23. },
  24. //新增联系人保存函数
  25. submitcontactman(e) {
  26. e.preventDefault();
  27. if(!this.state.newname){
  28. message.warn('请输入姓名');
  29. return ;
  30. };
  31. if(!this.state.newmobile){
  32. message.warn('请输入手机号码');
  33. return ;
  34. };
  35. if(this.state.newmobile.length!=11){
  36. message.error('请填写正确的手机号码');
  37. return
  38. }
  39. this.setState({
  40. loading: true
  41. })
  42. $.ajax({
  43. method: "post",
  44. dataType: "json",
  45. crossDomain: false,
  46. url: globalConfig.context + "/api/admin/customer/addOneContact",
  47. data: {
  48. uid: this.state.uid,
  49. name: this.state.newname,
  50. mobile: this.state.newmobile,
  51. email: this.state.newemail,
  52. wechat: this.state.newwechat,
  53. depatrment: this.state.newdepatrment,
  54. position: this.state.newposition,
  55. sex: this.state.newsex,
  56. qq: this.state.newqq
  57. },
  58. success: function(data) {
  59. if(!data.error.length) {
  60. this.addcontactModulOK()
  61. this.setState({
  62. loading: false,
  63. })
  64. } else {
  65. message.warning(data.error[0].message);
  66. };
  67. }.bind(this)
  68. });
  69. },
  70. componentWillReceiveProps(nextProps) {
  71. if(nextProps.addcontactModul && nextProps.uids) {
  72. this.setState({
  73. newsex: undefined,
  74. newname: '',
  75. newmobile: '',
  76. newwechat: '',
  77. newqq: '',
  78. newdepatrment: '',
  79. newposition: '',
  80. newemail: '',
  81. addcontactModul: true,
  82. uid: nextProps.uids,
  83. loading:false
  84. })
  85. };
  86. },
  87. render() {
  88. return(
  89. <div>
  90. <Modal
  91. footer=''
  92. width='800px'
  93. title="新增联系人"
  94. visible={this.state.addcontactModul}
  95. onOk={this.addcontactModulOK}
  96. onCancel={this.addcontactModulcancel}
  97. >
  98. <Form layout="horizontal" onSubmit={this.submitcontactman} id="demand-form">
  99. <Spin spinning={this.state.loading}>
  100. <Row>
  101. <FormItem
  102. labelCol={{ span: 3 }}
  103. wrapperCol={{ span: 14 }}
  104. label="性别:" style={{marginRight:'10px',marginTop: '-15px'}}>
  105. <Radio.Group value={this.state.newsex} onChange={(e) => {
  106. this.setState({ newsex: e.target.value })
  107. }}>
  108. <Radio value='男'>男</Radio>
  109. <Radio value='女'>女</Radio>
  110. </Radio.Group>
  111. </FormItem>
  112. </Row>
  113. <Row style={{ paddingLeft:'50px' }}>
  114. <Col span={2}><span style={{color:'red'}}>*</span>姓名:</Col>
  115. <Col span={8}>
  116. <Input value={this.state.newname}
  117. onChange={(e) => { this.setState({ newname: e.target.value }) }} />
  118. </Col>
  119. <Col span={2} style={{ marginLeft: '50px' }}><span style={{color:'red'}}>*</span>手机:</Col>
  120. <Col span={8}>
  121. <Input value={this.state.newmobile}
  122. onChange={(e) => { this.setState({ newmobile: e.target.value }) }} />
  123. </Col>
  124. </Row>
  125. <Row style={{ marginTop: '20px',paddingLeft:'50px' }}>
  126. <Col span={2}>微信:</Col>
  127. <Col span={8}>
  128. <Input value={this.state.newwechat}
  129. onChange={(e) => { this.setState({ newwechat: e.target.value }) }} />
  130. </Col>
  131. <Col span={2} style={{ marginLeft: '50px' }}>Q Q:</Col>
  132. <Col span={8}>
  133. <Input value={this.state.newqq}
  134. onChange={(e) => { this.setState({ newqq: e.target.value }) }} />
  135. </Col>
  136. </Row>
  137. <Row style={{ marginTop: '20px' ,paddingLeft:'50px'}}>
  138. <Col span={2}>部门:</Col>
  139. <Col span={8}>
  140. <Input value={this.state.newdepatrment}
  141. onChange={(e) => { this.setState({ newdepatrment: e.target.value }) }} />
  142. </Col>
  143. <Col span={2} style={{ marginLeft: '50px' }}>职位:</Col>
  144. <Col span={8}>
  145. <Input value={this.state.newposition}
  146. onChange={(e) => { this.setState({ newposition: e.target.value }) }} />
  147. </Col>
  148. </Row>
  149. <Row style={{ marginTop: '20px',paddingLeft:'50px' }}>
  150. <Col span={2}>邮箱:</Col>
  151. <Col span={8}>
  152. <Input value={this.state.newemail}
  153. onChange={(e) => { this.setState({ newemail: e.target.value }) }} />
  154. </Col>
  155. </Row>
  156. <Row style={{ marginTop: '20px',paddingLeft:'50px' ,marginBottom:'50px'}}>
  157. <Button className="set-submit" type="primary" htmlType="submit" id="change_keep" style={{marginLeft:'60px'}}>保存</Button>
  158. <Button className="set-submit" type="ghost" onClick={this.addcontactModulcancel} id='change_rem'>取消</Button>
  159. </Row>
  160. </Spin>
  161. </Form>
  162. </Modal>
  163. </div>
  164. )
  165. }
  166. })
  167. export default AddContact;