import React, { Component } from "react"
import { View, Text, TouchableOpacity, StyleSheet, Modal, ListView } from 'react-native';
import DatePicker from 'react-native-datepicker';

import BaseFunc from '../base/func';
import BaseSupport from '../base/support';
import { IformState, IformProp, IformOption } from '../aim/form'
import OperateForm from '../operate/form'
import PlusItemBook from '../item/book'


interface State extends IformState {


}

interface Prop extends IformProp {




}

export default class extends Component<Prop, State>{




    constructor(props: Prop) {
        super(props);


        let sDefaultValue = '';
        if (this.props.formDefaultValue != undefined) {
            sDefaultValue = BaseSupport.upDate(undefined, this.props.formDefaultValue);
        }

        var sValue = OperateForm.upFormValue(props.name, sDefaultValue);
        //moment().format()


        OperateForm.inRegexField(props.name, props.formRegexCode);
        this.state = { currentValue: sValue }
    }
    componentDidMount() {

    }



    render() {
        if (OperateForm.upFormType(this.props.name) === "book") {

            return (

                <PlusItemBook pText={this.state.currentValue}>
                </PlusItemBook>

            );

        }

        else {


            let sShowType = BaseFunc.stringEmptyDefault(this.props.formShowType, "datetime");

            let sFormat = "YYYY-MM-DD HH:mm:ss";
            if (sShowType === "date") {
                sFormat = "YYYY-MM-DD";
            } else if (sShowType === "time") {
                sFormat = "HH:mm:ss";
            }


            return (
                <View style={{ flex: 1 }}>
                    <DatePicker
                        style={{ width: 200 }}
                        date={this.state.currentValue}
                        mode={sShowType}
                        placeholder={BaseFunc.upLang(12041)}
                        format={sFormat}
                        showIcon={false}
                        //minDate="2016-05-01"
                        //maxDate="2016-06-01"
                        confirmBtnText={BaseFunc.upLang(12001)}
                        cancelBtnText={BaseFunc.upLang(12002)}
                        customStyles={{

                            dateTouch: { width: 100 },
                            dateInput: { borderWidth: 0, alignItems: 'flex-start', paddingLeft: 5 }
                            // ... You can check the source to find the other keys.
                        }}
                        onDateChange={(date) => { this.setState({ currentValue: date }); OperateForm.inFormValue(this.props.name, date); }}
                    />
                </View>

            );
        }
    }


}