account.jsx 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162
  1. import React from 'react';
  2. import {Form,Button,Spin,message,Input,Select,Radio} from 'antd';
  3. import ajax from 'jquery/src/ajax/xhr.js';
  4. import $ from 'jquery/src/ajax';
  5. const FormItem =Form.Item;
  6. import {statuslist,lvl,currentMember} from '@/dataDic.js';
  7. import {getcustomerTyp,getCustomerSource} from '@/tools.js';
  8. const Account =React.createClass({
  9. httpAccount(record) {
  10. $.ajax({
  11. method: "get",
  12. dataType: "json",
  13. crossDomain: false,
  14. url: globalConfig.context + '/api/admin/customer/findUserAccountDetail',
  15. data: {
  16. uid: record
  17. },
  18. success: function(data) {
  19. let thisData = data.data;
  20. if(!thisData) {
  21. if(data.error && data.error.length) {
  22. message.warning(data.error[0].message);
  23. };
  24. thisData = {};
  25. };
  26. this.setState({
  27. Accountuid: thisData.id,
  28. mobile: thisData.mobile,
  29. nickname: thisData.nickname,
  30. email: thisData.email,
  31. type: getcustomerTyp(String(thisData.type)),
  32. source: thisData.source,
  33. isMember: thisData.isMember,
  34. currentMemberStatus: String(thisData.currentMemberStatus),
  35. lvl: String(thisData.lvl),
  36. status: String(thisData.status),
  37. createTimes: thisData.createTimes,
  38. });
  39. }.bind(this),
  40. }).always(function() {
  41. this.setState({
  42. loading: false
  43. });
  44. }.bind(this));
  45. },
  46. getInitialState(){
  47. return{
  48. loading:false
  49. }
  50. },
  51. //账户信息保存
  52. accountSave(e) {
  53. e.preventDefault();
  54. if(!this.state.mobile) {
  55. message.warning('手机号码不能为空!')
  56. return false;
  57. }
  58. this.setState({
  59. loading: true
  60. });
  61. $.ajax({
  62. method: "post",
  63. dataType: "json",
  64. url: globalConfig.context + '/api/admin/customer/updateUserAccount',
  65. data: {
  66. id: this.state.Accountuid,
  67. mobile: this.state.mobile,
  68. nickname: this.state.nickname,
  69. email: this.state.email,
  70. isMember: this.state.isMember,
  71. currentMemberStatus: this.state.currentMemberStatus,
  72. lvl: this.state.lvl,
  73. status: this.state.status,
  74. }
  75. }).done(function(data) {
  76. this.setState({
  77. loading: false
  78. });
  79. if(!data.error.length) {
  80. message.success('保存成功!');
  81. this.props.closeDetail(false,true)
  82. } else {
  83. message.warning(data.error[0].message);
  84. }
  85. }.bind(this));
  86. },
  87. componentWillMount(){
  88. this.httpAccount(this.props.data.id);
  89. },
  90. detailsModal(){
  91. this.props.closeDetail(false, false)
  92. },
  93. componentWillReceiveProps(nextProps) {
  94. if(nextProps.data.id&&nextProps.accountState){
  95. this.httpAccount(nextProps.data.id)
  96. }
  97. },
  98. render(){
  99. const formItemLayout = {
  100. labelCol: { span: 8 },
  101. wrapperCol: { span: 14 },
  102. };
  103. return(
  104. <div className="clearfix">
  105. <Form layout="horizontal" id="demand-form" onSubmit={this.accountSave} >
  106. <Spin spinning={this.state.loading} >
  107. <FormItem className="half-item"
  108. {...formItemLayout}
  109. label="注册手机号" >
  110. <span>{this.state.mobile}</span>
  111. </FormItem>
  112. <FormItem className="half-item"
  113. {...formItemLayout}
  114. label="注册用户名" >
  115. <Input value={this.state.nickname} onChange={(e) => { this.setState({ nickname: e.target.value }); }} />
  116. </FormItem>
  117. <FormItem className="half-item"
  118. {...formItemLayout}
  119. label="注册邮箱" >
  120. <Input value={this.state.email} onChange={(e) => { this.setState({ email: e.target.value }); }} />
  121. </FormItem>
  122. <div className="clearfix">
  123. <FormItem className="half-item"
  124. {...formItemLayout}
  125. label="客户来源" >
  126. <span>{getCustomerSource(this.state.source)}</span>
  127. </FormItem>
  128. <FormItem className="half-item"
  129. {...formItemLayout}
  130. label="客户类型" >
  131. <span>{this.state.type}</span>
  132. </FormItem>
  133. <FormItem className="half-item"
  134. {...formItemLayout}
  135. label="创建时间" >
  136. <span>{this.state.createTimes}</span>
  137. </FormItem>
  138. <FormItem className="half-item"
  139. {...formItemLayout}
  140. label="账户状态"
  141. >
  142. <Select placeholder="账户状态" value={this.state.status} onChange={(e) => { this.setState({ status: e }); }} >
  143. {
  144. statuslist.map(function (item) {
  145. return <Select.Option key={item.value} >{item.key}</Select.Option>
  146. })
  147. }
  148. </Select>
  149. </FormItem>
  150. </div>
  151. <div className="clearfix">
  152. <Button className='saveBtn' type="primary" htmlType="submit">保存</Button>
  153. <Button type="ghost" onClick={this.detailsModal}>取消</Button>
  154. </div>
  155. </Spin>
  156. </Form>
  157. </div>
  158. )
  159. }
  160. })
  161. export default Account;