import React, { Component } from "react";
import {
  message,
  Button,
} from "antd";
import $ from "jquery/src/ajax";
import ReactDOM from 'react-dom';
import ProgressDetail from './progressDetail';
import './progress.less';
import Print from './progress/index'

class MyComponent extends Component {
  constructor(props) {
    super(props);
    this.state = {
      data: {},
      options: {
        noPrint: '.no-print',
        type: 'window',
      },
    }
    this.onSelect = this.onSelect.bind(this);
  }

  onSelect() {
    this.setState({
      loading: true,
    })
    $.ajax({
      method: 'get',
      dataType: 'json',
      crossDomain: false,
      url: globalConfig.context + '/api/admin/taskDetails/logDetails',
      data: {
        id: this.props.id,
      },
      success: function (data) {
        if (data.error && data.error.length) {
          message.warning(data.error[0].message)
        } else {
          let obj = data.data
          this.setState({
            data: obj,
          }, () => {
            Print(this.printTemp)
          })
        }
      }.bind(this),
    }).always(
      function () {
        this.setState({
          loading: false,
        })
      }.bind(this)
    )
  }

  render() {
    return (
      <div>
        <Button type="primary"
          onClick={this.onSelect}
        >查看</Button>
        <div
          style={{ display: 'none' }}
        >
          <div
            ref={ref => {
              this.printTemp = ref;
            }}
          >
            <ProgressDetail data={this.state.data} />
          </div>
        </div>
      </div>
    );
  }
}

export default MyComponent;