diff --git a/src/components/flight/ControlApprovalsTable.js b/src/components/flight/ControlApprovalsTable.js
index 3f767440..e25806e5 100644
--- a/src/components/flight/ControlApprovalsTable.js
+++ b/src/components/flight/ControlApprovalsTable.js
@@ -49,6 +49,10 @@ export default function ControlApprovalsTable(props) {
// 체크박스 선택
const [checkList, setCheckList] = useState([]);
+ const [currentRow, setCurrentRow] = useState(null);
+
+ const [currentPlanAreaSno, setCurrentPlanAreaSno] = useState(null);
+
useEffect(() => {
let approvalCdValue = { S: 0, F: 0, C: 0, U: 0 };
@@ -78,8 +82,6 @@ export default function ControlApprovalsTable(props) {
}
}, [laancAprvList]);
- const [currentPlanAreaSno, setCurrentPlanAreaSno] = useState(null);
-
// input 수정 컴포넌트
const EditableCell = ({
editable,
@@ -93,15 +95,51 @@ export default function ControlApprovalsTable(props) {
const save = async () => {
try {
const values = await form.validateFields();
-
- setModal({
- isOpen: true,
- title: '수정 확인',
- desc: '데이터를 수정하시겠습니까?',
- type: 'edit',
- row: { ...record, ...values }
- });
- } catch (errInfo) {}
+ const newValue = values[`${record.planAreaSno}_${dataIndex}`];
+
+ if (record[dataIndex] !== newValue) {
+ setCurrentRow({
+ planAreaSno: record.planAreaSno,
+ dataIndex: dataIndex,
+ originalValue: record[dataIndex], // 원래 값을 저장
+ newValue: values[`${record.planAreaSno}_${dataIndex}`] // 새로운 값을 저장
+ });
+
+ // 변경된 값이 반영된 상태에서 모달을 띄웁니다.
+
+ let descValue = '';
+
+ switch (dataIndex) {
+ case 'fltElev':
+ descValue = `신청 고도를`;
+ break;
+ case 'era':
+ descValue = `긴급 구조 기관을`;
+ break;
+ case 'rm':
+ descValue = `비고를`;
+ break;
+ case 'dtl':
+ descValue = `세부 사항을`;
+ break;
+ case 'reqRadius':
+ descValue = `요청 반경을`;
+ break;
+ case 'reqElev':
+ descValue = `요청 고도를`;
+ default:
+ }
+ setModal({
+ isOpen: true,
+ title: '수정 확인',
+ desc: `${descValue} 수정하시겠습니까?`,
+ type: 'edit',
+ row: { ...record, ...values }
+ });
+ }
+ } catch (errInfo) {
+ console.error('Save failed:', errInfo);
+ }
};
let childNode = children;
@@ -112,9 +150,15 @@ export default function ControlApprovalsTable(props) {
className='editable-input'
name={`${record.planAreaSno}_${dataIndex}`} // 고유한 이름 설정
initialValue={record[dataIndex]}
- onClick={e => e.stopPropagation()} // 클릭 이벤트 전파 중지
>
-
+ {
+ e.stopPropagation();
+ save();
+ }}
+ onClick={e => e.stopPropagation()}
+ />
);
}
@@ -122,6 +166,48 @@ export default function ControlApprovalsTable(props) {
return
{childNode} | ;
};
+ const handleCancel = () => {
+ if (currentRow) {
+ const { planAreaSno, dataIndex, originalValue } = currentRow;
+
+ // 필드의 원래 값을 다시 설정
+ form.setFieldsValue({
+ [`${planAreaSno}_${dataIndex}`]: originalValue
+ });
+ }
+ };
+
+ 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`] || ''
+ }
+ ])
+ );
+
+ if (updateRes.meta.requestStatus === 'fulfilled') {
+ props.handlerSearch(
+ props.filterId,
+ { startDate: props.startDate, endDate: props.endDate },
+ props.filterArea
+ );
+ setEditingKey('');
+ } else {
+ handlerErrorModal(ERROR_TITLE, ERROR_MESSAGE, true);
+ }
+ } catch (errInfo) {
+ handlerErrorModal(ERROR_TITLE, ERROR_MESSAGE, true);
+ }
+ };
+
// 데이터
const columns = [
{
@@ -483,48 +569,6 @@ export default function ControlApprovalsTable(props) {
}
];
- const handleIsModal = record => {
- dispatch(
- openModal({
- header: '재검토 사유',
- body: record.reviewedReason,
- type: 'review'
- })
- );
- };
-
- 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`] || ''
- }
- ])
- );
-
- if (updateRes.meta.requestStatus === 'fulfilled') {
- setEditingKey('');
- // await dispatch(
- // getLaancAprvList({
- // searchStDt: props.startDate,
- // searchEndDt: props.endDate
- // })
- // );
- } else {
- handlerErrorModal(ERROR_TITLE, ERROR_MESSAGE, true);
- }
- } catch (errInfo) {
- handlerErrorModal(ERROR_TITLE, ERROR_MESSAGE, true);
- }
- };
-
// 테이블 데이터
const mergedColumns = columns.map(col => {
if (!col.editable) {
@@ -542,6 +586,7 @@ export default function ControlApprovalsTable(props) {
})
};
});
+
// 단순 메시지 표출 모달
const handlerErrorModal = (header, body, isRefresh) => {
dispatch(
@@ -629,8 +674,13 @@ export default function ControlApprovalsTable(props) {
// 테이블 행 클릭 이벤트
const handleRowClick = row => {
- handlerOpenModal(row.approvalCd, row.fltElev, row.fltElevMax);
- props.handlerDetail([row]);
+ const activeElement = document.activeElement;
+ if (activeElement && activeElement.tagName === 'INPUT') {
+ activeElement.blur(); // 강제로 blur 이벤트를 발생시킴
+ } else {
+ handlerOpenModal(row.approvalCd, row.fltElev, row.fltElevMax);
+ props.handlerDetail([row]);
+ }
};
const handlePageChange = () => {
@@ -947,6 +997,7 @@ export default function ControlApprovalsTable(props) {
? updateReviewedType('P', currentPlanAreaSno)
: handleSave(modal.row)
}
+ handleCancel={handleCancel}
color='primary'
/>
)}
diff --git a/src/components/flight/OperationApprovalsTable.js b/src/components/flight/OperationApprovalsTable.js
index fbbf9d1b..cf07ec49 100644
--- a/src/components/flight/OperationApprovalsTable.js
+++ b/src/components/flight/OperationApprovalsTable.js
@@ -39,9 +39,6 @@ export default function OperationApprovalsTable(props) {
// 수정 키
const [editingKey, setEditingKey] = useState('');
- // select row key
- const [selectedRowKey, setSelectedRowKey] = useState('');
-
const [ismodal, setIsModal] = useState(false);
const [form] = Form.useForm();
@@ -55,7 +52,7 @@ export default function OperationApprovalsTable(props) {
// 유효성 기체 데이터
const [validData, setValidData] = useState();
- const [reviewedTypeValue, setReviewedTypeValue] = useState('');
+ const [currentRow, setCurrentRow] = useState(null);
// 확인 모달
const [modal, setModal] = useState({
@@ -106,15 +103,42 @@ export default function OperationApprovalsTable(props) {
const save = async () => {
try {
const values = await form.validateFields();
+ const newValue = values[`${record.planAreaSno}_${dataIndex}`];
+
+ if (record[dataIndex] !== newValue) {
+ setCurrentRow({
+ planAreaSno: record.planAreaSno,
+ dataIndex: dataIndex,
+ originalValue: record[dataIndex], // 원래 값을 저장
+ newValue: values[`${record.planAreaSno}_${dataIndex}`] // 새로운 값을 저장
+ });
+
+ // 변경된 값이 반영된 상태에서 모달을 띄웁니다.
+
+ let descValue = '';
- setModal({
- isOpen: true,
- title: '수정 확인',
- desc: '데이터를 수정하시겠습니까?',
- type: 'edit',
- row: { ...record, ...values }
- });
- } catch (errInfo) {}
+ switch (dataIndex) {
+ case 'fltElev':
+ descValue = `신청 고도를`;
+ break;
+ case 'reqRadius':
+ descValue = `요청 반경을`;
+ break;
+ case 'reqElev':
+ descValue = `요청 고도를`;
+ default:
+ }
+ setModal({
+ isOpen: true,
+ title: '수정 확인',
+ desc: `${descValue} 수정하시겠습니까?`,
+ type: 'edit',
+ row: { ...record, ...values }
+ });
+ }
+ } catch (errInfo) {
+ console.error('Save failed:', errInfo);
+ }
};
let childNode = children;
@@ -125,9 +149,15 @@ export default function OperationApprovalsTable(props) {
className='editable-input'
name={`${record.planAreaSno}_${dataIndex}`} // 고유한 이름 설정
initialValue={record[dataIndex]}
- onClick={e => e.stopPropagation()} // 클릭 이벤트 전파 중지
>
-
+ {
+ e.stopPropagation();
+ save();
+ }}
+ onClick={e => e.stopPropagation()}
+ />
);
}
@@ -135,8 +165,43 @@ export default function OperationApprovalsTable(props) {
return {childNode} | ;
};
- const handlePageChange = () => {
- document.activeElement?.blur();
+ const handleCancel = () => {
+ if (currentRow) {
+ const { planAreaSno, dataIndex, originalValue } = currentRow;
+
+ // 필드의 원래 값을 다시 설정
+ form.setFieldsValue({
+ [`${planAreaSno}_${dataIndex}`]: originalValue
+ });
+ }
+ };
+
+ 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`] || ''
+ }
+ ])
+ );
+
+ if (updateRes.meta.requestStatus === 'fulfilled') {
+ props.handlerSearch(
+ props.filterId,
+ { startDate: props.startDate, endDate: props.endDate },
+ props.filterArea
+ );
+ setEditingKey('');
+ } else {
+ handlerErrorModal(ERROR_TITLE, ERROR_MESSAGE, true);
+ }
+ } catch (errInfo) {
+ handlerErrorModal(ERROR_TITLE, ERROR_MESSAGE, true);
+ }
};
// 검토 상태 변경
@@ -626,34 +691,6 @@ export default function OperationApprovalsTable(props) {
);
}
};
- 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`] || ''
- }
- ])
- );
-
- if (updateRes.meta.requestStatus === 'fulfilled') {
- setEditingKey('');
- // await dispatch(
- // getLaancAprvList({
- // searchStDt: props.startDate,
- // searchEndDt: props.endDate
- // })
- // );
- } else {
- handlerErrorModal(ERROR_TITLE, ERROR_MESSAGE, true);
- }
- } catch (errInfo) {
- handlerErrorModal(ERROR_TITLE, ERROR_MESSAGE, true);
- }
- };
// 단순 메시지 표출 모달
const handlerErrorModal = (header, body, isRefresh) => {
@@ -719,10 +756,14 @@ export default function OperationApprovalsTable(props) {
// 테이블 행 클릭 이벤트
const handleRowClick = row => {
- handlerOpenModal(row.approvalCd, row.fltElev, row.fltElevMax);
- props.handlerDetail([row]);
+ const activeElement = document.activeElement;
+ if (activeElement && activeElement.tagName === 'INPUT') {
+ activeElement.blur(); // 강제로 blur 이벤트를 발생시킴
+ } else {
+ handlerOpenModal(row.approvalCd, row.fltElev, row.fltElevMax);
+ props.handlerDetail([row]);
+ }
};
-
// 유효성 검사 모달창
const handleIsModal = record => {
setValidData({
@@ -1016,6 +1057,7 @@ export default function OperationApprovalsTable(props) {
setModal={setModal}
handlerConfirm={() => handleSave(modal.row)}
color='primary'
+ handleCancel={handleCancel}
/>
)}
diff --git a/src/components/modal/ConfirmModal.js b/src/components/modal/ConfirmModal.js
index 130c9390..bd87352a 100644
--- a/src/components/modal/ConfirmModal.js
+++ b/src/components/modal/ConfirmModal.js
@@ -11,6 +11,14 @@ export const ConfirmModal = props => {
props.handlerConfirm();
props.setModal({ ...props.modal, isOpen: !props.modal.isOpen });
};
+
+ const handlerCancel = () => {
+ if (props.modal.type === 'edit' && props.handleCancel) {
+ props.handleCancel(); // handleCancel 함수가 올바르게 전달되었는지 확인
+ }
+ props.setModal({ ...props.modal, isOpen: !props.modal.isOpen });
+ };
+
return (
{
// modalClassName='modal-primary'
modalClassName={'modal-' + `${props.color}`}
className='modal-dialog-centered'
+ backdrop={props.modal.type === 'edit' ? 'static' : false} // 백그라운드 클릭 시 모달이 닫히지 않게 설정
+ keyboard={props.modal.type === 'edit' ? true : false} // Esc 키로 모달을 닫지 않도록 설정
>
@@ -36,12 +46,7 @@ export const ConfirmModal = props => {
확인
-