pav
/
pav-fe-kac
12
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

파일 다운로드 기능, 데이터 컬럼 수정

master
sanguu516 3 months ago
parent
3bf632cbcb
commit
0b722951c8
5 changed files with 156 additions and 119 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 67
      src/components/flight/NewFlightApprovalsReport.js
  2. 168
      src/components/flight/NewFlightApprovalsTable.js
  3. 17
      src/containers/flight/NewFlightApprovalsContainer.js
  4. 4
      src/redux/features/laanc/laancState.ts
  5. 19
      src/redux/features/laanc/laancThunk.ts

67
src/components/flight/NewFlightApprovalsReport.js
Unescape View File

@ -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}
/>
</div>
@ -79,33 +74,37 @@ export default function NewFlightApprovalsReport(props) {
<h4>지역</h4>
</div>
<div className='input-btn-2n'>
<div className='list-input'>
<CustomInput
inline
type='select'
id=''
bsSize='sm'
value={filterArea}
onChange={e => setFilterArea(e.target.value)}
>
<option value='' selected>
전체
</option>
<option value='gimpo'>김포공항 관제권</option>
</CustomInput>
<div className='list-input'>
<CustomInput
inline
type='select'
id=''
bsSize='sm'
value={props.filterArea}
onChange={e => props.setFilterArea(e.target.value)}
>
<option value='' selected>
전체
</option>
<option value='gimpo'>김포공항 관제권</option>
</CustomInput>
</div>
<div className='list-input-btn'>
<Button
color='primary'
onClick={() =>
props.handlerSearch(filterId, searchDate, filterArea)
}
size='sm'
>
검색
</Button>
</div>
<Button
color='primary'
onClick={() =>
props.handlerSearch(
props.filterId,
searchDate,
props.filterArea
)
}
size='sm'
>
검색
</Button>
</div>
</div>
</div>
</div>
</div>

168
src/components/flight/NewFlightApprovalsTable.js
Unescape View File

@ -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 ? (
<span>
<Typography.Link
onClick={() => 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 ? (
<span>
<Typography.Link
onClick={() => 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' ? (
<Input
min={0}
onKeyPress={e => {
if (!/[0-9]/.test(e.key)) {
e.preventDefault(); // 숫자 외의 입력을 막음
}
}}
/>
) : (
<Input />
);
const inputNode = inputType === 'number' ? <Input /> : <Input />;
return (
<td {...restProps}>
{editing ? (

17
src/containers/flight/NewFlightApprovalsContainer.js
Unescape View File

@ -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 }) {
<NewFlightApprovalsReport
handlerSearch={handlerSearch}
handleDragEnd={handleDragEnd}
filterId={filterId}
setFilterId={setFilterId}
filterArea={filterArea}
setFilterArea={setFilterArea}
/>
<NewFlightApprovalsTable
filter={filter}
filterArea={filterArea}
filterId={filterId}
startDate={startDate}
endDate={endDate}
selected={selected}

4
src/redux/features/laanc/laancState.ts
Unescape View File

@ -641,10 +641,14 @@ export interface ILaancAprvListRs {
schFltStDt: string;
schFltEndDt: string;
updateDt: string;
planAreaSno: number;
createDt: string;
purpose: string;
applyDtMonth: string;
applyDtDay: string;
addr1: string;
addr2: string;
addr3: string;
areaList: {
planAreaSno: number;
planSno: number;

19
src/redux/features/laanc/laancThunk.ts
Unescape View File

@ -277,17 +277,30 @@ export const getLaancAprvList = createAsyncThunk(
const data: ILaancAprvListRs[] = await axios.get(`api/bas/dos/plan`, {
params: rq
});
const result = data.map(item => {
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
};
})
};
}
});

Write Preview
Loading…
Cancel
Save