import React from "react";
import { Spin, Button, Tabs, Table, message, Modal } from "antd";

const project = React.createClass({
  getInitialState() {
    return {
      newVisible: false
    };
  },
  componentWillReceiveProps(nextProps) {
    this.setState({
      newVisible: nextProps.ShowModal
    });
  },
  handleOk() {
    this.setState({
      newVisible: false
    });
    // window.setTimeout( () => {
    //   this.setState({
    //     newVisible: true
    //   });
    // },)
  },
  componentDidMount() {
    
  },
  render() {
    return (
      <Modal
        className="customeDetails"
        footer=""
        title="项目概况"
        width="900px"
        visible={this.state.visible}
        onOk={this.visitOk}
        onCancel={this.visitCancel}
      >
        <Form
          layout="horizontal"
          onSubmit={this.handleSubmit}
          id="demand-form"
          style={{ paddingBottom: "0px" }}
        >
          <Spin spinning={this.state.loading}>
            <div className="clearfix">
              <div className="clearfix">
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="当前项目情况"
                >
                  <span>{this.state.status ? "暂停" : "开启"}</span>
                  <Button
                    type="primary"
                    size="small"
                    style={{ marginTop: "5px", position: "absolute" }}
                    onClick={this.caozuorizhi}
                  >
                    操作日志
                  </Button>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="合同编号"
                >
                  <span>{this.state.contractNo}</span>
                </FormItem>
              </div>
              <div className="clearfix">
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="项目状态"
                >
                  <span>{getProcessStatus(this.state.projectStatus)}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="是否特批"
                >
                  <span>{getApproval(this.state.approval)}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="结算状态"
                >
                  <span>
                    {getLiquidationStatus(this.state.liquidationStatus)}
                  </span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="流程状态"
                >
                  <span>{getProcessStatus(this.state.processStatus)}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="订单编号"
                >
                  <span>{this.state.orderNo}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="是否外包"
                >
                  <span>{this.state.outsource == 0 ? "否" : "是"}</span>
                </FormItem>
              </div>
              <div className="clearfix">
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="满意度表格"
                >
                  <span>{utils.getSatisfaction(this.state.formRetrieve)}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="退单"
                >
                  <span>{utils.getChargeback(this.state.taskRefund)}</span>
                </FormItem>
              </div>
              <div className="clearfix">
                {
                  <FormItem
                    className="half-item"
                    {...formItemLayout}
                    label="(满意度)备注"
                  >
                    <span>{this.state.retrieveContent}</span>
                  </FormItem>
                }
                {
                  <FormItem
                    className="half-item"
                    {...formItemLayout}
                    label="(退单)备注"
                  >
                    <span>{this.state.refundContent}</span>
                  </FormItem>
                }
              </div>
              <div className="clearfix">
                <h3 className="sub-title">任务信息</h3>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="任务编号"
                >
                  <span>{this.state.id}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="任务名称"
                >
                  <span>{this.state.taskName}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="任务状态"
                >
                  <span>{getTaskStatus(this.state.taskStatus)}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="任务类别"
                >
                  <span>{this.state.cname}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="证书编号"
                >
                  <span>{this.state.certificateNumber}</span>
                </FormItem>
              </div>
              {this.state.outsource === 1 ? (
                <div className="clearfix">
                  <h3 className="sub-title">外包信息</h3>
                  <FormItem
                    className="half-item"
                    {...formItemLayout}
                    label="外包公司"
                  >
                    <span>{this.state.outsourceName}</span>
                  </FormItem>
                  <FormItem
                    className="half-item"
                    {...formItemLayout}
                    label="外包成本(万元)"
                  >
                    <span>{this.state.outsourcePrice}</span>
                  </FormItem>
                </div>
              ) : (
                ""
              )}
              {/*<hr style={{border:'1px dashed #aaa', width:"90%",margin:'auto'}}/>*/}
              <div className="clearfix">
                <h3 className="sub-title">联系信息</h3>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="客户名称"
                >
                  <span>{this.state.userName}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="企业法人"
                >
                  <span>{this.state.legalPerson}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="法人电话"
                >
                  <span>{this.state.legalPersonTel}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="客户联系人"
                >
                  <span>{this.state.contacts}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="联系人电话"
                >
                  <span>{this.state.contactMobile}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="企业地址"
                >
                  <span>
                    {getprovince(this.state.locationProvince)}/
                    {getprovince(this.state.locationCity)}/
                    {getprovince(this.state.locationArea)}
                  </span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label=""
                ></FormItem>
                <FormItem className="half-item" {...formItemLayout}>
                  <span style={{ paddingLeft: "12em" }}>
                    {this.state.postalAddress}
                  </span>
                </FormItem>
              </div>
              {/*<hr style={{border:'1px dashed #aaa', width:"90%",margin:'auto'}}/>*/}
              <div className="clearfix">
                <h3 className="sub-title">订单负责人信息</h3>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="负责人"
                >
                  <span>
                    {this.state.salesmanName + "(" + this.state.depName + ")"}
                  </span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="负责人电话"
                >
                  <span>{this.state.salesmanMobile}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="当前财务负责人"
                >
                  <span>{this.state.nowFinance}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="当前财务负责人电话"
                >
                  <span>{this.state.nowFinanceMobile}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  style={{ opacity: ".5" }}
                  label="原负责人"
                >
                  <span>{this.state.oldSalesmanName}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  style={{ opacity: ".5" }}
                  label="原负责人电话"
                >
                  <span>{this.state.oldSalesmanMobile}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  style={{ opacity: ".5" }}
                  label="实际财务操作人"
                >
                  <span>{this.state.financeName}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  style={{ opacity: ".5" }}
                  label="实际财务操作人电话"
                >
                  <span>{this.state.financeMobile}</span>
                </FormItem>
              </div>
              <div className="clearfix">
                <h3 className="sub-title">申报系统账户信息</h3>
                {/*<span style={{color:'red'}}>注:仅技术部可见</span>*/}
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="用户名"
                >
                  <span>{this.state.declareUser ? "*" : ""}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="密码"
                >
                  <span>{this.state.declarePwd ? "*" : ""}</span>
                </FormItem>
              </div>
              <div className="clearfix">
                <h3 className="sub-title">项目申报进度</h3>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="启动时间"
                >
                  <span>{this.state.startDate}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="完成时间"
                >
                  <span>{this.state.endDate}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="受理时间"
                >
                  <span>{this.state.acceptDate}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="评审时间"
                >
                  <span>{this.state.reviewDate}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="公示时间"
                >
                  <span>{this.state.publicityDate}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="发证时间"
                >
                  <span>{this.state.licenceDate}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="立项金额(万元)"
                >
                  <span>{this.state.setUpAmount}</span>
                </FormItem>
                <FormItem
                  className="half-item"
                  {...formItemLayout}
                  label="是否到款"
                >
                  <span>
                    {this.state.arrivalMoney ? "已到企业" : "未到企业"}
                  </span>
                </FormItem>
              </div>
              <div className="clearfix">
                <FormItem
                  labelCol={{ span: 3 }}
                  wrapperCol={{ span: 18 }}
                  label="附件"
                >
                  <Upload
                    className="demandDetailShow-upload"
                    listType="picture-card"
                    fileList={this.state.attachmentUrl}
                    onPreview={file => {
                      this.setState({
                        previewImage: file.url || file.thumbUrl,
                        previewVisible: true
                      });
                    }}
                  ></Upload>
                  <Modal
                    maskClosable={false}
                    footer={null}
                    visible={this.state.previewVisible}
                    onCancel={() => {
                      this.setState({ previewVisible: false });
                    }}
                  >
                    <img
                      alt=""
                      style={{ width: "100%" }}
                      src={this.state.previewImage || ""}
                    />
                  </Modal>
                </FormItem>
              </div>
              <div className="clearfix">
                <FormItem
                  labelCol={{ span: 3 }}
                  wrapperCol={{ span: 16 }}
                  label="备注"
                >
                  <span>{this.state.taskComment}</span>
                </FormItem>
              </div>
              <div>
                <h3 className="sub-title">项目业务</h3>
                {this.state.processStatus == 0 ? (
                  <Button
                    type="primary"
                    onClick={this.addDetailed}
                    style={{
                      float: "right",
                      marginRight: "50px",
                      marginBottom: "15px"
                    }}
                  >
                    添加项目明细
                  </Button>
                ) : (
                  ""
                )}
              </div>
              <div className="patent-table">
                <Spin spinning={this.state.loading}>
                  <Table
                    columns={this.state.columnsX}
                    dataSource={this.state.dataSourceX}
                    pagination={this.state.paginations}
                    onRowClick={this.tableRowClickX}
                    bordered
                    size="small"
                  />
                </Spin>
              </div>
            </div>
          </Spin>
        </Form>
      </Modal>
    );
  }
});

export default project;
