diff --git a/src/components/card/EquipmentInfo.js b/src/components/card/EquipmentInfo.js index df373ec..1c7c4a4 100644 --- a/src/components/card/EquipmentInfo.js +++ b/src/components/card/EquipmentInfo.js @@ -7,6 +7,7 @@ import MyInfoIcon from "assets/images/sidebarIcon/MyInfoIcon.svg" import LocationIcon from "assets/images/Location.svg" import MoreIcon from "assets/images/triple_dot_icon_black.svg"; import EmptyImg from "assets/images/EmptyImg.svg" +import {EquipmentMoreModal} from "../modal/EquipmentMoreModal"; // 카드 박스 export const Card = styled.div` @@ -16,6 +17,7 @@ export const Card = styled.div` border: 1px solid #E6E6E6; box-sizing: border-box; padding: 15px; + position: relative; ` // 상단줄 컨테이너 @@ -24,11 +26,13 @@ const TopContainer = styled.div` align-items: center; justify-content: space-between; margin-bottom: 10px; + position: relative; ` const TopGatherContainer = styled.div` display: flex; align-items: center; + position: relative; ` // 비품명 컨테이너 @@ -74,11 +78,15 @@ function EquipmentInfo(props) { {props.name} - {props.quantity}개 + {props.quantity} + { + isOpen && + + } diff --git a/src/components/modal/EquipmentMoreModal.js b/src/components/modal/EquipmentMoreModal.js new file mode 100644 index 0000000..61b15d8 --- /dev/null +++ b/src/components/modal/EquipmentMoreModal.js @@ -0,0 +1,40 @@ +import React from 'react'; +import {EquipmentMoreModalView, MenuText, NormalDiv, RedDiv} from "./MoreModal"; +import {EquipmentsAxios} from "api/AxiosApi"; +import {getToken} from "utils/IsLoginUtil"; +import {basicError} from "utils/ErrorHandlerUtil"; + +export function EquipmentMoreModal(props) { + + const editEquipment = () => { + window.location.href = `/equipments/${props.id}/edit` + }; + + const deleteEquipment = () => { + EquipmentsAxios.delete(`/${props.id}`, { + headers: { + Authorization: getToken() + } + }) + .then((response) => { + alert("삭제되었습니다.") + window.location.reload(); + }) + .catch((error) => { + basicError(error) + }) + }; + + return ( + <> + e.stopPropagation()}> + + 수정 + + + 삭제 + + + + ); +} \ No newline at end of file diff --git a/src/components/modal/MoreModal.js b/src/components/modal/MoreModal.js index 1f8711e..50ef48f 100644 --- a/src/components/modal/MoreModal.js +++ b/src/components/modal/MoreModal.js @@ -9,8 +9,6 @@ export const MoreModalView = styled.div` display: flex; align-items: center; flex-direction: column; - position: absolute; - right: 3%; border-radius: 10px; background-color: #ffffff; box-sizing: border-box; @@ -19,12 +17,22 @@ export const MoreModalView = styled.div` padding: 0 5px; ` +export const UserMoreModalView = styled(MoreModalView)` + position: absolute; + right: 3%; +` + +export const EquipmentMoreModalView = styled(MoreModalView)` + position: absolute; + right: 3%; + top: 30px; +` + export const NormalDiv = styled.div` display: flex; align-items: center; padding: 10px; color: #545F71; - ` export const RedDiv = styled(NormalDiv)` diff --git a/src/pages/admin/user/UserMoreModal.js b/src/components/modal/UserMoreModal.js similarity index 72% rename from src/pages/admin/user/UserMoreModal.js rename to src/components/modal/UserMoreModal.js index 40eeb20..825aa48 100644 --- a/src/pages/admin/user/UserMoreModal.js +++ b/src/components/modal/UserMoreModal.js @@ -1,9 +1,9 @@ import React, {useState} from 'react'; -import {MenuText, MoreModalView, NormalDiv, RedDiv} from "../../../components/modal/MoreModal"; -import {UserModal} from "../../../components/modal/UserModal"; -import {AdminUsersAxios} from "../../../api/AxiosApi"; -import {getToken} from "../../../utils/IsLoginUtil"; -import {basicError} from "../../../utils/ErrorHandlerUtil"; +import {MenuText, NormalDiv, RedDiv, UserMoreModalView} from "./MoreModal"; +import {UserModal} from "./UserModal"; +import {AdminUsersAxios} from "../../api/AxiosApi"; +import {getToken} from "../../utils/IsLoginUtil"; +import {basicError} from "../../utils/ErrorHandlerUtil"; export function UserMoreModal(props) { const [isOpen, setIsOpen] = useState(false) @@ -33,14 +33,14 @@ export function UserMoreModal(props) { return ( <> - e.stopPropagation()}> + e.stopPropagation()}> 정보 수정 탈퇴 처리 - + {isOpen ? : null diff --git a/src/pages/admin/carBookings/CarBookingManage.js b/src/pages/admin/carBookings/CarBookingManage.js index b03a34f..81bdd89 100644 --- a/src/pages/admin/carBookings/CarBookingManage.js +++ b/src/pages/admin/carBookings/CarBookingManage.js @@ -1,6 +1,6 @@ import React, {useEffect, useState} from "react"; import {RightContainer, TitleText, WhiteContainer} from "components/rightContainer/RightContainer"; -import {Bar, BookedTable, BookedThead, TableContainer} from "../../basic/myBookings/BookedList"; +import {Bar, BookedTable, BookedThead, NoLineTr, TableContainer} from "../../basic/myBookings/BookedList"; import CarBookingManageCell from "./CarBookingManageCell"; import {AdminBookingAxios} from "api/AxiosApi"; import {getToken} from "utils/IsLoginUtil"; @@ -44,7 +44,11 @@ function CarBookingManage(props) { - {carBookings.map(carBooking => + {carBookings.length === 0 ? + + 예약 내역이 없습니다. + : + carBookings.map(carBooking => - {bookingOffices.map((bookingOffice, index) => + {bookingOffices.length === 0 ? + + 예약 내역이 없습니다. + : + bookingOffices.map((bookingOffice, index) => - {bookingResources.map((bookingResource, index) => + {bookingResources.length === 0 ? + + 예약 내역이 없습니다. + : + bookingResources.map((bookingResource, index) => { - getCategoryList(); if (equipmentId !== undefined) { getEquipmentInfo(); + } else { + getCategoryList(); } }, []) + useEffect(() => { + if (category != null) + getCategoryList(); + }, [category]) // 카테고리 리스트 검색 const getCategoryList = () => { @@ -195,9 +200,10 @@ function EquipmentManageAdd(props) { let categories = Response.data.data.categoryNames if (categoryOptionList.length === 0) { setCategoryOptionList((prevList) => [...prevList, ]) - categories.map((category) => + categories.map((c) => setCategoryOptionList((prevList) => [...prevList, - ])) + ]) + ) } }) .catch((error) => { @@ -329,7 +335,11 @@ function EquipmentManageAdd(props) { 카테고리 - + diff --git a/src/pages/basic/equipment/EquipmentList.js b/src/pages/basic/equipment/EquipmentList.js index c8aa113..0ef4ee0 100644 --- a/src/pages/basic/equipment/EquipmentList.js +++ b/src/pages/basic/equipment/EquipmentList.js @@ -70,21 +70,22 @@ function EquipmentList(props) { - - {equipments.length === 0 ? 비품 내역이 없습니다. : equipments.map((equipment) => - )} - + {equipments.length === 0 ? 비품 내역이 없습니다. : + + {equipments.map((equipment) => + )} + } );