addContact.jsx 6.3 KB

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