Commit 6aa8c061 authored by Choi Ga Young's avatar Choi Ga Young
Browse files

이전사항

parent 0af3e43b
import React, { useState, useEffect } from 'react';
import React from 'react';
import { Formik } from 'formik';
import Menu from '../Components/Menu';
import axios from 'axios';
import 'bootstrap/dist/css/bootstrap.css';
import * as Yup from 'yup';
function Apply() {
return (
......@@ -10,16 +12,30 @@ function Apply() {
<div className="container">apply
<Formik
initialValues={{
date: "20201003",
time: "시간",
room: "9-116",
name: "종윤",
date: '',
time: '',
room: '',
name: '',
_id: "5f786720c45bbf6c68899c51",
reason: "study hard",
member: "jinju rkyoung",
reason: '',
member: '',
approve: false,
num: 5,
}}
validationSchema={Yup.object({
date: Yup.string()
.required('날짜를 입력해주세요.'),
time: Yup.string()
.required('시간을 입력해주세요.'),
room: Yup.string()
.required('강의실 번호를 입력해주세요.'),
reason: Yup.string()
.required('대관목적을 입력해주세요.'),
name: Yup.string()
.required('대표자 성함을 입력해주세요.'),
member: Yup.string()
.required('이용자 성함을 입력해주세요.'),
})}
onSubmit={(values, { setSubmitting }) => {
axios({
method: 'post',
......@@ -40,14 +56,95 @@ function Apply() {
}}
>
{({
errors,
touched,
handleSubmit,
getFieldProps,
isSubmitting,
}) => (
<div className="row justify-content-center align-items-center">
<form onSubmit={handleSubmit} className="col-sm-3">
<div className="form-group mb-4">
<label>신청날짜</label>
<input
className={(touched.date && errors.date ? 'form-control is-invalid' : "form-control")}
type="number"
name="date"
{...getFieldProps('date')}
placeholder="2020mmdd"
/>
{touched.date && errors.date ? (
<div className="invalid-feedback text-left">{errors.date}</div>
) : null}
</div>
<div className="form-group mb-4">
<label>이용시간</label>
<input
className={(touched.time && errors.time ? 'form-control is-invalid' : "form-control")}
type="text"
name="time"
{...getFieldProps('time')}
placeholder="ex) 11:00~14:00"
/>
{touched.time && errors.time ? (
<div className="invalid-feedback text-left">{errors.time}</div>
) : null}
</div>
<div className="form-group mb-4">
<label>강의실</label>
<input
className={(touched.room && errors.room ? 'form-control is-invalid' : "form-control")}
type="text"
name="room"
{...getFieldProps('room')}
placeholder="bn-nnn"
/>
{touched.room && errors.room ? (
<div className="invalid-feedback text-left">{errors.room}</div>
) : null}
</div>
<div className="form-group mb-4">
<label>대관목적</label>
<input
className={(touched.reason && errors.reason ? 'form-control is-invalid' : "form-control")}
type="text"
name="reason"
{...getFieldProps('reason')}
placeholder="대관목적을 입력해 주세요."
/>
{touched.reason && errors.reason ? (
<div className="invalid-feedback text-left">{errors.reason}</div>
) : null}
</div>
<div className="form-group mb-4">
<label>대표자</label>
<input
className={(touched.name && errors.name ? 'form-control is-invalid' : "form-control")}
type="text"
name="name"
{...getFieldProps('name')}
placeholder="대표자 성함을 입력해 주세요"
/>
{touched.name && errors.name ? (
<div className="invalid-feedback text-left">{errors.name}</div>
) : null}
</div>
<div className="form-group mb-4">
<label>이용자</label>
<input
className={(touched.member && errors.member ? 'form-control is-invalid' : "form-control")}
type="text"
name="member"
{...getFieldProps('member')}
placeholder="이용자 성함을 입력해 주세요. "
/>
{touched.member && errors.member ? (
<div className="invalid-feedback text-left">{errors.member}</div>
) : null}
</div>
<button type="submit" className="btn btn-dark" disabled={isSubmitting}>
Sign Up
</button>
신청하기
</button>
</form>
</div>
)}
......
......@@ -34,7 +34,6 @@ ReactDOM.render(
<Redirect path="/" to="/" />
<Redirect path="/home" to="/" />
<Redirect path="/change/:id" to="/change"/>
<Redirect path="/check/:id" to="/check"/>
</Switch>
</Router>,
document.getElementById('root')
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment