Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix #736

Merged
merged 8 commits into from
Sep 24, 2023
42 changes: 20 additions & 22 deletions client/src/components/MyPage/MyPage.css
Original file line number Diff line number Diff line change
Expand Up @@ -5,14 +5,25 @@
padding: 20px;
position: sticky;
top: 100px;
background-color: #ffffff;
background-color: white;
}

@media screen and (max-width: 600px) {
.container {
position: static;
margin-left: 0;
margin-right: 0;
@media (max-width: 1920px) {
.table_n{
margin-top: 5%;
margin-left: 10%;
}
.profilecard {
width: 750px;
height: 600px;
overflow-y: auto;
border: 1px solid black;
border-radius: 5px;
padding: 20px;
background-color: white;
}
.profilecard::-webkit-scrollbar{
display: none;
}
}

Expand All @@ -32,26 +43,13 @@
width: 100%;
}

.profilecard {
width: 750px;
height: 600px;
border: 1px solid #ccc;
border-radius: 5px;
padding: 20px;
background-color: #f9f9f9;
}

.content {
margin-right: 100%;
}

.menu-card {
width: 300px;
border: 1px solid #ccc;
border: 1px solid black;
border-radius: 5px;
padding: 20px;
margin-left: 10%;
background-color: #f9f9f9;
background-color: white;
}

.button-group {
Expand All @@ -67,7 +65,7 @@
.buttonstyle {
width: 260px;
height: 50px;
background-color: #ffffff;
background-color: skyblue;
border: none;
border-radius: 5px;
font-size: 16px;
Expand Down
47 changes: 43 additions & 4 deletions client/src/components/MyPage/MyPage.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import React, { useState, useEffect } from "react";
import { Form, Button, Modal } from "react-bootstrap";
import { Form, Button, Modal, Card } from "react-bootstrap";
import Navbar from "../Navbar/Navbar";
import Footer from "../Footer/Footer";
import "./MyPage.css";
Expand All @@ -19,32 +19,57 @@ axios.default.withCredentials = true;

function MyPage() {
let token = localStorage.getItem("token");

const [name, setName] = useState(""); //프로필 이름

const [gender, setGender] = useState(""); //프로필 성별

const [email, setEmail] = useState(""); //프로필 이메일

const [rank, setRank] = useState([]); //프로필 선호 태그

const [currentPage, setCurrentPage] = useState("profile"); //메뉴 토글

const [preview, setPreview] = useState([]);

const [create, setCreate] = useState(0); //생성한 일정 개수

const [pw, setPw] = useState(""); //현재 패스워드

const [password, setPassword] = useState(""); // 수정할 패스워드

const [withdrawPassword, setWithdrawPassword] = useState("");

const [confirmPassword, setConfirmPassword] = useState(""); //수정할 패스워드 확인

const [correct, setCorrect] = useState(false); // 비밀번호 일치 여부

const [posts, setPosts] = useState([]); //페이지마다 띄울 게시판 목록

const [postNumber, setPostNumber] = useState([]); // 각 목록 번호

const [postsPerPage, setPostsPerPage] = useState(10); //페이지마다 띄울 게시판 목록 개수

var [currentNumber, setCurrentNumber] = useState(0); //현재 페이지 번호

const [totalPage, setTotalPage] = useState(0); //전체 페이지 개수

const [total, setTotal] = useState(13); //전체 목록 개수

const [order, setOrder] = useState("기본"); //버튼 정렬 기준

const [keyword, setKeyword] = useState(""); // 일정 검색어

const [loading, setLoading] = useState(false);

const [nestedModal, setNestedModal] = useState(false);

const [toggle, setToggle] = useState(false);

const [withdrawModal, setWithdrawModal] = useState(false);

const [accompanyList, setAccompanyList] = useState(["안녕하세요","안녕하세요","안녕하세요","안녕하세요","안녕하세요"]) // 동행 신청 현황

var ranklist = "";
var size = posts.length;
const indexOfLast = currentPage * postsPerPage;
Expand Down Expand Up @@ -359,7 +384,7 @@ function MyPage() {
const handlePasswordButton = (e) => {

const postToServer = {
pw: pw
pw: password
}

axios
Expand Down Expand Up @@ -475,8 +500,21 @@ function MyPage() {
<h5>이메일 : {email}</h5>
<h5>선호태그 : {ranklist} </h5>
<hr />
<h4>평점 : NaN점</h4>
</div>
<h4>동행 신청 현황</h4>
{accompanyList.map((item,idx) =>
<Card key={idx} style={{
height: '100px'
}} >
{item}
<Button
style={{
width: '50px',
height: '50px'
}}
>O</Button>
</Card>
)}
</div>
);
};

Expand Down Expand Up @@ -821,6 +859,7 @@ function MyPage() {
</td>
</table>
</div>
<br />
<Footer />
</div>
);
Expand Down
Loading