NoticePage.js 2.19 KB
Newer Older
1
import React, { useState, useEffect, useRef } from 'react';
Ha YeaJin's avatar
pages    
Ha YeaJin committed
2
import Menu from '../Components/Menu';
3
import axios from 'axios';
Ha YeaJin's avatar
Ha YeaJin committed
4
5
import { Link } from 'react-router-dom';
import { Container, Row, Col, Card, Accordion, Button } from 'react-bootstrap';
Ha YeaJin's avatar
pages    
Ha YeaJin committed
6
7

function Notice() {
8
9
10
11
12
13
    const [notices, setNotices] = useState([]);

    useEffect(() => {
        getNotice();
    }, []);

14
15
16
17
18
19
20
21
22
23
24
25
26
    function dateForm(day) {
        const post_day = new Date(day);
        let year = post_day.getFullYear();
        let month = post_day.getMonth() + 1;
        let date = post_day.getDate();

        month = month < 10 ? '0' + month : month;
        date = date < 10 ? '0' + date : date;

        const new_date = year + "-" + month + "-" + date;
        return new_date
    }

27
28
29
30
    function getNotice() {
        axios.get(`/notices`)
            .then(res => {
                if (res.status !== 201) {
Ha YeaJin's avatar
Ha YeaJin committed
31
                    // alert(res.data.error);
32
33
34
35
36
37
38
                }
                setNotices(res.data);
            })
            .catch(err => {
                alert(err.error)
            });
    }
Ha YeaJin's avatar
pages    
Ha YeaJin committed
39
40
41
    return (
        <div>
            <Menu />
Ha YeaJin's avatar
Ha YeaJin committed
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
            <Container fluid>
                <Row className="justify-content-center vw-100 vh-90">
                    <Col md={7}>
                        <h2 className="p-3 border-bottom">공지사항 <Link to="/write"> 작성</Link></h2>
                        <Accordion>
                            {notices.map((notice, index) =>
                                <Card>
                                    <Card.Header>
                                        <Accordion.Toggle as={Button} variant="link" eventKey={index + 1}>{notice.notice_title} <span className="text-right">{dateForm(notice.post_date)}</span></Accordion.Toggle>
                                    </Card.Header>
                                    <Accordion.Collapse eventKey={index + 1}>
                                        <Card.Body>{notice.notice_content}</Card.Body>
                                    </Accordion.Collapse>
                                </Card>)}
                        </Accordion>
                    </Col>
                </Row>
            </Container>
Ha YeaJin's avatar
pages    
Ha YeaJin committed
60
61
62
63
        </div>
    )
}

Lee Jin Ju's avatar
Lee Jin Ju committed
64
export default Notice;