| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556 | import React from 'react';import { Button, Modal, Input, Select, Spin, Table, Tabs, message, Form, Tooltip } from 'antd';import $ from 'jquery/src/ajax';import { ShowModal } from '../../../../tools.js'import { provinceList } from '@/NewDicProvinceList';import ShowModalDiv from "@/showModal.jsx";import ZhuanjiaoDetail from "@/zhuanjiaoDetail.jsx";import Detaile from './detail.jsx';import { ChooseList } from "../../../order/orderNew/chooseList";import EnterpriseNameChange from "../../../../common/enterpriseNameChange";const confirm = Modal.confirm;const { TabPane } = Tabsconst QueryCustomer = React.createClass({  //  loadData(pageNo, apiUrl) {    if (!this.state.nameSearch) {      return    }    this.setState({      visitModul: false,      loading: true,      modalVisible: false,    });    let api = apiUrl ? apiUrl : this.props.ApiUrl;    $.ajax({      method: "post",      dataType: "json",      crossDomain: false,      url: globalConfig.context + api,      data: {        pageNo: pageNo || 1,        pageSize: this.state.pagination.pageSize,        name: this.state.nameSearch,        departmentId: this.state.departmenttSearch,        aid: this.state.theTypes,      },      success: function (data) {        ShowModal(this);        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.list.length; i++) {            let thisdata = data.data.list[i];            let diqu =              (thisdata.province == null ? "" : thisdata.province) +              (thisdata.city == null ? "" : "-" + thisdata.city) +              (thisdata.area == null ? "" : "-" + thisdata.area);            thisdata.key = i;            thisdata.id = thisdata.uid;            thisdata.createTime = thisdata.createTime && thisdata.createTime.split(" ")[0];            thisdata.locationProvince = diqu;            theArr.push(thisdata);          }          this.state.pagination.current = data.data.pageNo;          this.state.pagination.total = data.data.totalCount;        }        if (data.data && data.data.list && !data.data.list.length) {          this.state.pagination.current = 0;          this.state.pagination.total = 0;        }        this.setState({          dataSource: theArr,          pagination: this.state.pagination,          selectedRowKeys: [],          ispage: data.data.pageNo,        });      }.bind(this),    }).always(      function () {        this.setState({          loading: false,        });      }.bind(this)    );  },  //部门  departmentList() {    this.setState({      loading: true,    });    $.ajax({      method: "get",      dataType: "json",      crossDomain: false,      url: globalConfig.context + "/api/admin/organization/selectSuperId",      data: {},      success: function (data) {        let thedata = data.data;        let theArr = [];        if (!thedata) {          if (data.error && data.error.length) {            message.warning(data.error[0].message);          }          thedata = {};        } else {          thedata.map(function (item, index) {            theArr.push({              key: index,              name: item.name,              id: item.id,            });          });        }        this.setState({          departmentArr: theArr,        });      }.bind(this),    }).always(      function () {        this.setState({          loading: false,        });      }.bind(this)    );  },  //  getInitialState() {    return {      addressSearch: [],      dataSource: [],      zhuanjiaoVisible: false,      zhuanjiaoData: [],      loading: false,      departmentArr: [],      selectedRowKeys: [],      selectedRowKey: [],      selectedRows: [],      pagination: {        defaultCurrent: 1,        defaultPageSize: 10,        showQuickJumper: true,        pageSize: 10,        onChange: function (page) {          this.loadData(page);        }.bind(this),        showTotal: function (total) {          return "共" + total + "条数据";        },      },      columns: [        {          title: "客户名称",          dataIndex: "name",          key: "name",          render: (text, record) => {            return (              <span style={{ display: 'flex', alignItems: 'flex-start' }}>                {record.channel === 1 ? <div style={{                  whiteSpace: 'nowrap',                  background: '#ef7207',                  color: '#FFF',                  padding: '1px 7px',                  borderRadius: '5px',                  fontSize: '12px',                  display: 'inline-block',                  marginRight: '10px'                }}>                  外联                </div> : null}                <Tooltip title={text}>                  <div>{text}</div>                </Tooltip>              </span>            )          }        },        {          title: "统一社会信用代码",          dataIndex: "orgCode",          key: "orgCode",        },        {          title: "共享类型",          dataIndex: "shareType",          key: "shareType",          //0-私有 1-公共 2 签单          render: (text, record) => {            return (              <span>                {                  text === '0' ? '私有' :                    text === '1' ? '公共' :                      text === '2' ? '签单' : ''                }                {                  record.newChannel == "1"                    ? "渠道" : ""                }              </span>            )          }        },        {          title: "地区",          dataIndex: "locationProvince",          key: "locationProvince",        },        {          title: "创建时间",          dataIndex: "createTime",          key: "createTime",          width: 80,        },        {          title: "客户所属人",          dataIndex: "adminName",          key: "adminName",        },        {          title: "资料所属人",          dataIndex: "informationMaintainer",          key: "informationMaintainer",        },        {          title: "操作",          dataIndex: "abc",          key: "abc",          render: (text, record) => {            return (              <div>                <Button                  disabled={record.signBills === 0}                  onClick={(e) => {                    e.stopPropagation(), this.seeDetail(record);                  }}                  type="primary"                  style={{ marginRight: 10 }}                >                  {record.signBills === 0 ? '暂未签单' : '查看签单详情'}                </Button>                <Button                  onClick={(e) => {                    e.stopPropagation(), this.zhuanjiaoLog(record);                  }}                  type="primary"                >                  查看转交记录                </Button>                <EnterpriseNameChange                  type='journal'                  style={{ marginLeft: 10 }}                  enterpriseId={record.uid} />                {record.shareType === '1' &&                  <Button style={{ marginLeft: 10 }} onClick={(e) => {                    e.stopPropagation();                    let _this = this;                    confirm({                      title: '提醒!',                      content: '确定要领取此客户吗?',                      onOk() {                        _this.receive(record);                      },                      onCancel() { },                    });                  }} type="primary">领取</Button>                }              </div>            );          },        },      ],    };  },  //  receive(e) {    this.setState({      loading: true,    });    $.ajax({      method: "get",      dataType: "json",      crossDomain: false,      url: globalConfig.context + "/api/admin/customer/receiveCustomer",      data: {        uid: e.id,      }    }).done(function (data) {      this.setState({        loading: false,      });      if (data.error.length === 0) {        message.success('领取成功!');        this.loadData(this.state.ispage);      } else {        message.warning(data.error[0].message);      };    }.bind(this));  },  //  zhuanjiaoDetailCancel() {    this.setState({      zhuanjiaoVisible: false,    });  },  //  zhuanjiaoLog(record) {    this.setState({      zhuanjiaoVisible: true,      zhuanjiaoId: record.id,    });  },  //  seeDetail(record) {    this.setState({      data: record,      visitModul: true,    });  },  //  closeDesc(e) {    this.state.visitModul = e;  },  //  search() {    this.loadData();  },  //  reset() {    this.setState({      nameSearch: undefined,      departmenttSearch: undefined,      theTypes: undefined,      auto: undefined,      provinceSearch: undefined,      addressSearch: [],      dataSource: []    })    // this.loadData();  },  componentWillReceiveProps(nextProps) {    if (nextProps.ApiUrl != this.props.ApiUrl) {      this.state.nameSearch = "";      this.state.provinceSearch = undefined;      this.state.addressSearch = [];      this.loadData(null, nextProps.ApiUrl);    }  },  componentWillMount() {    // this.departmentList();    //城市    let Province = [];    provinceList.map(function (item) {      var id = String(item.id);      Province.push(        <Select.Option value={id} key={item.name}>          {item.name}        </Select.Option>      );    });    this.state.Provinces = Province;    this.loadData();  },  //指定转交人自动补全  supervisor(e) {    $.ajax({      method: "get",      dataType: "json",      crossDomain: false,      url: globalConfig.context + "/api/admin/customer/listAdminByName",      data: {        adminName: e,      },      success: function (data) {        let thedata = data.data;        if (!thedata) {          if (data.error && data.error.length) {            message.warning(data.error[0].message);          }          thedata = {};        }        this.setState({          customerArr: thedata,        });      }.bind(this),    }).always(      function () {        this.setState({          loading: false,        });      }.bind(this)    );  },  //输入转交人输入框失去焦点是判断客户是否存在  selectAuto(value, options) {    this.setState({      auto: value,    });  },  blurChange(e) {    let theType = "";    let contactLists = this.state.customerArr || [];    if (e) {      contactLists.map(function (item) {        if (item.name == e.toString()) {          theType = item.id;        }      });    }    this.setState({      theTypes: theType,    });  },  //值改变时请求客户名称  httpChange(e) {    if (e.length >= 1) {      this.supervisor(e);    }    this.setState({      auto: e,    });  },  changeList(arr) {    const newArr = [];    this.state.columns.forEach(item => {      arr.forEach(val => {        if (val === item.title) {          newArr.push(item);        }      });    });    this.setState({      changeList: newArr    });  },  render() {    let departmentArr = this.state.departmentArr || [];    const intentionState = this.props.intentionState;    const FormItem = Form.Item;    const rowSelection = {      selectedRowKeys: this.state.selectedRowKeys,      onChange: (selectedRowKeys, selectedRows) => {        this.setState({          modalVisible: false,          selectedRows: selectedRows.slice(-1),          selectedRowKeys: selectedRowKeys.slice(-1),        });      },      onSelect: (recordt, selected, selectedRows) => {        this.setState({          modalVisible: false,          recordt: recordt.id,        });      },    };    const dataSources = this.state.customerArr || [];    const options = dataSources.map((group) => (      <Select.Option key={group.id} value={group.name}>        {group.name}      </Select.Option>    ));    const hasSelected = this.state.selectedRowKeys.length > 0;    return (      <div className="user-content">        <ShowModalDiv ShowModal={this.state.showModal} />        <div className="content-title" style={{ marginBottom: 10 }}>          <span style={{ fontWeight: 900, fontSize: 16 }}>{!intentionState ? "单位客户查询" : "个人客户查询"}</span>        </div>        <Tabs defaultActiveKey="1" onChange={this.callback} className="test">          <TabPane tab="搜索" key="1">            <div className="user-search">              <Input                style={{ width: 240 }}                placeholder="请输入精确客户全称或统一社会信用代码"                value={this.state.nameSearch}                onChange={(e) => {                  this.setState({ nameSearch: e.target.value });                }}              />              {/* <Select placeholder="选择部门"                            style={{ width: 150 ,marginRight:'10px',marginLeft:'10px'}}                            value={this.state.departmenttSearch}                            onChange={(e) => { this.setState({ departmenttSearch: e }) }}>                            {                                departmentArr.map(function (item) {                                        return <Select.Option key={item.id} >{item.name}</Select.Option>                                })                            }                    </Select>   */}              {/* <AutoComplete				        className="certain-category-search"				        dropdownClassName="certain-category-search-dropdown"				        dropdownMatchSelectWidth={false}				        dropdownStyle={{ width: 120 }}				        style={{ width: '120px'}}				        dataSource={options}				        placeholder="客户所有人姓名"				        value={this.state.auto}				        onChange={this.httpChange}				        filterOption={true}				        onBlur={this.blurChange}				        onSelect={this.selectAuto}				    >				        <Input />				    </AutoComplete>   */}              <Button type="primary" onClick={this.search}>                搜索              </Button>              <Button onClick={this.reset}>重置</Button>            </div>          </TabPane>          <TabPane tab="更改表格显示数据" key="2">            <div style={{ marginLeft: 10 }}>              <ChooseList                columns={this.state.columns}                changeFn={this.changeList}                changeList={this.state.changeList}                top={55}                margin={11}              />            </div>          </TabPane>        </Tabs>        <div className="patent-table">          <Spin spinning={this.state.loading}>            <Table              size="middle"              columns={                this.state.changeList                  ? this.state.changeList                  : this.state.columns              }              dataSource={this.state.dataSource}              rowSelection={rowSelection}              pagination={this.state.pagination}            />          </Spin>        </div>        <Detaile          visitModul={this.state.visitModul}          data={this.state.data}          detailApi={this.props.detailApi}          closeDesc={this.closeDesc}        />        {this.state.zhuanjiaoVisible ? (          <ZhuanjiaoDetail            cancel={this.zhuanjiaoDetailCancel}            visible={this.state.zhuanjiaoVisible}            id={this.state.zhuanjiaoId}          />        ) : (          ""        )}      </div>    );  },});export default QueryCustomer;
 |