kede-client/js/component/common/nowProjectStatus/index.jsx

import React, { Component } from "react";
import { Button, DatePicker, Input, message, Modal, Radio } from "antd";
import {
  highTechColumns, //高新
  highTechColumnsVIP, //高新会员
  science, //科技
  patent, //专利
  currency, //软著和通用
} from "./type";
import moment from "moment";
import $ from "jquery";
import { splitUrl } from "@/tools";
import ImgList from "../imgList";

class NowProjectStatus extends Component {
  constructor(props) {
    super(props);
    this.state = {
      projectStatus: parseInt(props.projectStatus),
      list:
        props.cSort === 3
          ? science
          : props.cSort === 6
          ? highTechColumnsVIP
          : props.projectType === 0 ||
            props.projectType === 2 ||
            props.projectType === 3 ||
            props.projectType === 4 ||
            props.projectType === 6
          ? currency
          : props.projectType === 1
          ? patent
          : props.projectType === 5
          ? highTechColumns
          : [], //projectType  0 正常 1专利 2软著 3审计 4双软 5高新 6商标   cSort: 3 科技项目  6: 会员
      dataInfor: Object.assign({}, props.projectTypeJSON),
      loading: false,
      fileList: [],
      value8: 0,
    };
  }

  updateProjectStatus() {
    let arr = this.state.list.filter((v) => v.id === this.state.projectStatus);
    let dataInforLength = this.state.dataInfor[this.state.projectStatus]
      ? Object.keys(this.state.dataInfor[this.state.projectStatus]).length
      : 0;
    if (
      this.state.dataInfor[this.state.projectStatus] &&
      this.state.dataInfor[this.state.projectStatus]["title"]
    ) {
      dataInforLength -= 1;
    }
    if (
      this.state.dataInfor[this.state.projectStatus] &&
      this.state.dataInfor[this.state.projectStatus]["suspendImg"]
    ) {
      dataInforLength -= 1;
    }
    if (
      arr.length !== 0 &&
      arr[0]["valueType"] &&
      dataInforLength !== arr[0]["valueType"].length
    ) {
      arr[0]["valueType"].map((v) => {
        if (!this.state.dataInfor[this.state.projectStatus][v]) {
          if (v === "date") {
            message.warning("请将" + arr[0]["name"] + "时间补充完整");
          }
          if (v === "certificateNumber") {
            message.warning("请将" + arr[0]["name"] + "的证书编号补充完整");
          }
          if (v === "setUpAmount") {
            message.warning("请将" + arr[0]["name"] + "的立项金额补充完整");
          }
          if (v === "appropriation") {
            message.warning("请将" + arr[0]["name"] + "的拨款金额补充完整");
          }
          return false;
        }
      });
      return false;
    }
    if (
      (this.state.projectStatus === 2 || this.state.projectStatus === 3) &&
      this.state.fileList.length === 0
    ) {
      message.warning("暂停附件未上传,请上传后保存!");
      return false;
    }
    this.setState({
      loading: true,
    });
    if (this.state.projectStatus === 2 || this.state.projectStatus === 3) {
      if (this.state.fileList.length) {
        let picArr = [];
        this.state.fileList.map(function (item) {
          if (
            item.response &&
            item.response.data &&
            item.response.data.length
          ) {
            picArr.push(item.response.data);
          }
        });
        if (!this.state.dataInfor[2]) {
          this.state.dataInfor[2] = {};
        }
        if (!this.state.dataInfor[3]) {
          this.state.dataInfor[3] = {};
        }
        this.state.dataInfor[2]["suspendImg"] = picArr.join(",");
        this.state.dataInfor[3]["suspendImg"] = picArr.join(",");
      }
    }
    let data = Object.assign({}, this.state.dataInfor);
    Object.keys(data).map((v) => {
      if (Object.keys(data[v]).length === 0) {
        delete data[v];
      }
    });
    if (data[this.state.projectStatus]) {
      data[this.state.projectStatus]["title"] =
        arr[0]["label"] || arr[0]["name"];
    }
    let obj = {
      tid: this.props.tid,
      projectStatus: this.state.projectStatus,
      timeRecord: JSON.stringify(data),
    };
    if (arr[0]["valueType"]) {
      //证书编号
      let type = arr[0]["valueType"].filter((v) => v === "certificateNumber");
      if (type.length > 0) {
        obj.certificateNumber =
          this.state.dataInfor[this.state.projectStatus]["certificateNumber"];
      }
      //立项金额
      let type1 = arr[0]["valueType"].filter((v) => v === "setUpAmount");
      if (type1.length > 0) {
        obj.setUpAmount =
          this.state.dataInfor[this.state.projectStatus]["setUpAmount"];
      }
    }
    $.ajax({
      url: globalConfig.context + "/api/admin/orderProject/updateProjectStatus",
      method: "post",
      data: obj,
    }).done(
      function (data) {
        this.setState({
          loading: false,
        });
        if (!data.error.length) {
          message.success("保存成功！");
          this.props.onPreservation(this.state.projectStatus);
        } else {
          message.warning(data.error[0].message);
        }
      }.bind(this)
    );
  }

  componentDidMount() {
    /*旧数据处理
     * endDate           完成时间      对应已提交时间     4
     * acceptDate        受理时间      对应已推荐时间     6
     * publicityDate     公示时间      对应已拟公示时间   8
     * licenceDate       发证时间      对应已下证时间     10
     * setUpAmount       立项金额                      15
     * */
    const { endDate, acceptDate, publicityDate, licenceDate, setUpAmount } =
      this.props.oldData;
    if (!this.props.projectTypeJSON[4] && endDate) {
      this.state.dataInfor[4] = { title: "完成时间" };
      this.state.dataInfor[4]["date"] = endDate;
    }
    if (!this.props.projectTypeJSON[6] && acceptDate) {
      this.state.dataInfor[6] = { title: "受理时间" };
      this.state.dataInfor[6]["date"] = acceptDate;
    }
    if (!this.props.projectTypeJSON[8] && publicityDate) {
      this.state.dataInfor[8] = { title: "公示时间" };
      this.state.dataInfor[8]["date"] = publicityDate;
    }
    if (!this.props.projectTypeJSON[10] && licenceDate) {
      this.state.dataInfor[10] = { title: "发证时间" };
      this.state.dataInfor[10]["date"] = licenceDate;
    }
    // if((!this.props.projectTypeJSON[15]) && setUpAmount){
    //     this.state.dataInfor[15]={title:'立项金额'};
    //     this.state.dataInfor[15]['setUpAmount'] = setUpAmount;
    // }
    //图片
    if (
      this.props.projectTypeJSON[2] &&
      this.props.projectTypeJSON[2]["suspendImg"]
    ) {
      this.setState({
        fileList: splitUrl(
          this.props.projectTypeJSON[2]["suspendImg"],
          ",",
          globalConfig.avatarHost + "/upload"
        ),
      });
    } else {
      this.setState({
        fileList: [],
      });
    }
    this.setState({
      dataInfor: this.state.dataInfor,
    });
  }

  render() {
    return (
      <Modal
        className="customeDetails"
        footer=""
        title=""
        width="700px"
        visible={this.props.visible}
        onOk={() => {
          this.props.onCancel();
        }}
        onCancel={() => {
          this.props.onCancel();
        }}
      >
        <div>
          <div
            style={{
              paddingBottom: "15px",
              fontSize: "18px",
              fontWeight: "bolder",
            }}
          >
            项目状态:
          </div>
          <div>
            <Radio.Group
              style={{
                dispaly: "flex",
                flexRow: "column",
              }}
              value={parseInt(this.state.projectStatus)}
              onChange={(e) => {
                if (e.target.value == 8) {
                  this.setState({
                    value8: 1,
                  });
                }
                // console.log(this.state.list);
                if (!this.state.dataInfor[e.target.value]) {
                  this.state.dataInfor[e.target.value] = {};
                }
                this.state.dataInfor[this.state.projectStatus] =
                  this.props.projectTypeJSON[this.state.projectStatus] || {};
                this.setState({
                  projectStatus: e.target.value,
                  dataInfor: this.state.dataInfor,
                });
              }}
            >
              {this.state.list.map((v, k) => (
                <div key={k} style={{ paddingBottom: "15px" }}>
                  <Radio value={v.id}>{v.name}</Radio>
                  {(v.valueType || []).map((d) =>
                    parseInt(this.state.projectStatus) !== parseInt(v.id) ? (
                      <span style={{ marginRight: "15px" }}>
                        {d === "appropriation"
                          ? "拨款金额(万元):"
                          : d === "certificateNumber"
                          ? "已出高新证书编号,编号:"
                          : d === "setUpAmount"
                          ? "立项金额(万元):"
                          : d === "exampleNumber"
                          ? "公式网络链接:"
                          : ""}
                        {this.state.dataInfor[v.id] &&
                          this.state.dataInfor[v.id][d]}
                      </span>
                    ) : d === "date" ? (
                      <div style={{ display: "inline-block" }}>
                        <DatePicker
                          style={{ marginRight: "5px", width: "120px" }}
                          showTime
                          format="YYYY-MM-DD"
                          onOk={() => {}}
                          value={
                            this.state.dataInfor[v.id] &&
                            this.state.dataInfor[v.id][d]
                              ? moment(this.state.dataInfor[v.id][d])
                              : null
                          }
                          onChange={(data, dataString) => {
                            // console.log(dataString);
                            if (!this.state.dataInfor[v.id]) {
                              this.state.dataInfor[v.id] = {};
                            }
                            if (!dataString && this.state.dataInfor[v.id][d]) {
                              delete this.state.dataInfor[v.id][d];
                            } else {
                              this.state.dataInfor[v.id][d] = dataString;
                            }
                            this.setState({
                              dataInfor: this.state.dataInfor,
                            });
                          }}
                        />
                      </div>
                    ) : d === "setUpAmount" ||
                      d === "certificateNumber" ||
                      d === "appropriation" ||
                      d === "exampleNumber" ? (
                      <span>
                        <span>
                          {d === "appropriation"
                            ? "拨款金额(万元)"
                            : d === "certificateNumber"
                            ? "已出高新证书编号,编号"
                            : d === "setUpAmount"
                            ? "立项金额(万元)"
                            : d === "exampleNumber"
                            ? "公式网络链接:"
                            : ""}
                        </span>
                        <Input
                          placeholder={v.placeholder}
                          value={
                            this.state.dataInfor[v.id]
                              ? this.state.dataInfor[v.id][d]
                              : ""
                          }
                          style={{ width: "120px", marginRight: "5px" }}
                          onChange={(e) => {
                            if (!this.state.dataInfor[v.id]) {
                              this.state.dataInfor[v.id] = {};
                            }
                            if (
                              !e.target.value &&
                              this.state.dataInfor[v.id][d]
                            ) {
                              delete this.state.dataInfor[v.id][d];
                            } else {
                              this.state.dataInfor[v.id][d] = e.target.value;
                            }
                            this.setState({
                              dataInfor: this.state.dataInfor,
                            });
                          }}
                        />
                      </span>
                    ) : null
                  )}
                  <span style={{ color: "#f00", marginLeft: "15px" }}>
                    {v.explain}
                  </span>
                </div>
              ))}
            </Radio.Group>
            {(this.state.projectStatus === 2 ||
              this.state.projectStatus === 3 ||
              this.state.fileList.length > 0) && (
              <div>
                <div
                  style={{
                    paddingTop: "20px",
                    paddingBottom: "10px",
                  }}
                >
                  <div>暂停附件:</div>
                  <div style={{ color: "#f00" }}>(请上传截图证明)</div>
                </div>
                <div
                  style={{
                    display:
                      this.state.projectStatus === 2 ||
                      this.state.projectStatus === 3
                        ? "block"
                        : "none",
                  }}
                >
                  <ImgList
                    domId="nowProjectStatus"
                    uploadConfig={{
                      action:
                        globalConfig.context +
                        "/api/admin/orderProject/uploadOrderTaskFile",
                      data: { sign: "order_task_file" },
                      multiple: true,
                      listType: "picture-card",
                    }}
                    onChange={(info) => {
                      let fileList = info.fileList;
                      this.setState({ fileList });
                    }}
                    fileList={this.state.fileList}
                  />
                </div>
                <div
                  style={{
                    display:
                      this.state.projectStatus === 2 ||
                      this.state.projectStatus === 3
                        ? "none"
                        : "block",
                  }}
                >
                  <ImgList
                    domId="nowProjectStatus1"
                    fileList={this.state.fileList}
                  />
                </div>
              </div>
            )}
            <div
              style={{
                display: "flex",
                justifyContent: "center",
                paddingTop: "20px",
                paddingBottom: "20px",
              }}
            >
              <Button
                loading={this.state.loading}
                className="cancel"
                type="ghost"
                onClick={() => {
                  this.updateProjectStatus();
                }}
              >
                保存
              </Button>
            </div>
            <div style={{ textAlign: "center", color: "#f00" }}>
              注:请根据实际项目情况填写
            </div>
          </div>
        </div>
      </Modal>
    );
  }
}

export default NowProjectStatus;