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

[feat] 어드민 기대평 페이지 일부 구현 #97

Merged
merged 5 commits into from
Aug 14, 2024

Conversation

darkdulgi
Copy link
Collaborator

#️⃣ 연관 이슈

📝 작업 내용

  • 컴포넌트를 feature 폴더로 파일 분리
  • 이벤트를 검색할 때 텍스트 자동 포맷팅

숫자로만 이루어진 9자리 문자열을 HD_012345_678 형태로 자동으로 변경시킵니다.

  • 이벤트를 입력하고 나서 접근하는 기대평 검색 페이지 일부 구현
  • mock api 더미 데이터 작성

아랍 문자입니다.

@darkdulgi darkdulgi added the feat 기능 구현 label Aug 14, 2024
@darkdulgi darkdulgi self-assigned this Aug 14, 2024
@darkdulgi darkdulgi linked an issue Aug 14, 2024 that may be closed by this pull request
6 tasks
Copy link
Collaborator

@lybell-art lybell-art left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

수고하셨습니다:)

Comment on lines 6 to 10
<Container>
<div className="flex flex-col w-full h-dvh p-20">
<span className="text-title-l">기대평</span>

<form onSubmit={searchComment} className="relative mt-10 flex">
<input
type="text"
inputMode="numeric"
onChange={onChangeForm}
onFocus={() => setIsSpread(true)}
onBlur={() => setIsSpread(false)}
value={formString}
placeholder="ID (숫자 6자리)"
className={`outline outline-1 outline-neutral-500 px-4 py-2 w-full ${isSpread ? "rounded-t-md" : "rounded-md"}`}
/>

<div
className={`absolute top-full outline outline-1 w-full outline-neutral-500 rounded-b-md px-3 py-2 flex flex-col gap-2 ${!isSpread && "hidden"}`}
>
{searchList.map((evt) => (
<li
key={evt.id}
className="list-none w-full hover:bg-blue-200 rounded px-1 flex"
>
<span className="w-40">{evt.id}</span>
<span>{evt.name}</span>
</li>
))}
</div>

<img
onClick={searchComment}
src="/icons/search.png"
alt="검색"
className="absolute top-1/2 -translate-y-1/2 right-4 cursor-pointer"
/>
</form>
<AdminComment />
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

편안해졌군요

Comment on lines +14 to +27
fetchServer("/api/v1/admin/comments", {
method: "DELETE",
body: {
commentIds: [...checkedComments],
},
})
.then(() => {
alert(num + "개의 기대평 삭제 완료.");
setCheckedComments(new Set());
})
.catch((e) => {
console.log(e);
});
}
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

향후 useMutation을 이용한 방식으로 수정하여, delete 요청 완료와 동시에 useQuery의 동일한 key를 소비하는 컴포넌트를 리렌더링할 수 있을 겁니다. 공통 훅인 useMutation에 대한 사용법은 내일 위키에 저장해 놓겠습니다.

Comment on lines +23 to +33
const filteredString = e.target.value.replace(/[^0-9]/g, "");

if (!filteredString) {
setFormString("");
} else if (filteredString.length <= 6) {
setFormString("HD_" + filteredString);
} else if (filteredString.length <= 9) {
setFormString(
"HD_" + filteredString.slice(0, 6) + "_" + filteredString.slice(6),
);
} else return;
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

이 부분은 일반 함수로 분리해도 좋을 것 같습니다.

Comment on lines +3 to +18
function getRandomString(len) {
// const startCode = 0xac00;
// const endCode = 0xd7a3;

const startCode = 0x0750;
const endCode = 0x077f;

let str = "";
for (let i = 0; i < len; i++) {
const randomCode =
Math.floor(Math.random() * (endCode - startCode + 1)) + startCode;
str += String.fromCharCode(randomCode);
}

return str;
}
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

공통적으로 사용이 가능할 것으로 예상되므로, common/mock 폴더로 분리해도 좋을 듯합니다.

@lybell-art lybell-art merged commit 9e72552 into dev Aug 14, 2024
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feat 기능 구현
Projects
None yet
Development

Successfully merging this pull request may close these issues.

[feat] 어드민-기대평
2 participants