// 住院登记
import React from 'react';
import {List, InputItem, Picker, DatePicker, Button} from 'antd-mobile';
import { createForm } from 'rc-form';
import './style/index.less';

const Item = List.Item;
const nowTimeStamp = "2019-12-12"
const now = new Date(nowTimeStamp);

class HospitalRegistration extends React.Component {
  constructor({history}) {
    super();
    this.state = {
      dpValue: now,
    }
    this.history=history;
  }

  componentDidMount() {
    
  }

  // 提交
  handleSubmit = () => {
    this.props.form.validateFields({ force: true }, (error) => {
      if (!error) {
        console.log(this.props.form.getFieldsValue());
      } else {
        console.log(error);
      }
    });
  }
  
  render() {
    let {district} = this.state;
    const { getFieldProps } = this.props.form;
    let sexdata = [
      {
        label: '男',
        value: '1',
      },
      {
        label: '女',
        value: '2',
      },
      {
        label: '不详',
        value: '3',
      },
    ]
    return (
      <div className="electronic-health-card">
        <div style={{height: "100%", overflow: "auto"}} className="hospital-registration">
          <List className="margintop10">
            <Item extra={<span>未住院</span>}>当前住院号</Item>
          </List>
          <form>
            <List className="margintop10">
              <InputItem
                {...getFieldProps('name', {
                  initialValue: undefined,
                })}
              >姓名</InputItem>
              <InputItem
                {...getFieldProps('num', {
                  initialValue: undefined,
                })}
                // placeholder="0.00"
                extra={<i className="iconfont icon-zhaoxiangji"></i>}
              >身份证号</InputItem>
              <Picker data={sexdata} cols={1} 
                title="选择性别"
                {...getFieldProps('district3')}
              >
                <List.Item arrow="horizontal">性别</List.Item>
              </Picker>
              <DatePicker
                mode="date"
                {...getFieldProps('dp', {
                  initialValue: this.state.dpValue,
                  rules: [
                    { required: true, message: '请选择' },
                  ],
                })}
              >
                <List.Item arrow="horizontal">出生日期</List.Item>
              </DatePicker>
              <InputItem
                {...getFieldProps('age', {
                  initialValue: undefined,
                })}
              >年龄</InputItem>
              <Picker data={sexdata} cols={1} 
                title="选择婚姻状况"
                {...getFieldProps('hunyingchuanagkuang')}
              >
                <List.Item arrow="horizontal">婚姻状况</List.Item>
              </Picker>
              <InputItem
                {...getFieldProps('phone', {
                  initialValue: undefined,
                })}
                type="phone"
                // placeholder="186 1234 1234"
              >联系电话</InputItem>
              <Picker cols={1} 
                title="选择地区"
                extra="请选择(可选)"
                data={district}
                {...getFieldProps('suozaidiqu')}
              >
                <List.Item arrow="horizontal">所在地区</List.Item>
              </Picker>
              <InputItem
                {...getFieldProps('city', {
                  initialValue: undefined,
                })}
              >详细地址</InputItem>
              <Picker data={sexdata} cols={1} 
                title="选择病人类型"
                {...getFieldProps('type')}
              >
                <List.Item arrow="horizontal">病人类型</List.Item>
              </Picker>
              <Picker data={sexdata} cols={1} 
                title="选择身份标签"
                {...getFieldProps('biaoqian')}
              >
                <List.Item arrow="horizontal">身份标签</List.Item>
              </Picker>
            </List>
            <List className="margintop10">
              <InputItem
                {...getFieldProps('lianxiren', {
                  initialValue: undefined,
                })}
              >联系人姓名</InputItem>
              <Picker data={sexdata} cols={1} 
                title="选择关系"
                {...getFieldProps('guanxi')}
              >
                <List.Item arrow="horizontal">关系</List.Item>
              </Picker>
              <InputItem
                {...getFieldProps('lianxirenphone', {
                  initialValue: undefined,
                })}
                type="phone"
                // placeholder="186 1234 1234"
              >联系人手机</InputItem>
            </List>
            <div className="footer-bottom">
              <Button type="primary" onClick={this.handleSubmit}>提交</Button>
            </div>
          </form>
        </div>
      </div>
    )


  }
};
const HospitalRegistrationForm = createForm()(HospitalRegistration);
export default HospitalRegistrationForm;