import React, { Component } from "react";
import { Form, Upload, Modal, Button, Table, Col, message, Tag } from "antd";
import {
  splitUrl,
  getProcessStatus,
  getjiedian,
  getLiquidationStatus,
  getboutique,
  getCuikuan,
  getApprovedState,
  getProjectStatus
} from "@/tools.js";
import img from "./img.png"
import ResolutionDetail from "@/resolutionDetail";
import ImgList from "../../../../common/imgList";
const FormItem = Form.Item;
class OrderDetail extends Component {
  constructor(props) {
    super(props);
    this.state = {
      newContactsLists: [
        {
          title: "项目名称",
          dataIndex: "commodityName",
          key: "commodityName",
          render: (text, record) => {
            return {text + "-" + record.tid};
          }
        },
        {
          title: "项目分类",
          dataIndex: "projectType",
          key: "projectType",
          render: text => {
            let arr = this.props.dataSourceX || [];
            let str = "";
            for (let i = 0; i < arr.length; i++) {
              if (this.props.dataSourceX[i].sort == text) {
                str = this.props.dataSourceX[i].cname;
                return {str};
              }
            }
          }
        },
        {
          title: "催款科目",
          dataIndex: "dunTypeName",
          key: "dunTypeName",
          render: (text, record) => {
            if(record.customizeName) {
              return text + record.customizeName;
            }
            return {text};
          }
        },
        {
          title: "时间",
          dataIndex: "waitDay",
          key: "waitDay",
          render: (text, record) => {
            if (record.dunTypeName) {
              if (record.customizeTimes) {
                return record.customizeTimes;
              }
              return {text};
            }
          }
        },
        {
          title: "金额(万元)",
          dataIndex: "money",
          key: "money",
          render: (text, record) => {
            if (record.dunTypeName) {
              if (record.appropriationRatio && !record.money) {
                return {record.appropriationRatio}(拨款比例);
              } else if (record.appropriationRatio && record.money) {
                return (
                  
                    {text}(比例:{record.appropriationRatio})
                  
                );
              } else {
                return {text};
              }
            }
          }
        },
        {
          title: "服务年限",
          dataIndex: "startDate",
          key: "startDate",
          render: (text, record) => {
            if (record.dunTypeName) {
              return {text};
            }
          }
        },
        {
          title: "催款状态",
          dataIndex: "status",
          key: "status",
          render: text => {
            return {text == 1 ? "已启动" : "未启动"};
          }
        }
      ],
      ContactsLists: [
        {
          title: "催款科目",
          dataIndex: "dunSubject",
          key: "dunSubject",
          render: text => {
            return getjiedian(text);
          }
        },
        {
          title: "金额(万元)",
          dataIndex: "money",
          key: "money"
        },
        {
          title: "催款状态",
          dataIndex: "dunStatus",
          key: "dunStatus",
          render: text => {
            return getCuikuan(text);
          }
        }
      ],
      resVisible: false,
      columnsX: [
        {
          title: "业务项目名称",
          dataIndex: "commodityName",
          key: "commodityName",
          render: (text, record) => {
            return text + "-" + record.id
          }
        },
        {
          title: "项目类别",
          dataIndex: "cname",
          key: "cname"
        },
        {
          title: "项目数量",
          dataIndex: "commodityQuantity",
          key: "commodityQuantity",
          render: (text, record) => {
            if (record.splitStatus == 1) {
              return (
                
                  {text}{" "}
                   {
                      e.stopPropagation();
                      this.showRes(record);
                    }}
                  >
                    已拆
                  
                
              );
            } else {
              return text;
            }
          }
        },
        {
          title: "金额(万元)",
          dataIndex: "commodityPrice",
          key: "commodityPrice",
          render: text => {
            return this.props.processState === 2 ? "***" : text;
          }
        },
        {
          title: "负责人",
          dataIndex: "contacts",
          key: "contacts"
        },
        {
          title: "负责人电话",
          dataIndex: "contactsMobile",
          key: "contactsMobile"
        },
        {
          title: "项目状态",
          dataIndex: "projectStatus",
          key: "projectStatus",
          render: text => {
            return getProjectStatus(text);
          }
        },
        {
          title: "主要项目",
          dataIndex: "main",
          key: "main",
          render: text => {
            return text ? "是" : "否";
          }
        },
        {
          title: "项目说明",
          dataIndex: "taskComment",
          key: "taskComment",
          render: text => {
            return text && text.length > 8 ? text.substr(0, 8) + "…" : text;
          }
        }
      ],
      rotateDeg: 0
    };
    this.tableRowClickX = this.tableRowClickX.bind(this);
    this.nextCancel = this.nextCancel.bind(this);
    this.rotate = this.rotate.bind(this);
    this.downImg = this.downImg.bind(this);
    this.upImg = this.upImg.bind(this);
    this.downImgs = this.downImgs.bind(this);
    this.upImgs = this.upImgs.bind(this);
    this.showRes = this.showRes.bind(this);
    this.resCancel = this.resCancel.bind(this);
  }
  rotate() {
    let rotateDeg = this.state.rotateDeg + 90;
    this.setState({
      rotateDeg
    });
  }
  //项目详情关闭
  nextCancel() {
    this.setState({
      visible: false
    });
  }
  //点击打卡项目详情
  tableRowClickX(record) {
    this.setState({
      jid: record.id, //项目ID
      kid: record.commodityId, //商品ID
      commodityName: record.commodityName, //金额
      commodityPrice: record.commodityPrice, //金额
      commodityQuantity: record.commodityQuantity, //数量
      taskComment: record.taskComment, //备注
      main: record.main.toString(), //是否为主要
      visible: true,
      addState: 0
    });
  }
  downImg() {
    const data = this.props.orderData;
    let num = 0;
    for (
      let i = 0;
      i <
      splitUrl(
        data.contractPictureUrl,
        ",",
        globalConfig.avatarHost + "/upload"
      ).length;
      i++
    ) {
      if (
        splitUrl(
          data.contractPictureUrl,
          ",",
          globalConfig.avatarHost + "/upload"
        )[i].url == this.state.previewImage
      ) {
        num = i;
      }
    }
    if (
      num ==
      splitUrl(
        data.contractPictureUrl,
        ",",
        globalConfig.avatarHost + "/upload"
      ).length -
        1
    ) {
      return message.warning("已经是最后一张了哦");
    }
    this.state.previewImage = splitUrl(
      data.contractPictureUrl,
      ",",
      globalConfig.avatarHost + "/upload"
    )[num + 1].url;
    this.setState({
      previewImage: this.state.previewImage,
      rotateDeg: 0
    });
  }
  upImg() {
    const data = this.props.orderData;
    let num = 0;
    for (
      let i = 0;
      i <
      splitUrl(
        data.contractPictureUrl,
        ",",
        globalConfig.avatarHost + "/upload"
      ).length;
      i++
    ) {
      if (
        splitUrl(
          data.contractPictureUrl,
          ",",
          globalConfig.avatarHost + "/upload"
        )[i].url == this.state.previewImage
      ) {
        num = i;
      }
    }
    if (num == 0) {
      return message.warning("已经是第一张了哦");
    }
    this.state.previewImage = splitUrl(
      data.contractPictureUrl,
      ",",
      globalConfig.avatarHost + "/upload"
    )[num - 1].url;
    this.setState({
      previewImage: this.state.previewImage,
      rotateDeg: 0
    });
  }
  downImgs() {
    const data = this.props.orderData;
    let num = 0;
    for (
      let i = 0;
      i <
      splitUrl(
        data.rep,
        ",",
        globalConfig.avatarHost + "/upload"
      ).length;
      i++
    ) {
      if (
        splitUrl(data.agreementUrl, ",", globalConfig.avatarHost + "/upload")[i]
          .url == this.state.previewImage
      ) {
        num = i;
      }
    }
    if (
      num ==
      splitUrl(data.agreementUrl, ",", globalConfig.avatarHost + "/upload")
        .length -
        1
    ) {
      return message.warning("已经是最后一张了哦");
    }
    this.state.previewImage = splitUrl(
      data.agreementUrl,
      ",",
      globalConfig.avatarHost + "/upload"
    )[num + 1].url;
    this.setState({
      previewImage: this.state.previewImage,
      rotateDeg: 0
    });
  }
  upImgs() {
    const data = this.props.orderData;
    let num = 0;
    for (
      let i = 0;
      i <
      splitUrl(data.agreementUrl, ",", globalConfig.avatarHost + "/upload")
        .length;
      i++
    ) {
      if (
        splitUrl(data.agreementUrl, ",", globalConfig.avatarHost + "/upload")[i]
          .url == this.state.previewImage
      ) {
        num = i;
      }
    }
    if (num == 0) {
      return message.warning("已经是第一张了哦");
    }
    this.state.previewImage = splitUrl(
      data.agreementUrl,
      ",",
      globalConfig.avatarHost + "/upload"
    )[num - 1].url;
    this.setState({
      previewImage: this.state.previewImage,
      rotateDeg: 0
    });
  }
  // 拆分详细
  showRes(record) {
    this.setState({
      resVisible: true,
      resRecord: record
    })
  }
  resCancel() {
    this.setState({
      resVisible: false
    })
  }
  render() {
    const formItemLayout = {
      labelCol: { span: 8 },
      wrapperCol: { span: 14 }
    };
    const data = this.props.orderData;
    const propsList = this.props.contactList || [];
    return (
      
        {this.state.resVisible ? (
          
        ) : (
          ""
        )}
        
          {data.orderNo}
        
        
          {data.contractNo}
        
        
          {data.userName}
        
        
          {data.signDate}
        
        
          {getProcessStatus(data.processStatus)}
        
        
          {getLiquidationStatus(data.liquidationStatus)}
        
        
          {/* {data.contacts} */}
          {this.props.isCaiWu ? "***" : data.contacts}
        
        
          {/* {data.contactMobile} */}
          {this.props.isCaiWu ? "***" : data.contactMobile}
        
        
          {this.props.isCaiWu ? "***" : data.legalPerson}
        
        
          {/* {data.legalPersonTel} */}
          {this.props.isCaiWu ? "***" : data.legalPersonTel}
        
        
          
            {this.props.processState === 2 ? "***" : data.totalAmount}
          
        
        
          
            {this.props.processState === 2 ? "***" : data.firstAmount}
          
        
        
          {getApprovedState(data.approval)}
        
        
          
            {this.props.processState === 2 ? "***" : data.settlementAmount}
          
        
        
          {data.depName}
        
        
          {data.outsource == 0 ? "否" : "是"}
        
        
        
          
            {/* {*/}
            {/*    this.setState({*/}
            {/*      previewImage: file.url || file.thumbUrl,*/}
            {/*      previewVisible: true,*/}
            {/*    });*/}
            {/*  }}*/}
            {/*/>*/}
            {this.props.orderData && data.contractPictureUrl ?
                 :
                
            }
             {
                this.state.rotateDeg = 0;
                this.setState({
                  previewVisible: false,
                  rotateDeg: this.state.rotateDeg,
                });
              }}
            >
               {/* {*/}
            {/*    this.setState({*/}
            {/*      previewImage: file.url || file.thumbUrl,*/}
            {/*      previewVisibles: true,*/}
            {/*    });*/}
            {/*  }}*/}
            {/*/>*/}
            
             {
                this.state.rotateDeg = 0;
                this.setState({
                  previewVisibles: false,
                  rotateDeg: this.state.rotateDeg,
                });
              }}
            >
              
              
              
            
            
          
          
            {/* {*/}
            {/*    this.setState({*/}
            {/*      previewImage: file.url || file.thumbUrl,*/}
            {/*      previewVisibles: true,*/}
            {/*    });*/}
            {/*  }}*/}
            {/*/>*/}
            
             {
                this.state.rotateDeg = 0;
                this.setState({
                  previewVisibles: false,
                  rotateDeg: this.state.rotateDeg,
                });
              }}
            >
               
              
              
              
            
          
         
        
          
            {data.salesmanName}
          
          
            {data.salesmanMobile}
          
        
        
          
            {data.nowFinance}
          
          
            {data.nowFinanceMobile}
          
        
        
          
            {data.oldSalesmanName}
          
          
            {data.oldSalesmanMobile}
          
        
        
          
            {data.financeName}
          
          
            {data.financeMobile}
          
        
        
          项目业务
        
        
        
          催款节点
          
            金额总计(万元): {this.props.totalCui}