Skip to content

GitLab

Commit ded7f980 authored by Ha YeaJin's avatar Ha YeaJin
Browse files

비염 너무 힘드러

parent 9e22fd14
Hide whitespace changes
Inline Side-by-side
server/client/src/Components/Menu.js
View file @ ded7f980
...@@ -41,7 +41,7 @@ function Menu() { ...@@ -41,7 +41,7 @@ function Menu() {
if (state) return <Redirect to="/" /> if (state) return <Redirect to="/" />
return ( return (
<MENU expand="md" variant="dark"> <MENU expand="md" variant="dark">
<Navbar.Brand href="#">대관 서비스</Navbar.Brand> <Navbar.Brand as={Link} to="/home">대관 서비스</Navbar.Brand>
<Navbar.Toggle aria-controls="basic-navbar-nav" /> <Navbar.Toggle aria-controls="basic-navbar-nav" />
<Navbar.Collapse id="basic-navbar-nav"> <Navbar.Collapse id="basic-navbar-nav">
<Nav className="mr-auto"> <Nav className="mr-auto">
......
server/client/src/Pages/ApplyPage.js
View file @ ded7f980
...@@ -2,9 +2,9 @@ import React, { useState, useEffect } from 'react'; ...@@ -2,9 +2,9 @@ import React, { useState, useEffect } from 'react';
import { Formik, Field, ErrorMessage, FieldArray } from 'formik'; import { Formik, Field, ErrorMessage, FieldArray } from 'formik';
import Menu from '../Components/Menu'; import Menu from '../Components/Menu';
import axios from 'axios'; import axios from 'axios';
import 'bootstrap/dist/css/bootstrap.css';
import * as Yup from 'yup'; import * as Yup from 'yup';
import { Redirect } from 'react-router-dom'; import { Redirect } from 'react-router-dom';
import { Col, Container, Row } from 'react-bootstrap';
function Apply(props) { function Apply(props) {
const [state, setState] = useState(); const [state, setState] = useState();
...@@ -41,7 +41,6 @@ function Apply(props) { ...@@ -41,7 +41,6 @@ function Apply(props) {
<option value="2">2시간</option> <option value="2">2시간</option>
<option value="3">3시간</option> <option value="3">3시간</option>
</Field>) </Field>)
} }
function getUser() { function getUser() {
...@@ -63,175 +62,175 @@ function Apply(props) { ...@@ -63,175 +62,175 @@ function Apply(props) {
return ( return (
<div> <div>
<Menu /> <Menu />
<Formik <Container fluid>
initialValues={{ <Row className="justify-content-center">
_id: `${props.match.params.id}`, <Col md={5}>
date: '', <Formik
starttime: '', initialValues={{
usetime: '', _id: `${props.match.params.id}`,
room: '', date: '',
reason: '', starttime: '',
students: [ usetime: '',
{ room: '',
member: '', reason: '',
}, students: [
], {
}} member: '',
validationSchema={Yup.object({ },
date: Yup.string() ],
.required('날짜를 입력해주세요.'), }}
room: Yup.string() validationSchema={Yup.object({
.required('강의실 번호를 입력해주세요.'), date: Yup.string()
reason: Yup.string() .required('날짜를 입력해주세요.'),
.required('대관목적을 입력해주세요.'), room: Yup.string()
})} .required('강의실 번호를 입력해주세요.'),
onSubmit={(values, { setSubmitting }) => { reason: Yup.string()
console.log(values) .required('대관목적을 입력해주세요.'),
axios({ })}
method: 'post', onSubmit={(values, { setSubmitting }) => {
url: '/reserves', console.log(values)
data: values axios({
}).then(res => { method: 'post',
if (res.status === 404) { url: '/reserves',
alert(res.data.error) data: values
return window.location.reload(); }).then(res => {
} if (res.status === 404) {
alert("신청이 완료되었습니다!"); alert(res.data.error)
setState(true); return window.location.reload();
console.log("res.data", res.data) }
}) alert("신청이 완료되었습니다!");
.catch(err => { setState(true);
alert(err.error) console.log("res.data", res.data)
}); })
.catch(err => {
setTimeout(() => { alert(err.error)
setSubmitting(false); });
}, 400); // finish the cycle in handler
}} setTimeout(() => {
> setSubmitting(false);
{({ }, 400); // finish the cycle in handler
errors, }}
touched, >
values, {({
handleSubmit, errors,
getFieldProps, touched,
isSubmitting, values,
}) => ( handleSubmit,
<div className="row justify-content-center align-items-center"> getFieldProps,
<form onSubmit={handleSubmit} className="col-sm-3"> isSubmitting,
<div className="form-group mb-4"> }) => (
<label>대표자</label> <form onSubmit={handleSubmit} className="d-flex flex-column">
<div>{user.name}</div> <h3 className="form-group font-weight-bold">
</div> <label className="pr-2 ">대표자 :</label>{user.name}
<div className="form-group mb-4"> </h3>
<label>신청날짜</label>
<input <div className="form-group">
className={(touched.date && errors.date ? 'form-control is-invalid' : "form-control")}
type="text" <div className={touched.date && errors.date ? "text-danger" : ""}>신청날짜</div>
name="date" <input
{...getFieldProps('date')} className={(touched.date && errors.date ? 'form-control is-invalid' : "form-control")}
placeholder="yyyy-mm-dd" type="text"
/> name="date"
{touched.date && errors.date ? ( {...getFieldProps('date')}
<div className="invalid-feedback text-left">{errors.date}</div> placeholder="yyyy-mm-dd"
) : null} />
</div> </div>
<div className="form-group mb-4">
<label>이용시작시간</label> <div className="form-group mb-4">
<Field as="select" name="starttime"> <label>이용시작시간</label>
<option value="">이용시작시간</option> <div>
<option value="9">9시</option> <Field as="select" name="starttime">
<option value="10">10시</option> <option value="">이용시작시간</option>
<option value="11">11시</option> <option value="9">9시</option>
<option value="12">12시</option> <option value="10">10시</option>
<option value="13">13시</option> <option value="11">11시</option>
<option value="14">14시</option> <option value="12">12시</option>
<option value="15">15시</option> <option value="13">13시</option>
<option value="16">16시</option> <option value="14">14시</option>
<option value="17">17시</option> <option value="15">15시</option>
<option value="18">18시</option> <option value="16">16시</option>
<option value="19">19시</option> <option value="17">17시</option>
<option value="20">20시</option> <option value="18">18시</option>
<option value="21">21시</option> <option value="19">19시</option>
</Field> <option value="20">20시</option>
</div> <option value="21">21시</option>
<div className="form-group mb-4"> </Field>
<label>이용시간</label> </div>
{time(values.starttime)} </div>
</div>
<div className="form-group mb-4"> <div className="form-group mb-4">
<label>강의실</label> <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">
<FieldArray name="students">
{({ insert, remove, push }) => (
<div> <div>
<label>이용자</label> {time(values.starttime)}
{
values.students.map((student, index) => (
<div className="row" key={index}>
<div className="col">
<Field
name={`students.${index}.member`}
placeholder="이용자 성함을 입력하세요."
type="text"
/>
<ErrorMessage
name={`friends.${index}.name`}
component="div"
className="field-error"
/>
<button
type="button"
className="secondary"
onClick={() => remove(index)}
>
X
</button>
</div>
</div>
))}
<button
type="button"
className="btn btn-primary"
onClick={() => push({ member: '' })}
>
추가
</button>
</div> </div>
)} </div>
</FieldArray>
</div> <div className="form-group mb-4">
<button type="submit" className="btn btn-dark" disabled={isSubmitting}> <div className={touched.room && errors.room ? "text-danger" : ""}>강의실</div>
신청하기 <input
className={(touched.room && errors.room ? 'form-control is-invalid' : "form-control")}
type="text"
name="room"
{...getFieldProps('room')}
placeholder="bn-nnn"
/>
</div>
<div className="form-group mb-4">
<div className={touched.reason && errors.reason ? "text-danger" : ""}>대관 목적</div>
<input
className={(touched.reason && errors.reason ? 'form-control is-invalid' : "form-control")}
type="text"
name="reason"
{...getFieldProps('reason')}
placeholder="대관목적을 입력해 주세요."
/>
</div>
<div className="form-group mb-4">
<FieldArray name="students">
{({ insert, remove, push }) => (
<div>
<label>이용자</label>
{
values.students.map((student, index) => (
<Row key={index}>
<Field
name={`students.${index}.member`}
placeholder="이용자 성함을 입력하세요."
type="text"
/>
<ErrorMessage
name={`friends.${index}.name`}
component="div"
className="field-error"
/>
<button
type="button"
className="secondary"
onClick={() => remove(index)}
>X</button>
</Row>
))}
<button
type="button"
className="btn btn-primary"
onClick={() => push({ member: '' })}
>추가</button>
</div>
)}
</FieldArray>
</div>
<button type="submit" className="btn btn-dark" disabled={isSubmitting}>
신청하기
</button> </button>
</form> </form>
</div> )}
)}
</Formik> </Formik>
</Col>
</Row>
</Container>
</div> </div>
) )
} }
......
server/client/src/Pages/SignupPage.js
View file @ ded7f980
...@@ -25,11 +25,6 @@ const Wow = styled.div` ...@@ -25,11 +25,6 @@ const Wow = styled.div`
content: '비밀번호가 일치하지 않습니다.'; content: '비밀번호가 일치하지 않습니다.';
color: red; color: red;
} }
& .asd {
display: flex;
flex-direction: column;
}
` `
function Signup() { function Signup() {
...@@ -46,7 +41,7 @@ function Signup() { ...@@ -46,7 +41,7 @@ function Signup() {
</Menu> </Menu>
<Container fluid> <Container fluid>
<Wow className="row justify-content-center"> <Wow className="row justify-content-center">
<Col md={3} xs={11} className="p-0"> <Col md={3} xs={11} className="p-0">
<Formik <Formik
initialValues={{ name: '', id: '', password: '', password2: '', question: '', answer: '' }} initialValues={{ name: '', id: '', password: '', password2: '', question: '', answer: '' }}
validationSchema={Yup.object({ validationSchema={Yup.object({
...@@ -91,7 +86,7 @@ function Signup() { ...@@ -91,7 +86,7 @@ function Signup() {
getFieldProps, // contain values, handleChange, handleBlur getFieldProps, // contain values, handleChange, handleBlur
isSubmitting, isSubmitting,
}) => ( }) => (
< form onSubmit={handleSubmit} className="asd"> <form onSubmit={handleSubmit} className="d-flex flex-column pt-3">
<div className="form-group "> <div className="form-group ">
<div className={touched.name && errors.name ? "text-danger" : ""}>이름을 입력하세요</div> <div className={touched.name && errors.name ? "text-danger" : ""}>이름을 입력하세요</div>
<input <input
...@@ -154,7 +149,7 @@ function Signup() { ...@@ -154,7 +149,7 @@ function Signup() {
{...getFieldProps('answer')} {...getFieldProps('answer')}
placeholder="Input answer" /> placeholder="Input answer" />
</div> </div>
<Button type="submit" variant="secondary" disabled={isSubmitting}>회원가입</Button> <Button type="submit" variant="secondary" className="mb-2" disabled={isSubmitting}>회원가입</Button>
<Button variant="outline-secondary" as={Link} to="/login">로그인하러 가기</Button> <Button variant="outline-secondary" as={Link} to="/login">로그인하러 가기</Button>
</form> </form>
)} )}
......
server/client/src/Pages/WritePage.js
View file @ ded7f980
...@@ -3,7 +3,7 @@ import { Link, Redirect } from 'react-router-dom'; ...@@ -3,7 +3,7 @@ import { Link, Redirect } from 'react-router-dom';
import Menu from '../Components/Menu'; import Menu from '../Components/Menu';
import * as Yup from 'yup'; import * as Yup from 'yup';
import axios from 'axios'; import axios from 'axios';
import { Container, Row, Col } from 'react-bootstrap'; import { Container, Row, Col, Form } from 'react-bootstrap';
import { Field, Formik } from 'formik'; import { Field, Formik } from 'formik';
function Write() { function Write() {
...@@ -18,7 +18,7 @@ function Write() { ...@@ -18,7 +18,7 @@ function Write() {
<Menu /> <Menu />
<Container fluid> <Container fluid>
<Row className="justify-content-center"> <Row className="justify-content-center">
<Col md={12} xl={8} style={{ height: "35em" }}> <Col md={5} xs={11} className="pt-3" >
<Formik <Formik
initialValues={{ title: '', content: '' }} initialValues={{ title: '', content: '' }}
validationSchema={Yup.object({ validationSchema={Yup.object({
...@@ -52,11 +52,23 @@ function Write() { ...@@ -52,11 +52,23 @@ function Write() {
getFieldProps, // contain values, handleChange, handleBlur getFieldProps, // contain values, handleChange, handleBlur
isSubmitting, isSubmitting,
}) => ( }) => (
<form onSubmit={handleSubmit} className="asd"> // <Form onSubmit={handleSubmit}>
{/* col-sm-3 */} // <Form.Group>
// <Form.Label variant={touched.name && errors.name ? "danger" : ""}>제목</Form.Label>
// <Form.Control className={(touched.name && errors.name ? 'form-control is-invalid' : "form-control")}
// type="text"
// placeholder="제목"
// title="title"
// {...getFieldProps('title')} />
// </Form.Group>
// <Form.Group>
// <Form.Label>내용</Form.Label>
// <Form.Control as="textarea" rows={10} />
// </Form.Group>
// </Form>
<form onSubmit={handleSubmit}>
<div className="form-group"> <div className="form-group">
{/* mb-4 */}
<div className={touched.name && errors.name ? "text-danger" : ""}>제목</div> <div className={touched.name && errors.name ? "text-danger" : ""}>제목</div>
<input className={(touched.name && errors.name ? 'form-control is-invalid' : "form-control")} <input className={(touched.name && errors.name ? 'form-control is-invalid' : "form-control")}
type="text" type="text"
...@@ -64,8 +76,8 @@ function Write() { ...@@ -64,8 +76,8 @@ function Write() {
{...getFieldProps('title')} {...getFieldProps('title')}
placeholder="제목" /> placeholder="제목" />
</div> </div>
<div className="form-group "> <div className="form-group ">
{/* mb-4 */}
<div className={touched.name && errors.name ? "text-danger" : ""}>내용</div> <div className={touched.name && errors.name ? "text-danger" : ""}>내용</div>
<input className={(touched.name && errors.name ? 'form-control is-invalid' : "form-control")} <input className={(touched.name && errors.name ? 'form-control is-invalid' : "form-control")}
type="text" type="text"
...@@ -73,6 +85,7 @@ function Write() { ...@@ -73,6 +85,7 @@ function Write() {
{...getFieldProps('content')} {...getFieldProps('content')}
placeholder="내용" /> placeholder="내용" />
</div> </div>
<button type="submit" className="btn btn-dark" disabled={isSubmitting}>공지 등록</button> <button type="submit" className="btn btn-dark" disabled={isSubmitting}>공지 등록</button>
</form> </form>
)} )}
...@@ -83,5 +96,5 @@ function Write() { ...@@ -83,5 +96,5 @@ function Write() {
</div> </div>
) )
} }
export default Write export default Write
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