|
|
@ -1,5 +1,6 @@ |
|
|
|
import React, { useEffect, useState, useRef } from 'react'; |
|
|
|
import React, { useEffect, useState, useRef } from 'react'; |
|
|
|
import { useDispatch, useSelector } from 'react-redux'; |
|
|
|
import { useDispatch, useSelector } from 'react-redux'; |
|
|
|
|
|
|
|
import { ConfigProvider } from 'antd'; |
|
|
|
import { Button, Card, CustomInput } from '@component/ui'; |
|
|
|
import { Button, Card, CustomInput } from '@component/ui'; |
|
|
|
import { openModal } from '@src/redux/features/comn/message/messageSlice'; |
|
|
|
import { openModal } from '@src/redux/features/comn/message/messageSlice'; |
|
|
|
import { Form, Input, Select, Table } from 'antd'; |
|
|
|
import { Form, Input, Select, Table } from 'antd'; |
|
|
@ -840,174 +841,196 @@ export default function OperationApprovalsTable(props) { |
|
|
|
}; |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
return ( |
|
|
|
return ( |
|
|
|
<div className='layer-content'> |
|
|
|
<ConfigProvider |
|
|
|
<div className='layer-ti'> |
|
|
|
theme={{ |
|
|
|
<div> |
|
|
|
token: { |
|
|
|
<h4>비행승인 신청 검토결과 목록</h4> |
|
|
|
colorPrimary: '#8a1c05' |
|
|
|
</div> |
|
|
|
// colorBgContainer: '#fff'
|
|
|
|
</div> |
|
|
|
} |
|
|
|
{ismodal && ( |
|
|
|
}} |
|
|
|
<OperationModal |
|
|
|
> |
|
|
|
isModal={ismodal} |
|
|
|
<div className='layer-content'> |
|
|
|
setIsModal={setIsModal} |
|
|
|
<div className='layer-ti'> |
|
|
|
data={validData} |
|
|
|
<div> |
|
|
|
/> |
|
|
|
<h4>비행승인 신청 검토결과 목록</h4> |
|
|
|
)} |
|
|
|
</div> |
|
|
|
{isCheckBoxModal && ( |
|
|
|
|
|
|
|
<OperationCheckBoxModal |
|
|
|
|
|
|
|
checkData={checkData} |
|
|
|
|
|
|
|
setCheckData={setCheckData} |
|
|
|
|
|
|
|
isCheckBoxModal={isCheckBoxModal} |
|
|
|
|
|
|
|
setIsCheckBoxModal={setIsCheckBoxModal} |
|
|
|
|
|
|
|
handlerErrorModal={handlerErrorModal} |
|
|
|
|
|
|
|
handlerSearch={props.handlerSearch} |
|
|
|
|
|
|
|
filterArea={props.filterArea} |
|
|
|
|
|
|
|
filterId={props.filterId} |
|
|
|
|
|
|
|
startDate={props.startDate} |
|
|
|
|
|
|
|
endDate={props.endDate} |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
)} |
|
|
|
|
|
|
|
<div className='search-download'> |
|
|
|
|
|
|
|
<div> |
|
|
|
|
|
|
|
<span className='search-case'> |
|
|
|
|
|
|
|
{formatDate(props.startDate)} |
|
|
|
|
|
|
|
{props.endDate && props.startDate !== props.endDate |
|
|
|
|
|
|
|
? '~' + formatDate(props.endDate) + ' ' |
|
|
|
|
|
|
|
: null} |
|
|
|
|
|
|
|
총 |
|
|
|
|
|
|
|
{approvalCdValue.S + |
|
|
|
|
|
|
|
approvalCdValue.F + |
|
|
|
|
|
|
|
approvalCdValue.U + |
|
|
|
|
|
|
|
approvalCdValue.C} |
|
|
|
|
|
|
|
건 |
|
|
|
|
|
|
|
</span> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div className='download'> |
|
|
|
{ismodal && ( |
|
|
|
<Button color='primary' size='sm' onClick={() => handleCheckbox('S')}> |
|
|
|
<OperationModal |
|
|
|
검토 완료 |
|
|
|
isModal={ismodal} |
|
|
|
</Button> |
|
|
|
setIsModal={setIsModal} |
|
|
|
<Button color='primary' size='sm' onClick={() => handleCheckbox('Q')}> |
|
|
|
data={validData} |
|
|
|
검토 요청 |
|
|
|
/> |
|
|
|
</Button> |
|
|
|
)} |
|
|
|
{/* <Button color='primary' size='sm' onClick={() => handleCheckbox('A')}> |
|
|
|
{isCheckBoxModal && ( |
|
|
|
|
|
|
|
<OperationCheckBoxModal |
|
|
|
|
|
|
|
checkData={checkData} |
|
|
|
|
|
|
|
setCheckData={setCheckData} |
|
|
|
|
|
|
|
isCheckBoxModal={isCheckBoxModal} |
|
|
|
|
|
|
|
setIsCheckBoxModal={setIsCheckBoxModal} |
|
|
|
|
|
|
|
handlerErrorModal={handlerErrorModal} |
|
|
|
|
|
|
|
handlerSearch={props.handlerSearch} |
|
|
|
|
|
|
|
filterArea={props.filterArea} |
|
|
|
|
|
|
|
filterId={props.filterId} |
|
|
|
|
|
|
|
startDate={props.startDate} |
|
|
|
|
|
|
|
endDate={props.endDate} |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
)} |
|
|
|
|
|
|
|
<div className='search-download'> |
|
|
|
|
|
|
|
<div> |
|
|
|
|
|
|
|
<span className='search-case'> |
|
|
|
|
|
|
|
{formatDate(props.startDate)} |
|
|
|
|
|
|
|
{props.endDate && props.startDate !== props.endDate |
|
|
|
|
|
|
|
? '~' + formatDate(props.endDate) + ' ' |
|
|
|
|
|
|
|
: null} |
|
|
|
|
|
|
|
총 |
|
|
|
|
|
|
|
{approvalCdValue.S + |
|
|
|
|
|
|
|
approvalCdValue.F + |
|
|
|
|
|
|
|
approvalCdValue.U + |
|
|
|
|
|
|
|
approvalCdValue.C} |
|
|
|
|
|
|
|
건 |
|
|
|
|
|
|
|
</span> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<div className='download'> |
|
|
|
|
|
|
|
<Button |
|
|
|
|
|
|
|
color='primary' |
|
|
|
|
|
|
|
size='sm' |
|
|
|
|
|
|
|
onClick={() => handleCheckbox('S')} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
검토 완료 |
|
|
|
|
|
|
|
</Button> |
|
|
|
|
|
|
|
<Button |
|
|
|
|
|
|
|
color='primary' |
|
|
|
|
|
|
|
size='sm' |
|
|
|
|
|
|
|
onClick={() => handleCheckbox('Q')} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
검토 요청 |
|
|
|
|
|
|
|
</Button> |
|
|
|
|
|
|
|
{/* <Button color='primary' size='sm' onClick={() => handleCheckbox('A')}> |
|
|
|
재 요청 |
|
|
|
재 요청 |
|
|
|
</Button> */} |
|
|
|
</Button> */} |
|
|
|
<Button color='primary' size='sm' onClick={() => handleCheckbox('A')}> |
|
|
|
<Button |
|
|
|
드론 원스톱 전송 |
|
|
|
color='primary' |
|
|
|
</Button> |
|
|
|
size='sm' |
|
|
|
|
|
|
|
onClick={() => handleCheckbox('A')} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
드론 원스톱 전송 |
|
|
|
|
|
|
|
</Button> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div className='search-case-list'> |
|
|
|
<div className='search-case-list'> |
|
|
|
<div> |
|
|
|
<div> |
|
|
|
<ul> |
|
|
|
<ul> |
|
|
|
<li className='approval'>승인 {approvalCdValue.S}건</li> |
|
|
|
<li className='approval'>승인 {approvalCdValue.S}건</li> |
|
|
|
<li className='not-approved'>미승인 {approvalCdValue.F}건</li> |
|
|
|
<li className='not-approved'>미승인 {approvalCdValue.F}건</li> |
|
|
|
<li className='condition-approved'> |
|
|
|
<li className='condition-approved'> |
|
|
|
조건부 승인 {approvalCdValue.C}건 |
|
|
|
조건부 승인 {approvalCdValue.C}건 |
|
|
|
</li> |
|
|
|
</li> |
|
|
|
<li className='non-target'>비대상 {approvalCdValue.U}건</li> |
|
|
|
<li className='non-target'>비대상 {approvalCdValue.U}건</li> |
|
|
|
<li className='sent'>전송 0건</li> |
|
|
|
<li className='sent'>전송 0건</li> |
|
|
|
<li className='not-sent'>미 전송 0건</li> |
|
|
|
<li className='not-sent'>미 전송 0건</li> |
|
|
|
</ul> |
|
|
|
</ul> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div className='invoice-list-wrapper'> |
|
|
|
<div className='invoice-list-wrapper'> |
|
|
|
<Card> |
|
|
|
<Card> |
|
|
|
<div className='invoice-list-dataTable flight-approval'> |
|
|
|
<div className='invoice-list-dataTable flight-approval'> |
|
|
|
{laancAprvList?.length > 0 ? ( |
|
|
|
{laancAprvList?.length > 0 ? ( |
|
|
|
<Form form={form} component={false}> |
|
|
|
<Form form={form} component={false}> |
|
|
|
<ScrollContainer |
|
|
|
<ScrollContainer |
|
|
|
className='scroll-container' |
|
|
|
className='scroll-container' |
|
|
|
ref={scrollContainerRef} |
|
|
|
ref={scrollContainerRef} |
|
|
|
hideScrollbars={false} |
|
|
|
hideScrollbars={false} |
|
|
|
vertical={true} |
|
|
|
vertical={true} |
|
|
|
horizontal={true} |
|
|
|
horizontal={true} |
|
|
|
activationDistance={10} |
|
|
|
activationDistance={10} |
|
|
|
ignoreElements='.editable-input' // 이 클래스의 요소는 드래그 이벤트에서 제외
|
|
|
|
ignoreElements='.editable-input' // 이 클래스의 요소는 드래그 이벤트에서 제외
|
|
|
|
> |
|
|
|
> |
|
|
|
<div style={{ width: '2000px' }}> |
|
|
|
<div style={{ width: '2000px' }}> |
|
|
|
<Form form={form}> |
|
|
|
<Form form={form}> |
|
|
|
<Table |
|
|
|
<Table |
|
|
|
components={{ |
|
|
|
components={{ |
|
|
|
body: { |
|
|
|
body: { |
|
|
|
cell: EditableCell |
|
|
|
cell: EditableCell |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}} |
|
|
|
|
|
|
|
dataSource={laancAprvList |
|
|
|
|
|
|
|
.map((item, index) => |
|
|
|
|
|
|
|
item.areaList.map((area, index) => ({ |
|
|
|
|
|
|
|
...area, |
|
|
|
|
|
|
|
key: `${area.planAreaSno}` |
|
|
|
|
|
|
|
})) |
|
|
|
|
|
|
|
) |
|
|
|
|
|
|
|
.flat()} |
|
|
|
|
|
|
|
columns={mergedColumns} |
|
|
|
|
|
|
|
rowClassName={record => { |
|
|
|
|
|
|
|
let className = ''; |
|
|
|
|
|
|
|
if (record?.approvalCd === 'S') { |
|
|
|
|
|
|
|
className += 'flight-approval-row editable-row'; |
|
|
|
|
|
|
|
} else if (record.approvalCd === 'F') { |
|
|
|
|
|
|
|
className += 'flight-not-approval-row editable-row'; |
|
|
|
|
|
|
|
} else if (record.approvalCd === 'C') { |
|
|
|
|
|
|
|
className += |
|
|
|
|
|
|
|
'flight-condition-approval-row editable-row'; |
|
|
|
|
|
|
|
} else className += 'editable-row'; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
if (props.selected?.length > 0) { |
|
|
|
|
|
|
|
if (record.planAreaSno === props.selected[0]) { |
|
|
|
|
|
|
|
className += ' flight-approval-row-click'; |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
}} |
|
|
|
|
|
|
|
dataSource={laancAprvList |
|
|
|
if (record.length > 1) { |
|
|
|
.map((item, index) => |
|
|
|
className += 'expanded-tr'; |
|
|
|
item.areaList.map((area, index) => ({ |
|
|
|
} |
|
|
|
...area, |
|
|
|
return className; |
|
|
|
key: `${area.planAreaSno}` |
|
|
|
}} |
|
|
|
})) |
|
|
|
onRow={record => ({ |
|
|
|
) |
|
|
|
onClick: event => { |
|
|
|
.flat()} |
|
|
|
handleRowClick(record); |
|
|
|
columns={mergedColumns} |
|
|
|
} |
|
|
|
rowClassName={record => { |
|
|
|
})} |
|
|
|
let className = ''; |
|
|
|
rowSelection={{ |
|
|
|
if (record?.approvalCd === 'S') { |
|
|
|
...rowSelection |
|
|
|
className += 'flight-approval-row editable-row'; |
|
|
|
}} |
|
|
|
} else if (record.approvalCd === 'F') { |
|
|
|
loading={laancAprvLoading} |
|
|
|
className += |
|
|
|
scroll={{ |
|
|
|
'flight-not-approval-row editable-row'; |
|
|
|
x: 1700 |
|
|
|
} else if (record.approvalCd === 'C') { |
|
|
|
}} |
|
|
|
className += |
|
|
|
rowHoverable={false} |
|
|
|
'flight-condition-approval-row editable-row'; |
|
|
|
expandIconColumnIndex={-1} |
|
|
|
} else className += 'editable-row'; |
|
|
|
onChange={(pagination, filters, sorter, extra) => { |
|
|
|
|
|
|
|
handlePageChange(); |
|
|
|
if (props.selected?.length > 0) { |
|
|
|
}} |
|
|
|
if (record.planAreaSno === props.selected[0]) { |
|
|
|
pagination={{ |
|
|
|
className += ' flight-approval-row-click'; |
|
|
|
position: ['bottomLeft'] |
|
|
|
} |
|
|
|
}} |
|
|
|
} |
|
|
|
/> |
|
|
|
|
|
|
|
</Form> |
|
|
|
if (record.length > 1) { |
|
|
|
</div> |
|
|
|
className += 'expanded-tr'; |
|
|
|
</ScrollContainer> |
|
|
|
} |
|
|
|
{modal && ( |
|
|
|
return className; |
|
|
|
<ConfirmModal |
|
|
|
}} |
|
|
|
modal={modal} |
|
|
|
onRow={record => ({ |
|
|
|
setModal={setModal} |
|
|
|
onClick: event => { |
|
|
|
handlerConfirm={() => handleSave(modal.row)} |
|
|
|
handleRowClick(record); |
|
|
|
color='primary' |
|
|
|
} |
|
|
|
/> |
|
|
|
})} |
|
|
|
)} |
|
|
|
rowSelection={{ |
|
|
|
</Form> |
|
|
|
...rowSelection |
|
|
|
) : ( |
|
|
|
}} |
|
|
|
<div |
|
|
|
loading={laancAprvLoading} |
|
|
|
className='d-flex justify-content-center align-items-center ' |
|
|
|
scroll={{ |
|
|
|
style={{ height: '100px', color: '#000' }} |
|
|
|
x: 1700 |
|
|
|
> |
|
|
|
}} |
|
|
|
<p>비행승인 신청 건수가 없습니다.</p> |
|
|
|
rowHoverable={false} |
|
|
|
</div> |
|
|
|
expandIconColumnIndex={-1} |
|
|
|
)} |
|
|
|
onChange={(pagination, filters, sorter, extra) => { |
|
|
|
</div> |
|
|
|
handlePageChange(); |
|
|
|
</Card> |
|
|
|
}} |
|
|
|
|
|
|
|
pagination={{ |
|
|
|
|
|
|
|
position: ['bottomLeft'] |
|
|
|
|
|
|
|
}} |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
</Form> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</ScrollContainer> |
|
|
|
|
|
|
|
{modal && ( |
|
|
|
|
|
|
|
<ConfirmModal |
|
|
|
|
|
|
|
modal={modal} |
|
|
|
|
|
|
|
setModal={setModal} |
|
|
|
|
|
|
|
handlerConfirm={() => handleSave(modal.row)} |
|
|
|
|
|
|
|
color='primary' |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
)} |
|
|
|
|
|
|
|
</Form> |
|
|
|
|
|
|
|
) : ( |
|
|
|
|
|
|
|
<div |
|
|
|
|
|
|
|
className='d-flex justify-content-center align-items-center ' |
|
|
|
|
|
|
|
style={{ height: '100px', color: '#000' }} |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
<p>비행승인 신청 건수가 없습니다.</p> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
)} |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</Card> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</ConfigProvider> |
|
|
|
); |
|
|
|
); |
|
|
|
} |
|
|
|
} |
|
|
|