Skip to content

GitLab

Commit d0f6f520 authored by CHAERIN KIM's avatar CHAERIN KIM
Browse files

기능 ㄹㅇ 완료

parent 3dfcbd6d
Hide whitespace changes
Inline Side-by-side
server/client/src/Components/List.js deleted 100644 → 0
View file @ 3dfcbd6d
import React, { useState, useEffect } from 'react';
import { Field, Formik } from 'formik';
import axios from 'axios';
import { render } from 'react-dom';
import { Link, Redirect } from 'react-router-dom';
import styled from 'styled-components';
function List(props) {
function remove() {
console.log(props._id)
axios.delete(`/reserves/${props._id}`, { data: { _id: props._id, }})
.then(res => {
if (res.status === 404) return alert(res.data.error)
alert("신청이 완료되었습니다!")
})
.catch(err => {
alert(err.error)
});
};
return (
<div>
<div>날짜 : {props.date}</div>
<div>이름 : {props.name}</div>
<div>강의실 : {props.room}</div>
<div>시간 : {props.time}</div>
<div>사용인원 : {props.num}</div>
<div>{props._id}</div>
<form onSubmit={remove} className="col-sm-3">
<button type="submit" className="btn btn-dark">
신청 취소
</button>
</form>
</div>
)
}
export default List;
\ No newline at end of file
server/client/src/Components/Menu.js
View file @ d0f6f520
......@@ -39,7 +39,10 @@ function Menu() {
<Link to="/home" className="nav-link">대관 현황</Link>
</li>
<li className="nav-item">
<Link to="/apply" className="nav-link">대관 신청</Link>
<Link to={{
pathname: `/apply/${localStorage.getItem('_id')}`,
state: { id: localStorage.getItem('_id') },
}} className="nav-link">대관 신청</Link>
</li>
<li className="nav-item">
<Link to={{
......
server/client/src/Pages/ApplyPage.js
View file @ d0f6f520
import React, { useState, useEffect } from 'react';
import { Formik } from 'formik';
import { Formik, Field, ErrorMessage, FieldArray } from 'formik';
import Menu from '../Components/Menu';
import axios from 'axios';
import 'bootstrap/dist/css/bootstrap.css';
import * as Yup from 'yup';
import { Redirect } from 'react-router-dom';
function Apply(props) {
const [state, setState] = useState();
const [user, setUser] = useState({ name: "" });
useEffect(() => {
getUser();
}, [])
if (state) {
return <Redirect to={{
pathname: `/check/${props.match.params.id}`,
state: { id: props.match.params.id },
}} />;
}
function getUser() {
axios.get(`/users/${props.match.params.id}`, {
headers: { authorization: localStorage.getItem('token') },
})
.then(res => {
if (res.status !== 201) {
alert(res.data.error);
}
console.log(res.data);
setUser(res.data);
})
.catch(err => {
alert(err.error)
});
}
function Apply() {
return (
<div>
<Menu />
<div className="container">apply
<Formik
initialValues={{
date: "20201003",
time: "시간",
room: "9-116",
name: "종윤",
_id: "5f6fa20001988e5604603870",
reason: "study hard",
member: "jinju rkyoung",
approve: false,
num: 5,
}}
onSubmit={(values, { setSubmitting }) => {
axios({
method: 'post',
url: '/reserves',
data: values,
}).then(res => {
if (res.status === 404) return alert(res.data.error)
alert("신청이 완료되었습니다!")
})
.catch(err => {
alert(err.error)
});
setTimeout(() => {
setSubmitting(false);
}, 400); // finish the cycle in handler
}}
>
{({
handleSubmit,
isSubmitting,
}) => (
<div className="row justify-content-center align-items-center">
<form onSubmit={handleSubmit} className="col-sm-3">
<button type="submit" className="btn btn-dark" disabled={isSubmitting}>
신청
initialValues={{
_id: `${props.match.params.id}`,
date: '',
time: '',
room: '',
reason: '',
students: [
{
member: '',
},
],
}}
validationSchema={Yup.object({
date: Yup.string()
.required('날짜를 입력해주세요.'),
time: Yup.string()
.required('시간을 입력해주세요.'),
room: Yup.string()
.required('강의실 번호를 입력해주세요.'),
reason: Yup.string()
.required('대관목적을 입력해주세요.'),
})}
onSubmit={(values, { setSubmitting }) => {
console.log(values)
axios({
method: 'post',
url: '/reserves',
data: values
}).then(res => {
if (res.status === 404) return alert(res.data.error)
alert("신청이 완료되었습니다!");
setState(true);
})
.catch(err => {
alert(err.error)
});
// setTimeout(() => {
// setSubmitting(false);
// }, 400); // finish the cycle in handler
}}
>
{({
errors,
touched,
values,
handleSubmit,
getFieldProps,
isSubmitting,
}) => (
<div className="row justify-content-center align-items-center">
{console.log(user)}
<form onSubmit={handleSubmit} className="col-sm-3">
<div className="form-group mb-4">
<label>대표자</label>
<div>{user.name}</div>
</div>
<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">
<FieldArray name="students">
{({ insert, remove, push }) => (
<div>
<label>이용자</label>
{
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>
)}
</FieldArray>
</div>
<button type="submit" className="btn btn-dark" disabled={isSubmitting}>
신청하기
</button>
</form>
</div>
)}
</Formik>
</div>
</form>
</div>
)}
</Formik>
</div>
)
}
......
server/client/src/Pages/CheckPage.js
View file @ d0f6f520
......@@ -3,6 +3,11 @@ import Menu from '../Components/Menu';
import axios from 'axios';
function Check(props) {
const [reserve, setReserve] = useState([]);
useEffect(() => {
getReserve();
}, [])
function getReserve() {
axios.get(`/reserves/${props.match.params.id}`, {
headers: { authorization: localStorage.getItem('token') },
......@@ -22,54 +27,49 @@ function Check(props) {
axios.delete(`/reserves/${reserve[index]._id}`)
.then(res => {
if (res.status === 404) return alert(res.data.error)
alert("삭제되었습니다!")
alert("삭제되었습니다!");
getReserve();
})
.catch(err => {
alert(err.error)
});
};
function renderTableBody() {
return reserve.map((reserve, index) => {
return (
<tr key={index}>
<td>{props.match.params.id}</td>
<td>{reserve.name}</td>
<td>{reserve.date}</td>
<td>{reserve.room}</td>
<td>
<button onClick={() => remove(index)} className="btn btn-dark">
취소
</button>
</td>
</tr>
)
})
}
function renderTableHeader(props) {
return (
<tr>
<th>아이디</th>
<th>이름</th>
<th>날짜</th>
<th>강의실</th>
<th>예약취소</th>
</tr>
)
}
const [reserve, setReserve] = useState([]);
useEffect(() => {
getReserve();
}, [])
return (
<div>
<Menu />
<div className="">check
<div className="">
<table className="table">
<thead>
<tr>
<th>날짜</th>
<th>시간</th>
<th>강의실</th>
<th>사용인원</th>
<th>승인여부</th>
<th>예약취소</th>
</tr>
</thead>
<tbody>
{renderTableHeader()}
{renderTableBody()}
{reserve.map((reserve, index) => {
return (
<tr key={index}>
<td>{reserve.date}</td>
<td>{reserve.time}</td>
<td>{reserve.room}</td>
<td>{reserve.num}</td>
<td>{reserve.approve?"사용허가":"글쎄..."}</td>
<td>
<button onClick={() => remove(index)} className="btn btn-danger">
취소
</button>
</td>
</tr>
)
})}
</tbody>
</table>
</div>
</div>
)
......
server/client/src/Pages/LoginPage.js
View file @ d0f6f520
......@@ -132,7 +132,7 @@ function Login() {
if (res.status === 404) return alert(res.data.error)
localStorage.setItem('token', res.data.token);
localStorage.setItem('id', res.data.users._id);
localStorage.setItem('_id', res.data.users._id);
localStorage.setItem('name', res.data.users.name);
setState(true);
})
......
server/client/src/index.js
View file @ d0f6f520
......@@ -29,7 +29,7 @@ ReactDOM.render(
<Route path="/signup" component={Signup} />
<Route path="/find" component={Find} />
<Route path="/change" component={Change} />
<Route path="/apply" component={Apply} />
<Route path="/apply/:id" component={Apply} />
<Route path="/check/:id" component={Check} />
<Route path="/notice" component={Notice} />
<Redirect path="/" to="/" />
......
server/routes/reserves.js
View file @ d0f6f520
......@@ -8,15 +8,15 @@ router.post('/', function (req, res, next) {
console.log('/reserve post req.body', req.body)
const reserve = new Reserve({
id: req.body._id,
date: req.body.date,
time: req.body.time,
room: req.body.room,
name: req.body.name,
id: req.body._id,
reason: req.body.reason,
member: req.body.member,
students: req.body.students,
approve: req.body.approve,
num: req.body.num,
num: req.body.students.length + 1,
});
reserve.save()
......
server/routes/users.js
View file @ d0f6f520
......@@ -34,6 +34,15 @@ router.post('/', function (req, res, next) {
})
});
router.get('/:_id', function (req, res, next) {
console.log('/users get req.params', req.params)
User.findOne({ _id: req.params._id }, function (err, user) {
if (err) return res.status(500).json({ error: err });
res.status(201).json(user);
})
})
router.put('/change/:id', function (req, res, next) {
console.log('/change put req.body', req.params)
User.findOne({ _id: req.params.id }, 'password', function (err, user) {
......
server/schemas/index.js
View file @ d0f6f520
......@@ -5,7 +5,7 @@ module.exports = () => {
if (process.env.NODE_ENV !== 'production') {
mongoose.set('debug', true);
}
mongoose.connect('mongodb://hyj:hyj3657@localhost:27017/admin', {
mongoose.connect('mongodb://cherry:1q2w3e4r@localhost:27017/admin', {
dbName: 'ku_rental', useNewUrlParser: true, useUnifiedTopology: true,
}, (error) => {
if (error) {
......
server/schemas/reserve.js
View file @ d0f6f520
......@@ -27,8 +27,8 @@ const reserveSchema = new Schema({
type: String,
},
member: {
type: String,
students: {
type: Array,
},
approve: {
......
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