import React from "react";
import { notNull } from "../../util/validate";
import { Button, Col, Row } from "antd";
import { WeaDialog, WeaError, WeaInput } from "ecCom";

export default class CopyModal extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      name: ""
    };
  }

  handleChange(value) {
    this.setState({ name: value });
  }

  handleSave() {
    if (!notNull(this.state.name)) {
      this.refs.weaError.showError();
      return;
    }
    this.props.onSave && this.props.onSave(this.state.name);
  }

  render() {
    const { name } = this.state;
    return (
      <WeaDialog
        style={{ width: 600 }}
        title="复制工资单"
        visible={this.props.visible}
        onCancel={() => {
          this.props.onCancel();
        }}
        buttons={[
          <Button type="primary" onClick={() => {
            this.handleSave();
          }}>保存</Button>
        ]}>
        <Row style={{display:"flex",alignItems: "center", padding: "16px 20px"}}>
          <Col span={6}>工资单名称</Col>
          <Col span={18}>
            <WeaError
              style={{ width: "100%" }}
              tipPosition="bottom"
              ref="weaError"
              error="请填写工资单名称">
              <WeaInput
                style={{ width: "100%" }}
                value={name}
                viewAttr={3}
                onChange={(value) => {
                  if (value === "") {
                    this.refs.weaError.showError();
                    return;
                  }
                  this.handleChange(value);
                }}/>
            </WeaError>
          </Col>
        </Row>
      </WeaDialog>
    );
  }
}