import React from 'react';
import { connect } from 'dva';
import { Button, Steps } from 'antd';
import { routerRedux } from 'dva/router';
import RegNotice from './regNotice';
import Base from './base';
import Qualify from './qualify';
import Item from './item';
import SelfIntroduce from './selfIntroduce';
import GegSuccess from './regSuccess';
import styles from './index.less';

const Step = Steps.Step;


const Register = ({ dispatch, register, loading }) => {
  const { current,  formData } = register;

  const steps = [{
    title: '用户须知',
    content: < RegNotice />,
  }, {
    title: '基础信息',
    content: < Base />,
  }, {
    title: '资质证明',
    content: < Qualify />,
  },{
    title: '品类信息',
    content: < Item />,
  }, {
    title: '自我介绍',
    content: < SelfIntroduce />,
  }, {
    title: '注册成功',
    content: < GegSuccess />,
  }];

  const domain = 'register';

  const handleSave = () => {
    dispatch({ type: `${domain}/save`,});

  };

  const prev = () => {
    dispatch({
      type: `${domain}/minusCurrent`,
    });
  };

  const next = () => {
    // formUtils.validateForm([...supp,], Object.assign(getDefaultValues(), formData),() => {
    //   //dispatch({ type: `${domain}/save`, payload: getDefaultValues() });
    //   dispatch(routerRedux.push(`/register/qualify`));
    // });
    dispatch({
      type: `${domain}/addCurrent`,
    });
  };

  const handleLogin = () => {
    dispatch(routerRedux.push(`/login`));
  };

  return (
    <div className={styles.registerBox}>
      <Steps current={current} >
        {steps.map(item => <Step key={item.title} title={item.title} />)}
      </Steps >
      <div className={styles.registerContent}>{steps[current].content}</div>
      <div className={styles.registerButton}>
        {/*{
          current < steps.length - 1
          && current === 0
          &&
          <Button type="primary" onClick={next}>同意注册</Button>
        }*/}
        {/*{
          current < steps.length - 2
          && current > 0
          &&
          <Button type="primary" onClick={next}>下一步</Button>
        }
        {
          current === steps.length - 2
          &&
          <Button type="primary" onClick={handleSave}>提交</Button>
        }
        {
          current > 0
          &&  current < steps.length - 1
          &&
          <Button style={{ marginLeft: 8 }} onClick={prev}> 返回 </Button>
        }*/}
        {
          current === steps.length - 1
          &&
          <Button type="primary" style={{ marginLeft: 8 }} onClick={handleLogin}> 登录 </Button>
        }

      </div>
    </div>
  );
};

export default connect(({ register, loading }) => ({ register, loading }))(Register);
