MemoForm.js 2.02 KB
Newer Older
1
2
import React from 'react';
import { Button, View, TouchableWithoutFeedback, Keyboard } from 'react-native';
YoonDongMin's avatar
YdM    
YoonDongMin committed
3
4
5
import { globalStyles } from '../styles/global.js'
import { Formik } from 'formik';
import * as yup from 'yup';
YoonDongMin's avatar
YDm    
YoonDongMin committed
6
7
import DatePicker from '../components/DatePicker.js';
import InputBox from '../components/InputBox.js';
8
import { getDateStr } from '../utils/dateFunction';
YoonDongMin's avatar
YdM    
YoonDongMin committed
9
10

const ReviewSchema = yup.object({
11
12
    date: yup.string()
        .required(),
YoonDongMin's avatar
YDm    
YoonDongMin committed
13
    message: yup.string()
YoonDongMin's avatar
YdM    
YoonDongMin committed
14
15
16
17
18
        .required()
        .min(2),

})

19
20
21
const getDates = () => {
    const date = new Date();
    return (getDateStr(date))
YoonDongMin's avatar
YDm    
YoonDongMin committed
22
}
YoonDongMin's avatar
YdM    
YoonDongMin committed
23
24
25
26
27
28
29
30

function MemoForm({ addInfo }) {
    return (
        <TouchableWithoutFeedback onPress={() => {
            Keyboard.dismiss();
        }}>
            <View style={globalStyles.container} >
                <Formik
YoonDongMin's avatar
YDm    
YoonDongMin committed
31
                    initialValues={{ date: '', message: '' }}
YoonDongMin's avatar
YdM    
YoonDongMin committed
32
                    validationSchema={ReviewSchema}
33
                    onSubmit={(values) => {
YoonDongMin's avatar
YdM    
YoonDongMin committed
34
35
36
37
38
39
                        addInfo(values);
                    }}

                >
                    {({ handleChange, handleSubmit, values }) => (
                        <View>
YoonDongMin's avatar
YDm    
YoonDongMin committed
40
41
                            <DatePicker
                                inputTitle='날짜'
42
                                date={values.date || getDates()}
YoonDongMin's avatar
YDm    
YoonDongMin committed
43
                                setDate={handleChange('date')}
YoonDongMin's avatar
YdM    
YoonDongMin committed
44
                            />
YoonDongMin's avatar
YDm    
YoonDongMin committed
45
46
47
48
                            <InputBox
                                inputTitle="내용"
                                onChangeText={handleChange('message')}
                                value={values.message}
YoonDongMin's avatar
YdM    
YoonDongMin committed
49
50

                            />
YoonDongMin's avatar
YDm    
YoonDongMin committed
51
52
53
                            <View style={{ marginVertical: '10%', marginHorizontal: 10 }}>
                                <Button title='입력' color='dodgerblue' onPress={handleSubmit} />
                            </View>
YoonDongMin's avatar
YdM    
YoonDongMin committed
54
55
56
57
58
59
60
61
62
63
64
                        </View>
                    )}

                </Formik>

            </View >
        </TouchableWithoutFeedback>
    )
}

export default MemoForm;