From 8943bb0725acca1e63d44d7e7ecd0196bebd3c4b Mon Sep 17 00:00:00 2001
From: JeonYooDeok
Date: Wed, 29 May 2024 00:14:54 +0900
Subject: [PATCH 1/2] =?UTF-8?q?feat=20:=20=EA=B8=80=EC=9E=91=EC=84=B1=20?=
=?UTF-8?q?=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20=EB=B6=84=EB=A6=AC,=20?=
=?UTF-8?q?=EC=9E=90=EC=9C=A0=EA=B2=8C=EC=8B=9C=ED=8C=90=20=EC=B9=B4?=
=?UTF-8?q?=ED=85=8C=EA=B3=A0=EB=A6=AC=20=EC=A1=B0=ED=9A=8C=20=EA=B8=B0?=
=?UTF-8?q?=EB=8A=A5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
app/api/community/[category]/[id]/route.ts | 2 +-
app/api/community/[category]/route.ts | 20 +-
app/community/[category]/page.tsx | 7 +-
app/edit/page.tsx | 218 ++-------------------
components/CommunitySearch.tsx | 2 +-
components/FreeBoardContent.tsx | 32 +--
components/edit/EditFrees.tsx | 176 +++++++++++++++++
components/edit/EditMarkets.tsx | 185 +++++++++++++++++
components/edit/EditQna.tsx | 147 ++++++++++++++
public/icon/dropdown_arrow.svg | 4 +-
redux/slices/categorySlice.ts | 2 +-
11 files changed, 559 insertions(+), 236 deletions(-)
create mode 100644 components/edit/EditFrees.tsx
create mode 100644 components/edit/EditMarkets.tsx
create mode 100644 components/edit/EditQna.tsx
diff --git a/app/api/community/[category]/[id]/route.ts b/app/api/community/[category]/[id]/route.ts
index d9a43ac..047af1f 100644
--- a/app/api/community/[category]/[id]/route.ts
+++ b/app/api/community/[category]/[id]/route.ts
@@ -2,7 +2,7 @@ import type { NextRequest } from "next/server"
export const GET = async (
request: NextRequest,
- context: { params: { category: string; id: string } }
+ context: { params: { category: string; id: number } }
) => {
const { category, id } = context.params
diff --git a/app/api/community/[category]/route.ts b/app/api/community/[category]/route.ts
index 45b04bf..507bc51 100644
--- a/app/api/community/[category]/route.ts
+++ b/app/api/community/[category]/route.ts
@@ -7,15 +7,21 @@ export const GET = async (
const { category } = context.params
const { searchParams } = request.nextUrl
// let url = `http://localhost:3001/${category}`
- let url = `https://711.ha-ving.store/boards/${category}`
+ const keyword = searchParams.get("keyword")
+ const catid =
+ searchParams.get("catid") === "undefined" ||
+ searchParams.get("catid") === null
+ ? "0"
+ : searchParams.get("catid")
+ console.log(keyword)
+ console.log(catid)
+
+ let url = `https://711.ha-ving.store/boards/${category}?category-id=${catid}`
// searchParams가 비어있지 않고, title이 존재하면서 값이 "undefined"가 아닌 경우에만 title을 URL에 추가합니다.
- if (
- searchParams &&
- searchParams.get("keyowrd") !== undefined &&
- searchParams.get("keyword") !== "undefined"
- ) {
- url += `?keyword=${searchParams.get("keyword")}`
+ if (searchParams && keyword !== undefined && keyword !== "undefined") {
+ // url += `?keyword=${searchParams.get("keyword")}`
+ url = `https://711.ha-ving.store/boards/${category}?category-id=${catid}&keyword=${keyword}`
}
try {
diff --git a/app/community/[category]/page.tsx b/app/community/[category]/page.tsx
index e6c21b8..80496ea 100644
--- a/app/community/[category]/page.tsx
+++ b/app/community/[category]/page.tsx
@@ -11,13 +11,14 @@ export default async function Page({
searchParams
}: {
params: { category: string }
- searchParams: { title: string }
+ searchParams: { keyword: string; catid: number }
}) {
const { category } = params
- const { title } = searchParams
+ const { keyword, catid } = searchParams
const res = await fetch(
- `${process.env.NEXT_PUBLIC_CLIENT_URL}/api/community/${category}?keyword=${title}`
+ // `${process.env.NEXT_PUBLIC_CLIENT_URL}/api/community/${category}?keyword=${title}`
+ `${process.env.NEXT_PUBLIC_CLIENT_URL}/api/community/${category}?catid=${catid}&keyword=${keyword}`
)
const responseData = await res.json()
let componentProps = { responseData, category }
diff --git a/app/edit/page.tsx b/app/edit/page.tsx
index 15e9105..41558bb 100644
--- a/app/edit/page.tsx
+++ b/app/edit/page.tsx
@@ -1,138 +1,21 @@
"use client"
-import PrimaryButton from "@/components/button/PrimaryButton"
-import DropDown from "@/components/dropdown/DropDown"
-import { getToday } from "@/utils/todayUtil"
-import { useEffect, useState, useMemo } from "react"
import { useSelector, useDispatch } from "react-redux"
-import { setCategory } from "@/redux/slices/categorySlice"
-import { AppDispatch } from "@/redux/store"
-
-type Options = {
- value: number
- name: string
-}
+import EditFrees from "@/components/edit/EditFrees"
+import EditMarkets from "@/components/edit/EditMarkets"
+import EditQna from "@/components/edit/EditQna"
export default function Edit() {
const category = useSelector((state: any) => state.category)
- const dispatch = useDispatch()
- const [selectedBoard, setSelectedBoard] = useState(0)
- const [selectedType, setSelectedType] = useState(0)
- const [typeOptions, setTypeOptions] = useState([])
-
- const boardOptions: Options[] = [
- { value: 11, name: "자유게시판" },
- { value: 12, name: "나눔장터" },
- { value: 13, name: "QnA" }
- ]
-
- const optionsA = useMemo(
- () => [
- { value: 1, name: "생활・편의" },
- { value: 2, name: "음식・카페" },
- { value: 3, name: "병원・약국" },
- { value: 4, name: "수리・시공" },
- { value: 5, name: "투자・부동산" },
- { value: 6, name: "교육・육아" },
- { value: 7, name: "아파트・동네소식" },
- { value: 8, name: "여행" },
- { value: 9, name: "살림정보" },
- { value: 10, name: "모임・동호회" },
- { value: 11, name: "기타" }
- ],
- []
- )
-
- const optionsB = useMemo(
- () => [
- { value: 999, name: "중고거래" },
- { value: 999, name: "무료나눔" }
- ],
- []
- )
-
- useEffect(() => {
- if (category.value === "frees") {
- setSelectedBoard(11)
- } else if (category.value === "markets") {
- setSelectedBoard(12)
- } else if (category.value === "qnas") {
- setSelectedBoard(13)
- }
- }, [category.value])
-
- useEffect(() => {
- if (selectedBoard === 11) {
- setTypeOptions(optionsA)
- } else if (selectedBoard === 12) {
- setTypeOptions(optionsB)
- } else {
- setTypeOptions([])
- }
- }, [selectedBoard, optionsA, optionsB])
-
- const handleBoardChange = (value: number) => {
- setSelectedBoard(value)
- setSelectedType(0)
- if (value === 11) {
- dispatch(setCategory("frees"))
- } else if (value === 12) {
- dispatch(setCategory("markets"))
- } else if (value === 13) {
- dispatch(setCategory("qnas"))
- }
- }
-
- const handleTypeChange = (value: number) => {
- setSelectedType(value)
- }
- const handleUpdate = async (e: React.FormEvent) => {
- e.preventDefault()
- const formData = new FormData(e.currentTarget)
- // const issaled = "onsale"
- // const isnew = true
- // const category = formData.get("category")
- const category_id = selectedType
- const title = formData.get("title")
- const content = formData.get("content")
- const visible = true
- // const price = formData.get("price")
- // const nickname = "userNickname"
- // const date = getToday()
- const updatedItem = {
- // issaled: issaled,
- // isnew: isnew,
- // category: category,
- category_id: category_id,
- title: title,
- content: content,
- visible: visible
- // price: price,
- // nickname: nickname,
- // date: date
- }
- // const url = `http://localhost:3001/${category}`
- const url = `https://711.ha-ving.store/boards/${category.value}`
- console.log(updatedItem)
- try {
- const response = await fetch(url, {
- method: "POST",
- headers: {
- "Content-Type": "application/json"
- },
- body: JSON.stringify(updatedItem)
- })
+ let contentComponent
- if (response.ok) {
- const responseData = await response.json()
- console.log("게시물 등록 성공:", responseData)
- } else {
- console.error("게시물 등록을 실패했습니다.")
- }
- } catch (error) {
- console.error("에러 발생:", error)
- }
+ if (category.value === "frees") {
+ contentComponent =
+ } else if (category.value === "markets") {
+ contentComponent =
+ } else if (category.value === "qnas") {
+ contentComponent =
}
return (
@@ -145,86 +28,7 @@ export default function Edit() {
게시글 작성 페이지
-
+ {contentComponent}
)
diff --git a/components/CommunitySearch.tsx b/components/CommunitySearch.tsx
index c7dae07..a175504 100644
--- a/components/CommunitySearch.tsx
+++ b/components/CommunitySearch.tsx
@@ -25,7 +25,7 @@ export default function CommunitySearch({
const title = formData.get("title")
console.log(title)
console.log(category)
- router.push(`/community/${category}?title=${title}`)
+ router.push(`/community/${category}?keyword=${title}`)
if (inputRef.current) {
inputRef.current.value = ""
}
diff --git a/components/FreeBoardContent.tsx b/components/FreeBoardContent.tsx
index 6d1cc53..a489e40 100644
--- a/components/FreeBoardContent.tsx
+++ b/components/FreeBoardContent.tsx
@@ -5,7 +5,6 @@ import { useRouter } from "next/navigation"
import PrimaryButton from "./button/PrimaryButton"
import FreeBoardItem from "./FreeBoardItem"
import DropDown from "./dropdown/DropDown"
-import CommunitySearch from "./CommunitySearch"
type Reactions = {
count_reaction_type_good: number
@@ -53,67 +52,72 @@ export default function FreeBoardContent({
const categoryData = [
{
- id: 1,
+ id: "0",
+ board_group: "FREES",
+ name: "전체"
+ },
+ {
+ id: "1",
board_group: "FREES",
code: "13",
name: "생활/편의"
},
{
- id: 2,
+ id: "2",
board_group: "FREES",
code: "14",
name: "음식/카페"
},
{
- id: 3,
+ id: "3",
board_group: "FREES",
code: "15",
name: "병원/약국"
},
{
- id: 4,
+ id: "4",
board_group: "FREES",
code: "16",
name: "수리/시공"
},
{
- id: 5,
+ id: "5",
board_group: "FREES",
code: "17",
name: "투자/부동산"
},
{
- id: 6,
+ id: "6",
board_group: "FREES",
code: "18",
name: "교육/육아"
},
{
- id: 7,
+ id: "7",
board_group: "FREES",
code: "19",
name: "아파트/동네소식"
},
{
- id: 8,
+ id: "8",
board_group: "FREES",
code: "20",
name: "여행"
},
{
- id: 9,
+ id: "9",
board_group: "FREES",
code: "21",
name: "살림정보"
},
{
- id: 10,
+ id: "10",
board_group: "FREES",
code: "22",
name: "모임/동호회"
},
{
- id: 11,
+ id: "11",
board_group: "FREES",
code: "23",
name: "기타"
@@ -125,11 +129,10 @@ export default function FreeBoardContent({
name: category.name
}))
- categoryOptions.unshift({ value: 0, name: "전체" })
-
const handleCategoryChange = (changedData: string) => {
setSelectedCategory(changedData)
console.log(changedData)
+ router.push(`/community/${category}?catid=${changedData}`)
}
const handleGoEdit = () => {
@@ -143,6 +146,7 @@ export default function FreeBoardContent({
label="분류"
options={categoryOptions}
event={handleCategoryChange}
+ initialValue={categoryData[0].id}
/>
state.category)
+ const dispatch = useDispatch()
+ const [selectedBoard, setSelectedBoard] = useState(0)
+ const [selectedType, setSelectedType] = useState(0)
+
+ const boardOptions: Options[] = [
+ { value: 11, name: "자유게시판" },
+ { value: 12, name: "나눔장터" },
+ { value: 13, name: "QnA" }
+ ]
+
+ const typeOptions: Options[] = [
+ { value: 1, name: "생활・편의" },
+ { value: 2, name: "음식・카페" },
+ { value: 3, name: "병원・약국" },
+ { value: 4, name: "수리・시공" },
+ { value: 5, name: "투자・부동산" },
+ { value: 6, name: "교육・육아" },
+ { value: 7, name: "아파트・동네소식" },
+ { value: 8, name: "여행" },
+ { value: 9, name: "살림정보" },
+ { value: 10, name: "모임・동호회" },
+ { value: 11, name: "기타" }
+ ]
+
+ useEffect(() => {
+ if (category.value === "frees") {
+ setSelectedBoard(11)
+ } else if (category.value === "markets") {
+ setSelectedBoard(12)
+ } else if (category.value === "qnas") {
+ setSelectedBoard(13)
+ }
+ }, [category.value])
+
+ const handleBoardChange = (value: number) => {
+ setSelectedBoard(value)
+ setSelectedType(0)
+ if (value === 11) {
+ dispatch(setCategory("frees"))
+ } else if (value === 12) {
+ dispatch(setCategory("markets"))
+ } else if (value === 13) {
+ dispatch(setCategory("qnas"))
+ }
+ }
+
+ const handleTypeChange = (value: number) => {
+ setSelectedType(value)
+ }
+
+ const handleUpdate = async (e: React.FormEvent) => {
+ e.preventDefault()
+ const formData = new FormData(e.currentTarget)
+ // const issaled = "onsale"
+ // const isnew = true
+ // const category = formData.get("category")
+ const category_id = selectedType
+ const title = formData.get("title")
+ const content = formData.get("content")
+ const visible = true
+ // const price = formData.get("price")
+ // const nickname = "userNickname"
+ // const date = getToday()
+ const updatedItem = {
+ // issaled: issaled,
+ // isnew: isnew,
+ // category: category,
+ category_id: category_id,
+ title: title,
+ content: content,
+ visible: visible
+ // price: price,
+ // nickname: nickname,
+ // date: date
+ }
+ // const url = `http://localhost:3001/${category}`
+ const url = `https://711.ha-ving.store/boards/${category.value}`
+ console.log(updatedItem)
+ try {
+ const response = await fetch(url, {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json"
+ },
+ body: JSON.stringify(updatedItem)
+ })
+
+ if (response.ok) {
+ const responseData = await response.json()
+ console.log("게시물 등록 성공:", responseData)
+ } else {
+ console.error("게시물 등록을 실패했습니다.")
+ }
+ } catch (error) {
+ console.error("에러 발생:", error)
+ }
+ }
+ return (
+
+ )
+}
diff --git a/components/edit/EditMarkets.tsx b/components/edit/EditMarkets.tsx
new file mode 100644
index 0000000..42eed31
--- /dev/null
+++ b/components/edit/EditMarkets.tsx
@@ -0,0 +1,185 @@
+import { useEffect, useState, useMemo } from "react"
+import { useSelector, useDispatch } from "react-redux"
+import { AppDispatch } from "@/redux/store"
+import { setCategory } from "@/redux/slices/categorySlice"
+import PrimaryButton from "../button/PrimaryButton"
+import DropDown from "../dropdown/DropDown"
+import GoBackButton from "../button/GoBackButton"
+
+type Options = {
+ value: number
+ name: string
+}
+
+export default function EditFrees() {
+ const category = useSelector((state: any) => state.category)
+ const dispatch = useDispatch()
+ const [selectedBoard, setSelectedBoard] = useState(0)
+ const [selectedType, setSelectedType] = useState(0)
+
+ const boardOptions: Options[] = [
+ { value: 11, name: "자유게시판" },
+ { value: 12, name: "나눔장터" },
+ { value: 13, name: "QnA" }
+ ]
+
+ const typeOptions: Options[] = [
+ { value: 99, name: "중고거래" },
+ { value: 999, name: "무료나눔" }
+ ]
+
+ useEffect(() => {
+ if (category.value === "frees") {
+ setSelectedBoard(11)
+ } else if (category.value === "markets") {
+ setSelectedBoard(12)
+ } else if (category.value === "qnas") {
+ setSelectedBoard(13)
+ }
+ }, [category.value])
+
+ const handleBoardChange = (value: number) => {
+ setSelectedBoard(value)
+ setSelectedType(0)
+ if (value === 11) {
+ dispatch(setCategory("frees"))
+ } else if (value === 12) {
+ dispatch(setCategory("markets"))
+ } else if (value === 13) {
+ dispatch(setCategory("qnas"))
+ }
+ }
+
+ const handleTypeChange = (value: number) => {
+ setSelectedType(value)
+ }
+
+ const handleUpdate = async (e: React.FormEvent) => {
+ e.preventDefault()
+ const formData = new FormData(e.currentTarget)
+ // const issaled = "onsale"
+ // const isnew = true
+ // const category = formData.get("category")
+ const category_id = selectedType
+ const title = formData.get("title")
+ const content = formData.get("content")
+ const visible = true
+ // const price = formData.get("price")
+ // const nickname = "userNickname"
+ // const date = getToday()
+ const updatedItem = {
+ // issaled: issaled,
+ // isnew: isnew,
+ // category: category,
+ category_id: category_id,
+ title: title,
+ content: content,
+ visible: visible
+ // price: price,
+ // nickname: nickname,
+ // date: date
+ }
+ // const url = `http://localhost:3001/${category}`
+ const url = `https://711.ha-ving.store/boards/${category.value}`
+ console.log(updatedItem)
+ try {
+ const response = await fetch(url, {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json"
+ },
+ body: JSON.stringify(updatedItem)
+ })
+
+ if (response.ok) {
+ const responseData = await response.json()
+ console.log("게시물 등록 성공:", responseData)
+ } else {
+ console.error("게시물 등록을 실패했습니다.")
+ }
+ } catch (error) {
+ console.error("에러 발생:", error)
+ }
+ }
+ return (
+
+ )
+}
diff --git a/components/edit/EditQna.tsx b/components/edit/EditQna.tsx
new file mode 100644
index 0000000..cdc471a
--- /dev/null
+++ b/components/edit/EditQna.tsx
@@ -0,0 +1,147 @@
+import { useEffect, useState, useMemo } from "react"
+import { useSelector, useDispatch } from "react-redux"
+import { AppDispatch } from "@/redux/store"
+import { setCategory } from "@/redux/slices/categorySlice"
+import PrimaryButton from "../button/PrimaryButton"
+import DropDown from "../dropdown/DropDown"
+import GoBackButton from "../button/GoBackButton"
+
+type Options = {
+ value: number
+ name: string
+}
+
+export default function EditFrees() {
+ const category = useSelector((state: any) => state.category)
+ const dispatch = useDispatch()
+ const [selectedBoard, setSelectedBoard] = useState(0)
+
+ const boardOptions: Options[] = [
+ { value: 11, name: "자유게시판" },
+ { value: 12, name: "나눔장터" },
+ { value: 13, name: "QnA" }
+ ]
+
+ useEffect(() => {
+ if (category.value === "frees") {
+ setSelectedBoard(11)
+ } else if (category.value === "markets") {
+ setSelectedBoard(12)
+ } else if (category.value === "qnas") {
+ setSelectedBoard(13)
+ }
+ }, [category.value])
+
+ const handleBoardChange = (value: number) => {
+ setSelectedBoard(value)
+ if (value === 11) {
+ dispatch(setCategory("frees"))
+ } else if (value === 12) {
+ dispatch(setCategory("markets"))
+ } else if (value === 13) {
+ dispatch(setCategory("qnas"))
+ }
+ }
+
+ const handleUpdate = async (e: React.FormEvent) => {
+ e.preventDefault()
+ const formData = new FormData(e.currentTarget)
+ // const issaled = "onsale"
+ // const isnew = true
+ // const category = formData.get("category")
+ const title = formData.get("title")
+ const content = formData.get("content")
+ const visible = true
+ // const price = formData.get("price")
+ // const nickname = "userNickname"
+ // const date = getToday()
+ const updatedItem = {
+ // issaled: issaled,
+ // isnew: isnew,
+ // category: category,
+ title: title,
+ content: content,
+ visible: visible
+ // price: price,
+ // nickname: nickname,
+ // date: date
+ }
+ // const url = `http://localhost:3001/${category}`
+ const url = `https://711.ha-ving.store/boards/${category.value}`
+ console.log(updatedItem)
+ try {
+ const response = await fetch(url, {
+ method: "POST",
+ headers: {
+ "Content-Type": "application/json"
+ },
+ body: JSON.stringify(updatedItem)
+ })
+
+ if (response.ok) {
+ const responseData = await response.json()
+ console.log("게시물 등록 성공:", responseData)
+ } else {
+ console.error("게시물 등록을 실패했습니다.")
+ }
+ } catch (error) {
+ console.error("에러 발생:", error)
+ }
+ }
+ return (
+
+ )
+}
diff --git a/public/icon/dropdown_arrow.svg b/public/icon/dropdown_arrow.svg
index 7a536f6..f50a073 100644
--- a/public/icon/dropdown_arrow.svg
+++ b/public/icon/dropdown_arrow.svg
@@ -1,3 +1,3 @@
-