From 0b722951c8980e3e3ecdca4874f9b70027f3f722 Mon Sep 17 00:00:00 2001 From: sanguu516 Date: Wed, 26 Jun 2024 10:58:46 +0900 Subject: [PATCH] =?UTF-8?q?=ED=8C=8C=EC=9D=BC=20=EB=8B=A4=EC=9A=B4?= =?UTF-8?q?=EB=A1=9C=EB=93=9C=20=EA=B8=B0=EB=8A=A5,=20=EB=8D=B0=EC=9D=B4?= =?UTF-8?q?=ED=84=B0=20=EC=BB=AC=EB=9F=BC=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../flight/NewFlightApprovalsReport.js | 67 ++++--- .../flight/NewFlightApprovalsTable.js | 168 +++++++++--------- .../flight/NewFlightApprovalsContainer.js | 17 +- src/redux/features/laanc/laancState.ts | 4 + src/redux/features/laanc/laancThunk.ts | 19 +- 5 files changed, 156 insertions(+), 119 deletions(-) diff --git a/src/components/flight/NewFlightApprovalsReport.js b/src/components/flight/NewFlightApprovalsReport.js index 8f896c0a..0086d257 100644 --- a/src/components/flight/NewFlightApprovalsReport.js +++ b/src/components/flight/NewFlightApprovalsReport.js @@ -5,11 +5,6 @@ import { Search, Calendar } from 'react-feather'; import dayjs from 'dayjs'; export default function NewFlightApprovalsReport(props) { - // 식별번호 - const [filterId, setFilterId] = useState(''); - - // 지역 - const [filterArea, setFilterArea] = useState(''); // 달력 const [searchDate, setSearchDate] = useState({ startDate: dayjs().format('YYYY-MM-DD'), @@ -20,8 +15,8 @@ export default function NewFlightApprovalsReport(props) { const popupSyncSearchData = JSON.parse(localStorage.getItem('popupState')); if (popupSyncSearchData) { - setFilterArea(popupSyncSearchData.selected); - setFilterId(popupSyncSearchData.filter); + props.setFilterArea(popupSyncSearchData.selected); + props.setFilterId(popupSyncSearchData.filter); setSearchDate({ startDate: popupSyncSearchData.startDate, endDate: popupSyncSearchData.endDate @@ -32,7 +27,7 @@ export default function NewFlightApprovalsReport(props) { const handleKeyDown = e => { if (e.key === 'Enter') { - props.handlerSearch(filterId, searchDate, filterArea); + props.handlerSearch(props.filterId, searchDate, props.filterArea); } }; @@ -68,8 +63,8 @@ export default function NewFlightApprovalsReport(props) { type='text' bsSize='sm' placeholder='신청번호 또는 검토결과를 입력해주세요.' - value={filterId} - onChange={e => setFilterId(`${e.target.value}`)} + value={props.filterId} + onChange={e => props.setFilterId(`${e.target.value}`)} onKeyPress={handleKeyDown} /> @@ -79,33 +74,37 @@ export default function NewFlightApprovalsReport(props) {

지역

-
- setFilterArea(e.target.value)} - > - - - +
+ props.setFilterArea(e.target.value)} + > + + +
- -
+
+
diff --git a/src/components/flight/NewFlightApprovalsTable.js b/src/components/flight/NewFlightApprovalsTable.js index 1cc20c7b..8bb294a4 100644 --- a/src/components/flight/NewFlightApprovalsTable.js +++ b/src/components/flight/NewFlightApprovalsTable.js @@ -8,7 +8,7 @@ import { Form, Input, InputNumber, Popconfirm, Table, Typography } from 'antd'; import { HOST } from '../../configs/constants'; import axios from 'axios'; import { getAccessToken } from '../../utility/authService/jwtTokenUtil'; - +import { updateLaancAprv } from '@src/redux/features/laanc/laancThunk'; export default function NewFlightApprovalsTable(props) { const dispatch = useDispatch(); @@ -28,21 +28,14 @@ export default function NewFlightApprovalsTable(props) { // 수정 키 const [editingKey, setEditingKey] = useState(''); - const [form] = Form.useForm(); + // select row key + const [selectedRowKey, setSelectedRowKey] = useState(''); - const [updateRowData, setRowData] = useState({ - planAreaSno: 0, - bufferZone: 0, - fltElev: 0, - dtl: '', - era: '', - rm: '' - }); + const [form] = Form.useForm(); // 수정 키 확인 const isEditing = record => record.key === editingKey; - console.log('>>>', laancAprvList); // 승인, 미승인, 비대상 건수 계산 useEffect(() => { resApprovalCd(); @@ -50,9 +43,14 @@ export default function NewFlightApprovalsTable(props) { // 수정 이벤트 const edit = record => { + console.log('planAreaSno>>>', record.planAreaSno); form.setFieldsValue({ - bufferZone: '', - fltElev: '', + planAreaSno: record.planAreaSno, + bufferZone: record.bufferZone, + fltElev: record.fltElev, + dtl: record.dtl, + era: record.era, + rm: record.rm, ...record }); setEditingKey(record.key); @@ -64,24 +62,25 @@ export default function NewFlightApprovalsTable(props) { }; // 저장 이벤트 - const save = async key => { + const save = async (key, type) => { try { const row = await form.validateFields(); const newData = [...laancAprvList]; - const index = newData.findIndex(item => key === item.key); - - if (index > -1) { - const item = newData[index]; - newData.splice(index, 1, { ...item, ...row }); - setData(newData); - setEditingKey(''); - setRowData(row); // 입력한 값을 setRowData에 저장 - } else { - newData.push(row); - setData(newData); - setEditingKey(''); - setRowData(row); // 입력한 값을 setRowData에 저장 - } + let index = { ...row, planAreaSno: selectedRowKey }; + + console.log('index>>', index); + // if (index > -1) { + // const item = newData[index]; + // newData.splice(index, 1, { ...item, ...row }); + // setData(newData); + // setEditingKey(''); + // setRowData(row); // 입력한 값을 setRowData에 저장 + // } else { + // newData.push(row); + // setData(newData); + // setEditingKey(''); + // setRowData(row); // 입력한 값을 setRowData에 저장 + // } } catch (errInfo) { console.log('Validate Failed:', errInfo); } @@ -110,7 +109,7 @@ export default function NewFlightApprovalsTable(props) { dataIndex: 'applyDtMonth', width: '80px', align: 'center', - render: text => dayjs(text).format('M월') + render: text => `${text}월` }, { title: ( @@ -137,11 +136,11 @@ export default function NewFlightApprovalsTable(props) { }, { title: <>신청자, - dataIndex: 'applyDt', + dataIndex: 'applyNm', width: '90px', align: 'center', - render: text => '홍*동' + render: text => (text ? text : '-') }, { title: ( @@ -154,7 +153,9 @@ export default function NewFlightApprovalsTable(props) { width: '90px', align: 'center', render: areaList => { - return areaList.length <= 1 ? '서울특별시' : '-'; + return areaList.length <= 1 && areaList[0].addr1 + ? areaList[0].addr1 + : '-'; } }, { @@ -168,7 +169,9 @@ export default function NewFlightApprovalsTable(props) { width: '90px', align: 'center', render: areaList => { - return areaList.length <= 1 ? '강서구' : '-'; + return areaList.length <= 1 && areaList[0].addr2 + ? areaList[0].addr2 + : '-'; } }, { @@ -182,7 +185,9 @@ export default function NewFlightApprovalsTable(props) { width: '100px', align: 'center', render: areaList => { - return areaList.length <= 1 ? '가양동439-1(원추)' : '-'; + return areaList.length <= 1 && areaList[0].addr3 + ? areaList[0].addr3 + : '-'; } }, { @@ -244,12 +249,12 @@ export default function NewFlightApprovalsTable(props) { 사항 ), - dataIndex: 'areaList', + dataIndex: 'dtl', align: 'center', editable: true, width: '110px', - render: areaList => { - return areaList.length <= 1 ? <>- : '-'; + render: dtl => { + return dtl ? dtl : '-'; } }, { @@ -263,7 +268,9 @@ export default function NewFlightApprovalsTable(props) { align: 'center', width: '110px', render: areaList => { - return areaList.length <= 1 ? <>기타 : '-'; + return areaList.length <= 1 && areaList[0].purpose + ? areaList[0].purpose + : '-'; } }, { @@ -274,22 +281,22 @@ export default function NewFlightApprovalsTable(props) { 구조 기관 ), - dataIndex: 'areaList', + dataIndex: 'era', align: 'center', width: '110px', editable: true, - render: areaList => { - return areaList.length <= 1 ? <>- : '-'; + render: era => { + return era ? era : '-'; } }, { title: <>비고, - dataIndex: 'areaList', + dataIndex: 'rm', align: 'center', width: '110px', editable: true, - render: areaList => { - return areaList.length <= 1 ? <>비행 고도 특별 주의 건 입니다. : '-'; + render: rm => { + return rm ? rm : '-'; } }, { @@ -365,7 +372,7 @@ export default function NewFlightApprovalsTable(props) { }, { title: '편집', - dataIndex: 'operation', + dataIndex: 'planAreaSno', align: 'center', width: '110px', render: (_, record) => { @@ -374,7 +381,7 @@ export default function NewFlightApprovalsTable(props) { editable ? ( save(record.key)} + onClick={() => save(record.key, 'outer')} style={{ marginRight: 8 }} @@ -412,7 +419,7 @@ export default function NewFlightApprovalsTable(props) { dataIndex: 'applyDtMonth', width: '80px', align: 'center', - render: text => dayjs(text).format('M월') + render: text => `${text}월` }, { dataIndex: 'applyDtDay', @@ -429,35 +436,35 @@ export default function NewFlightApprovalsTable(props) { } }, { - dataIndex: '홍길동', + dataIndex: 'applyNm', align: 'center', width: '90px', render: text => { - return <>홍*동; + return text ? text : '-'; } }, { - dataIndex: '서울특별시', + dataIndex: 'addr1', align: 'center', width: '90px', render: text => { - return <>서울특별시; + return text ? text : <>-; } }, { - dataIndex: '강남구', + dataIndex: 'addr2', align: 'center', width: '90px', render: text => { - return <>강서구; + return text ? text : <>-; } }, { - dataIndex: '가양동439-1(원추)', + dataIndex: 'addr3', align: 'center', width: '100px', render: text => { - return <>가양동439-1(원추); + return text ? text : <>-; } }, { @@ -493,15 +500,15 @@ export default function NewFlightApprovalsTable(props) { editable: true, width: '110px', render: text => { - return <>기타; + return text ? text : <>-; } }, { - dataIndex: '비행목적', + dataIndex: 'purpose', align: 'center', width: '110px', render: text => { - return <>레저비행; + return text ? text : <>-; } }, { @@ -510,7 +517,7 @@ export default function NewFlightApprovalsTable(props) { editable: true, width: '110px', render: text => { - return <>-; + return text ? text : <>-; } }, { @@ -519,7 +526,7 @@ export default function NewFlightApprovalsTable(props) { editable: true, width: '110px', render: text => { - return <>-; + return text ? text : <>-; } }, { @@ -539,7 +546,7 @@ export default function NewFlightApprovalsTable(props) { } }, { - dataIndex: 'operation', + dataIndex: 'planAreaSno', align: 'center', width: '110px', render: (_, record) => { @@ -547,7 +554,7 @@ export default function NewFlightApprovalsTable(props) { return editable ? ( save(record.key)} + onClick={() => save(record.key, 'inner')} style={{ marginRight: 8 }} @@ -573,7 +580,7 @@ export default function NewFlightApprovalsTable(props) { const data = []; record.areaList.map((item, index) => { data.push({ - key: `${record.applyNo}-${index}`, + key: `${item.planAreaSno}-${index}`, applyNo: item.applyNo, applyDt: item.applyDt, zoneNo: item.zoneNo, @@ -583,8 +590,17 @@ export default function NewFlightApprovalsTable(props) { applyDtMonth: item.applyDtMonth, bufferZone: item.bufferZone, fltElev: item.fltElev, + rm: item.rm, + era: item.era, + fltElevMax: item.fltElevMax, + purpose: item.purpose, + applyNm: item.applyNm, + dtl: item.dtl, approvalCd: item.approvalCd, - planAreaSno: item.planAreaSno + planAreaSno: item.planAreaSno, + addr1: item.addr1, + addr2: item.addr2, + addr3: item.addr3 }); }); @@ -636,6 +652,8 @@ export default function NewFlightApprovalsTable(props) { if (editingKey !== '') { return; // edit 상태면 이벤트 실행 안 함 } + setSelectedRowKey(record.planAreaSno); + // 이벤트 버블링을 막기 위해 클릭된 요소가 'Edit' 버튼인지 확인 if ( event.target.tagName !== 'BUTTON' && @@ -676,6 +694,7 @@ export default function NewFlightApprovalsTable(props) { // 모달 오픈 핸들러 const handlerOpenModal = (approval, fltElev, fltElevMax) => { + console.log('fltElevMax>>', fltElevMax); if (approval === 'F') { dispatch( openModal({ @@ -767,11 +786,11 @@ export default function NewFlightApprovalsTable(props) { try { const fileDetails = { pdf: { - url: `${HOST}api/bas/dos/plan/download/pdf?searchStDt=2024-06-24&searchEndDt=2024-06-24`, + url: `${HOST}api/bas/dos/plan/download/pdf?searchStDt=${props.startDate}&searchEndDt=${props.endDate}&selectZone=${props.filterArea}&approvalCd=${props.filterId}`, name: '비행승인결과.pdf' }, excel: { - url: `${HOST}api/bas/dos/plan/download/excel?searchStDt=2024-06-24&searchEndDt=2024-06-24`, + url: `${HOST}api/bas/dos/plan/download/excel?searchStDt=${props.startDate}&searchEndDt=${props.endDate}&selectZone=${props.filterArea}&approvalCd=${props.filterId}`, name: '비행승인결과.xlsx' } }; @@ -878,7 +897,7 @@ export default function NewFlightApprovalsTable(props) { }} dataSource={laancAprvList.map((item, index) => ({ ...item, - key: index + key: `${item.planAreaSno}-${index}` }))} columns={mergedColumns} rowClassName={record => { @@ -905,6 +924,7 @@ export default function NewFlightApprovalsTable(props) { if (editingKey !== '') { return; // edit 상태면 이벤트 실행 안 함 } + setSelectedRowKey(record.planAreaSno); // 이벤트 버블링을 막기 위해 클릭된 요소가 'Edit' 버튼인지 확인 if ( event.target.tagName !== 'BUTTON' && @@ -954,19 +974,7 @@ const EditableCell = ({ children, ...restProps }) => { - const inputNode = - inputType === 'number' ? ( - { - if (!/[0-9]/.test(e.key)) { - e.preventDefault(); // 숫자 외의 입력을 막음 - } - }} - /> - ) : ( - - ); + const inputNode = inputType === 'number' ? : ; return ( {editing ? ( diff --git a/src/containers/flight/NewFlightApprovalsContainer.js b/src/containers/flight/NewFlightApprovalsContainer.js index c2a484e9..ed403011 100644 --- a/src/containers/flight/NewFlightApprovalsContainer.js +++ b/src/containers/flight/NewFlightApprovalsContainer.js @@ -38,9 +38,16 @@ export default function NewFlightApprovalsContainer({ mode }) { const { areaCoordList, isOpenModal } = useSelector(state => state.laancState); const { user } = useSelector(state => state.authState); - // + const [startDate, setStartDate] = useState(dayjs().format('YYYY-MM-DD')); - const [endDate, setEndDate] = useState(); + const [endDate, setEndDate] = useState(dayjs().format('YYYY-MM-DD')); + + // 식별번호 + const [filterId, setFilterId] = useState(''); + + // 지역 + const [filterArea, setFilterArea] = useState(''); + // 미니맵 레이어 const [previewLayer, setPreviewLayer] = useState(); @@ -350,9 +357,15 @@ export default function NewFlightApprovalsContainer({ mode }) { { + const result = data.map((item, index) => { if (item.areaList.length <= 1) { return { ...item, fltElev: item.areaList[0].fltElev, bufferZone: item.areaList[0].bufferZone, - areaList: item.areaList + rm: item.areaList[0].rm, + era: item.areaList[0].era, + dtl: item.areaList[0].dtl, + planAreaSno: item.areaList[0].planAreaSno }; } else { return { - ...item + ...item, + areaList: item.areaList.map((area, innerIndex) => { + return { + ...area, + applyNm: item.applyNm, + purpose: item.purpose, + addr1: item.addr1, + addr2: item.addr2, + addr3: item.addr3 + }; + }) }; } });