import React, { FormEvent, useEffect, useState, MouseEvent } from "react"; import { Link } from "react-router-dom"; import { mainimgApi } from "../apis"; import { catchErrors } from "../helpers"; import { MainimgType } from "../types"; import { MySlide } from "./adminslide"; export default function Admin() { // 이미지 전체 불러오기 const [getimgs, setGetimgs] = useState([]); async function imgsData() { const imgs = await mainimgApi.getmainimg(); setGetimgs(imgs) }; useEffect(() => { imgsData(); }, []); // 이미지 추가하기 const [addimg, setAddimg] = useState({ _id: "", theme: "", city: "", url: "", title: "", }); const [loading, setLoading] = useState(false); const [error, setError] = useState(""); const [addSuccess, setAddSuccess] = useState(false); const [delSuccess, setDelSuccess] = useState(false); function handleSelectChange(event: React.ChangeEvent) { const { name, value } = event.currentTarget; setAddimg({ ...addimg, [name]: value }); } function handleInputeChange(event: React.ChangeEvent) { const { name, value } = event.currentTarget; setAddimg({ ...addimg, [name]: value }); } async function handleSubmit(event: FormEvent) { event.preventDefault(); try { setError(""); console.log("img data", addimg); setLoading(true); const res = await mainimgApi.mainimg(addimg); console.log("서버연결됬나요", res); setAddSuccess(true); setError(""); } catch (error) { console.log("에러발생"); catchErrors(error, setError); } finally { setLoading(false); } } if (addSuccess) { alert("img 추가되었습니다"); } // 이미지 삭제하기 async function handleDeleteClick(event: MouseEvent) { try { if (confirm("삭제하시겠습니까?") == true) { const picId = event.currentTarget.id; console.log("picId : ", picId) const res = await mainimgApi.delmainimg(picId); console.log("delete img", res); setDelSuccess(true); setError(""); } else { return false; } } catch (error) { console.log("에러발생"); catchErrors(error, setError); } finally { setLoading(false); }; }; if (delSuccess) { alert("img 삭제되었습니다"); } let limit = 15; const numPages = Math.ceil(getimgs.length / 15); const slides = [] for (let i = 0; i < numPages; i++) { const k = [ getimgs.slice(i * limit, i * limit + limit).map((pic, index: number) => (

{pic.title}

))] slides.push(k); } return (

url :

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

title :

); };