Skip to content

Commit

Permalink
Merge pull request #144 from PLADI-ALM/feat/PDW-96-car-detail
Browse files Browse the repository at this point in the history 
[PDW-96/feat] 관리자 차량 상세 조회 및 삭제
  • Loading branch information
@psyeon1120
psyeon1120 authored Nov 26, 2023
2 parents 092d564 + 1c15ade commit b5f4e74
Show file tree
Hide file tree
Showing 6 changed files with 85 additions and 93 deletions.
2 changes: 2 additions & 0 deletions src/App.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ import CarBookingCheck from "./pages/basic/booking/car/CarBookingCheck";
import CarManage from "./pages/admin/car/CarManage";
import CarBookingManage from "./pages/admin/carBookings/CarBookingManage";
import CarManageAdd from "./pages/admin/car/CarManageAdd";
import CarManageDetail from "./pages/admin/car/CarManageDetail";

function App() {

Expand Down Expand Up @@ -62,6 +63,7 @@ function App() {
<Route path='/admin/resourceBooking/:bookingId' element={<ResourceBookingCheck isAdmin={true} />} />
<Route path='/admin/cars' element={<CarManage />} />
<Route path='/admin/cars/add' element={<CarManageAdd />} />
<Route path='/admin/cars/:carId' element={<CarManageDetail/>} />
<Route path='/admin/cars/edit/:carId' element={<CarManageAdd />} />
<Route path='/admin/carBooking' element={<CarBookingManage/>} />
<Route path='/admin/carBooking/:bookingId' element={<CarBookingCheck isAdmin={true} />} />
Expand Down
2 changes: 1 addition & 1 deletion src/constants/Path.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import AdminInactiveIcon from 'assets/images/sidebarIcon/AdminInactive.svg'
export const BOOKING_MENUS = [
{name: '회의실 예약', path: '/officeBooking'},
{name: '장비 예약', path: '/resourceBooking'},
{name: '차량 내역', path: '/carBooking'}
{name: '차량 예약', path: '/carBooking'}
]

export const MY_BOOKING_MENUS = [
Expand Down
2 changes: 1 addition & 1 deletion src/pages/admin/car/CarManage.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ function CarManage(props) {
const [cars, setCars] = useState([]);

const getCars = (name) => {
AdminCarsAxios.get(`?keyword=${name}`, {
AdminCarsAxios.get(`?keyword=${name}&size=100`, {
headers: {
Authorization: getToken()
}
Expand Down
6 changes: 4 additions & 2 deletions src/pages/admin/car/CarManageAdd.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -206,6 +206,7 @@ function CarManageAdd(props) {
setIsUpload(false);
imageInput.current.value = "";
setImgSrc("")
setImgUrl(null)
};

// 이미지 람다 호출
Expand Down Expand Up @@ -328,6 +329,7 @@ function CarManageAdd(props) {
description: Response.data.data.description
});
setImgUrl(Response.data.data.imgUrl);
setImgSrc(Response.data.data.imgUrl);
})
.catch((Error) => {
basicError(Error)
Expand Down Expand Up @@ -407,10 +409,10 @@ function CarManageAdd(props) {
<TitleLabel>첨부사진</TitleLabel>
<ImageInfoContainer>
<PreviewImage
src={imageUrl ? imageUrl : imageSrc ? imageSrc : EmptyImg}
src={imageSrc ? imageSrc : EmptyImg}
alt="첨부사진"
/>
{imageFile !== null && <AbExitBtn onClick={deleteImageFile}>×</AbExitBtn>}
{imageSrc !== "" && <AbExitBtn onClick={deleteImageFile}>×</AbExitBtn>}
</ImageInfoContainer>
<ImageAddContainer>
<ImageAddButton onClick={changeImageFile}>파일선택</ImageAddButton>
Expand Down
163 changes: 76 additions & 87 deletions src/pages/admin/car/CarManageDetail.js
View file
Original file line number Diff line number Diff line change
@@ -1,27 +1,17 @@
import React, {useEffect, useState} from 'react';
import styled from "styled-components"
import {AdminResourcesAxios, ResourcesAxios} from 'api/AxiosApi';
import styled from "styled-components";
import {AdminCarsAxios, CarsAxios} from 'api/AxiosApi';
import {useParams} from 'react-router-dom';
import Capsule from 'components/capsule/Capsule';
import {basicError} from 'utils/ErrorHandlerUtil';
import {Bar} from 'pages/basic/myBookings/BookedList';
import {RightContainer, TitleText, WhiteContainer} from 'components/rightContainer/RightContainer';
import {
MainTextContainer,
NameSubTitleText,
SubTextContainer,
DetailSubTitleText
} from 'components/officeBooking/SubTitleBar';
import {DetailSubTitleText, NameSubTitleText} from 'components/officeBooking/SubTitleBar';
import {getToken} from 'utils/IsLoginUtil';
import MoreButtonIcon from "../../../assets/images/button/triple_dot_icon.svg"
import ResourceDetailInfo from "../../../components/card/ResourceDetailInfo";
import ImageFullButton from "../../../components/button/ImageFullButton";
import MoreButtonIcon from "assets/images/button/triple_dot_icon.svg";
import ResourceDetailInfo from "components/card/ResourceDetailInfo";
import ImageFullButton from "components/button/ImageFullButton";

export const MoreButton = styled.button`
border: none;
background-color: #2A3042;
float: right;
`
export const OptionsView = styled.div`
display: ${props => props.isShowing ? 'table-cell' : 'none'};
width: 85px;
Expand Down Expand Up @@ -50,7 +40,6 @@ export const InfoTable = styled.table`
border-collapse: collapse;
border: 1px solid #959494;
font-size: 17px;
align: center;
`

export const InfoTableData = styled.td`
Expand All @@ -59,126 +48,126 @@ export const InfoTableData = styled.td`
`

function CarManageDetail() {
let {resourceId} = useParams()
let {carId} = useParams()

const [isShowingOptions, setOptionViewShowing] = useState(false)
const [resourceInfo, setResourceInfo] = useState([])
const [carInfo, setCarInfo] = useState([])
const [bookingsInfo, setBookingsInfo] = useState([])

const getResourceInfo = () => {
ResourcesAxios.get(`/${resourceId}`, {
const getCarInfo = () => {
CarsAxios.get(`/${carId}`, {
headers: {
Authorization: getToken()
}
})
.then((Response) => {
console.log(Response.data.data)
setResourceInfo(Response.data.data)
setCarInfo(Response.data.data)
})
.catch((Error) => {
basicError(Error)
console.log(Error)
window.alert("장비 정보를 불러올 수 없습니댜.")
window.alert("차량 정보를 불러올 수 없습니댜.")
window.history.back()
})
}

const getResourceBookingListInfo = () => {
AdminResourcesAxios.get(`${resourceId}`, {
const getCarBookingListInfo = () => {
AdminCarsAxios.get(`${carId}`, {
headers: {
Authorization: getToken()
}
})
.then((Response) => {
console.log(Response.data.data)
setBookingsInfo(Response.data.data.resourcesLists)
setBookingsInfo(Response.data.data.productList)
})
.catch((Error) => {
basicError(Error)
console.log(Error)
window.alert("예약 정보를 불러올 수 없습니댜.")
window.history.back()
})
}

const deleteResource = () => {
if (window.confirm("장비을 삭제하시겠습니까?")) {
AdminResourcesAxios.delete(`${resourceId}`, {
const deleteCar = () => {
if (window.confirm("차량을 삭제하시겠습니까?")) {
AdminCarsAxios.delete(`${carId}`, {
headers: {
Authorization: getToken()
}
})
.then((Response) => {
if (Response.data.status === 200) {
alert('장비을 성공적으로 삭제하였습니다.')
window.history.back()
alert('차량을 성공적으로 삭제하였습니다.')
window.location.href = `/admin/cars`
}
})
.catch((Error) => {
basicError(Error)
console.log(Error)
})
setOptionViewShowing(false)
}
}

useEffect(() => {
getResourceInfo()
getResourceBookingListInfo()
getCarInfo()
getCarBookingListInfo()
}, []);

return <RightContainer>
<TitleText>장비 관리</TitleText>

<WhiteContainer>
<Bar space={true}>
<div>
<NameSubTitleText>{resourceInfo.name}</NameSubTitleText>
<DetailSubTitleText>{resourceInfo.location}</DetailSubTitleText>
return (
<RightContainer>
<TitleText>차량 관리</TitleText>

<WhiteContainer>
<Bar space={true}>
<div>
<NameSubTitleText>{carInfo.name}</NameSubTitleText>
<DetailSubTitleText>{carInfo.location}</DetailSubTitleText>
</div>
<ImageFullButton image={MoreButtonIcon} click={() => {
setOptionViewShowing(!isShowingOptions)
}}/>
<OptionsView isShowing={isShowingOptions}>
<OptionButton onClick={() => {
window.location.href = `/admin/cars/edit/${carId}`
}}>수정</OptionButton>
<OptionButton isDelete={true} onClick={deleteCar}>삭제</OptionButton>
</OptionsView>
</Bar>

<ResourceDetailInfo
managerName={carInfo.responsibilityName}
managerPhone={carInfo.responsibilityPhone}
description={carInfo.description}
imgUrl={carInfo.imgUrl}/>

<div style={{width: '150px', padding: '30px 0 0 40px'}}>
<Capsule color="purple" text="예약 내역"/>
</div>
<ImageFullButton image={MoreButtonIcon} click={() => {
setOptionViewShowing(!isShowingOptions)
}}/>
<OptionsView isShowing={isShowingOptions}>
<OptionButton onClick={() => {
window.location.href = `/admin/resources/edit/${resourceId}`
}}>수정</OptionButton>
<OptionButton isDelete={true} onClick={deleteResource}>삭제</OptionButton>
</OptionsView>
</Bar>

<ResourceDetailInfo
managerName={resourceInfo.responsibilityName}
managerPhone={resourceInfo.responsibilityPhone}
description={resourceInfo.description}
imgUrl={resourceInfo.imgUrl}/>

<div style={{width: '150px', padding: '30px 0 0 40px'}}>
<Capsule color="purple" text="예약 내역"/>
</div>

<InfoTable>
<tr style={{backgroundColor: '#D0B1EE', border: '1px solid #959494', height: '45px'}}>
<th scope="col" style={{width: '20%', border: '1px solid #959494'}}>요청자</th>
<th scope="col" style={{width: '25%', border: '1px solid #959494'}}>예약일자</th>
<th scope="col" style={{width: '43%', border: '1px solid #959494'}}>목적</th>
<th scope="col" style={{width: '12%', border: '1px solid #959494'}}>상태</th>
</tr>
{bookingsInfo.map(function (info) {
return (
<tr style={{border: '1px solid #959494', height: '45px'}}>
<InfoTableData>{info.reservatorName} ({info.reservatorPhone})</InfoTableData>
<InfoTableData
style={{fontWeight: 'bold'}}>{info.startDateTime} ~<br/>{info.endDateTime}</InfoTableData>
<InfoTableData>{info.goal}</InfoTableData>
<InfoTableData>{info.bookingStatus}</InfoTableData>
</tr>
)
})}
</InfoTable>

</WhiteContainer>
</RightContainer>

<InfoTable>
<tr style={{backgroundColor: '#D0B1EE', border: '1px solid #959494', height: '45px'}}>
<th scope="col" style={{width: '20%', border: '1px solid #959494'}}>요청자</th>
<th scope="col" style={{width: '25%', border: '1px solid #959494'}}>예약일자</th>
<th scope="col" style={{width: '43%', border: '1px solid #959494'}}>목적</th>
<th scope="col" style={{width: '12%', border: '1px solid #959494'}}>상태</th>
</tr>
{bookingsInfo.map(function (info) {
return (
<tr style={{border: '1px solid #959494', height: '45px'}}>
<InfoTableData>{info.reservatorName} ({info.reservatorPhone})</InfoTableData>
<InfoTableData
style={{fontWeight: 'bold'}}>{info.startDateTime} ~<br/>{info.endDateTime}
</InfoTableData>
<InfoTableData>{info.memo}</InfoTableData>
<InfoTableData>{info.bookingStatus}</InfoTableData>
</tr>
)
})}
</InfoTable>

</WhiteContainer>
</RightContainer>
)
}

export default CarManageDetail;
3 changes: 1 addition & 2 deletions src/pages/admin/resource/ResourceManageDetail.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -106,12 +106,11 @@ function ResourceManageDetail() {
.then((Response) => {
if (Response.data.status === 200) {
alert('장비을 성공적으로 삭제하였습니다.')
window.history.back()
window.location.href = `/admin/resources`
}
})
.catch((Error) => {
basicError(Error)
console.log(Error)
})
setOptionViewShowing(false)
}
Expand Down

0 comments on commit b5f4e74

Please sign in to comment.