import { message } from "antd/lib/index";
import {
  Button,
  Popconfirm,
  Row,
  Col,
  Form,
  Input,
  Select,
  Table,
  Modal,
  Icon,
  DatePicker
} from "antd";
import React from "react";
import {
  initFilter,
  extendRule,
  ShowDateTime,
  setDataFieldValue,
  guid,
  initQueryFilter
} from "../../../utils/common";
import ReactToPrint from "react-to-print";
import { connect } from "dva";
import moment from "moment";
import FormPage from "../../FormPage";
class WB052ShowPrint extends React.Component {
  constructor(props) {
    super(props);
    var dtS = this.props.data.parentRecord.START_TIME_S
    var dtE = this.props.data.parentRecord.START_TIME_E
    if (dtS == undefined || dtS == '')
      dtS = ShowDateTime(new Date(), 'yyyy-01-01 00:00:00')
    if (dtE == undefined || dtE == '')
      dtE = ShowDateTime(new Date(), 'yyyy-MM-dd 23:59:59')

    this.state = {
      selectStartTime: moment(dtS),
      selectEndTime: moment(dtE),
      tableColumns: [
        {
          title: "序号",
          dataIndex: "ROW_NO",
          key: "ROW_NO",
          align: "center",
          render: (text, record, index) => {
            return index + 1;
          }
        },
        {
          title: "生产单元",
          dataIndex: "MineTypeSHOW",
          key: "MineTypeSHOW",
          align: "center"
        },
        {
          title: "检查区域",
          dataIndex: "AREANAME",
          key: "AREANAME",
          align: "center"
        },
        {
          title: "检查内容",
          dataIndex: "CHECK_CONTENT",
          key: "CHECK_CONTENT",
          align: "center"
        },
        {
          title: "隐患数",
          dataIndex: "RISKCOUNT",
          key: "RISKCOUNT",
          align: "center",
          // render: (text, record) => {
          //   if (record.TRAIN_MODEL != "笔试") {
          //     return "";
          //   } else {
          //     return text;
          //   }
          // }
        },
        {
          title: "查看",
          dataIndex: "viewPaper",
          key: "viewPaper",
          align: "center",
          render: (text, record) => {
            if (record.RISKCOUNT != 0) {
              return <Icon
                onClick={() =>
                  this.showDetailModal(record.ID, dtS, dtE)}
                type="eye"
                style={{ color: "#005b9b", cursor: "pointer" }}
              />;
            }
          }
        }
      ],
      data: null,
      //弹窗参数
      detailForm: {
        isShow: false,
        formCode: "WB053_SHOWPRINT",
        title: "明细查看",
        ID: ""
      },
      trainData: {
        value: 1,
        reason: ""
      }
    };
  }

  componentDidMount() {
    this.loadData();
  }

  BtnClose = () => {
    if (
      typeof this.props.data.onCancel != "undefined" &&
      typeof this.props.data.onCancel == "function"
    )
      this.props.data.onCancel();
  };
  loadData = () => {
    let startTime = this.state.selectStartTime.format("YYYY-MM-DD 00:00:00");
    let endTime = this.state.selectEndTime.format("YYYY-MM-DD 23:59:59");
    let json = initFilter(this.props.login.OrgId, this.props.data.id);
    extendRule(json, "CREATE_TIME", 6, startTime);
    extendRule(json, "CREATE_TIME", 4, endTime);
    json.Parameter1 = this.props.data.parentRecord.CODE;
    this.props.dispatch({
      type: "app/getDataByPost",
      payload: json,
      url: "WB/WBSafeCheckRecord/GetProjectRisk",
      onComplete: ret => {
        if (ret) {
          this.setState({
            data: ret
          });
        }
      }
    });
  };
  showDetailModal = (ID, dtS, dtE) => {
    const newtmpData = {
      data: {
        id: ID,
        dtS: dtS,
        dtE: dtE
      },
      formCode: "WB053_SHOWPRINT"
    };
    this.setState({ tmpData: newtmpData }, () => {
      var detailForm = {
        isShow: true,
        title: "隐患整改记录"
      };
      this.setState({
        detailForm: detailForm
      });
    });
  };
  //详情弹窗关闭（隐藏）
  detailFormClose = () => {
    var detailForm = {
      isShow: false
    };
    this.setState({
      detailForm: detailForm
    });
  };
  startChange = value => {
    this.setState({
      selectStartTime: value,
      startTime: value.format("YYYY-MM-DD")
    });
  };
  endChange = value => {
    this.setState({
      selectEndTime: value,
      endTime: value.format("YYYY-MM-DD")
    });
  };
  render() {
    const { data, tableColumns } = this.state;
    return (
      <div>
        <div style={{ padding: "10px" }}>
          <ReactToPrint
            trigger={() =>
              <Button type={"primary"} icon={"printer"}>
                打印
              </Button>}
            content={() => this.componentRef}
          />
          <span style={{ float: "right" }}>
            <span
              style={{
                marginLeft: "20px"
              }}
            >
              <b>开始时间：</b>
              <DatePicker
                style={{ width: "150px" }}
                value={this.state.selectStartTime}
                format="YYYY-MM-DD"
                onChange={this.startChange}
              />
            </span>
            <span
              style={{
                marginLeft: "20px"
              }}
            >
              <b>结束时间：</b>
              <DatePicker
                style={{ width: "150px" }}
                value={this.state.selectEndTime}
                format="YYYY-MM-DD"
                onChange={this.endChange}
              />
            </span>
            <span style={{ width: "100px", marginLeft: "20px", marginRight: "10px" }}>
              <Button
                onClick={() => this.loadData()}
                style={{ width: "80px" }}
                type="primary"
              >
                查询
              </Button>
            </span>
          </span>
        </div>

        <div ref={el => (this.componentRef = el)}>
          {
            <Table
              dataSource={data}
              columns={tableColumns}
              pagination={false}
              bordered
              size="small"
            />
          }
        </div>
        <div style={{ display: "inline-block" }}>
          <Modal
            visible={this.state.detailForm.isShow}
            title={this.state.detailForm.title}
            maskClosable={false}
            closeModal={this.detailFormClose}
            onCancel={this.detailFormClose}
            footer={null}
            width="95%"
          >
            <FormPage {...this.state.tmpData} />
          </Modal>
        </div>
      </div>
    );
  }
}

export default connect(({ login, app }) => ({ login, app }))(WB052ShowPrint);