diff --git a/src/components/flight/ControlApprovalsTable.js b/src/components/flight/ControlApprovalsTable.js index 7460eae1..912ae453 100644 --- a/src/components/flight/ControlApprovalsTable.js +++ b/src/components/flight/ControlApprovalsTable.js @@ -3,14 +3,14 @@ import { useDispatch, useSelector } from 'react-redux'; import { Button, Card } from '@component/ui'; import { openModal } from '@src/redux/features/comn/message/messageSlice'; import { FaAngleDown, FaAngleUp } from 'react-icons/fa'; -import { Form, Input, Table, Typography } from 'antd'; +import { Form, Input, Table, Select } from 'antd'; import { HOST } from '../../configs/constants'; import axios from 'axios'; import { getAccessToken } from '../../utility/authService/jwtTokenUtil'; import { updateLaancAprv, getLaancAprvList, - updateLaancAprvReview + updateLaancCAprvReview } from '@src/redux/features/laanc/laancThunk'; import { ERROR_MESSAGE, ERROR_TITLE } from '@src/configs/msgConst'; import ScrollContainer from 'react-indiana-drag-scroll'; @@ -33,23 +33,14 @@ export default function ControlApprovalsTable(props) { const scrollContainerRef = useRef(null); - // 확장된 행 키 - const [expandedRowKeys, setExpandedRowKeys] = useState([]); - // 수정 키 const [editingKey, setEditingKey] = useState(''); - // select row key - const [selectedRowKey, setSelectedRowKey] = useState(''); - const [form] = Form.useForm(); // 체크박스 선택 const [checkList, setCheckList] = useState([]); - // 수정 키 확인 - const isEditing = record => record.key === editingKey; - useEffect(() => { let approvalCdValue = { S: 0, F: 0, C: 0, U: 0 }; @@ -79,61 +70,91 @@ export default function ControlApprovalsTable(props) { } }, [laancAprvList]); - // 수정 이벤트 - const edit = record => { - form.setFieldsValue({ - planAreaSno: record.planAreaSno, - reqRadius: record.reqRadius, - fltElev: record.fltElev, - dtl: record.dtl, - era: record.era, - rm: record.rm, - reqRadius: record.reqRadius, - reqElev: record.reqElev, - ...record - }); - setEditingKey(record.key); - }; - - // 취소 이벤트 - const cancel = () => { - setEditingKey(''); - }; - - // 저장 이벤트 - const save = async (key, type) => { - try { - const row = await form.validateFields(); - const index = { ...row, planAreaSno: selectedRowKey }; + // input 수정 컴포넌트 + const EditableCell = ({ + editable, + children, + dataIndex, + record, + handleSave, + ...restProps + }) => { + // 저장 이벤트 + const save = async () => { + try { + const values = await form.validateFields(); + + handleSave({ ...record, ...values }); + } catch (errInfo) {} + }; - const updateRes = await dispatch( - updateLaancAprv([ - { - planAreaSno: selectedRowKey, - reqRadius: row.reqRadius || '', - fltElev: row.fltElev || '', - dtl: row.dtl || '', - era: row.era || '', - rm: row.rm || '', - reqRadius: row.reqRadius || '', - reqElev: row.reqElev || '' - } - ]) + let childNode = children; + + if (editable) { + childNode = ( + e.stopPropagation()} // 클릭 이벤트 전파 중지 + > + + ); + } - if (updateRes.meta.requestStatus === 'fulfilled') { - setEditingKey(''); - await dispatch( - getLaancAprvList({ - searchStDt: props.startDate, - searchEndDt: props.endDate - }) - ); - } else { - handlerErrorModal(ERROR_TITLE, ERROR_MESSAGE, true); + return {childNode}; + }; + + // 검토 상태 변경 + const handlerReviewed = (value, type) => { + let text = ''; + if (type === 'operation') { + switch (value) { + case 'W': + text = '대기'; + break; + case 'Q': + text = '검토요청'; + break; + case 'A': + text = '재검토요청'; + break; + case 'S': + text = '완료'; + break; + case 'C': + text = '검토요청취소'; + break; + case 'U': + text = '불필요'; + break; + case 'P': + text = '검토요청처리'; + break; + default: + text = '-'; } - } catch (errInfo) { - handlerErrorModal(ERROR_TITLE, ERROR_MESSAGE, true); + return text; + } else if (type === 'control') { + switch (value) { + case 'R': + text = '재검토'; + break; + case 'W': + text = '검토대기'; + break; + case 'C': + text = '검토취소'; + break; + case 'P': + text = '요청처리'; + break; + + default: + text = '-'; + } + return text; } }; @@ -160,7 +181,7 @@ export default function ControlApprovalsTable(props) { dataIndex: 'applyDtMonth', width: '70px', align: 'center', - render: text => `${text}월` + render: applyDtMonth => `${applyDtMonth}월` }, { title: ( @@ -172,7 +193,7 @@ export default function ControlApprovalsTable(props) { width: '70px', align: 'center', - render: text => `${text}일` + render: applyDtDay => `${applyDtDay}일` }, { title: ( @@ -181,18 +202,17 @@ export default function ControlApprovalsTable(props) { 구역 수 ), - dataIndex: 'areaList', + dataIndex: 'zoneNo', align: 'center', width: '85px', - render: areaList => <>총{areaList.length}건 + render: zoneNo => <>{zoneNo}구역 }, { title: <>신청자, dataIndex: 'applyNm', width: '90px', align: 'center', - - render: text => (text ? text : '-') + render: applyNm => applyNm ?? '-' }, { title: ( @@ -201,13 +221,11 @@ export default function ControlApprovalsTable(props) { 구역 1 ), - dataIndex: 'areaList', + dataIndex: 'addr1', width: '90px', align: 'center', - render: areaList => { - return areaList.length <= 1 && areaList[0].addr1 - ? areaList[0].addr1 - : '-'; + render: addr1 => { + return addr1 ?? '-'; } }, { @@ -217,43 +235,42 @@ export default function ControlApprovalsTable(props) { 구역 2 ), - dataIndex: 'areaList', + dataIndex: 'addr2', width: '90px', align: 'center', - render: areaList => { - return areaList.length <= 1 && areaList[0].addr2 - ? areaList[0].addr2 - : '-'; + render: addr2 => { + return addr2 ?? '-'; } }, { title: ( <> - 상세
+ 상세 +
주소 ), - dataIndex: 'areaList', + dataIndex: 'addr3', width: '100px', align: 'center', - render: areaList => { - return areaList.length <= 1 && areaList[0].addr3 - ? areaList[0].addr3 - : '-'; + render: addr3 => { + return addr3 ?? '-'; } }, { title: ( <> - 장애물
+ 장애물 +
제한 표면 ), - dataIndex: 'areaList', + dataIndex: 'limitZoneNm', width: '100px', align: 'center', - render: areaList => { - return areaList.length <= 1 ? areaList[0].limitZoneNm : '-'; + render: limitZoneNm => { + return limitZoneNm ?? '-'; + // return areaList.length <= 1 ? areaList[0].limitZoneNm : '-'; } }, { @@ -264,18 +281,16 @@ export default function ControlApprovalsTable(props) { (위도, 경도) ), - dataIndex: 'areaList', + dataIndex: 'planAreaSno', align: 'center', width: '90px', - render: areaList => { - return areaList.length <= 1 ? ( + render: (text, record) => { + return ( <> - {areaList[0].lat.toFixed(5)}, + {record.lat.toFixed(5)},
- {areaList[0].lon.toFixed(5)} + {record.lon.toFixed(5)} - ) : ( - '-' ); } }, @@ -290,8 +305,8 @@ export default function ControlApprovalsTable(props) { dataIndex: 'bufferZone', align: 'center', width: '80px', - render: (text, record) => { - return text ? text : '-'; + render: (bufferZone, record) => { + return bufferZone ?? '-'; } }, { @@ -306,8 +321,8 @@ export default function ControlApprovalsTable(props) { align: 'center', width: '80px', editable: true, - render: (text, record) => { - return text ? text : '-'; + render: (reqRadius, record) => { + return reqRadius ?? '-'; } }, { @@ -321,8 +336,8 @@ export default function ControlApprovalsTable(props) { dataIndex: 'allowRadius', align: 'center', width: '80px', - render: (text, record) => { - return text ? text : '-'; + render: (allowRadius, record) => { + return allowRadius ?? '-'; } }, { @@ -337,8 +352,8 @@ export default function ControlApprovalsTable(props) { align: 'center', width: '80px', editable: true, - render: (text, record) => { - return text ? text : '-'; + render: (fltElev, record) => { + return fltElev ?? '-'; } }, { @@ -353,8 +368,8 @@ export default function ControlApprovalsTable(props) { align: 'center', width: '80px', editable: true, - render: (text, record) => { - return text ? text : '-'; + render: (reqElev, record) => { + return reqElev ?? '-'; } }, { @@ -368,8 +383,8 @@ export default function ControlApprovalsTable(props) { dataIndex: 'fltElevMax', align: 'center', width: '120px', - render: (text, record) => { - return text ? text : '-'; + render: (fltElevMax, record) => { + return fltElevMax ?? '-'; } }, { @@ -379,18 +394,16 @@ export default function ControlApprovalsTable(props) { editable: true, width: '110px', render: dtl => { - return dtl ? dtl : '-'; + return dtl ?? '-'; } }, { title: <>비행 목적, - dataIndex: 'areaList', + dataIndex: 'purpose', align: 'center', width: '110px', - render: areaList => { - return areaList.length <= 1 && areaList[0].purpose - ? areaList[0].purpose - : '-'; + render: purpose => { + return purpose ?? '-'; } }, { @@ -406,7 +419,7 @@ export default function ControlApprovalsTable(props) { width: '110px', editable: true, render: era => { - return era ? era : '-'; + return era ?? '-'; } }, { @@ -416,158 +429,125 @@ export default function ControlApprovalsTable(props) { width: '110px', editable: true, render: rm => { - return rm ? rm : '-'; + return rm ?? '-'; } }, { - title: <>검토 결과, - dataIndex: 'areaList', + title: ( + <> + LAANC +
+ 검토 결과 + + ), + dataIndex: 'approvalCd', align: 'center', width: '140px', - render: areaList => { - const approvalCounts = areaList.reduce( - (counts, item) => { - if (item.approvalCd === 'U') { - counts.unapproved += 1; - } else if (item.approvalCd === 'S') { - counts.approved += 1; - } else if (item.approvalCd === 'C') { - counts.conditionalapproval += 1; - } else { - counts.pending += 1; - } - return counts; - }, - { unapproved: 0, approved: 0, pending: 0, conditionalapproval: 0 } - ); - + render: approvalCd => { return ( <> - {areaList.length > 1 ? ( - <> - 승인: {approvalCounts.approved}건
- 미승인: - {approvalCounts.pending}건 -
- 조건부승인:{approvalCounts.conditionalapproval}건
- 비대상: - {approvalCounts.unapproved}건 - - ) : ( - <> - {areaList[0].approvalCd === 'U' - ? '비대상' - : areaList[0].approvalCd === 'S' - ? '승인' - : areaList[0].approvalCd === 'C' - ? '조건부승인' - : '미승인'} - - )} + {approvalCd === 'U' + ? '비대상' + : approvalCd === 'S' + ? '승인' + : approvalCd === 'C' + ? '조건부승인' + : '미승인'} ); } }, { - title: <>더보기, - dataIndex: 'areaList', + title: ( + <> + 관제과 +
+ 확인결과 + + ), + dataIndex: 'reviewedProcType', align: 'center', width: '130px', - render: (areaList, record) => - areaList.length > 1 ? ( - - ) : ( - <>- - ) - }, - { - title: '편집', - dataIndex: 'planAreaSno', - align: 'center', - width: '110px', - render: (_, record) => { - const editable = isEditing(record); - return record.areaList.length <= 1 ? ( - editable ? ( - - save(record.key, 'outer')} - style={{ - marginRight: 8 - }} - > - 저장 - - cancel()}>취소 - - ) : ( - - ) - ) : ( - <>- + render: (reviewedProcType, record) => { + const handleMouseDown = e => { + e.stopPropagation(); // 이벤트 전파 중지 + }; + return ( + <> + + ); } }, { title: ( <> + 운항과 +
확인
결과 ), - dataIndex: 'areaList', + dataIndex: 'reviewedType', align: 'center', width: '130px', - render: (areaList, record) => - areaList.length <= 1 ? ( - areaList[0].reviewedType === 'R' ? ( - '검토완료' - ) : areaList[0].reviewedType === 'C' ? ( - '요청반려' - ) : areaList[0].reviewedType === 'Q' ? ( - '검토요청' - ) : areaList[0].reviewedType === 'A' ? ( - '검토재요청' - ) : ( - - ) + render: (reviewedType, record) => { + return reviewedType !== 'R' ? ( + <>{handlerReviewed(reviewedType, 'operation')} ) : ( - <>- - ) + + ); + } + }, + { + title: ( + <> + 전송 +
+ 상태 + + ), + dataIndex: 'planAreaSno', + width: '100px', + align: 'center', + render: planAreaSno => { + return '미전송'; + } } ]; @@ -580,374 +560,37 @@ export default function ControlApprovalsTable(props) { }) ); }; - // 확장된 테이블 데이터 - const expandedRowRender = record => { - const childColumns = [ - { - dataIndex: 'applyNo', - width: '60px', - align: 'center' - }, - { - dataIndex: 'applyDtMonth', - width: '70px', - align: 'center', - - render: text => `${text}월` - }, - { - dataIndex: 'applyDtDay', - width: '70px', - align: 'center', - render: text => `${text}일` - }, - { - dataIndex: 'zoneNo', - align: 'center', - width: '85px', - render: text => { - return <>구역{text}; - } - }, - { - dataIndex: 'applyNm', - align: 'center', - width: '90px', - render: text => { - return text ? text : '-'; - } - }, - { - dataIndex: 'addr1', - align: 'center', - width: '90px', - render: text => { - return text ? text : <>-; - } - }, - { - dataIndex: 'addr2', - align: 'center', - width: '90px', - render: text => { - return text ? text : <>-; - } - }, - { - dataIndex: 'addr3', - align: 'center', - width: '100px', - render: text => { - return text ? text : <>-; - } - }, - { - dataIndex: 'limitZoneNm', - align: 'center', - width: '100px', - render: text => { - return text ? text : <>-; - } - }, + const handleSave = async row => { + try { + const updateRes = await dispatch( + updateLaancAprv([ + { + planAreaSno: row.key, + reqRadius: row[`${row.key}_reqRadius`] || '', + fltElev: row[`${row.key}_fltElev`] || '', + reqElev: row[`${row.key}_reqElev`] || '', + dtl: row[`${row.key}_dtl`] || '', + era: row[`${row.key}_era`] || '', + rm: row[`${row.key}_rm`] || '' + } + ]) + ); - { - align: 'center', - width: '90px', - dataIndex: ['lat', 'lon'], - render: (text, record) => { - const lat = record.lat; - const lon = record.lon; - return ( - <> - {lat.toFixed(5)},
- {lon.toFixed(5)} - - ); - } - }, - { - dataIndex: 'bufferZone', - align: 'center', - width: '80px', - render: text => { - return text ? text : <>-; - } - }, - { - dataIndex: 'reqRadius', - align: 'center', - editable: true, - width: '80px', - render: text => { - return text ? text : <>-; - } - }, - { - dataIndex: 'allowRadius', - align: 'center', - width: '80px', - render: text => { - return text ? text : <>-; - } - }, - { - dataIndex: 'fltElev', - align: 'center', - editable: true, - width: '80px', - render: text => { - return text ? text : <>-; - } - }, - { - dataIndex: 'reqElev', - align: 'center', - width: '80px', - editable: true, - render: text => { - return text ? text : <>-; - } - }, - { - dataIndex: 'fltElevMax', - align: 'center', - width: '90px', - render: text => { - return text ? text : <>-; - } - }, - { - dataIndex: 'dtl', - align: 'center', - editable: true, - width: '110px', - render: text => { - return text ? text : <>-; - } - }, - { - dataIndex: 'purpose', - align: 'center', - width: '110px', - render: text => { - return text ? text : <>-; - } - }, - { - dataIndex: 'era', - align: 'center', - editable: true, - width: '110px', - render: text => { - return text ? text : <>-; - } - }, - { - dataIndex: 'rm', - align: 'center', - editable: true, - width: '110px', - render: text => { - return text ? text : <>-; - } - }, - { - dataIndex: 'approvalCd', - align: 'center', - width: '140px', - render: text => ( - <> - {text === 'U' - ? '비대상' - : text === 'S' - ? '승인' - : text === 'C' - ? '조건부승인' - : '미승인'} - - ) - }, - { - dataIndex: '더보기', - align: 'center', - width: '130px', - render: text => { - return <>-; - } - }, - { - dataIndex: 'planAreaSno', - align: 'center', - width: '110px', - render: (_, record) => { - const editable = isEditing(record); - return editable ? ( - - save(record.key, 'inner')} - style={{ - marginRight: 8 - }} - > - 저장 - - cancel()}>취소 - - ) : ( - - ); - } - }, - { - dataIndex: 'reviewedType', - align: 'center', - width: '130px', - render: (text, record) => { - return text === 'R' ? ( - '검토완료' - ) : text === 'C' ? ( - '요청반려' - ) : text === 'Q' ? ( - '검토요청' - ) : text === 'A' ? ( - '검토재요청' - ) : ( - - ); - } + if (updateRes.meta.requestStatus === 'fulfilled') { + setEditingKey(''); + await dispatch( + getLaancAprvList({ + searchStDt: props.startDate, + searchEndDt: props.endDate + }) + ); + } else { + handlerErrorModal(ERROR_TITLE, ERROR_MESSAGE, true); } - ]; - - const data = []; - record.areaList.map((item, index) => { - data.push({ - key: `${item.planSno}`, - applyNo: item.applyNo, - applyDt: item.applyDt, - zoneNo: item.zoneNo, - lat: item.lat, - lon: item.lon, - applyDtDay: item.applyDtDay, - applyDtMonth: item.applyDtMonth, - bufferZone: item.bufferZone, - fltElev: item.fltElev, - rm: item.rm, - era: item.era, - reqElev: item.reqElev, - reqRadius: item.reqRadius, - allowRadius: item.allowRadius, - fltElevMax: item.fltElevMax, - purpose: item.purpose, - reviewedType: item.reviewedType, - applyNm: item.applyNm, - dtl: item.dtl, - approvalCd: item.approvalCd, - planAreaSno: item.planAreaSno, - addr1: item.addr1, - addr2: item.addr2, - addr3: item.addr3 - }); - }); - - return ( -
- { - let className = ''; - if (record.approvalCd === 'S') { - className += 'flight-approval-row'; - } else if (record.approvalCd === 'F') { - className += 'flight-not-approval-row'; - } else if (record.approvalCd === 'C') { - className += 'flight-condition-approval-row editable-row'; - } else className; - - if (record.planAreaSno === props.selected) { - className += ' flight-approval-row-click'; - } - return className; - }} - size='small' - columns={childColumns.map(col => { - if (!col.editable) { - return col; - } - return { - ...col, - onCell: record => ({ - record, - inputType: - col.dataIndex === 'bufferZone' || col.dataIndex === 'fltElev' - ? 'number' - : 'text', - dataIndex: col.dataIndex, - title: col.title, - editing: isEditing(record) - }) - }; - })} - dataSource={record.areaList.map((item, index) => ({ - ...item, - key: `child_${record.planSno}_${item.planAreaSno}` - }))} - pagination={false} - components={{ - body: { - cell: EditableCell - } - }} - onRow={record => ({ - onClick: event => { - if (editingKey !== '') { - return; // edit 상태면 이벤트 실행 안 함 - } - setSelectedRowKey(record.planAreaSno); - - // 이벤트 버블링을 막기 위해 클릭된 요소가 'Edit' 버튼인지 확인 - if ( - event.target.tagName !== 'BUTTON' && - event.target.tagName !== 'A' && - !event.target.closest('.ant-input') && // input 요소를 감지 - !event.target.closest('.ant-input-number') // inputNumber 요소를 감지 - ) { - handleInRowClick(record); - } - } - })} - rowSelection={{ - ...childRowSelection, - selectedRowKeys: checkList.filter(key => - key.startsWith(`child_${record.planSno}_`) - ) - }} - showHeader={false} - rowHoverable={false} - /> - - ); + } catch (errInfo) { + handlerErrorModal(ERROR_TITLE, ERROR_MESSAGE, true); + } }; // 테이블 데이터 @@ -955,21 +598,18 @@ export default function ControlApprovalsTable(props) { if (!col.editable) { return col; } + return { ...col, onCell: record => ({ record, - inputType: - col.dataIndex === 'bufferZone' || col.dataIndex === 'fltElev' - ? 'number' - : 'text', + editable: col.editable, dataIndex: col.dataIndex, title: col.title, - editing: isEditing(record) + handleSave }) }; }); - // 단순 메시지 표출 모달 const handlerErrorModal = (header, body, isRefresh) => { dispatch( @@ -982,6 +622,29 @@ export default function ControlApprovalsTable(props) { ); }; + // 관제과 select box 상태 변경 + const updateReviewedType = async (value, planAreaSno) => { + try { + await dispatch( + updateLaancCAprvReview({ + planAreaSnoList: [planAreaSno], + reviewedProcType: value + }) + ); + props.handlerSearch( + props.filterId, + { startDate: props.startDate, endDate: props.endDate }, + props.filterArea + ); + } catch (error) { + return handlerErrorModal( + '검토 실패', + '검토를 요청을 실패하였습니다. 다시 시도해주세요.', + false + ); + } + }; + // 모달 오픈 핸들러 const handlerOpenModal = (approval, fltElev, fltElevMax) => { if (approval === 'F') { @@ -1032,29 +695,10 @@ export default function ControlApprovalsTable(props) { return `${year}년 ${month}월 ${day}일 `; }; - const handleExpand = key => { - const expanded = expandedRowKeys.includes(key); - const keys = expanded - ? expandedRowKeys.filter(k => k !== key) - : [...expandedRowKeys, key]; - setExpandedRowKeys(keys); - }; - // 테이블 행 클릭 이벤트 const handleRowClick = row => { - if (row.areaList.length > 1) return; - handlerOpenModal( - row.areaList[0].approvalCd, - row.areaList[0].fltElev, - row.areaList[0].fltElevMax - ); - props.handlerDetail(row.areaList[0]); - }; - - // 확장된 테이블 행 클릭 이벤트 - const handleInRowClick = row => { handlerOpenModal(row.approvalCd, row.fltElev, row.fltElevMax); - props.handlerDetail(row); + props.handlerDetail([row]); }; const handleFileDownload = async type => { @@ -1116,109 +760,8 @@ export default function ControlApprovalsTable(props) { // 부모 체크박스 const rowSelection = { selectedRowKeys: checkList, - getCheckboxProps: record => { - const allChildrenReviewed = record.areaList.every( - child => child.reviewedType === 'R' - ); - return { - disabled: allChildrenReviewed, - name: record.key - }; - }, - onSelect: (record, selected, selectedRows, nativeEvent) => { - let newCheckList = [...checkList]; // const를 let으로 변경 - const key = record.key; - - if (key.startsWith('parent_')) { - const childKeys = record.areaList - .filter(child => child.reviewedType !== 'R') - .map(child => `child_${record.planSno}_${child.planAreaSno}`); - - if (selected) { - newCheckList.push(key, ...childKeys); - } else { - newCheckList = newCheckList.filter( - k => k !== key && !childKeys.includes(k) - ); - } - } - - updateCheckList(newCheckList); - }, - onSelectAll: (selected, selectedRows, changeRows) => { - const newCheckList = selected - ? laancAprvList.flatMap(parent => { - const parentKey = `parent_${parent.planSno}`; - const selectableChildren = parent.areaList.filter( - child => child.reviewedType !== 'R' - ); - const childKeys = selectableChildren.map( - child => `child_${parent.planSno}_${child.planAreaSno}` - ); - - return selectableChildren.length > 0 - ? [parentKey, ...childKeys] - : []; - }) - : []; - - updateCheckList(newCheckList); - } - }; - - // updateCheckList 함수 수정 - const updateCheckList = list => { - const newList = [...list]; - - // 부모 키 업데이트 - laancAprvList.forEach(parent => { - const parentKey = `parent_${parent.planSno}`; - const selectableChildren = parent.areaList.filter( - child => child.reviewedType !== 'R' - ); - const childKeys = selectableChildren.map( - child => `child_${parent.planSno}_${child.planAreaSno}` - ); - const allSelectableChildrenChecked = childKeys.every(key => - newList.includes(key) - ); - const someSelectableChildrenChecked = childKeys.some(key => - newList.includes(key) - ); - - if (allSelectableChildrenChecked && selectableChildren.length > 0) { - if (!newList.includes(parentKey)) { - newList.push(parentKey); - } - } else if (!someSelectableChildrenChecked) { - const index = newList.indexOf(parentKey); - if (index > -1) { - newList.splice(index, 1); - } - } - }); - - setCheckList(newList); - }; - - // 자식 테이블 체크박스 - const childRowSelection = { - selectedRowKeys: checkList.filter(key => key.startsWith('child_')), - getCheckboxProps: record => ({ - disabled: record.reviewedType === 'R', - name: record.key - }), - - onSelect: (record, selected, selectedRows) => { - const key = record.key; - let newCheckList = [...checkList]; - - if (selected) { - newCheckList.push(key); - } else { - newCheckList = newCheckList.filter(k => k !== key); - } - updateCheckList(newCheckList); + onChange: selectedRowKeys => { + setCheckList(selectedRowKeys); } }; @@ -1228,29 +771,22 @@ export default function ControlApprovalsTable(props) { return handlerErrorModal('검토 실패', '검토 항목을 선택해주세요.', false); } - const planAreaSnoList = [ - ...new Set( - checkList - .filter(item => item.startsWith('child_')) - .map(item => item.split('_').pop()) - ) - ]; - const res = laancAprvList.flatMap(item => item.areaList.filter(area => - planAreaSnoList.includes(area.planAreaSno.toString()) + checkList.includes(area.planAreaSno.toString()) ) ); + console.log('>>', res); // 검토 완료, 요청 반려 조건 확인 const checkCondition = - type === 'R' - ? item => item.reviewedType !== 'Q' - : item => item.reviewedType !== 'Q'; + type === 'S' + ? item => item.reviewedProcType !== 'W' + : item => item.reviewedProcType !== 'W'; // 에러 메시지 const errorMessages = { - R: ['검토 완료', '확인결과 대기인 신청건만 검토완료 요청이 가능합니다.'], + S: ['검토 완료', '확인결과 대기인 신청건만 검토완료 요청이 가능합니다.'], C: ['요청 반려', '확인결과 대기인 신청건만 요청반려 요청이 가능합니다.'] }; @@ -1262,7 +798,10 @@ export default function ControlApprovalsTable(props) { // 요청 성공 호출 try { await dispatch( - updateLaancAprvReview({ planAreaSnoList, reviewedType: type }) + updateLaancCAprvReview({ + planAreaSnoList: checkList, + reviewedProcType: type + }) ); props.handlerSearch( props.filterId, @@ -1303,7 +842,7 @@ export default function ControlApprovalsTable(props) {
-
({ - ...item, - key: `parent_${item.planSno}` - }))} + dataSource={laancAprvList + .map((item, index) => + item.areaList.map((area, index) => ({ + ...area, + key: `${area.planAreaSno}` + })) + ) + .flat()} columns={mergedColumns} rowClassName={record => { let className = ''; - if (record.areaList.length <= 1) { - if (record?.areaList[0]?.approvalCd === 'S') { - className += 'flight-approval-row editable-row'; - } else if (record.areaList[0].approvalCd === 'F') { - className += - 'flight-not-approval-row editable-row'; - } else if (record.areaList[0].approvalCd === 'C') { - className += - 'flight-condition-approval-row editable-row'; - } else className += 'editable-row'; - } - if ( - record.areaList.length <= 1 && - record.areaList[0].planAreaSno === props.selected - ) { - className += ' flight-approval-row-click'; - } - if (expandedRowKeys.includes(record.key)) { - className += ' expanded-row'; + 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'; + } } - if (record.areaList.length > 1) { + + if (record.length > 1) { className += 'expanded-tr'; } return className; @@ -1396,29 +934,10 @@ export default function ControlApprovalsTable(props) { }} onRow={record => ({ onClick: event => { - if (editingKey !== '') { - return; // edit 상태면 이벤트 실행 안 함 - } - setSelectedRowKey(record.planAreaSno); - // 이벤트 버블링을 막기 위해 클릭된 요소가 'Edit' 버튼인지 확인 - if ( - event.target.tagName !== 'BUTTON' && - event.target.tagName !== 'A' && - !event.target.closest('.ant-input') && // input 요소를 감지 - !event.target.closest('.ant-input-number') // inputNumber 요소를 감지 - ) { - handleRowClick(record); - } + handleRowClick(record); } })} loading={laancAprvLoading} - expandable={{ - expandedRowRender, - expandedRowKeys: expandedRowKeys, - onExpand: (expanded, record) => - handleExpand(record.key), - rowExpandable: record => record?.areaList?.length > 1 - }} scroll={{ x: 1700 }} diff --git a/src/components/flight/NewFlightApprovalsReport.js b/src/components/flight/NewFlightApprovalsReport.js index ee591a8a..380c3934 100644 --- a/src/components/flight/NewFlightApprovalsReport.js +++ b/src/components/flight/NewFlightApprovalsReport.js @@ -94,7 +94,7 @@ export default function NewFlightApprovalsReport(props) { props.setFilterId(e.target.value)} onKeyPress={handleKeyDown} @@ -140,18 +140,18 @@ export default function NewFlightApprovalsReport(props) { props.setReviewedType(e.target.value)} + id='reviewedProcType' + value={props.reviewedProcType} + onChange={e => props.setReviewedProcType(e.target.value)} onKeyPress={handleKeyDown} > - {Object.values( + {Object.entries( props.pageName === 'control' ? FlightCategory.Control : FlightCategory.Operation - ).map(item => ( - ))} @@ -172,13 +172,13 @@ export default function NewFlightApprovalsReport(props) { onChange={e => props.setReviewedType(e.target.value)} onKeyPress={handleKeyDown} > - {Object.values( + {Object.entries( props.pageName === 'control' ? FlightCategory.Operation : FlightCategory.Control - ).map(item => ( - ))} diff --git a/src/components/flight/OperationApprovalsTable.js b/src/components/flight/OperationApprovalsTable.js index b8ad8678..74540e6f 100644 --- a/src/components/flight/OperationApprovalsTable.js +++ b/src/components/flight/OperationApprovalsTable.js @@ -59,6 +59,7 @@ export default function OperationApprovalsTable(props) { const [validData, setValidData] = useState(); const [reviewedTypeValue, setReviewedTypeValue] = useState(''); + useEffect(() => { let approvalCdValue = { S: 0, F: 0, C: 0, U: 0 }; @@ -99,12 +100,6 @@ export default function OperationApprovalsTable(props) { const save = async () => { try { const values = await form.validateFields(); - const currentValue = form.getFieldValue( - `${record.planAreaSno}_${dataIndex}` - ); - - console.log('>>', record); - console.log('>>', currentValue); handleSave({ ...record, ...values }); } catch (errInfo) {} @@ -134,50 +129,51 @@ export default function OperationApprovalsTable(props) { if (type === 'operation') { switch (value) { case 'W': - text = '검토대기'; + text = '대기'; break; case 'Q': text = '검토요청'; break; case 'A': - text = '검토재요청'; + text = '재검토요청'; break; - case 'R': - text = '검토완료'; + case 'S': + text = '완료'; break; case 'C': - text = '검토취소'; + text = '검토요청취소'; break; case 'U': - text = '검토불필요'; + text = '불필요'; break; + case 'P': + text = '검토요청처리'; + break; + default: + text = '-'; } return text; } else if (type === 'control') { switch (value) { case 'R': - text = '검토완료'; - break; - case 'Q': - text = '검토요청'; + text = '재검토'; break; case 'W': - text = '-'; - break; - case 'A': - text = '검토재요청'; + text = '검토대기'; break; case 'C': - text = '요청반려'; + text = '검토취소'; break; - case 'U': - text = '-'; + case 'P': + text = '요청처리'; break; + + default: + text = '-'; } return text; } }; - // 데이터 const columns = [ { @@ -225,7 +221,7 @@ export default function OperationApprovalsTable(props) { dataIndex: 'zoneNo', align: 'center', width: '85px', - render: zoneNo => <>총{zoneNo}건 + render: zoneNo => <>{zoneNo}구역 }, { title: <>신청자, @@ -463,7 +459,7 @@ export default function OperationApprovalsTable(props) { type='select' id='reviewedType' style={{ - width: 100 + width: 110 }} value={reviewedType} onClick={handleMouseDown} @@ -481,18 +477,16 @@ export default function OperationApprovalsTable(props) { - - - - - {/* <>{handlerReviewed(reviewedType, 'operation')} */} ); } @@ -505,15 +499,11 @@ export default function OperationApprovalsTable(props) { 확인결과 ), - dataIndex: 'cReviewedType', + dataIndex: 'reviewedProcType', align: 'center', width: '130px', - render: cReviewedType => { - return ( - <> - <>{handlerReviewed(cReviewedType, 'control')} - - ); + render: reviewedProcType => { + return <>{handlerReviewed(reviewedProcType, 'control')}; } }, { @@ -574,9 +564,8 @@ export default function OperationApprovalsTable(props) { }; }); + // 운항과 select box 상태 변경 const updateReviewedType = async (value, planAreaSno) => { - console.log('>>', planAreaSno); - try { await dispatch( updateLaancAprvReview({ @@ -624,15 +613,6 @@ export default function OperationApprovalsTable(props) { } catch (errInfo) { handlerErrorModal(ERROR_TITLE, ERROR_MESSAGE, true); } - - // const newData = [...tempDataSource]; - // newData.map(item => { - // if (row.hasOwnProperty(item.planAreaSno)) { - // item.reviewedReason = row[item.planAreaSno]; - // } - // }); - - // setTempDataSource(newData); }; // 단순 메시지 표출 모달 @@ -743,7 +723,7 @@ export default function OperationApprovalsTable(props) { const checkCondition = { A: item => item.reviewedType !== 'R' && item.reviewedType !== 'C', Q: item => item.reviewedType !== 'W', - R: item => item.reviewedType !== 'U' && item.reviewedType !== 'W' + S: item => item.reviewedType !== 'U' && item.reviewedType !== 'W' }; // 요청 실패 시 에러 메시지 @@ -753,7 +733,7 @@ export default function OperationApprovalsTable(props) { '검토결과 완료, 검토취소인 신청건만 재 요청이 가능합니다.' ], Q: ['검토 요청 실패', '검토결과 대기인 신청건만 요청이 가능합니다.'], - R: [ + S: [ '검토 완료 실패', '검토불필요, 검토대기인 신청건만 재 요청이 가능합니다.' ] @@ -787,12 +767,12 @@ export default function OperationApprovalsTable(props) { ); } }, - R: async () => { + S: async () => { try { await dispatch( updateLaancAprvReview({ planAreaSnoList: checkList, - reviewedType: 'R' + reviewedType: 'S' }) ); props.handlerSearch( @@ -864,7 +844,7 @@ export default function OperationApprovalsTable(props) {
-