From 87d510dc2de353f1cc85061cf6c1064c00718de1 Mon Sep 17 00:00:00 2001 From: sanguu516 Date: Mon, 15 Jul 2024 18:42:24 +0900 Subject: [PATCH] =?UTF-8?q?=EA=B4=80=EC=A0=9C=EA=B3=BC=20=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80=20=EC=B2=B4=ED=81=AC=EB=B0=95=EC=8A=A4=20?= =?UTF-8?q?=EC=9E=91=EC=97=85=EC=A4=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../flight/ControlApprovalsTable.js | 116 +++++++++++++++--- src/redux/features/laanc/laancState.ts | 1 + 2 files changed, 101 insertions(+), 16 deletions(-) diff --git a/src/components/flight/ControlApprovalsTable.js b/src/components/flight/ControlApprovalsTable.js index a50e24ae..36c1491e 100644 --- a/src/components/flight/ControlApprovalsTable.js +++ b/src/components/flight/ControlApprovalsTable.js @@ -12,6 +12,7 @@ import { getLaancAprvList } from '@src/redux/features/laanc/laancThunk'; import { ERROR_MESSAGE, ERROR_TITLE } from '@src/configs/msgConst'; +import { CgKey } from 'react-icons/cg'; export default function ControlApprovalsTable(props) { const dispatch = useDispatch(); @@ -40,6 +41,8 @@ export default function ControlApprovalsTable(props) { const [form] = Form.useForm(); + const [checkList, setCheckList] = useState([]); + // 수정 키 확인 const isEditing = record => record.key === editingKey; @@ -703,7 +706,7 @@ export default function ControlApprovalsTable(props) { const data = []; record.areaList.map((item, index) => { data.push({ - key: `${item.planAreaSno}-${index}`, + key: `${item.planSno}`, applyNo: item.applyNo, applyDt: item.applyDt, zoneNo: item.zoneNo, @@ -765,7 +768,10 @@ export default function ControlApprovalsTable(props) { }) }; })} - dataSource={data} + dataSource={record.areaList.map((item, index) => ({ + ...item, + key: `child_${record.planSno}_${item.planAreaSno}` + }))} pagination={false} components={{ body: { @@ -791,7 +797,10 @@ export default function ControlApprovalsTable(props) { } })} rowSelection={{ - ...rowSelection + ...childRowSelection, + selectedRowKeys: checkList.filter(key => + key.startsWith(`child_${record.planSno}_`) + ) }} showHeader={false} rowHoverable={false} @@ -971,19 +980,97 @@ export default function ControlApprovalsTable(props) { } }; - const rowSelection = { - onChange: (selectedRowKeys, selectedRows) => { - console.log( - `selectedRowKeys: ${selectedRowKeys}`, - 'selectedRows: ', - selectedRows - ); + // 자식 테이블 체크박스 + const childRowSelection = { + selectedRowKeys: checkList.filter(key => key.startsWith('child_')), + onChange: (selectedRowKeys, selectedRows, info) => { + const newCheckList = checkList.filter(key => !key.startsWith('child_')); + // console.log('>>>>', selectedRowKeys); }, onSelect: (record, selected, selectedRows) => { - console.log(record, selected, selectedRows); + const key = record.key; + const newCheckList = []; + + if (selected) { + newCheckList.push(...checkList, key); + } else { + newCheckList.push(...checkList.filter(k => k !== key)); + } + updateCheckList(newCheckList); + } + }; + + // 체크박스 업데이트 + const updateCheckList = list => { + const newList = [...list]; + + // 부모 키 업데이트 + laancAprvList.forEach(parent => { + const parentKey = `parent_${parent.planSno}`; + const childKeys = parent.areaList.map( + child => `child_${parent.planSno}_${child.planAreaSno}` + ); + const allChildrenChecked = childKeys.every(key => newList.includes(key)); + const someChildrenChecked = childKeys.some(key => newList.includes(key)); + + if (allChildrenChecked) { + if (!newList.includes(parentKey)) { + newList.push(parentKey); + } + } else if (!someChildrenChecked) { + const index = newList.indexOf(parentKey); + if (index > -1) { + newList.splice(index, 1); + } + } + }); + + setCheckList(newList); + }; + + // 부모 체크박스 + const rowSelection = { + selectedRowKeys: checkList, + onSelect: (record, selected, selectedRows, nativeEvent) => { + const newCheckList = [...checkList]; + const key = record.key; + + if (key.startsWith('parent_')) { + const childKeys = record.areaList.map(child => { + // console.log('>>', checkList); + + return `child_${record.planSno}_${child.planAreaSno}`; + }); + + if (selected) { + newCheckList.push(key, ...childKeys); + } else { + const index = newCheckList.indexOf(key); + if (index > -1) { + newCheckList.splice(index, 1); + } + childKeys.forEach(childKey => { + const childIndex = newCheckList.indexOf(childKey); + if (childIndex > -1) { + newCheckList.splice(childIndex, 1); + } + }); + } + } + + updateCheckList(newCheckList); }, onSelectAll: (selected, selectedRows, changeRows) => { - console.log(selected, selectedRows, changeRows); + const newCheckList = selected + ? laancAprvList.flatMap(parent => [ + `parent_${parent.planSno}`, + ...parent.areaList.map( + child => `child_${parent.planSno}_${child.planAreaSno}` + ) + ]) + : []; + + updateCheckList(newCheckList); } }; @@ -1057,10 +1144,7 @@ export default function ControlApprovalsTable(props) { }} dataSource={laancAprvList.map((item, index) => ({ ...item, - key: - item.areaList.length >= 1 - ? `${item.planAreaSno}-${index}` - : `${item.planAreaSno}` + key: `parent_${item.planSno}` }))} columns={mergedColumns} rowClassName={record => { diff --git a/src/redux/features/laanc/laancState.ts b/src/redux/features/laanc/laancState.ts index 5b36f663..562b0172 100644 --- a/src/redux/features/laanc/laancState.ts +++ b/src/redux/features/laanc/laancState.ts @@ -656,6 +656,7 @@ export interface ILaancAprvListRs { planSno: number; zoneNo: string; bufferZone: number; + purpose: string; fltElev: number; lat: number; fltElevMax: number;