| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717 | import React from "react";import {  Table,  Button,  Spin,  message,  Popconfirm,  Alert,  Modal,  Input,  Cascader,  Select,} from "antd";import $ from "jquery/src/ajax";import AddContact from "../../../customer/NEW/signCustomer/followDetail/addContact";import "./index.less";import { areaSelect, getProvince } from "@/NewDicProvinceList";const TextArea = Input.TextArea;const Option = Select.Option;const ContactPerson = React.createClass({  getInitialState() {    return {      major: 0,      loading: false,      addcontactModul: false,      enterpriseName: "",      ContactsLists: [        {          title: "姓名",          dataIndex: "name",          key: "name",          render: (text, record, index) => {            if (record.id) return <div>{text}</div>;          },        },        {          title: "联系人部门",          dataIndex: "department",          key: "department",          render: (text, record, index) => {            if (record.id) return <div>{text}</div>;          },        },        {          title: "联系人职务",          dataIndex: "position",          key: "position",          render: (text, record, index) => {            if (record.id) return <div>{text}</div>;          },        },        {          title: "主要联系人",          dataIndex: "major",          width: 100,          key: "major",          render: (text) => {            return text == 1 ? "是" : "否";          },        },        {          title: "地区",          dataIndex: "cityName",          key: "cityName",          render: (text, record, index) => {            if (record.id) return <div>{text}</div>;          },        },        {          title: "手机号码",          dataIndex: "mobile",          key: "mobile",          render: (text, record, index) => {            if (record.id) return <div>{text}</div>;          },        },        {          title: "座机",          dataIndex: "fixedTel",          key: "fixedTel",          render: (text, record, index) => {            if (record.id) return <div>{text}</div>;          },        },        {          title: "微信",          dataIndex: "wechat",          key: "wechat",          render: (text, record, index) => {            if (record.id) return <div>{text}</div>;          },        },        {          title: "联系人QQ",          dataIndex: "qq",          key: "qq",          render: (text, record, index) => {            if (record.id) return <div>{text}</div>;          },        },        {          title: "电子邮箱",          dataIndex: "email",          key: "email",          render: (text, record, index) => {            if (record.id) return <div>{text}</div>;          },        },        {          title: "更新时间",          dataIndex: "createTimes",          key: "createTimes",          render: (text, record, index) => {            if (record.id) return <div>{text}</div>;          },        },        {          title: "跟进人",          dataIndex: "aname",          key: "aname",          render: (text, record, index) => {            if (record.id) return <div>{text}</div>;          },        },        {          title: "操作",          dataIndex: "dels",          key: "dels",          render: (text, record, index) => {            return (              !this.props.isCustomerAdmin && (                <div>                  {/* 禁止管理员删除联系人 */}                  {/* {adminData.isSuperAdmin || !record.id ? (                    <Popconfirm                      title="是否删除?"                      onConfirm={(e) => {                        this.confirmDelet(record);                      }}                      okText="删除"                      cancelText="不删除"                    >                      <Button                        style={{                          marginRight: "10px",                          color: "#ffffff",                          background: "#f00",                          border: "none",                        }}                      >                        删除                      </Button>                    </Popconfirm>                  ) : (                    ""                  )} */}                  {record.major != 1 ? (                    <Button                      style={{                        marginRight: "10px",                        color: "#ffffff",                        background: "green",                        border: "none",                      }}                      onClick={(e) => {                        e.stopPropagation(), this.mainContact(record);                      }}                    >                      设为主要联系人                    </Button>                  ) : (                    ""                  )}                </div>              )            );          },        },      ],      channeOb: [        { name: "民主党派", val: 2 },        { name: "园区", val: 3 },        { name: "民间组织", val: 4 },        { name: "战略合作单位", val: 5 },        { name: "其他", val: 1 },      ],      visible: "", //修改弹窗状态      name: "",      locationProvince: "",      introduction: "",      newname: "",      dataArrar: [],      newintroduction: "",      newtype: 0,    };  },  //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)    );    this.state.contactList.forEach((item) => {      item.major = 0;    });    record.major = 1;    // console.log(record);    this.setState({      contactList: this.state.contactList,    });  },  //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,              department: thisdata.department,              position: thisdata.position,              major: thisdata.major,              createTimes: thisdata.createTimes,              fixedTel: thisdata.fixedTel,              aname: thisdata.aname,              cityName:                (thisdata.provinceName || "") +                (thisdata.cityName || "") +                (thisdata.areaName || ""),            });          }        }        this.setState({          contactList: theArr,        });      }.bind(this),    }).always(      function () {        this.setState({          loading: false,        });      }.bind(this)    );  },  //新增  //tab2新增联系人  addcontact() {    this.setState({      addcontactModul: true,    });  },  //  componentWillMount() {    const { data } = this.props    this.contactLists(this.props.data.id);    this.setState({      name: this.props.name,      locationProvince: (data.province || "") + (!data.city ? "" : "-") + (data.city || "") + (!data.area ? "" : "-") + (data.area || ""),      introduction: this.props.data.introduction,      type: this.props.data.type,    });  },  componentWillReceiveProps(nextProps) {    // if (nextProps.data.id && nextProps.contactState) {    if (nextProps.data.id) {      this.contactLists(nextProps.data.id);    }  },  // 修改渠道名称  onOk() {    if (!this.state.newname) {      message.warning("请输入渠道名称");      return;    }    this.setState({      loading: true,    });    $.ajax({      url: globalConfig.context + "/api/admin/customer/updateUserName",      method: "post",      data: {        uid: this.props.data.id,        userName: this.state.newname,      },    }).done(      function (data) {        this.setState({          loading: false,        });        if (data.error.length === 0) {          message.success("恭喜您,更名成功!");          this.setState({            visible: "",            name: this.state.newname,          });        } else {          message.warning(data.error[0].message);        }      }.bind(this)    );  },  // 修改信息  updateDate() {    const { dataArrar, visible, newintroduction, newtype } = this.state;    if (dataArrar.length === 0 && visible == "city") {      message.warning("请选择省-市-区");      return;    }    if (!newintroduction && visible == "introduction") {      message.warning("请输入简介");      return;    }    if (newtype == 0 && visible == "type") {      message.warning("请选择渠道类别");      return;    }    this.setState({      loading: true,    });    let data = {      uid: this.props.data.id,    };    if (visible == "city") {      data.province = dataArrar[0] || undefined;      data.city = dataArrar[1] || undefined;      data.area = dataArrar[2] || undefined;    }    if (visible == "introduction") {      data.introduction = newintroduction;    }    if (visible == "type") {      data.channelType = newtype;    }    $.ajax({      url: globalConfig.context + "/api/admin/customer/updateUserDate",      method: "post",      data: data,    }).done(      function (data) {        this.setState({          loading: false,        });        if (data.error.length === 0) {          message.success("恭喜您,更改成功!");          this.setState({            visible: "",          });          if (visible == "city") {            this.setState({              locationProvince: getProvince(                dataArrar[0],                dataArrar[1],                dataArrar[2]              ),            });          }          if (visible == "introduction") {            this.setState({              introduction: newintroduction,            });          }          if (visible == "type") {            this.setState({              type: newtype,            });          }        } else {          message.warning(data.error[0].message);        }      }.bind(this)    );  },  render() {    const { visible } = this.state;    return (      <div>        <div className="clearfix">          <Alert            message="注:已保存信息不可修改,可新增正确的信息并设置为主要联系人"            banner          />          <div            style={{              display: "flex",              flexDirection: "row",              justifyContent: "space-between",              margin: "30px 60px 30px 0px",            }}          >            <div              style={{                fontSize: 14,                fontWeight: "bold",              }}            >              <div style={{ padding: "5px 0" }}>                <span>渠道名称:{this.state.name}</span>                <Button                  type="primary"                  style={{ marginLeft: "20px" }}                  onClick={() => {                    this.setState({                      visible: "name",                      newname: "",                    });                  }}                >                  渠道更名                </Button>              </div>              <div style={{ padding: "5px 0" }}>                <span>                  渠道类别:{[                    "",                    "其他",                    "民主党派",                    "园区",                    "民间组织",                    "战略合作单位",                  ][this.state.type]}                </span>                <Button                  type="primary"                  style={{ marginLeft: "20px" }}                  onClick={() => {                    this.setState({                      visible: "type",                      newtype: "",                    });                  }}                >                  修改                </Button>              </div>              <div style={{ padding: "5px 0" }}>                <span>                  省-市-区:                  {this.state.locationProvince}                </span>                <Button                  type="primary"                  style={{ marginLeft: "20px" }}                  onClick={() => {                    this.setState({                      visible: "city",                      dataArrar: [],                    });                  }}                >                  修改                </Button>              </div>              <div style={{ padding: "5px 0" }}>                <span>渠道简介:{this.state.introduction}</span>                <Button                  type="primary"                  style={{ marginLeft: "20px" }}                  onClick={() => {                    this.setState({                      visible: "introduction",                      newintroduction: [],                    });                  }}                >                  修改                </Button>              </div>            </div>            <Button              className="ContactsList"              type="primary"              onClick={this.addcontact}            >              新增联系人            </Button>          </div>        </div>        <div className="clearfix">          <Spin spinning={this.state.loading}>            <Table              pagination={false}              columns={this.state.ContactsLists}              dataSource={this.state.contactList}            />          </Spin>        </div>        {/* 新增联系人 */}        <AddContact          addcontactModul={this.state.addcontactModul}          uids={this.props.data.id}          closeFollow={() => {            this.setState(              {                addcontactModul: false,              },              () => {                this.contactLists();              }            );          }}        />        {/* 信息修改 */}        <Modal          footer={null}          maskClosable={false}          width={300}          title={"信息修改"}          visible={visible != ""}          onCancel={() => {            this.setState({              visible: "",            });          }}        >          <div>            {visible == "name" && (              <div className="enterpriseNameContent">                <div className="enterpriseNameItem">                  <div className="enterpriseNameTitle">更改前:</div>                  <div className="enterpriseNameValue">{this.state.name}</div>                </div>                <div className="enterpriseNameItem">                  <div className="enterpriseNameTitle">更改后:</div>                  <div className="enterpriseNameValue">                    <Input                      value={this.state.newname}                      onChange={(e) => {                        this.setState({                          newname: e.target.value,                        });                      }}                    />                  </div>                </div>              </div>            )}            {visible == "city" && (              <div className="enterpriseNameContent">                <div className="enterpriseNameItem">                  <div className="enterpriseNameTitle">更改前:</div>                  <div className="enterpriseNameValue">                    {this.state.locationProvince}                  </div>                </div>                <div className="enterpriseNameItem">                  <div className="enterpriseNameTitle">更改后:</div>                  <div className="enterpriseNameValue">                    <Cascader                      options={areaSelect()}                      placeholder="选择城市"                      onChange={(e, pre) => {                        this.setState({                          dataArrar: e,                        });                      }}                    />                  </div>                </div>              </div>            )}            {visible == "introduction" && (              <div className="enterpriseNameContent">                <div className="enterpriseNameItem">                  <div className="enterpriseNameTitle">更改前:</div>                  <div className="enterpriseNameValue">                    {this.state.introduction}                  </div>                </div>                <div className="enterpriseNameItem">                  <div className="enterpriseNameTitle">更改后:</div>                  <div className="enterpriseNameValue">                    <TextArea                      style={{ width: "200px" }}                      value={this.state.newintroduction}                      onChange={(e) => {                        this.setState({                          newintroduction: e.target.value,                        });                      }}                    />                  </div>                </div>              </div>            )}            {visible == "type" && (              <div className="enterpriseNameContent">                <div className="enterpriseNameItem">                  <div className="enterpriseNameTitle">更改前:</div>                  <div className="enterpriseNameValue">                    {[                      "",                      "其他",                      "民主党派",                      "园区",                      "民间组织",                      "战略合作单位",                    ][this.state.type]}</div>                </div>                <div className="enterpriseNameItem">                  <div className="enterpriseNameTitle">更改后:</div>                  <div className="enterpriseNameValue">                    <Select                      style={{ width: 165 }}                      placeholder="请选择"                      value={this.state.newtype == 0 ? undefined : this.state.newtype}                      onChange={(e) => {                        this.setState({                          newtype: e,                        });                      }}                    >                      {this.state.channeOb.map(it => (                        <Option key={it.val}>{it.name}</Option>                      ))}                    </Select>                  </div>                </div>              </div>            )}            <Popconfirm              placement="top"              title="确定要修改吗?"              onConfirm={(e) => {                e.stopPropagation();                visible == "name" ? this.onOk() : this.updateDate();              }}              okText="确定"              cancelText="取消"            >              <Button type="primary">确定修改</Button>            </Popconfirm>          </div>        </Modal>      </div>    );  },});export default ContactPerson;
 |