Skip to content

GitLab

Commit 3ed89fa4 authored by Kim, Subin's avatar Kim, Subin
Browse files

공지사항 삭제, 수정기능 구현중

parent 1322417b
Show whitespace changes
Inline Side-by-side
server/client/package.json
View file @ 3ed89fa4
......@@ -26,7 +26,7 @@
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
......
server/client/src/Components/Card.js
View file @ 3ed89fa4
import React, { useState, useContext } from 'react';
import { Card, Accordion, Col, AccordionContext, useAccordionToggle } from 'react-bootstrap';
import React, { useContext } from 'react';
import { Link } from 'react-router-dom';
import axios from 'axios';
import { Card, Accordion, Col, AccordionContext, useAccordionToggle, Button } from 'react-bootstrap';
import styled from 'styled-components';
const Text = styled(Card.Body)`
......@@ -11,7 +13,7 @@ const Text = styled(Card.Body)`
}
`
function Notice({ card_index, title, date, content }) {
function Notice({ card_id, card_index, title, date, content, admin }) {
function ContextAwareToggle({ children, eventKey, callback }) {
const currentEventKey = useContext(AccordionContext);
......@@ -44,6 +46,18 @@ function Notice({ card_index, title, date, content }) {
return new_date
}
function remove (card_id) {
axios.delete(`/notices/${card_id}`)
.then(res => {
if (res.status === 404) return alert(res.data.error)
alert("삭제되었습니다!");
window.location.reload();
})
.catch(err => {
alert(err.error)
});
}
return (
<Card className="w-100">
<Card.Header className="row flex-row py-3">
......@@ -53,9 +67,16 @@ function Notice({ card_index, title, date, content }) {
<Col md={2} xs={4} className="p-0" >{dateForm(date)}</Col>
</Card.Header>
<Accordion.Collapse eventKey={card_index + 1}>
<Text>{content.split("\n").map((i, key) => {
<Text>
{content.split("\n").map((i, key) => {
return <div key={key}>{i}</div>;
})}</Text>
})}
{admin === "admin" ? (
<div className="d-flex justify-content-end">
<Button variant="primary" size="sm" as={Link} to={`/write/revise/${card_id}`}>수정</Button>
<Button variant="danger" size="sm" onClick={() => remove(card_id)}>삭제</Button>
</div>) : null}
</Text>
</Accordion.Collapse>
</Card >
)
......
server/client/src/Pages/ApplyPage.js
View file @ 3ed89fa4
......@@ -14,6 +14,7 @@ function Apply(props) {
useEffect(() => {
getUser();
}, [])
if (state.ok==="no") return <Redirect to="/" />;
if (state.ok==="ok") {
return <Redirect to={{
......
server/client/src/Pages/CheckPage.js
View file @ 3ed89fa4
......@@ -2,8 +2,7 @@ import React, { useState, useEffect } from 'react';
import Menu from '../Components/Menu';
import { Redirect } from 'react-router-dom';
import axios from 'axios';
import Table from 'react-bootstrap/Table'
import { Container } from 'react-bootstrap';
import { Container, Table } from 'react-bootstrap';
import styled from 'styled-components';
const Ta = styled(Table)`
......@@ -26,7 +25,6 @@ margin-top: 0.5em;
align-items: center;
margin: 10px;
};
`
function Check(props) {
......@@ -52,7 +50,7 @@ function Check(props) {
setState(true);
}
console.log(res.data);
const reserves=res.data.filter(function(item) {
const reserves = res.data.filter(function(item) {
return item !== '';
});
setReserve(reserves);
......
server/client/src/Pages/NoticePage.js
View file @ 3ed89fa4
......@@ -2,11 +2,10 @@ import React, { useState, useEffect } from 'react';
import Menu from '../Components/Menu';
import axios from 'axios';
import { Link, Redirect } from 'react-router-dom';
import { Container, Row, Col, Card, Accordion, Button } from 'react-bootstrap';
import { Container, Row, Col, Accordion, Button } from 'react-bootstrap';
import CARD from '../Components/Card';
function Notice() {
const [show, setShow] = useState(false);
const [notices, setNotices] = useState([]);
const [user, setUser] = useState({ role: "" })
const [state, setState] = useState()
......@@ -40,7 +39,7 @@ function Notice() {
axios.get(`/notices`)
.then(res => {
if (res.status !== 201) {
// alert(res.data.error);
alert(res.data.error);
}
setNotices(res.data);
})
......@@ -58,7 +57,7 @@ function Notice() {
<h2 className="p-3 border-bottom d-flex justify-content-between">공지사항 {user.role === "admin" ? (
<Button as={Link} to="/write">글 작성</Button>) : null}</h2>
<Accordion>
{notices.map((notice, index) => <CARD card_index={index} title={notice.notice_title} date={notice.post_date} content={notice.notice_content} />
{notices.map((notice, index) => <CARD card_id={notice._id} card_index={index} title={notice.notice_title} date={notice.post_date} content={notice.notice_content} admin={user.role} />
)}
</Accordion>
</Col>
......
server/client/src/Pages/WritePage.js
View file @ 3ed89fa4
import React, { useState, useEffect } from 'react';
import { Link, Redirect } from 'react-router-dom';
import { Redirect } from 'react-router-dom';
import Menu from '../Components/Menu';
import * as Yup from 'yup';
import axios from 'axios';
import { Container, Row, Col, Button } from 'react-bootstrap';
import { Field, Formik } from 'formik';
function Write() {
const [submitData, setSubmitData] = useState(false);
function Write({ match }) {
const [state, setState] = useState(false);
const [revision, setRevision] = useState({ title: '', content: '' });
// const [isadmin, setIsadmin] = useState({ok:""});
// const [user, setUser] = useState({ role: "" })
// if (isadmin.ok==="no") return <Redirect to="/" />;
useEffect(() => {
getOne(match.params.id)
}, [])
if (state) {
return <Redirect to="/notice" />;
}
function getOne (id) {
if (id) {
axios.get(`/notices/${id}`)
.then(res => {
if (res.status !== 201) {
alert(res.data.error);
}
setRevision({ title: res.data.notice_title, content: res.data.notice_content })
})
.catch(err => {
alert(err.error)
});
}
};
// function putData (match, revision) {
// if (!match.params.id) return { title: '', content: '' }
// else return { title: revision.notice_title, content: revision.notice_content }
// };
// function acheck() {
// axios.get(`/users/${localStorage.getItem('_id')}`, {
// headers: { authorization: localStorage.getItem('token') },
// })
// .then(res => {
// if (res.status !== 201) {
// alert(res.data.error);
// localStorage.clear();
// setIsadmin({ok:"no"});
// }
// if (res.data.role == "admin") {
// setUser(res.data)
// }
// }).catch(err => {
// alert(err.error)
// });
// }
return (
<div>
<Menu />
{console.log("revision", revision.title, revision.content)}
<Menu/>
<Container fluid>
<Row className="justify-content-center">
<Col md={5} xs={11} className="pt-3" >
<Formik
initialValues={{ title: '', content: '' }}
initialValues={{title: revision.title, content: revision.content}}
validationSchema={Yup.object({
title: Yup.string()
.required('제목을 입력해주세요.'),
......@@ -28,6 +76,7 @@ function Write() {
.required('내용을 입력해주세요.'),
})}
onSubmit={(values, { setSubmitting }) => {
if (!match.params.id) {
axios({
method: 'post',
url: '/writes',
......@@ -40,7 +89,21 @@ function Write() {
.catch(err => {
alert(err.error)
});
} else {
axios({
method: 'put',
url: '/writes/${id}',
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
......@@ -61,13 +124,13 @@ function Write() {
{...getFieldProps('title')}
placeholder="제목" />
</div>
<div className="form-group ">
{console.log(revision.title)}
<div className="form-group">
<div className={touched.name && errors.name ? "text-danger" : ""}>내용</div>
<Field as="textarea" rows={8} style={{ "min-width": "100%" }}
{...getFieldProps('content')} />
</div>
<Button className="mb-2" variant="dark" type="submit" disabled={isSubmitting}>공지 등록</Button>
<Button className="mb-2" variant="dark" type="submit" disabled={isSubmitting}>{match.params.id ? "공지 수정" : "공지 등록"}</Button>
</form>
)}
</Formik>
......
server/client/src/index.js
View file @ 3ed89fa4
......@@ -33,6 +33,7 @@ ReactDOM.render(
<Route path="/change" component={Change} />
<Route path="/apply/:id" component={Apply} />
<Route path="/check/:id" component={Check} />
<Route path="/write/revise/:id" component={Write} />
<Route path="/write" component={Write} />
<Route path="/notice" component={Notice} />
<Route path="/acheck/:id" component={ACheck} />
......
server/routes/notices.js
View file @ 3ed89fa4
......@@ -9,12 +9,33 @@ router.get('/', function (req, res, next) {
res.status(201).json(notices);
})
.catch((err) => {
console.error(err);
next(err);
});
// res.status(404).json({error:"없음."})
res.status(201).json(notices);
});
router.get('/:id', function (req, res, next) {
Notice.findOne({ _id: req.params.id }, function (err, notice) {
if (err) return res.status(500).json({ error: err });
console.log("FindOne", notice)
res.status(201).json(notice);
})
});
router.delete('/:id', function (req, res, next) {
Notice.findOne({ _id: req.params.id }, function (err, notice) {
if (err) return res.status(500).json({ error: err });
notice.remove()
.then(() => {
console.log();
res.status(201).json();
})
.catch((err) => {
console.error(err);
next(err);
});
})
});
module.exports = router;
\ No newline at end of file
server/routes/writes.js
View file @ 3ed89fa4
......@@ -25,4 +25,23 @@ router.post('/', function (req, res, next) {
});
});
router.put('/:id', function (req, res, next) {
console.log('/writes put req.body', req.params)
Notice.findOne({ _id: req.params.id }, function (err, notice) {
if (err) return res.status(500).json({ error: err });
notice.notice_title = req.body.title + " (수정)";
notice.post_date = req.body.post_date;
notice.notice_content = req.body.content;
notice.save()
.then((result) => {
console.log(result);
res.status(201).json(result);
})
.catch((err) => {
console.error(err);
next(err);
});
});
});
module.exports = router;
\ No newline at end of file
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