From e7e8eef00343c4b18d26d59e825e75b5e2007fac Mon Sep 17 00:00:00 2001 From: Baek SeungMin Date: Thu, 21 Jul 2022 19:24:10 +0900 Subject: [PATCH] delete working --- frontend/src/apis/mainimg.api.ts | 3 +- frontend/src/auth/admin.tsx | 152 ++++++++++++++------------ frontend/src/auth/adminslide.tsx | 6 +- frontend/src/types/index.tsx | 2 +- src/controllers/mainimg.controller.ts | 28 +++-- src/db/mainimg.db.ts | 5 + src/routes/mainimg.route.ts | 4 +- 7 files changed, 114 insertions(+), 86 deletions(-) diff --git a/frontend/src/apis/mainimg.api.ts b/frontend/src/apis/mainimg.api.ts index 91b31fb..b5b8c9d 100644 --- a/frontend/src/apis/mainimg.api.ts +++ b/frontend/src/apis/mainimg.api.ts @@ -7,13 +7,12 @@ export const mainimg = async (mainimg: MainimgType) => { return data; }; -export const delmainimg = async (id : string) => { +export const delmainimg = async (_id : string) => { const { data } = await axios.delete(`${baseUrl}/mainimg`); return data; }; export const getmainimg = async () => { const { data } = await axios.get(`${baseUrl}/mainimg`); - console.log("test",data) return data; }; diff --git a/frontend/src/auth/admin.tsx b/frontend/src/auth/admin.tsx index 15bb7d8..3ee7f3f 100644 --- a/frontend/src/auth/admin.tsx +++ b/frontend/src/auth/admin.tsx @@ -1,8 +1,8 @@ -import React, { FormEvent, useEffect, useState } from "react"; +import React, { FormEvent, useEffect, useState, MouseEvent } from "react"; import { mainimgApi } from "../apis"; import { catchErrors } from "../helpers"; import { MainimgType } from "../types"; -import {MySlide} from "./adminslide"; +import { MySlide } from "./adminslide"; export default function Admin() { @@ -19,6 +19,7 @@ export default function Admin() { }, []); const [addimg, setAddimg] = useState({ + _id: "", theme: "", city: "", url: "", @@ -48,6 +49,7 @@ export default function Admin() { console.log("서버연결됬나요", res); setSuccess(true); setError(""); + alert("img 추가되었습니다"); } catch (error) { console.log("에러발생"); catchErrors(error, setError); @@ -56,10 +58,18 @@ export default function Admin() { } } - if (success) { - alert("img 추가되었습니다"); - } - + // if (success) { + // alert("img 추가되었습니다"); + // } + + async function handleDeleteClick(event: MouseEvent) { + const picId = event.currentTarget.id; + console.log(picId) + const res = await mainimgApi.delmainimg(picId); + console.log("delete img", res); + alert("img 삭제되었습니다.") + }; + let limit = 15; const numPages = Math.ceil(getimgs.length / 15); @@ -67,14 +77,17 @@ export default function Admin() { for (let i = 0; i < numPages; i++) { const k = [ getimgs.slice(i * limit, i * limit + limit).map((pic, index: number) => ( -
- -

{pic.title}

+
+
+ +

{pic.title}

+
+
))] slides.push(k); @@ -84,67 +97,70 @@ export default function Admin() {
-
- - -
-

url

- - {/* type="file"/> */} -
-
-

title

- +
+
+ + +
+

url :

+ + {/* type="file"/> */} +
+
+

title :

+ +
-
- +
+
-
+
+
); diff --git a/frontend/src/auth/adminslide.tsx b/frontend/src/auth/adminslide.tsx index cf9e085..6e67a4e 100644 --- a/frontend/src/auth/adminslide.tsx +++ b/frontend/src/auth/adminslide.tsx @@ -10,7 +10,6 @@ export function MySlide({ slides}: num) { const firstRightClick = useRef(true); const [page, setPage] = useState(1); const [slide,setSlide] = useState(1); - // const slide = useRef(1); const [style, setStyle] = useState(""); const leftClick = () => { @@ -20,7 +19,6 @@ export function MySlide({ slides}: num) { } else { setPage(page - 1) } - // slide.current -= 1; setSlide(slide-1) setStyle("-translate-x-full animate-slidetoright"); }; @@ -32,16 +30,14 @@ export function MySlide({ slides}: num) { } else { setPage(page + 1) } - // slide.current += 1; setSlide(slide+1) setStyle("animate-slidetoleft"); }; return ( -
+
{ const req = reqExp as TypedRequestAuth<{ userId: string }>; - const { theme, city, url, title} = req.body as { + const { theme, city, url, title } = req.body as { theme: string; city: string; url: string; @@ -15,10 +17,10 @@ export const createMainimg = asyncWrap(async (reqExp, res, next) => { console.log("body", req.body); - if (!isLength(url ?? "", { min: 1 })) { - return res.status(422).send("이미지 url을 입력해주세요"); - } - + if (!isLength(url ?? "", { min: 1 })) { + return res.status(422).send("이미지 url을 입력해주세요"); + } + if (!isLength(title ?? "", { min: 1 })) { return res.status(422).send("이미지 제목을 입력해주세요"); } @@ -34,10 +36,18 @@ export const createMainimg = asyncWrap(async (reqExp, res, next) => { }); export const getMainimg = asyncWrap(async (req, res) => { - const mainimgs = await mainimgDb.getMainimg(); - return res.json(mainimgs); - }); + const mainimgs = await mainimgDb.getMainimg(); + return res.json(mainimgs); +}); + + +export const deleteMainimg = asyncWrap(async (req, res) => { + const { imgId } = req.params; + console.log(imgId); + const deleteCount = await mainimgDb.deleteOneMainimg(imgId); + + return res.json(deleteCount); +}); - diff --git a/src/db/mainimg.db.ts b/src/db/mainimg.db.ts index 83edb47..924b3d0 100644 --- a/src/db/mainimg.db.ts +++ b/src/db/mainimg.db.ts @@ -14,3 +14,8 @@ export const getMainimg = async () => { const users = await Mainimg.find({}); return users; }; + +export const deleteOneMainimg = async (_id: string) => { + const res = await Mainimg.deleteOne({ _id: _id }); + return res; +}; diff --git a/src/routes/mainimg.route.ts b/src/routes/mainimg.route.ts index 2016f28..bcf0222 100644 --- a/src/routes/mainimg.route.ts +++ b/src/routes/mainimg.route.ts @@ -6,6 +6,8 @@ const router = express.Router(); router .route("/") .get(authCtrl.requireLogin, mainimgCtrl.getMainimg) - .post(authCtrl.requireLogin, mainimgCtrl.createMainimg); + .post(authCtrl.requireLogin, mainimgCtrl.createMainimg) + .delete(authCtrl.requireLogin, mainimgCtrl.deleteMainimg) + export default router; -- GitLab