Showing
4 changed files
with
81 additions
and
12 deletions
1 | +.writing{ | ||
2 | + height: 90%; | ||
3 | + width: 90%; | ||
4 | + max-width: 1024px; | ||
5 | + | ||
6 | + display:grid; | ||
7 | + grid-template-rows: 15% 70% 10% ; | ||
8 | + | ||
9 | + margin: 2% 2%; | ||
10 | + | ||
11 | + background-color: #FDF5E6; | ||
12 | + | ||
13 | +} | ||
14 | + | ||
15 | +.writing :nth-child(1) { | ||
16 | + display: flex; | ||
17 | + justify-content: center; | ||
18 | + align-items: center; | ||
19 | +} | ||
20 | +.writing :nth-child(2) { | ||
21 | + display: flex; | ||
22 | + justify-content: center; | ||
23 | + align-items:flex-start; | ||
24 | + padding-top:3%; | ||
25 | +} | ||
26 | +.writing :nth-child(1) input{ | ||
27 | + padding: 2%; | ||
28 | + width:95%; | ||
29 | + height:87%; | ||
30 | + | ||
31 | + font-size: 30px; | ||
32 | +} | ||
33 | +.writing :nth-child(2) textarea { | ||
34 | + padding: 2%; | ||
35 | + width:95%; | ||
36 | + height:95%; | ||
37 | + resize: none; | ||
38 | + font-size: 20px; | ||
39 | +} | ||
40 | + | ||
41 | +.writing :nth-child(1) input::placeholder{ | ||
42 | + font-size:40px; | ||
43 | +} | ||
44 | + | ||
45 | +.writing :nth-child(3){ | ||
46 | + display: flex; | ||
47 | + justify-content: end; | ||
48 | + align-items: flex-end; | ||
49 | +} | ||
50 | +.writing :nth-child(3) button { | ||
51 | + height: 70%; | ||
52 | + width: 15%; | ||
53 | + margin: 3%; | ||
54 | + max-width: 250px; | ||
55 | +} | ||
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
... | @@ -3,19 +3,38 @@ import axios from "axios"; | ... | @@ -3,19 +3,38 @@ import axios from "axios"; |
3 | import { useEffect, useState } from 'react'; | 3 | import { useEffect, useState } from 'react'; |
4 | import './Writing.css' | 4 | import './Writing.css' |
5 | 5 | ||
6 | +function Writing() { | ||
6 | 7 | ||
8 | + const postContent = ()=>{ | ||
9 | + const title = document.getElementById('title').value; | ||
10 | + const content = document.getElementById('content').value; | ||
7 | 11 | ||
8 | -function Writing() { | 12 | + let postContent = { |
13 | + "title": title, | ||
14 | + "content": content, | ||
15 | + "password": '1234', | ||
16 | + }; | ||
9 | 17 | ||
18 | + console.log(postContent); | ||
19 | + if(postContent.title == '' || postContent.content == ''){ | ||
20 | + alert('제목과 내용을 모두 적어주세요'); | ||
21 | + } else { | ||
22 | + axios.post('/api/postSave', postContent).then((res)=>{ | ||
23 | + window.location.href = '/mealtalk'; | ||
24 | + }); | ||
25 | + } | ||
26 | + } | ||
10 | 27 | ||
11 | useEffect(()=>{ | 28 | useEffect(()=>{ |
29 | + | ||
12 | }, []); | 30 | }, []); |
13 | 31 | ||
14 | return ( | 32 | return ( |
15 | <div className='writing'> | 33 | <div className='writing'> |
34 | + <div><input id='title' type='text' placeholder='제목' /></div> | ||
35 | + <div><textarea id='content'></textarea></div> | ||
36 | + <div id='postContent'><button onClick={postContent}>게시글 등록</button></div> | ||
16 | </div> | 37 | </div> |
17 | ); | 38 | ); |
18 | } | 39 | } |
19 | -//첫번째: 오늘 메뉴/ 두번째: 오늘 메뉴에 대한 이야기/ 세번째: 어제 메뉴에 대한 이야기 | ||
20 | - | ||
21 | export default Writing; | 40 | export default Writing; |
... | \ No newline at end of file | ... | \ No newline at end of file | ... | ... |
... | @@ -6,16 +6,12 @@ import './MainPage.css' | ... | @@ -6,16 +6,12 @@ import './MainPage.css' |
6 | 6 | ||
7 | 7 | ||
8 | function MainPage() { | 8 | function MainPage() { |
9 | - const [lunch, setlunch] = useState(""); | 9 | + const [list, setList] = useState([]); |
10 | - const [dinner, setdinner] = useState(""); | ||
11 | let currentYear = new Date().getFullYear(); | 10 | let currentYear = new Date().getFullYear(); |
12 | let currentMonth = new Date().getMonth(); | 11 | let currentMonth = new Date().getMonth(); |
13 | let currentDate = new Date().getDate(); | 12 | let currentDate = new Date().getDate(); |
14 | let today = currentYear+'/'+currentMonth+'/'+currentDate; | 13 | let today = currentYear+'/'+currentMonth+'/'+currentDate; |
15 | 14 | ||
16 | - | ||
17 | - | ||
18 | - | ||
19 | const todayMealTable = async()=>{ | 15 | const todayMealTable = async()=>{ |
20 | axios.get("/api/todayMenu").then( | 16 | axios.get("/api/todayMenu").then( |
21 | (res) => { | 17 | (res) => { |
... | @@ -48,8 +44,7 @@ function MainPage() { | ... | @@ -48,8 +44,7 @@ function MainPage() { |
48 | makeTable(dinnerArr, dinnerDom); | 44 | makeTable(dinnerArr, dinnerDom); |
49 | } | 45 | } |
50 | ) | 46 | ) |
51 | - } | 47 | + }; |
52 | - | ||
53 | 48 | ||
54 | useEffect(()=>{ | 49 | useEffect(()=>{ |
55 | todayMealTable(); | 50 | todayMealTable(); | ... | ... |
... | @@ -15,9 +15,9 @@ code { | ... | @@ -15,9 +15,9 @@ code { |
15 | *{ | 15 | *{ |
16 | margin:0px; | 16 | margin:0px; |
17 | padding:0px; | 17 | padding:0px; |
18 | - /* | 18 | + |
19 | border-style: solid; | 19 | border-style: solid; |
20 | border-color: black; | 20 | border-color: black; |
21 | border-width: 5px; | 21 | border-width: 5px; |
22 | - */ | 22 | + |
23 | } | 23 | } | ... | ... |
-
Please register or login to post a comment