sanguu516
3 months ago
12 changed files with 6516 additions and 2125 deletions
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,137 @@ |
|||||||
|
import { useEffect, useState } from 'react'; |
||||||
|
import dayjs from 'dayjs'; |
||||||
|
import { useDispatch } from '@src/redux/store'; |
||||||
|
import { getLaancAprvList } from '@src/redux/features/laanc/laancThunk'; |
||||||
|
import FlightApprovalsTable from '@src/components/flight/FlightApprovalsTable'; |
||||||
|
import FlightApprovalsReport from '@src/components/flight/FlightApprovalsReport'; |
||||||
|
|
||||||
|
function RightMenuContainer() { |
||||||
|
const [filter, setFilter] = useState(''); |
||||||
|
const [startDate, setStartDate] = useState(dayjs().format('YYYY-MM-DD')); |
||||||
|
const [endDate, setEndDate] = useState(); |
||||||
|
const [selected, setSelected] = useState(null); |
||||||
|
|
||||||
|
const dispatch = useDispatch(); |
||||||
|
|
||||||
|
useEffect(() => { |
||||||
|
handlerOpnerPostMessage('initalState', null); |
||||||
|
window.addEventListener('message', opnerMessage); |
||||||
|
|
||||||
|
return () => { |
||||||
|
window.removeEventListener('message', opnerMessage); |
||||||
|
}; |
||||||
|
}, []); |
||||||
|
|
||||||
|
const opnerMessage = e => { |
||||||
|
const { type } = e.data; |
||||||
|
const { payload } = e.data; |
||||||
|
|
||||||
|
switch (type) { |
||||||
|
case 'initalState': |
||||||
|
setFilter(payload.filter); |
||||||
|
setSelected(payload.selected); |
||||||
|
setStartDate(payload.startDate); |
||||||
|
setEndDate(payload.endDate); |
||||||
|
|
||||||
|
return; |
||||||
|
case 'handlerSearchRs': |
||||||
|
console.log(payload.filter); |
||||||
|
setFilter(payload.filter); |
||||||
|
|
||||||
|
return; |
||||||
|
default: |
||||||
|
break; |
||||||
|
} |
||||||
|
}; |
||||||
|
|
||||||
|
const handlerOpnerPostMessage = (type, payload) => { |
||||||
|
switch (type) { |
||||||
|
case 'initalState': |
||||||
|
window.opener.postMessage({ type, payload }); |
||||||
|
return; |
||||||
|
case 'search': |
||||||
|
window.opener.postMessage({ type, payload }); |
||||||
|
return; |
||||||
|
case 'detail': |
||||||
|
window.opener.postMessage({ type, payload }); |
||||||
|
return; |
||||||
|
case 'closedSync': |
||||||
|
window.opener.postMessage({ type, payload }); |
||||||
|
default: |
||||||
|
break; |
||||||
|
} |
||||||
|
}; |
||||||
|
|
||||||
|
const handlerSearch = (search, searchDate, filterArea) => { |
||||||
|
if ( |
||||||
|
search != '' && |
||||||
|
(search === '승인' || search === '미승인' || search === '비대상') |
||||||
|
) { |
||||||
|
dispatch( |
||||||
|
getLaancAprvList({ |
||||||
|
searchStDt: searchDate.startDate, |
||||||
|
searchEndDt: searchDate.endDate, |
||||||
|
selectZone: filterArea, |
||||||
|
approvalCd: search === '승인' ? 'S' : search === '미승인' ? 'F' : 'U' |
||||||
|
}) |
||||||
|
); |
||||||
|
} else if (search != '') { |
||||||
|
dispatch( |
||||||
|
getLaancAprvList({ |
||||||
|
searchStDt: searchDate.startDate, |
||||||
|
searchEndDt: searchDate.endDate, |
||||||
|
selectZone: filterArea, |
||||||
|
applyNo: search |
||||||
|
}) |
||||||
|
); |
||||||
|
} else { |
||||||
|
dispatch( |
||||||
|
getLaancAprvList({ |
||||||
|
searchStDt: searchDate.startDate, |
||||||
|
searchEndDt: searchDate.endDate, |
||||||
|
selectZone: filterArea |
||||||
|
}) |
||||||
|
); |
||||||
|
} |
||||||
|
localStorage.setItem( |
||||||
|
'popupState', |
||||||
|
JSON.stringify({ |
||||||
|
filter: search, |
||||||
|
selected: filterArea, |
||||||
|
startDate: searchDate.startDate, |
||||||
|
endDate: searchDate.endDate |
||||||
|
}) |
||||||
|
); |
||||||
|
handlerOpnerPostMessage('search', { search, searchDate, filterArea }); |
||||||
|
}; |
||||||
|
|
||||||
|
const handlerDetail = area => { |
||||||
|
handlerOpnerPostMessage('detail', { area }); |
||||||
|
}; |
||||||
|
|
||||||
|
const handleBeforeUnload = () => { |
||||||
|
handlerOpnerPostMessage('closedSync', ''); |
||||||
|
}; |
||||||
|
|
||||||
|
return ( |
||||||
|
<div className='right-menu active'> |
||||||
|
<div |
||||||
|
className='right-layer active flight-approval-layer' |
||||||
|
style={{ width: '100vw' }} |
||||||
|
> |
||||||
|
<div className='layer-content'> |
||||||
|
<FlightApprovalsReport handlerSearch={handlerSearch} /> |
||||||
|
<FlightApprovalsTable |
||||||
|
filter={filter} |
||||||
|
startDate={startDate} |
||||||
|
endDate={endDate} |
||||||
|
selected={selected} |
||||||
|
handlerDetail={handlerDetail} |
||||||
|
/> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
); |
||||||
|
} |
||||||
|
|
||||||
|
export default RightMenuContainer; |
@ -0,0 +1,13 @@ |
|||||||
|
import '@styles/react/libs/flatpickr/flatpickr.scss'; |
||||||
|
import '@styles/react/libs/tables/react-dataTable-component.scss'; |
||||||
|
import '../assets/css/custom.css'; |
||||||
|
import RightMenuContainer from '../containers/rightMenuContainer'; |
||||||
|
import FlightApprovalsContainer from '../containers/flight/flightApprovalsContainer'; |
||||||
|
|
||||||
|
export default function rightMenuView() { |
||||||
|
return ( |
||||||
|
<div className='pal-container'> |
||||||
|
<RightMenuContainer /> |
||||||
|
</div> |
||||||
|
); |
||||||
|
} |
Loading…
Reference in new issue