|
|
|
@ -36,12 +36,14 @@ export default function FlightApprovalsTable(props) {
|
|
|
|
|
classNames: ['flight-approval-row'] |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
when: row => row.areaList[0].planAreaSno === props.selected, |
|
|
|
|
classNames: ['flight-approval-row-click'] |
|
|
|
|
when: row => |
|
|
|
|
row.areaList[0].planAreaSno === props.selected && !row.isExpandableRow, |
|
|
|
|
style: row => ({ border: '2px solid #000', cursor: 'pointer' }) |
|
|
|
|
// classNames: ['flight-approval-row-click']
|
|
|
|
|
} |
|
|
|
|
]; |
|
|
|
|
|
|
|
|
|
const infoRowStyles = [ |
|
|
|
|
const inConditionalRowStyles = [ |
|
|
|
|
{ |
|
|
|
|
when: row => row.approvalCd === 'F', |
|
|
|
|
classNames: ['flight-not-approval-row'] |
|
|
|
@ -156,9 +158,9 @@ export default function FlightApprovalsTable(props) {
|
|
|
|
|
width: '120px', |
|
|
|
|
cell: row => |
|
|
|
|
row.areaList.length > 1 ? ( |
|
|
|
|
<Button color='flat-dark' onClick={() => toggleRow(row.applyNo)}> |
|
|
|
|
{row.areaList.length}건 더 보기 |
|
|
|
|
{expandedRows[row.applyNo] ? <FaAngleDown /> : <FaAngleUp />} |
|
|
|
|
<Button color='flat-dark' onClick={() => toggleRow(row.planSno)}> |
|
|
|
|
{row.areaList.length - 1}건 더 보기 |
|
|
|
|
{expandedRows[row.planSno] ? <FaAngleDown /> : <FaAngleUp />} |
|
|
|
|
</Button> |
|
|
|
|
) : ( |
|
|
|
|
'-' |
|
|
|
@ -283,14 +285,17 @@ export default function FlightApprovalsTable(props) {
|
|
|
|
|
} |
|
|
|
|
]; |
|
|
|
|
|
|
|
|
|
// 테이블 내부 행 클릭 이벤트
|
|
|
|
|
const handleInRowClick = row => { |
|
|
|
|
props.handlerDetail(row); |
|
|
|
|
}; |
|
|
|
|
// 테이블 행 클릭 이벤트
|
|
|
|
|
const handleRowClick = row => { |
|
|
|
|
props.handlerDetail(row.areaList[0]); |
|
|
|
|
// 여기에 클릭 이벤트를 처리하는 코드를 작성하세요.
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
// 데이터 테이블 내부 컴포넌트
|
|
|
|
|
const FlightInfoComponent = ({ data }) => { |
|
|
|
|
return ( |
|
|
|
|
<> |
|
|
|
@ -300,7 +305,7 @@ export default function FlightApprovalsTable(props) {
|
|
|
|
|
noTableHead={true} |
|
|
|
|
data={data.areaList.slice(1)} |
|
|
|
|
columns={nestedColumns} |
|
|
|
|
conditionalRowStyles={infoRowStyles} |
|
|
|
|
conditionalRowStyles={inConditionalRowStyles} |
|
|
|
|
onRowClicked={handleInRowClick} |
|
|
|
|
/> |
|
|
|
|
</div> |
|
|
|
@ -308,6 +313,7 @@ export default function FlightApprovalsTable(props) {
|
|
|
|
|
); |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
// 날짜 포맷 변경
|
|
|
|
|
const formatDate = dateString => { |
|
|
|
|
const date = new Date(dateString); |
|
|
|
|
const year = date.getFullYear(); |
|
|
|
@ -316,10 +322,12 @@ export default function FlightApprovalsTable(props) {
|
|
|
|
|
return `${year} 년 ${month} 월 ${day} 일`; |
|
|
|
|
}; |
|
|
|
|
|
|
|
|
|
// 승인, 미승인, 비대상 건수 계산
|
|
|
|
|
useEffect(() => { |
|
|
|
|
resApprovalCd(); |
|
|
|
|
}, [laancAprvList]); |
|
|
|
|
|
|
|
|
|
// 승인, 미승인, 비대상 건수 계산
|
|
|
|
|
const resApprovalCd = () => { |
|
|
|
|
let approvalCdValue = { S: 0, F: 0, U: 0 }; |
|
|
|
|
|
|
|
|
@ -377,7 +385,7 @@ export default function FlightApprovalsTable(props) {
|
|
|
|
|
FlightInfoComponent={FlightInfoComponent} |
|
|
|
|
handleRowClick={handleRowClick} |
|
|
|
|
expandableRowExpanded={row => |
|
|
|
|
expandedRows[row.applyNo] || false |
|
|
|
|
expandedRows[row.planSno] || false |
|
|
|
|
} |
|
|
|
|
paginationPerPage={20} |
|
|
|
|
/> |
|
|
|
|