From f75dd731618b4406f2edd5cf583e7d9e647c6176 Mon Sep 17 00:00:00 2001 From: HyunJungJo98 Date: Thu, 17 Mar 2022 21:44:11 +0900 Subject: [PATCH] =?UTF-8?q?[#49]Feat:=EB=A7=88=EC=9D=B4=20=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80=20=EB=9D=BC=EC=9A=B0=ED=8C=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/components/Comment/Comment.js | 27 +------ .../src/components/DMPage/DMDetail.js | 25 +----- .../src/components/DMPage/DMListThumbnail.js | 29 +------ .../InformationShareDetailPage.js | 26 +----- .../InformationShares/InformationShares.js | 31 +------- .../src/components/MainContent/MainContent.js | 12 ++- .../src/components/MyPage/MyPageDetail.js | 4 +- .../MyPage/MyPageDetail/MyComments.js | 30 +------ .../components/MyPage/MyPageDetail/MyPosts.js | 30 +------ .../src/components/MyPage/MyPageNormal.js | 21 ++--- .../src/components/Report/Report.js | 25 +----- .../src/components/TopBar/NavigationBar.js | 2 +- .../TransactionPage/TransactionDetail.js | 79 +------------------ .../src/css/DMPage/DMListThumbnail.module.css | 2 +- .../TransactionDetail.module.css | 18 +---- .../TransactionPage.module.css | 3 +- .../src/parseDate/parseDate.js | 23 ++++++ 17 files changed, 64 insertions(+), 323 deletions(-) create mode 100644 frontend/sweet-red-beans/src/parseDate/parseDate.js diff --git a/frontend/sweet-red-beans/src/components/Comment/Comment.js b/frontend/sweet-red-beans/src/components/Comment/Comment.js index 38e129d..8e868f3 100644 --- a/frontend/sweet-red-beans/src/components/Comment/Comment.js +++ b/frontend/sweet-red-beans/src/components/Comment/Comment.js @@ -3,6 +3,7 @@ import axios from "axios"; import { useNavigate } from "react-router"; import { useSelector } from "react-redux"; import style from "../../css/Comment/Comment.module.css"; +import { parseDate } from "../../parseDate/parseDate"; const Comment = ({comment}) => { console.log("댓글 렌더"); @@ -59,32 +60,6 @@ const Comment = ({comment}) => { cancelConfirm ); - //날짜 형식 바꾸기 - const parseDate = (written_date) => { - const d = new Date(written_date); - const year = d.getFullYear(); - let month = d.getMonth(); - let date = d.getDate(); - let hours = d.getHours(); - let min = d.getMinutes(); - if(month<10){ - month = '0'+month; - } - if(date<10){ - date = '0'+date; - } - if(hours<10){ - hours = '0'+hours; - } - if(min<10){ - min = '0'+min; - } - return ( - `${year}-${month}-${date} ${hours} : ${min}` - ) - } - - console.log(comment.comment_nickname); return ( <>
diff --git a/frontend/sweet-red-beans/src/components/DMPage/DMDetail.js b/frontend/sweet-red-beans/src/components/DMPage/DMDetail.js index f80a348..e8d7479 100644 --- a/frontend/sweet-red-beans/src/components/DMPage/DMDetail.js +++ b/frontend/sweet-red-beans/src/components/DMPage/DMDetail.js @@ -8,6 +8,7 @@ import Modal from "../../components/Modals/TransactionModal"; import style from "../../css/DMPage/DMDetail.module.css"; import { useDispatch, useSelector } from "react-redux"; import { SELECTED_DM } from "../../actions/types"; +import { parseDate } from "../../parseDate/parseDate"; let stompClient = null; @@ -259,30 +260,6 @@ const DMDetail = ({selectedRoom}) => { }, [imgFile]) - const parseDate = (written_date) => { - const d = new Date(written_date); - const year = d.getFullYear(); - let month = d.getMonth(); - let date = d.getDate(); - let hours = d.getHours(); - let min = d.getMinutes(); - if(month<10){ - month = '0'+month; - } - if(date<10){ - date = '0'+date; - } - if(hours<10){ - hours = '0'+hours; - } - if(min<10){ - min = '0'+min; - } - return ( - `${year}-${month}-${date} ${hours}:${min}` - ) - } - return ( <> diff --git a/frontend/sweet-red-beans/src/components/DMPage/DMListThumbnail.js b/frontend/sweet-red-beans/src/components/DMPage/DMListThumbnail.js index c443d8c..fb84aff 100644 --- a/frontend/sweet-red-beans/src/components/DMPage/DMListThumbnail.js +++ b/frontend/sweet-red-beans/src/components/DMPage/DMListThumbnail.js @@ -1,6 +1,7 @@ import React, { useEffect, useState } from "react"; import { useSelector } from "react-redux"; import style from "../../css/DMPage/DMListThumbnail.module.css"; +import { parseDate } from "../../parseDate/parseDate"; const DMListThumbnail = ({dm}) => { const [currentRoom, setCurrentRoom] = useState(false); @@ -26,34 +27,6 @@ const DMListThumbnail = ({dm}) => { } }, [selectedRoomId]) - - const parseDate = (written_date) => { - const d = new Date(written_date); - const year = d.getFullYear(); - let month = d.getMonth(); - let date = d.getDate(); - let hours = d.getHours(); - let min = d.getMinutes(); - if(month<10){ - month = '0'+month; - } - if(date<10){ - date = '0'+date; - } - if(hours<10){ - hours = '0'+hours; - } - if(min<10){ - min = '0'+min; - } - return ( - <> -
{year}-{month}-{date}
-
{hours} : {min}
- - ) - } - return ( <>
diff --git a/frontend/sweet-red-beans/src/components/InformationShares/InformationShareDetailPage.js b/frontend/sweet-red-beans/src/components/InformationShares/InformationShareDetailPage.js index 7cd6bbd..d294cc9 100644 --- a/frontend/sweet-red-beans/src/components/InformationShares/InformationShareDetailPage.js +++ b/frontend/sweet-red-beans/src/components/InformationShares/InformationShareDetailPage.js @@ -6,6 +6,7 @@ import { useSelector } from "react-redux"; import axios from "axios"; import { useNavigate } from "react-router"; import style from "../../css/InformationSharePage/InformationShareDetailPage.module.css"; +import { parseDate } from "../../parseDate/parseDate"; const InformationShareDetailPage = () => { @@ -137,31 +138,6 @@ const InformationShareDetailPage = () => { } } - //날짜 형식 바꾸기 - const parseDate = (written_date) => { - const d = new Date(written_date); - const year = d.getFullYear(); - let month = d.getMonth(); - let date = d.getDate(); - let hours = d.getHours(); - let min = d.getMinutes(); - if(month<10){ - month = '0'+month; - } - if(date<10){ - date = '0'+date; - } - if(hours<10){ - hours = '0'+hours; - } - if(min<10){ - min = '0'+min; - } - return ( - `${year}-${month}-${date} ${hours} : ${min}` - ) - } - return( <>
diff --git a/frontend/sweet-red-beans/src/components/InformationShares/InformationShares.js b/frontend/sweet-red-beans/src/components/InformationShares/InformationShares.js index 7ee4683..347a981 100644 --- a/frontend/sweet-red-beans/src/components/InformationShares/InformationShares.js +++ b/frontend/sweet-red-beans/src/components/InformationShares/InformationShares.js @@ -4,7 +4,7 @@ import Pagination from "./Pagination"; import style from "../../css/InformationSharePage/InformationShares.module.css" import { useSelector } from "react-redux"; import axios from "axios"; - +import { parseDate } from "../../parseDate/parseDate"; const InformationShares = ({searchWords, sort, cinemaName, cinemaArea, cinemaBranch}) => { const [infos, setInfos] = useState([]); @@ -86,31 +86,6 @@ const InformationShares = ({searchWords, sort, cinemaName, cinemaArea, cinemaBra } },[searchWords]) - //날짜 형식 바꾸기 - const parseDate = (written_date) => { - const d = new Date(written_date); - const year = d.getFullYear(); - let month = d.getMonth(); - let date = d.getDate(); - let hours = d.getHours(); - let min = d.getMinutes(); - if(month<10){ - month = '0'+month; - } - if(date<10){ - date = '0'+date; - } - if(hours<10){ - hours = '0'+hours; - } - if(min<10){ - min = '0'+min; - } - return ( -
{year}-{month}-{date} {hours} : {min}
- ) - } - console.log(infos); return ( @@ -144,9 +119,7 @@ const InformationShares = ({searchWords, sort, cinemaName, cinemaArea, cinemaBra
{item.title}
{item.nickname}
- { - parseDate(item.written_date) - } +
{parseDate(item.written_date)}
{item.view}
diff --git a/frontend/sweet-red-beans/src/components/MainContent/MainContent.js b/frontend/sweet-red-beans/src/components/MainContent/MainContent.js index 245eb4e..f4cf5a4 100644 --- a/frontend/sweet-red-beans/src/components/MainContent/MainContent.js +++ b/frontend/sweet-red-beans/src/components/MainContent/MainContent.js @@ -18,7 +18,11 @@ import MyPageNormal from "../MyPage/MyPageNormal"; import KakaoLogin from "../TopBar/KakaoLogin"; import GoogleLogin from "../TopBar/GoogleLogin"; import MyEvents from "../MyPage/MyPageDetail/MyEvents"; +import MyTransactions from "../MyPage/MyPageDetail/MyTransactions"; +import MyLikeTransactions from "../MyPage/MyPageDetail/MyLikeTransactions"; +import MyPosts from "../MyPage/MyPageDetail/MyPosts"; import MyPageDetail from "../MyPage/MyPageDetail"; +import MyComments from "../MyPage/MyPageDetail/MyComments"; const MainContenet = () => { return ( @@ -34,8 +38,12 @@ const MainContenet = () => { }/> }/> }/> - }> - {/* }/> */} + }> + }/> + }/> + }/> + }/> + }/> }/> }/> diff --git a/frontend/sweet-red-beans/src/components/MyPage/MyPageDetail.js b/frontend/sweet-red-beans/src/components/MyPage/MyPageDetail.js index 8a31371..73a963e 100644 --- a/frontend/sweet-red-beans/src/components/MyPage/MyPageDetail.js +++ b/frontend/sweet-red-beans/src/components/MyPage/MyPageDetail.js @@ -16,8 +16,8 @@ const MyPageDetail = ({myMenu}) => { }, [id]) return ( <> - - {myComponents[myMenu]} + + {/* {myComponents[myMenu]} */} ) } diff --git a/frontend/sweet-red-beans/src/components/MyPage/MyPageDetail/MyComments.js b/frontend/sweet-red-beans/src/components/MyPage/MyPageDetail/MyComments.js index c0813bc..c914c00 100644 --- a/frontend/sweet-red-beans/src/components/MyPage/MyPageDetail/MyComments.js +++ b/frontend/sweet-red-beans/src/components/MyPage/MyPageDetail/MyComments.js @@ -4,6 +4,7 @@ import Pagination from "./Pagination"; import { useSelector } from "react-redux"; import style from "../../../css/MyPage/MyPageDetail/MyComments.module.css"; import { useNavigate } from "react-router"; +import { parseDate } from "../../../parseDate/parseDate"; const MyComments = () => { const navigation = useNavigate(); @@ -27,31 +28,6 @@ const MyComments = () => { navigation('/informationShare/'+postid); } - //날짜 형식 바꾸기 - const parseDate = (written_date) => { - const d = new Date(written_date); - const year = d.getFullYear(); - let month = d.getMonth(); - let date = d.getDate(); - let hours = d.getHours(); - let min = d.getMinutes(); - if(month<10){ - month = '0'+month; - } - if(date<10){ - date = '0'+date; - } - if(hours<10){ - hours = '0'+hours; - } - if(min<10){ - min = '0'+min; - } - return ( -
{year}-{month}-{date} {hours} : {min}
- ) - } - return ( <>
@@ -62,9 +38,7 @@ const MyComments = () => { {myComments !== undefined ? myComments.slice(offset, offset + limit).map((item, index) => (
postClick(item.post_id, e)}>
{item.comment_content}
- { - parseDate(item.written_date) - } +
{parseDate(item.written_date)}
)) : null}
diff --git a/frontend/sweet-red-beans/src/components/MyPage/MyPageDetail/MyPosts.js b/frontend/sweet-red-beans/src/components/MyPage/MyPageDetail/MyPosts.js index 2d66e3b..4dc4500 100644 --- a/frontend/sweet-red-beans/src/components/MyPage/MyPageDetail/MyPosts.js +++ b/frontend/sweet-red-beans/src/components/MyPage/MyPageDetail/MyPosts.js @@ -4,6 +4,7 @@ import Pagination from "./Pagination"; import { useNavigate } from "react-router"; import { useSelector } from "react-redux"; import style from "../../../css/MyPage/MyPageDetail/MyPosts.module.css"; +import { parseDate } from "../../../parseDate/parseDate"; const MyPosts = () => { const navigation = useNavigate(); @@ -26,31 +27,6 @@ const MyPosts = () => { navigation('/informationShare/'+postid); } - //날짜 형식 바꾸기 - const parseDate = (written_date) => { - const d = new Date(written_date); - const year = d.getFullYear(); - let month = d.getMonth(); - let date = d.getDate(); - let hours = d.getHours(); - let min = d.getMinutes(); - if(month<10){ - month = '0'+month; - } - if(date<10){ - date = '0'+date; - } - if(hours<10){ - hours = '0'+hours; - } - if(min<10){ - min = '0'+min; - } - return ( -
{year}-{month}-{date} {hours} : {min}
- ) - } - return ( <>
@@ -63,9 +39,7 @@ const MyPosts = () => {
postClick(item.post_id, e)}>
{item.title}
{item.category}
- { - parseDate(item.written_date) - } +
{parseDate(item.written_date)}
)) : null}
diff --git a/frontend/sweet-red-beans/src/components/MyPage/MyPageNormal.js b/frontend/sweet-red-beans/src/components/MyPage/MyPageNormal.js index 67a1610..e85f39f 100644 --- a/frontend/sweet-red-beans/src/components/MyPage/MyPageNormal.js +++ b/frontend/sweet-red-beans/src/components/MyPage/MyPageNormal.js @@ -15,10 +15,6 @@ const MyPageNomal = () => { const [nickname, setNickname] = useState(""); const [reliability, setReliability] = useState(""); - //하위 메뉴들 - const [myMenu, setMyMenu] = useState(0); - const myList = ["내가 관심있는 이벤트", "내가 쓴 거래", "내가 좋아요 한 거래", "내가 쓴 글", "내가 쓴 댓글"]; - //프로필 수정 const [hide, setHide] = useState(true); //이미지 불러오기 @@ -85,7 +81,7 @@ const MyPageNomal = () => { //메뉴 선택 const myListClick = (index, e) => { - setMyMenu(index) + navigation('/mypage/'+index) } //프로필 변경 버튼 눌렀을 때 @@ -314,23 +310,23 @@ const MyPageNomal = () => {
- - {/* - }/> - */} +
diff --git a/frontend/sweet-red-beans/src/components/Report/Report.js b/frontend/sweet-red-beans/src/components/Report/Report.js index 1006471..b32f5e6 100644 --- a/frontend/sweet-red-beans/src/components/Report/Report.js +++ b/frontend/sweet-red-beans/src/components/Report/Report.js @@ -3,6 +3,7 @@ import React, { useEffect, useState } from "react"; import { useNavigate } from "react-router"; import style from "../../css/Report/Report.module.css"; import Modal from "../Modals/Modal"; +import { parseDate } from "../../parseDate/parseDate"; const Report = ({report}) => { const navigation = useNavigate(); @@ -74,30 +75,6 @@ const Report = ({report}) => { cancelConfirm ); - const parseDate = (written_date) => { - const d = new Date(written_date); - const year = d.getFullYear(); - let month = d.getMonth(); - let date = d.getDate(); - let hours = d.getHours(); - let min = d.getMinutes(); - if(month<10){ - month = '0'+month; - } - if(date<10){ - date = '0'+date; - } - if(hours<10){ - hours = '0'+hours; - } - if(min<10){ - min = '0'+min; - } - return ( -
{year}-{month}-{date} {hours} : {min}
- ) - } - return ( <> diff --git a/frontend/sweet-red-beans/src/components/TopBar/NavigationBar.js b/frontend/sweet-red-beans/src/components/TopBar/NavigationBar.js index 0aa666f..84621a5 100644 --- a/frontend/sweet-red-beans/src/components/TopBar/NavigationBar.js +++ b/frontend/sweet-red-beans/src/components/TopBar/NavigationBar.js @@ -45,7 +45,7 @@ const NavigationBar = () => { if(cookies.get("login")) { const authority = cookies.get("user").authority if(authority === "일반") { - navigation('/mypage'); + navigation('/mypage/myevents'); } else if(authority === "관리자") { navigation('/adminpage'); diff --git a/frontend/sweet-red-beans/src/components/TransactionPage/TransactionDetail.js b/frontend/sweet-red-beans/src/components/TransactionPage/TransactionDetail.js index 43623d6..98450cc 100644 --- a/frontend/sweet-red-beans/src/components/TransactionPage/TransactionDetail.js +++ b/frontend/sweet-red-beans/src/components/TransactionPage/TransactionDetail.js @@ -5,8 +5,8 @@ import { useDispatch } from "react-redux"; import { DM_CREATE } from "../../actions/types"; import style from "../../css/TransactionPage/TransactionDetail.module.css"; import Modal from "../Modals/TransactionModal"; -import SwitchSelector from "react-switch-selector"; import Switch from "react-switch"; +import { parseDate } from "../../parseDate/parseDate"; const TransactionDetail = ({transaction}) => { const dispatch = useDispatch(); @@ -156,31 +156,6 @@ const TransactionDetail = ({transaction}) => { }); } - //날짜 형식 바꾸기 - const parseDate = (written_date) => { - const d = new Date(written_date); - const year = d.getFullYear(); - let month = d.getMonth(); - let date = d.getDate(); - let hours = d.getHours(); - let min = d.getMinutes(); - if(month<10){ - month = '0'+month; - } - if(date<10){ - date = '0'+date; - } - if(hours<10){ - hours = '0'+hours; - } - if(min<10){ - min = '0'+min; - } - return ( -
{year}-{month}-{date} {hours} : {min}
- ) - } - useEffect(() => { setStatus(transaction.status) setLikeStatus(transaction.is_like); @@ -295,8 +270,9 @@ const TransactionDetail = ({transaction}) => { checked={status==="진행중"?true:false} onColor="#F32222" offColor="#C4C4C4" - width={90} + width={85} height={30} + handleDiameter={22} uncheckedIcon={
마감
} @@ -312,51 +288,6 @@ const TransactionDetail = ({transaction}) => { }
-
- {transaction.is_mine ? -
- {/* */} -
- : - null} -
- - - - {/* {useMemo(() => - - initialSelectedIndex !== -1 ? -
- -
- : - null - , [transaction])} - - - {initialSelectedIndex !== -1 ? -
- -
- : - null - } */} - - - -
{transaction.content}
@@ -377,9 +308,7 @@ const TransactionDetail = ({transaction}) => {
- { - parseDate(transaction.written_date) - } + {parseDate(transaction.written_date)}
diff --git a/frontend/sweet-red-beans/src/css/DMPage/DMListThumbnail.module.css b/frontend/sweet-red-beans/src/css/DMPage/DMListThumbnail.module.css index f6df003..8cb296a 100644 --- a/frontend/sweet-red-beans/src/css/DMPage/DMListThumbnail.module.css +++ b/frontend/sweet-red-beans/src/css/DMPage/DMListThumbnail.module.css @@ -58,7 +58,7 @@ /* 날짜 */ .thumbnail > div:nth-child(3), .currentThumbnail > div:nth-child(3) { text-align: right; - width: 100px; + width: 70px; top: 15px; right: 15px; font-size: 0.74rem; diff --git a/frontend/sweet-red-beans/src/css/TransactionPage/TransactionDetail.module.css b/frontend/sweet-red-beans/src/css/TransactionPage/TransactionDetail.module.css index a5e2f85..d18d98f 100644 --- a/frontend/sweet-red-beans/src/css/TransactionPage/TransactionDetail.module.css +++ b/frontend/sweet-red-beans/src/css/TransactionPage/TransactionDetail.module.css @@ -153,7 +153,7 @@ .proceeding, .done { cursor: default; text-align: center; - width: 80px; + width: 85px; height: 30px; border-radius: 50px; } @@ -182,13 +182,6 @@ } .proceedingButton, .doneButton { - /* cursor: default; - text-align: center; - width: 80px; - height: 30px; - border-radius: 50px; - background-color: #5a5a5a; - font-size: 16px; */ width: 50px; font-size: 16px; color: white; @@ -199,21 +192,16 @@ .proceedingButton { margin-left: 8px; + font-family: 'ROKAFSansBold'; } .doneButton{ right: 0px; margin-right: 15px; text-align: right; + font-family: 'ROKAFSansBold'; } -.proceedingButton > div, .doneButton > div { - /* position: absolute; */ -} - -.statusButton >* > div { - -} .notMine { position: absolute; diff --git a/frontend/sweet-red-beans/src/css/TransactionPage/TransactionPage.module.css b/frontend/sweet-red-beans/src/css/TransactionPage/TransactionPage.module.css index 207a32d..32fe645 100644 --- a/frontend/sweet-red-beans/src/css/TransactionPage/TransactionPage.module.css +++ b/frontend/sweet-red-beans/src/css/TransactionPage/TransactionPage.module.css @@ -72,7 +72,8 @@ width: 700px; height: 200px; border-radius: 10px; - border: 1px solid #C4C4C4; + border: none; + box-shadow: 0px 0px 7px rgba(90, 90, 90, 0.25); box-sizing: border-box; padding: 20px; resize: none; diff --git a/frontend/sweet-red-beans/src/parseDate/parseDate.js b/frontend/sweet-red-beans/src/parseDate/parseDate.js new file mode 100644 index 0000000..529a577 --- /dev/null +++ b/frontend/sweet-red-beans/src/parseDate/parseDate.js @@ -0,0 +1,23 @@ +export const parseDate = (written_date) => { + const d = new Date(written_date); + const year = d.getFullYear(); + let month = d.getMonth()+1; + let date = d.getDate(); + let hours = d.getHours(); + let min = d.getMinutes(); + if(month<10){ + month = '0'+month; + } + if(date<10){ + date = '0'+date; + } + if(hours<10){ + hours = '0'+hours; + } + if(min<10){ + min = '0'+min; + } + return ( + `${year}-${month}-${date} ${hours} : ${min}` + ) +} \ No newline at end of file