Commit f49dda57 authored by Lee Soobeom's avatar Lee Soobeom
Browse files

Merge remote-tracking branch 'origin/MK17' into develop

parents e7e8eef0 3be6ef0d
......@@ -10,6 +10,7 @@ export default function Profile() {
const [file, setFile] = useState<File>();
const [imageSrc, setImageSrc] = useState("");
const [nickname, setNickname] = useState("");
const [placeholder, setPlaceholder] = useState("");
const { logout } = useAuth();
const handleProfile = async () => {
......@@ -39,28 +40,39 @@ export default function Profile() {
};
const onNickChange = (e: React.ChangeEvent<HTMLInputElement>) => {
const nickname = e.target.value;
setNickname(nickname);
const newnickname = e.target.value;
setNickname(newnickname);
};
const userChange = async () => {
const profile = await handleProfile();
setEmail(profile.email);
setPicturename(profile.avatar.newfilename);
setPlaceholder(profile.avatar.nickname);
};
const handleClick = async (
e: React.MouseEvent<HTMLButtonElement, globalThis.MouseEvent>
) => {
const formdata = new FormData();
if (!(file === undefined || file === null)) {
if (!(file === undefined || nickname === "")) {
formdata.append("picture", file);
formdata.append("nickname", nickname);
console.log("both");
await profileApi.picture(formdata);
} else if (!(nickname === "")) {
formdata.append("nickname", nickname);
console.log("picture");
await profileApi.picture(formdata);
} else {
alert("수정할 정보를 입력해주세요.");
}
formdata.append("nickname", nickname);
await profileApi.picture(formdata);
};
const deleteClick = async () => {
await profileApi.deleteUser().then(() => logout());
await profileApi.deleteUser().then(() => {
logout();
console.log("test");
});
};
useEffect(() => {
......@@ -68,64 +80,69 @@ export default function Profile() {
}, []);
return (
<div className="grid ">
<form className="">
<div className="ml-40 mt-10">프로필 </div>
<div className="grid ml-40 mt-20 border-0 border-y-2 w-2/3">
<div className="grid md:px-60">
<form className="justify-items-center">
<div className="ml-20 mt-10">프로필 수정</div>
<div className="grid mt-20 border-0 border-y-2 ">
<div className="flex">
<div className="py-10 basis-1/5 border-0 border-r-2 bg-gray-100 grid place-items-center ">
<div className="py-10 basis-1/5 border-0 border-r-2 bg-gray-100 grid place-items-center shrink-0">
Email
</div>
<div className="basis-full my-5 p-5">{email}</div>
</div>
<div className="flex border-0 border-t-2">
<div className="py-10 basis-1/5 border-0 border-r-2 bg-gray-100 grid place-items-center">
<div className="py-10 basis-1/5 border-0 border-r-2 bg-gray-100 grid place-items-center shrink-0">
사진
</div>
<div className="basis-full p-2">
{imageSrc ? (
<img
src={imageSrc}
width={200}
height={200}
alt="preview-img"
/>
) : (
<img
src={"http://localhost:3000/images/" + picturename}
width={200}
height={200}
/>
)}
<div className="basis-full p-2 ">
<div className="overflow-hidden w-40 h-40 rounded-full border-2 m-5">
{imageSrc ? (
<img
src={imageSrc}
className="object-cover object-center h-full"
/>
) : (
<img
src={"http://localhost:3000/images/" + picturename}
className="object-cover object-center h-full"
/>
)}
</div>
<input
type="file"
id="files"
className="hidden"
onChange={onUploadFile}
></input>
<label htmlFor="files" className="border-2">
<label htmlFor="files" className="border-2 m-5">
이미지 선택
</label>
</div>
</div>
<div className="flex border-0 border-t-2">
<div className="py-10 basis-1/5 border-0 border-r-2 bg-gray-100 grid place-items-center">
<div className="py-10 basis-1/5 border-0 border-r-2 bg-gray-100 grid place-items-center shrink-0">
별명
</div>
<div className="basis-full ">
<input
placeholder="빈칸"
className="basis-full placeholder:text-black my-10 ml-5"
placeholder={placeholder}
className="basis-full placeholder:text-black my-10 ml-5 border-2"
onChange={onNickChange}
/>
</div>
</div>
</div>
<div className="grid justify-items-center mb-20">
<button onClick={handleClick} className=" border-2 ">
<div className="grid grid-cols-2 my-4 md:mb-20 justify-items-center">
<button
onClick={handleClick}
className="w-20 border-2 shrink-0 ml-10"
>
저장하기
</button>
<button onClick={deleteClick} className="border-2">
<button
onClick={deleteClick}
className="w-20 border-2 shrink-0 mr-10"
>
계정 삭제
</button>
</div>
......
......@@ -42,36 +42,26 @@ export const postPicture = asyncWrap(async (reqExp, res) => {
form.parse(req, (err, fields, files) => {
if (!Array.isArray(files.picture)) {
//파일 좁히기 중
if (Array.isArray(fields.nickname)) {
console.log(fields.nickname);
const nickname = fields.nickname.join();
const originalfilename = files.picture.originalFilename;
const newfilename = files.picture.newFilename;
const picturepath = files.picture.filepath;
userDb.postPicture(
userId,
originalfilename,
newfilename,
picturepath,
nickname
);
} else {
if (!Array.isArray(fields.nickname)) {
const nickname = fields.nickname;
const originalfilename = files.picture.originalFilename;
const newfilename = files.picture.newFilename;
const picturepath = files.picture.filepath;
userDb.postPicture(
userId,
originalfilename,
newfilename,
picturepath,
nickname
);
if (!(files.picture === undefined)) {
const originalfilename = files.picture.originalFilename;
const newfilename = files.picture.newFilename;
const picturepath = files.picture.filepath;
userDb.postPicture(
userId,
nickname,
originalfilename,
newfilename,
picturepath
);
} else {
userDb.postPicture(userId, nickname);
}
}
}
});
res.json();
});
......
......@@ -73,19 +73,32 @@ export const isValidUserId = async (userId: string) => {
export const postPicture = async (
userId: ObjectId,
originalfilename: string | null,
newfilename: string,
picturepath: string,
nickname: string
nickname: string,
originalfilename?: string | null,
newfilename?: string,
picturepath?: string
) => {
const profile = await User.findById(userId);
if (!(profile?.avatar === undefined)) {
await Avatar.findByIdAndUpdate(profile.avatar._id, {
originalfilename: originalfilename,
newfilename: newfilename,
picturepath: picturepath,
nickname: nickname,
});
if (originalfilename === null) {
await Avatar.findByIdAndUpdate(profile.avatar._id, {
nickname: nickname,
});
} else if (nickname === "") {
await Avatar.findByIdAndUpdate(profile.avatar._id, {
originalfilename: originalfilename,
newfilename: newfilename,
picturepath: picturepath,
});
} else {
await Avatar.findByIdAndUpdate(profile.avatar._id, {
originalfilename: originalfilename,
newfilename: newfilename,
picturepath: picturepath,
nickname: nickname,
});
}
}
};
......
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