| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354 | import React, { Component } from "react";import { AutoComplete, Button, Form, Input, message, Modal, Radio, Select, Spin } from "antd";import $ from "jquery";const FormItem = Form.Item;const formItemLayout = {  labelCol: { span: 8 },  wrapperCol: { span: 14 },};class ProjectOperationVip extends Component {  constructor(props) {    super(props);    this.state = {      commodityName: '',      commodityQuantity: '',      patentType: 0,      officialCost: '',      costReduction: '',      commodityPrice: '',      main: '',      taskComment: '',      declarationBatch: '',      ifCertificationFee: '',      displayFees: "none",      customerArr: [],      patentTypeList: [],      loading: false,      patentTransfer: props.dataInfor ? props.dataInfor.patentTransfer : 0  //收否为专利转让 0 否 1 是    }    this.onSubmit = this.onSubmit.bind(this);    this.httpChange = this.httpChange.bind(this);    this.selectAuto = this.selectAuto.bind(this);    this.setValue = this.setValue.bind(this);  }  componentDidMount() {    this.setValue();  }  setValue() {    const { dataInfor } = this.props;    if (!(dataInfor && Object.keys(dataInfor).length > 0)) { return; }    this.setState({      fid: dataInfor.id,      commodityId: dataInfor.commodityId, //服务ID      commodityName: dataInfor.commodityName, //项目名称      memberType: dataInfor.memberType,// 付款情况      commodityQuantity: dataInfor.commodityQuantity, // 数量      taskComment: dataInfor.taskComment, // 备注    });  }  // 新建会员项目  onSubmit() {    if (this.state.commodityId === undefined || !this.state.commodityId) {      message.warning("服务名称不匹配!");      return    }    let reg = /^([0]|[1-9][0-9]*)$/;    if (      !this.state.commodityQuantity ||      !reg.test(this.state.commodityQuantity)    ) {      message.warning("请输入正确商品数量!");      return    }    if (this.state.memberType === undefined) {      message.warning("请选择付款情况!");      return    }    this.setState({      loading: true,    });    let infor = {      commodityId: this.state.commodityId, //项目编号      orderNo: this.props.orderNo, //订单编号      commodityName: this.state.commodityName, //项目名称      commodityQuantity: this.state.commodityQuantity, //商品数量      commodityPrice: 0, //签单总价      taskComment: this.state.taskComment, //服务说明      memberType: this.state.memberType,//会员付款状态    }    $.ajax({      method: "POST",      dataType: "json",      crossDomain: false,      url: globalConfig.context + "/api/admin/orderProject/addMemberProject",      data: infor,    }).done(      function (data) {        this.setState({          loading: false,        });        if (!data.error.length) {          message.success("保存成功!");          this.props.onCancel();        } else {          message.warning(data.error[0].message);        }      }.bind(this)    );  }  // 修改会员项目  onChange() {    if (this.state.commodityId === undefined || !this.state.commodityId) {      message.warning("服务名称不匹配!");      return    }    let reg = /^([0]|[1-9][0-9]*)$/;    if (      !this.state.commodityQuantity ||      !reg.test(this.state.commodityQuantity)    ) {      message.warning("请输入正确商品数量!");      return false;    }    if (this.state.memberType === undefined) {      message.warning("请选择付款情况!");      return    }    this.setState({      loading: true,    });    $.ajax({      method: "POST",      dataType: "json",      crossDomain: false,      url: globalConfig.context + "/api/admin/orderProject/updateMemberProject",      data: {        id: this.state.fid, //任务ID        commodityId: this.state.commodityId, //项目ID        orderNo: this.props.orderNo, //订单编号        commodityQuantity: this.state.commodityQuantity, //数量        taskComment: this.state.taskComment, //备注        memberType: this.state.memberType,//会员付款状态      },    }).done(      function (data) {        this.setState({          loading: false,        });        if (!data.error.length) {          message.success("保存成功!");          this.props.onCancel();        } else {          message.warning(data.error[0].message);        }      }.bind(this)    );  }  httpChange(e) {    this.setState({      commodityName: e,    });    if (e.length >= 1) {      this.supervisor(e);    }  }  //加载(自动补全)  supervisor(e) {    //服务名称自动补全    let api = "/api/admin/order/getBusinessProjectByName";    $.ajax({      method: "get",      dataType: "json",      crossDomain: false,      url: globalConfig.context + api,      data: {        businessName: e,        cname: "高新会员服务",      },      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 () {      }.bind(this)    );  }  //上级主管输入框失去焦点是判断客户是否存在  selectAuto(value) {    const { customerArr } = this.state;    const newdataSources = JSON.stringify(customerArr) == "{}" ? [] : customerArr;    this.setState({      commodityName: value,      commodityId: newdataSources.find((item) => item.bname == value).id,    });  }  render() {    let options = this.state.customerArr.map((group, index) => (      <Select.Option key={index} value={group.bname}>        {group.bname}      </Select.Option>    ));    const { readOnly } = this.props;    return (      <Modal        maskClosable={false}        visible={this.props.visible}        onOk={this.props.onCancel}        onCancel={this.props.onCancel}        width="900px"        title={readOnly ? "会员详情" : !this.state.fid ? "添加会员项目" : "编辑会员项目"}        footer=""        className="admin-desc-content"      >        <Form          layout="horizontal"        >          <Spin spinning={this.state.loading}>            <div className="clearfix">              <FormItem                className="half-item"                {...formItemLayout}                label="服务名称"              >                {readOnly ? this.state.commodityName :                  <AutoComplete                    className="certain-category-search"                    dropdownClassName="certain-category-search-dropdown"                    dropdownMatchSelectWidth={false}                    style={{ width: "200px" }}                    dataSource={options}                    placeholder="输入服务名称"                    value={this.state.commodityName}                    onChange={this.httpChange}                    filterOption={true}                    onSelect={this.selectAuto}                  >                    <Input />                  </AutoComplete>}                <span className="mandatory">*</span>              </FormItem>              <FormItem                className="half-item"                {...formItemLayout}                label="服务数量"              >                {readOnly ? this.state.commodityQuantity :                  <Input                    placeholder="请输入服务数量"                    value={this.state.commodityQuantity}                    style={{ width: "200px" }}                    onChange={(e) => {                      this.setState({ commodityQuantity: e.target.value });                    }}                    ref="commodityQuantity"                  />}                <span className="mandatory">*</span>              </FormItem>              <div style={{ marginTop: "33px", color: "red", textAlign: "right", position: "relative", top: "-8", left: "0" }}>如会员项目,服务一年,请填写1,服务二年,请填写2,依次类推</div>              <FormItem                className="half-item"                {...formItemLayout}                label="付款情况"              >                {readOnly ?                  [                    { value: "0", key: "已付会员节点全款" },                    { value: "1", key: "已付部分期款,需特批" },                    { value: "2", key: "未付款,需特批" }][this.state.memberType] :                  <Select                    placeholder="选择付款情况"                    style={{ width: "200px" }}                    value={this.state.memberType}                    onChange={(e) => {                      this.setState({ memberType: e });                    }}                  >                    {[                      { value: "0", key: "已付会员节点全款" },                      { value: "1", key: "已付部分期款,需特批" },                      { value: "2", key: "未付款,需特批" }].map(function (item) {                        return (                          <Select.Option key={item.value}>                            {item.key}                          </Select.Option>                        );                      })}                  </Select>}                <span className="mandatory">*</span>              </FormItem>              <div className="clearfix">                <FormItem                  labelCol={{ span: 4 }}                  wrapperCol={{ span: 16 }}                  label="项目说明"                >                  {readOnly ? this.state.taskComment :                    <Input                      type="textarea"                      placeholder="如:增派2022.6-2023.5,总会员服务为3年,客户未付款,承诺10月份进行补付款"                      value={this.state.taskComment}                      onChange={(e) => {                        this.setState({ taskComment: e.target.value });                      }}                    />}                </FormItem>                <div style={{ color: "red", marginLeft: 144 }}>                  请详细说明项目服务时间,总服务时间及付款情况,如:<span style={{ color: "#333" }}>增派2022.6-2023.5,总会员服务为3年,客户未付款,承诺10月份进行补付款</span>                  <p>未付款时,需进行特批审核,请详细说明预计付款时间等详细情况</p>                </div>              </div>              {readOnly ? null : <FormItem                wrapperCol={{ span: 12, offset: 4 }}                className="half-middle"              >                <Button                  className="submitSave"                  type="primary"                  onClick={() => {                    if (!this.state.fid) {                      this.onSubmit()                    } else {                      this.onChange()                    }                  }}                >                  保存                </Button>                <Button                  className="submitSave"                  type="ghost"                  onClick={this.props.onCancel}                >                  取消                </Button>              </FormItem>}            </div>          </Spin>        </Form>      </Modal>    )  }}export default ProjectOperationVip;
 |