/**
 * Created by zhouhuan on 2017/10/30.
 */
import React from 'react';
import { createForm } from 'rc-form';
import { View, StyleSheet, Text, ScrollView } from 'react-native';
import { Card, WingBlank, WhiteSpace, List, InputItem, Button } from 'antd-mobile';
import { connect } from 'react-redux';
import { createAction } from '../../../utils';

@connect(({ obligeeInfo, ListHouse }) => ({ obligeeInfo, ListHouse }))
class ObligeeInfo extends React.Component {
  componentDidMount() {
    const { houseID } = this.props.ListHouse;
    this.props.dispatch(createAction('obligeeInfo/getObligeeInfo')(houseID));
  }
  onPress = () => {
    const ID = this.props.obligeeInfo.sourceData.id;
    this.props.dispatch(createAction('obligeeInfo/getObligeeDetail')(ID));
  };
  onEdit =() => {
    this.props.dispatch(createAction('obligeeInfo/setStatus')(true));
  };
  onSubmit = () => {
    this.props.form.validateFields({ force: true }, (error, value) => {
      if (!error) {
        this.props.dispatch(createAction('obligeeInfo/updateDSRDetail')({ id: this.props.obligeeInfo.sourceData.id, singularData: value }));
      } else {
        console.log('Validation failed');
      }
    });
  };
  onEditBack = () => {
    const { houseID } = this.props.ListHouse;
    this.props.dispatch(createAction('obligeeInfo/onEBack')(houseID));
  };
  render() {
    const { sourceData, isDetail, detailData, editable, disabled } = this.props.obligeeInfo;
    const { getFieldProps } = this.props.form;
    if (isDetail === false) {
      return (
        <ScrollView >
          <WingBlank size="lg">
            <WhiteSpace size="lg" />
            <Card>
              <Card.Header
                title={sourceData.dangShiRenXingMing}
                extra={<Text style={Styles.cardText} onPress={this.onPress}>&gt;&gt;详情</Text>}
              />
              <Card.Body>
                <Text style={Styles.cardBodyText}>当事人编号:<Text style={Styles.cardBodyText2}>{sourceData.dangShiRenBianHao}</Text></Text>
                <Text style={Styles.cardBodyText}>证件号码:<Text style={Styles.cardBodyText2}>{sourceData.dangShiRenIdentityCard}</Text></Text>
              </Card.Body>
            </Card>
            <WhiteSpace size="lg" />
          </WingBlank>
        </ScrollView >
      );
    } else {
      return (
        <ScrollView>
          <List>
            <InputItem
              {...getFieldProps('dangShiRenXingMing', {
                initialValue: detailData.dangShiRenXingMing,
                rules: [
                  { required: true, message: '不允许为空' },
                  { validator: this.validateFWBianMa },
                ],
              })}
              clear
              placeholder="请输入"
              editable={editable}
              ref={(el) => { this.customFocusInst = el; }}
            >
              姓名
            </InputItem>
            <InputItem
              {...getFieldProps('dangShiRenXingBie', {
                initialValue: detailData.dangShiRenXingBie,
              })}
              clear
              placeholder="请输入"
              editable={editable}
              ref={(el) => { this.customFocusInst = el; }}
            >
              性别
            </InputItem>
            <InputItem
              {...getFieldProps('dangShiRenTelephone', {
                initialValue: detailData.dangShiRenTelephone,
              })}
              clear
              placeholder="请输入"
              editable={editable}
              ref={(el) => { this.customFocusInst = el; }}
            >
              电话号码
            </InputItem>
            <InputItem
              {...getFieldProps('dangShiRenIdentityCard', {
                initialValue: detailData.dangShiRenIdentityCard,
              })}
              clear
              placeholder="请输入"
              editable={editable}
              ref={(el) => { this.customFocusInst = el; }}
            >
              身份证号码
            </InputItem>
            <InputItem
              {...getFieldProps('dangShiRenIdentityCardbak', {
                initialValue: detailData.dangShiRenIdentityCardbak,
              })}
              clear
              placeholder="请输入"
              editable={editable}
              ref={(el) => { this.customFocusInst = el; }}
            >
              身份证类型
            </InputItem>
            <InputItem
              {...getFieldProps('dangShiRenAddress', {
                initialValue: detailData.dangShiRenAddress,
              })}
              clear
              placeholder="请输入"
              editable={editable}
              ref={(el) => { this.customFocusInst = el; }}
            >
              地址
            </InputItem>
            <InputItem
              {...getFieldProps('DSRMaritalStatus', {
                initialValue: detailData.DSRMaritalStatus,
              })}
              clear
              placeholder="请输入"
              editable={editable}
              ref={(el) => { this.customFocusInst = el; }}
            >
              婚姻状态
            </InputItem>
            <InputItem
              {...getFieldProps('DSRCensusType', {
                initialValue: detailData.DSRCensusType,
              })}
              clear
              placeholder="请输入"
              editable={editable}
              ref={(el) => { this.customFocusInst = el; }}
            >
              是否原村民
            </InputItem>
            <List.Item>
              <View style={{ flexDirection: 'row' }}>
                <Button style={{ marginRight: 8 }} type="primary" onClick={this.onEdit}>编辑</Button>
                <Button style={{ marginRight: 8 }} onClick={this.onSubmit} disabled={disabled}>保存</Button>
                <Button onClick={this.onEditBack}>返回</Button>
              </View>
            </List.Item>
          </List>
        </ScrollView>
      );
    }
  }
}
const Styles = StyleSheet.create({
  cardText: {
    color: '#2196F3',
    textAlign: 'right',
  },
  cardBodyText: {
    marginBottom: 10,
    marginLeft: 13,
  },
});
export default createForm()(ObligeeInfo);
