123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275 |
- import React from 'react';
- import {Form,Table,Button,Spin,message,Input,Popconfirm,Col} from 'antd';
- import ajax from 'jquery/src/ajax/xhr.js';
- import $ from 'jquery/src/ajax';
- const ContactPerson = React.createClass({
- getInitialState() {
- return {
- contactList:[],
- loading:false,
- ContactsLists: [{
- title: '姓名',
- dataIndex: 'name',
- key: 'name',
- render: (text, record, index) => {
- return <Input value={record.name} placeholder="姓名(必填项)" key={record.id} required="required"
- onChange={(e) => { record.name = e.target.value;
- this.setState({ contactList: this.state.contactList }); }} style={{width:'120px'}}/>
- }
- }, {
- title: '联系人部门',
- dataIndex: 'depatrment',
- key: 'depatrment',
- render: (text, record, index) => {
- return <Input value={record.depatrment} placeholder="联系人部门" key={record.id}
- onChange={(e) => { record.depatrment = e.target.value; this.setState({ contactList: this.state.contactList }); }} style={{width:'120px'}}/>
- }
- }, {
- title: '联系人职务',
- dataIndex: 'position',
- key: 'position',
- render: (text, record, index) => {
- return <Input value={record.position} placeholder="联系人职务" key={record.id}
- onChange={(e) => { record.position = e.target.value; this.setState({ contactList: this.state.contactList }); }} style={{width:'120px'}}/>
- }
- }, {
- title: '主要联系人',
- dataIndex: 'major',
- width:100,
- key: 'major',
- render:(text) => {
- return text?'是':"否"
- }
- },{
- title: '手机号码',
- dataIndex: 'mobile',
- key: 'mobile',
- render: (text, record, index) => {
- return <Input value={record.mobile} placeholder="手机号码(必填项)" key={record.id} required="required"
- onChange={(e) => { record.mobile = e.target.value; this.setState({ contactList: this.state.contactList }); }} style={{width:'120px'}}/>
- }
- }, {
- title: '微信',
- dataIndex: 'wechat',
- key: 'wechat',
- render: (text, record, index) => {
- return <Input value={record.wechat} placeholder="微信" key={record.id}
- onChange={(e) => { record.wechat = e.target.value; this.setState({ contactList: this.state.contactList }); }} style={{width:'120px'}}/>
- }
- }, {
- title: '联系人QQ',
- dataIndex: 'qq',
- key: 'qq',
- render: (text, record, index) => {
- return <Input value={record.qq} placeholder="联系人QQ" key={record.id}
- onChange={(e) => { record.qq = e.target.value; this.setState({ contactList: this.state.contactList }); }} style={{width:'120px'}}/>
- }
- }, {
- title: '电子邮箱',
- dataIndex: 'email',
- key: 'email',
- render: (text, record, index) => {
- return <Input value={record.email} placeholder="电子邮箱" key={record.id}
- onChange={(e) => { record.email = e.target.value; this.setState({ contactList: this.state.contactList }); }} style={{width:'120px'}}/>
- }
- },
- {
- title: '操作',
- dataIndex: 'dels',
- key: 'dels',
- render: (text, record, index) => {
- return <div>{adminData.isSuperAdmin ?
- <Popconfirm title="是否删除?" onConfirm={(e)=>{this.confirmDelet(record)}} okText="删除" cancelText="不删除">
- <Button style={{marginRight:'10px',color:'#ffffff',background:'#f00',border:'none'}}>删除</Button>
- </Popconfirm>
- :''}
- {record.name?<Button style={{marginRight:'10px',color:'#ffffff',background:'green',border:'none'}} onClick={(e)=>{e.stopPropagation(),this.mainContact(record)}}>设为主要联系人</Button>:''}
- </div>
- }
- }
- ],
- }
- },
- //tab2删除
- confirmDelet(e) {
- this.setState({
- loading: true
- });
- if(e.id) {
- $.ajax({
- method: "get",
- dataType: "json",
- crossDomain: false,
- url: globalConfig.context + "/api/admin/customer/deleteOneContact",
- data: {
- ocbId: e.id, //删除的ID
- }
- }).done(function(data) {
- if(!data.error.length) {
- message.success('删除成功!');
- this.setState({
- loading: false,
- });
- } else {
- message.warning(data.error[0].message);
- };
- this.contactLists();
- }.bind(this));
- } else {
- this.contactLists();
- }
- },
- //选择主要联系人
- mainContact(record){
- this.setState({
- loading: true
- });
- $.ajax({
- method: "get",
- dataType: "json",
- crossDomain: false,
- url: globalConfig.context + "/api/admin/customer/updateMainContact",
- data: {
- uid:this.props.data.id,
- ocbId: record.id
- }
- }).done(function(data) {
- if(!data.error.length) {
- message.success('设为主要联系人成功!');
- this.setState({
- loading: false,
- });
- } else {
- message.warning(data.error[0].message);
- };
- this.contactLists();
- }.bind(this));
- },
- //tab2获取联系人详情
- contactLists(ids) {
- this.setState({
- loading: true
- });
- $.ajax({
- method: "get",
- dataType: "json",
- crossDomain: false,
- url: globalConfig.context + '/api/admin/customer/findCustomerContacts',
- data: {
- uid: ids||this.props.data.id, //名称1
- },
- success: function(data) {
- let theArr = [];
- if(data.error.length || data.data.list == "") {
- if(data.error && data.error.length) {
- message.warning(data.error[0].message);
- };
- } else {
- for(let i = 0; i < data.data.length; i++) {
- let thisdata = data.data[i];
- theArr.push({
- key:i,
- id: thisdata.id,
- name: thisdata.name,
- mobile: thisdata.mobile,
- email: thisdata.email,
- qq: thisdata.qq,
- wechat: thisdata.wechat,
- depatrment: thisdata.depatrment,
- position: thisdata.position,
- major:thisdata.major
- });
- };
- };
- this.setState({
- contactList: theArr,
- });
- }.bind(this),
- }).always(function() {
- this.setState({
- loading: false
- });
- }.bind(this));
- },
- //新增
- //tab2新增联系人
- addcontact() {
- this.state.contactList.push({
- id: null,
- name: '',
- mobile: '',
- email: '',
- qq: '',
- wechat: '',
- depatrment: '',
- position: '',
- });
- this.setState({
- contactList: this.state.contactList
- })
- },
- //tab2联系人保存
- contactSave(e) {
- e.preventDefault();
- this.setState({
- loading: true
- });
- $.ajax({
- url: globalConfig.context + '/api/admin/customer/updateCustomerContacts',
- method: 'post',
- data: {
- uid: this.props.data.id,
- contactList: JSON.stringify(this.state.contactList)
- }
- }).done(function(data) {
- this.setState({
- loading: false
- });
- if(!data.error.length) {
- message.success('保存成功!');
- this.props.closeDetail(false,true)
- } else {
- message.warning(data.error[0].message);
- }
- }.bind(this));
- },
- componentWillMount(){
- this.contactLists(this.props.data.id);
- },
- detailsModal(){
- this.props.closeDetail(false, false)
- },
- componentWillReceiveProps(nextProps) {
- if(nextProps.data.id&&nextProps.contactState){
- this.contactLists(nextProps.data.id)
- }
- },
- render() {
- return(
- <div>
- <div className="clearfix" >
- <Button className="ContactsList" type="primary" onClick={this.addcontact}>新增</Button>
- </div>
- <div className="clearfix">
- <Spin spinning={this.state.loading}>
- <Form layout="horizontal" id="demand-form" onSubmit={this.contactSave} >
- <Table
- pagination={false}
- columns={this.state.ContactsLists}
- dataSource={this.state.contactList}
- />
- <Col span={24} offset={9} style={{marginTop:'15px'}}>
- <Button type="primary" htmlType="submit">保存</Button>
- <Button type="ghost" onClick={this.detailsModal} style={{marginLeft:'100px'}}>取消</Button>
- </Col>
- </Form>
- </Spin>
- </div>
- </div>
- )
- }
- })
- export default ContactPerson;
|