| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332 | import React from 'react';import { Form, Table, Spin, message, Modal, Button, Select } from 'antd';import ajax from 'jquery/src/ajax/xhr.js';import $ from 'jquery/src/ajax';const Detail = React.createClass({  getInitialState() {    return {      visible: false,      loading: false,      dataSource: [],      gdataSource: [],      columns: [        {          title: '业务名称',          dataIndex: 'businessProjectName',          key: 'businessProjectName',        },        {          title: '签单时间',          dataIndex: 'lockTime',          key: 'lockTime',        },        {          title: '营销员',          dataIndex: 'salesmanName',          key: 'salesmanName',        }      ],      gcolumns: [        {          title: '限定项目',          dataIndex: 'projectName',          key: 'projectName',        },        {          title: '状态',          dataIndex: 'type',          key: 'type',          render: (text) =>            <span>              {["公共", "私有", "签单"][text]}            </span>        },        {          title: '营销员',          dataIndex: 'adminName',          key: 'adminName',        },        {          title: '操作',          dataIndex: 'op',          key: 'op',          render: (text, record) =>            (record.type == 0 && this.props.data.shareType == 2) &&            <Button              type="primary"              onClick={() => {                this.setState({                  visible: true,                  pid: record.pid,                  pName: record.projectName,                })              }}            >              领取            </Button>        },      ],      followList: [        { key: "已发项目介绍资料", value: 0 },        { key: "已约面谈", value: 1 },        { key: "已发合同计划书", value: 2 },        { key: "已报价", value: 3 },        { key: "已发合同", value: 4 },        { key: "已签合同", value: 5 },        { key: "面谈中", value: 6 },        { key: "已面签", value: 7 },        { key: "无进度", value: 8 },      ],      customerList: [        { key: "新客户", value: 0 },        { key: "意向客户", value: 1 },        { key: "重点客户", value: 2 },        { key: "面谈客户", value: 3 },        { key: "签单客户", value: 4 },        { key: "被拒客户", value: 5 },        { key: "停止跟进", value: 6 },      ],      followSituation: 6,      customerStatus: 4,    }  },  loadData(data, apiUrl) {    this.setState({      loading: true,    });    $.ajax({      method: "get",      dataType: "json",      crossDomain: false,      url: globalConfig.context + apiUrl,      data: {        uid: data.id,      },      success: function (data) {        let listArr = [];        let thedata = data.data;        if (!thedata) {          if (data.error && data.error.length) {            message.warning(data.error[0].message);          };          thedata = {};          return;        };        for (let i = 0; i < data.data.length; i++) {          let thisdata = data.data[i];          listArr.push({            id: thisdata.id,            businessProjectName: thisdata.businessProjectName,            salesmanName: thisdata.salesmanName,            lockTime: thisdata.lockTime && thisdata.lockTime.split(' ')[0],          });        };        this.setState({          dataSource: listArr,        });      }.bind(this),    }).always(function () {      this.setState({        loading: false      });    }.bind(this));  },  gloadData(id) {    this.setState({      loading: true,    });    $.ajax({      method: "get",      dataType: "json",      crossDomain: false,      url: globalConfig.context + '/api/restrict/Project/list',      data: {        uid: id,      },      success: function (data) {        let thedata = data.data;        if (!thedata) {          if (data.error && data.error.length) {            message.warning(data.error[0].message);          };        } else {          this.setState({            gdataSource: thedata          })        }      }.bind(this),    }).always(function () {      this.setState({        loading: false      });    }.bind(this));  },  visitCancel() {    this.setState({      visitModul: false    })    this.props.closeDesc(false);  },  add() {    if (!this.state.followSituation && this.state.followSituation != 0) {      message.warning("请选择跟进进度!")      return    }    if (!this.state.customerStatus && this.state.customerStatus != 0) {      message.warning("请选择客户状态!")      return    }    this.setState({      loading: true,    });    $.ajax({      method: "post",      dataType: "json",      crossDomain: false,      url: globalConfig.context + "/api/restrict/Project/add",      data: {        pid: this.state.pid,        uid: this.state.uid,        followSituation: this.state.followSituation,        customerStatus: this.state.customerStatus,      },      success: function (data) {        if (data.error && data.error.length) {          message.warning(data.error[0].message);        } else {          Modal.success({            title: '领取成功!',            content: (              <div>                本次领取的项目为                <span style={{ color: "red" }}>【{this.state.pName}】</span>                ,请在我的“客户管理-限定项目列表“查看              </div>),          });          this.setState({            visible: false,            followSituation: 6,            customerStatus: 4,          })          this.gloadData(this.state.uid)        }      }.bind(this),    }).always(      function () {        this.setState({          loading: false,        });      }.bind(this)    );  },  componentWillReceiveProps(nextProps) {    if (nextProps.visitModul) {      this.setState({        visitModul: true,        uid: nextProps.data.id,      })      this.loadData(nextProps.data, nextProps.detailApi);      this.gloadData(nextProps.data.id)    }  },  render() {    const FormItem = Form.Item    return (      <Modal        className="customeDetails"        footer=''        title=""        width='800px'        visible={this.state.visitModul}        onOk={this.visitCancel}        onCancel={this.visitCancel}      >        <Spin spinning={this.state.loading}>          <div style={{ fontSize: "16px", fontWeight: "bold" }}>限定项目</div>          <Table            size="middle"            columns={this.state.gcolumns}            dataSource={this.state.gdataSource}            pagination={false}          />          <div style={{ marginTop: 50, fontSize: "16px", fontWeight: "bold" }}>已签业务</div>          <Table            size="middle"            columns={this.state.columns}            dataSource={this.state.dataSource}            pagination={false}          />        </Spin>        <Modal          title="领取限定项目"          visible={this.state.visible}          onOk={this.add}          onCancel={() => {            this.setState({              visible: false,              followSituation: 6,              customerStatus: 4,            })          }}        >          <FormItem            labelCol={{ span: 8 }}            wrapperCol={{ span: 10 }}            label="跟进进度"          >            <Select              placeholder="跟进进度"              value={this.state.followSituation}              style={{ width: 200 }}              onChange={(e) => {                this.setState({ followSituation: e });              }}            >              {this.state.followList.map(function (item) {                return (                  <Select.Option key={item.value} value={item.value}>                    {item.key}                  </Select.Option>                );              })}            </Select>          </FormItem>          <FormItem            labelCol={{ span: 8 }}            wrapperCol={{ span: 10 }}            label="客户状态"          >            <Select              placeholder="客户状态"              value={this.state.customerStatus}              style={{ width: 200 }}              onChange={(e) => {                this.setState({ customerStatus: e });              }}            >              {this.state.customerList.map(function (item) {                return (                  <Select.Option key={item.value} value={item.value}>                    {item.key}                  </Select.Option>                );              })}            </Select>          </FormItem>        </Modal>      </Modal>    )  }})export default Detail;
 |