Browse Source

승인 목록 공문 다운로드 기능 추가 및 코드 정리

pull/2/head
박상현 11 months ago
parent
commit
b8c29203f2
  1. 40
      src/components/laanc/LaacnStep3.js
  2. 61
      src/components/laanc/LaancGrid.js
  3. 6
      src/components/laanc/LaancSearch.js
  4. 48
      src/components/laanc/LaancStep1.js
  5. 5
      src/components/laanc/LaancStep2.js
  6. 110
      src/containers/laanc/LaancContainer.js
  7. 94
      src/containers/laanc/LaancPlanContainer.js
  8. 1
      src/modules/laanc/models/laancModels.ts

40
src/components/laanc/LaacnStep3.js

@ -1,5 +1,5 @@
import React, { useEffect, useState } from 'react';
import { useDispatch, useSelector, shallowEqual } from 'react-redux';
import React, { useState } from 'react';
import { useSelector } from 'react-redux';
import { Document, Page, pdfjs } from 'react-pdf';
import {
Row,
@ -9,7 +9,6 @@ import {
ModalHeader,
ModalBody,
ModalFooter,
Alert,
FormGroup,
Label,
Input,
@ -21,14 +20,12 @@ import { HOST } from '../../configs/constants';
pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js`;
export default function LaacnStep3({
handlerStep,
disabledAnimation,
data,
setDisabledAnimation,
handlerLaancClose,
centeredModal,
setCenteredModal,
handleChange
setCenteredModal
}) {
const obj = {
fltType: {
@ -46,14 +43,13 @@ export default function LaacnStep3({
const [centeredModal2, setCenteredModal2] = useState(false);
const [formModal, setFormModal] = useState(false);
const [numPages, setNumPages] = useState(null); // total
const [pageNum, setPageNum] = useState(1);
const { user } = useSelector(state => state.authState);
const { laancPdf } = useSelector(state => state.laancState);
const handlerPdfDownload = e => {
if (laancPdf.pdfUrl) {
let alink = document.createElement('a');
alink.href = `${HOST}${laancPdf.pdfUrl.substring(1)}`;
alink.href = `${HOST}${laancPdf.pdfUrl?.substring(1)}`;
alink.download = 'SamplePDF.pdf';
alink.click();
}
@ -223,32 +219,6 @@ export default function LaacnStep3({
</ul>
</div>
</div>
{/* <div className='document-btn'>
<div className='ti'>승인 공문</div>
<Row>
<Col md='6'>
<Button color='primary' size='lg' onClick={handlerPdfDownload}>
공문 다운로드
</Button>
</Col>
<Col md='6'>
<Button
color='primary'
size='lg'
outline
onClick={() => {
const url = localStorage.getItem('pdfUrl');
if (url !== 'undefined') {
setFormModal(true);
}
}}
>
공문 미리보기
</Button>
</Col>
</Row>
</div> */}
</div>
</ModalBody>
<ModalFooter style={{ justifyContent: 'right' }}>
@ -279,7 +249,7 @@ export default function LaacnStep3({
</ModalHeader>
<ModalBody>
<Document
file={`${HOST}${(laancPdf?.pdfUrl).substring(1)}`}
file={`${HOST}${laancPdf?.pdfUrl?.substring(1)}`}
onLoadSuccess={onDocumentLoadSuccess}
>
<div>

61
src/components/laanc/LaancGrid.js

@ -1,6 +1,6 @@
import { useEffect, useState } from 'react';
import { useSelector, useDispatch } from 'react-redux';
import { useHistory } from 'react-router-dom';
import { Document, Page, pdfjs } from 'react-pdf';
import { GridDatabase } from '@src/components/crud/grid/GridDatatable';
import { Row, Col, Card, Button, Spinner, Modal } from 'reactstrap';
import * as LaancAction from '../../modules/laanc/actions/laancActions';
@ -12,50 +12,18 @@ import {
AREA_DETAIL_INIT
} from '../../modules/basis/flight/actions/basisFlightAction';
import { drawTypeChangeAction } from '../../modules/control/map/actions/controlMapActions';
const data = [
{
name: '김장현',
flightStart: '2023-09-25 12:50',
flightEnd: '2023-09-25 13:20',
apploveType: '승인',
weight: '25kg',
altitude: '50m'
},
{
name: '김장현',
flightStart: '2023-09-26 14:40',
flightEnd: '2023-09-26 15:10',
apploveType: '승인',
weight: '2kg',
altitude: '120m'
},
{
name: '김장현',
flightStart: '2023-09-27 16:30',
flightEnd: '2023-09-27 17:00',
apploveType: '승인',
weight: '7kg',
altitude: '100m'
}
];
import { HOST } from '../../configs/constants';
pdfjs.GlobalWorkerOptions.workerSrc = `//cdnjs.cloudflare.com/ajax/libs/pdf.js/${pdfjs.version}/pdf.worker.js`;
export default function LaancGrid() {
const dispatch = useDispatch();
const history = useHistory();
const [isAnimation, setIsAnimation] = useState(false);
const { scheduleList } = useSelector(state => state.flightState);
const { laancSearchData } = useSelector(state => state.laancState);
const { areaCoordList } = useSelector(state => state.flightState);
const { loading } = useSelector(state => state.loadingReducer);
const { laancDetail } = useSelector(state => state.laancState);
const fillZero = (width, str) => {
return str.length >= width
? str
: new Array(width - str.length + 1).join('0') + str; //남는 길이만큼 0으로 채움
};
useEffect(() => {
if (laancDetail) {
@ -72,9 +40,6 @@ export default function LaancGrid() {
//상세보기
const handleDetail = planSno => {
dispatch(LaancAction.LAANC_DETAIL.request(planSno));
// history.push('/basis/flight/plan/create');
// to={`/basis/flight/plan/detail/${row.planSno}?type=plan`}
};
const handlerLaancClose = () => {
@ -182,12 +147,17 @@ export default function LaancGrid() {
},
{
name: '',
// selector: row => row.altitude,
minWidth: '170px',
sortable: true,
cell: row => {
return (
<Button.Ripple color='primary' size='sm' onClick={() => {}}>
<Button.Ripple
color='primary'
size='sm'
onClick={() => {
handlerPdfDownload(row.pdfUrl);
}}
>
공문 다운로드
</Button.Ripple>
);
@ -195,6 +165,15 @@ export default function LaancGrid() {
}
];
const handlerPdfDownload = pdf => {
if (pdf) {
let alink = document.createElement('a');
alink.href = `${HOST}${pdf?.substring(1)}`;
alink.download = 'SamplePDF.pdf';
alink.click();
}
};
return (
<div className='pal-card-box'>
<Row>
@ -211,7 +190,7 @@ export default function LaancGrid() {
<div style={{ display: 'flex', alignItems: 'center' }}>
<h4>LAANC 승인 신청 목록</h4>
<span className='search-case'>
검색결과 {laancSearchData?.length}
검색결과 {laancSearchData ? laancSearchData?.length : 0}
</span>
</div>
</div>

6
src/components/laanc/LaancSearch.js

@ -1,5 +1,5 @@
import { useState, useEffect } from 'react';
import { useDispatch, Selector, useSelector } from 'react-redux';
import { useDispatch } from 'react-redux';
import { Row, Col, Button, Card, CardBody } from 'reactstrap';
import { Search, Calendar } from 'react-feather';
import Flatpickr from 'react-flatpickr';
@ -15,7 +15,7 @@ function LaancSearch() {
});
useEffect(() => {
dispatch(LaancAction.LAANC_APRV_LIST.request({ ...date, page: 1 }));
dispatch(LaancAction.LAANC_APRV_LIST.request({ ...date }));
}, []);
const handlerChangeDate = selectedDates => {
@ -27,7 +27,7 @@ function LaancSearch() {
};
const handlerClick = () => {
dispatch(LaancAction.LAANC_APRV_LIST.request({ ...date, page: 1 }));
dispatch(LaancAction.LAANC_APRV_LIST.request({ ...date }));
};
return (

48
src/components/laanc/LaancStep1.js

@ -1,6 +1,6 @@
import React, { useEffect, useState, useRef } from 'react';
import { useHistory, useLocation } from 'react-router-dom';
import { useDispatch, useSelector, shallowEqual } from 'react-redux';
import { useLocation } from 'react-router-dom';
import { useDispatch, useSelector } from 'react-redux';
import Flatpickr from 'react-flatpickr';
import * as LaancAction from '../../modules/laanc/actions/laancActions';
import '@styles/react/libs/flatpickr/flatpickr.scss';
@ -13,14 +13,10 @@ import {
Row,
Col,
Button,
Modal,
ModalHeader,
ModalBody,
ModalFooter,
Alert,
FormGroup,
Popover,
PopoverHeader,
UncontrolledPopover,
PopoverBody,
Label,
@ -32,9 +28,6 @@ export default function LaancStep1({
handleChange,
handlerNext,
data,
handlerWeather,
disabledAnimation,
setDisabledAnimation,
centeredModal,
setCenteredModal,
currentParm,
@ -167,22 +160,6 @@ export default function LaancStep1({
const handleBlur = (value, type) => {
switch (type) {
case 'fltElev':
// if (
// &&
// data.areaList[0].coordList[0].lat != 0
// ) {
// setIsErrorModal({
// isOpen: true,
// title: '고도 알림',
// desc: (
// <>
// 관제권 및 비행금지 공역을 제외한 지역에서는 주간에 150m미만의
// <br />
// 고도에서는 비행승인없이 비행가능합니다.
// </>
// )
// });
// }
if (
parseInt(value.replace('/^0+/', 'm', ''), 10) > 150 &&
data.areaList[0].coordList[0].lat != 0
@ -236,14 +213,19 @@ export default function LaancStep1({
};
const toggle = type => {
if (type === 'commercial') {
setPopoverCommercial(!popoverCommercial);
} else if (type === 'schFltStDt') {
setPopoverSchFltStDt(!popoverSchFltStDt);
} else if (type === 'schFltEndDt') {
setPopoverSchFltEndDt(!popoverSchFltEndDt);
switch (type) {
case 'commercial':
setPopoverCommercial(!popoverCommercial);
break;
case 'schFltStDt':
setPopoverSchFltStDt(!popoverSchFltStDt);
break;
case 'schFltEndDt':
setPopoverSchFltEndDt(!popoverSchFltEndDt);
break;
}
};
return (
<>
<ModalHeader>
@ -709,7 +691,7 @@ export default function LaancStep1({
</Input>
</FormGroup>
</Col>
{data.commercial === 'COMMERCIAL' ||
{data.fltType === 'COMMERCIAL' ||
data.arcrftList[0].arcrftWghtCd == '11' ||
data.arcrftList[0].arcrftWghtCd == '10' ||
data.arcrftList[0].arcrftWghtCd == '9' ? (
@ -751,7 +733,6 @@ export default function LaancStep1({
type='text'
id='idntfNum'
name='idntfNum'
// defaultValue={data.email || ''}
value={data.arcrftList[0].idntfNum}
size='sm'
onChange={e => {
@ -762,7 +743,6 @@ export default function LaancStep1({
value
});
}}
// innerRef={data}
placeholder=''
/>
</FormGroup>

5
src/components/laanc/LaancStep2.js

@ -22,8 +22,6 @@ import * as TermsActions from '../../modules/account/register/actions/accountAct
export default function LaancStep2({
data,
handlerStep,
disabledAnimation,
setDisabledAnimation,
centeredModal,
setCenteredModal,
handlerLaancClose,
@ -91,9 +89,8 @@ export default function LaancStep2({
],
validatedRs: laancApply
});
// dispatch(LaancAction.LAANC_FLIGHT_CREATE.request(flightData));
};
//laanc 문구 정의 함수
const laancReason = (
flight,
arcrftDuplicated,

110
src/containers/laanc/LaancContainer.js

@ -1,10 +1,9 @@
import { useEffect, useState } from 'react';
import { useHistory, useLocation } from 'react-router-dom';
import { useLocation } from 'react-router-dom';
import { Button, Badge } from 'reactstrap';
import moment from 'moment';
import { useDispatch, useSelector, shallowEqual } from 'react-redux';
import { CustomMainLayout } from '../../components/layout/CustomMainLayout';
import * as FlightAction from '../../modules/basis/flight/actions/basisFlightAction';
import * as LaancAction from '../../modules/laanc/actions/laancActions';
import { drawTypeChangeAction } from '../../modules/control/map/actions/controlMapActions';
import {
@ -29,29 +28,15 @@ const initSearchData = {
// const columns = [{}];
export default function LaancContainer() {
const dispatch = useDispatch();
const history = useHistory();
const [open, setOpen] = useState(false);
const location = useLocation();
const [currentParm, setCurrentParm] = useState(false);
const [disabledAnimation, setDisabledAnimation] = useState(false);
const [searchData, setSerchData] = useState(initSearchData);
const {
list: planListData,
detail: planDetailData,
listSelect,
selectGroup,
areaCoordList,
total
} = useSelector(state => state.flightState);
const { joinList, joinListCount, groupList, groupListCount } = useSelector(
state => state.groupState
);
const { user } = useSelector(state => state.authState, shallowEqual);
const { laancSearchData } = useSelector(state => state.laancState);
//비행계획서 신청 버튼 활성/비활성 제어
const [isMyGroup, setIsMyGroup] = useState();
const { user } = useSelector(state => state.authState, shallowEqual);
const location = useLocation();
const queryParams = new URLSearchParams(location.search);
const mapParam = queryParams.get('map');
@ -103,20 +88,6 @@ export default function LaancContainer() {
}
}, [searchData]);
// const moveFlightPlanDetailPage = () => {
// if (planDetailData) {
// dispatch(FlightAction.FLIGHT_PLAN_DETAIL_INIT());
// }
// if (areaCoordList) {
// dispatch(FlightAction.AREA_DETAIL_INIT());
// }
// history.push('/basis/flight/plan/create');
// };
// const handleSearch = data => {
// dispatch(FlightAction.FLIGHT_PLAN_LIST.request({ ...data, page: 1 }));
// };
const handleApply = () => {
dispatch(drawTypeChangeAction(''));
dispatch(LaancAction.LAANC_APPROVAL_INIT());
@ -124,79 +95,6 @@ export default function LaancContainer() {
setCurrentParm(true);
};
// const handleChangeSearchData = values => {
// setSerchData(prevState => ({
// ...prevState,
// ...values
// }));
// };
// const handleGroupSelect = ({
// groupId,
// groupNm,
// groupAuthCd,
// myGroupAuthCd
// }) => {
// // 권한 상관 없이 모두 조회 가능
// const param = searchData;
// param.cstmrSno = user.cstmrSno;
// param.groupId = groupId;
// dispatch(
// // FlightAction.FLIGHT_PLAN_GROUP_SELECT({
// FlightAction.FLIGHT_PLAN_LIST_GROUP_SELECT({
// cstmrSno: user.cstmrSno,
// groupId: groupId,
// groupNm: groupNm
// })
// );
// // groupId sessionStorage에 보관 (1 브라우저 1 tab에만 유효)
// sessionStorage.setItem('groupId', groupId);
// sessionStorage.setItem('cstmrSno', user.cstmrSno);
// setSerchData(prevState => {
// return {
// ...prevState,
// cstmrSno: user.cstmrSno,
// groupId: groupId
// };
// });
// dispatch(FlightAction.FLIGHT_PLAN_LIST.request({ ...param, page: 1 }));
// //비행계획서 신청 버튼 활성/비활성 제어
// let my = false;
// if (user.authId === 'SUPER') {
// my = true;
// } else if (user.authId === 'ADMIN') {
// if (myGroupAuthCd) {
// my = true;
// }
// } else if (user.authId === 'USER') {
// if (groupAuthCd) {
// my = true;
// }
// }
// setIsMyGroup(my);
// };
// const handlerGroupCancel = () => {
// dispatch(
// // FlightAction.FLIGHT_PLAN_GROUP_SELECT({
// FlightAction.FLIGHT_PLAN_LIST_GROUP_SELECT({
// cstmrSno: 0,
// groupId: '',
// groupNm: ''
// })
// );
// };
// const onChangePage = page => {
// dispatch(FlightAction.FLIGHT_PLAN_LIST.request({ ...searchData, page }));
// };
return (
<CustomMainLayout title={'LAANC 신청 목록'}>
<div className='sub-text'>

94
src/containers/laanc/LaancPlanContainer.js

@ -108,21 +108,20 @@ export default function LaancPlanContainer({
});
return;
}
// if ((!valid && evaluatedTargetArea && !flight)) {
// setIsErrorModal({
// isOpen: true,
// title: '검토 결과 사전안내',
// desc: (
// <>
// 유효성 검사에 실패하여 미 승인 대상입니다.
// <p>자세한 사항은 비행승인 검토결과를 확인해주시기 바랍니다.</p>
// </>
// )
// });
if (!valid && evaluatedTargetArea && !flight) {
setIsErrorModal({
isOpen: true,
title: '검토 결과 사전안내',
desc: (
<>
유효성 검사에 실패하여 승인 대상입니다.
<p>자세한 사항은 비행승인 검토결과를 확인해주시기 바랍니다.</p>
</>
)
});
// return;
// }
return;
}
setStep(2);
}
}, [laancApply]);
@ -132,10 +131,6 @@ export default function LaancPlanContainer({
setStep(step);
};
// const handlerLogout = () => {
// dispatch(Actions.logout.request());
// };
// 날씨 핸들러
const handlerWeather = () => {
setFormModal(!formModal);
@ -161,29 +156,6 @@ export default function LaancPlanContainer({
});
break;
case 'area':
// setIsErrorModal({
// isOpen: true,
// title: '고도 재설정 알림',
// desc: (
// <>
// 설정하신 고도가 150m를 초과하였습니다.
// <br />
// 150m 초과 시 드론원스톱을 통해 특별비행승인이 필요합니다.
// </>
// )
// });
// setDetailData(prevState => {
// const arr = [...prevState[arrName]];
// const updateData = {
// ...prevState[arrName][0],
// [name]: 0
// };
// arr[0] = updateData;
// return {
// ...prevState,
// [arrName]: arr
// };
// });
if (name === 'fltMethod' && value != '직접입력') {
setDetailData(prevState => {
const arr = [...prevState[arrName]];
@ -198,22 +170,7 @@ export default function LaancPlanContainer({
[arrName]: arr
};
});
}
// else if (name === 'selffltMethod') {
// setDetailData(prevState => {
// const arr = [...prevState[arrName]];
// const updateData = {
// ...prevState[arrName][0],
// fltMethod: value
// };
// arr[0] = updateData;
// return {
// ...prevState,
// [arrName]: arr
// };
// });
// }
else {
} else {
setDetailData(prevState => {
const arr = [...prevState[arrName]];
const updateData = {
@ -350,22 +307,7 @@ export default function LaancPlanContainer({
});
return false;
}
// else if (detailData.areaList[0].fltElev > 150) {
// setIsErrorModal({
// isOpen: true,
// title: '고도 재설정 알림',
// desc: (
// <>
// 설정하신 고도가 150m를 초과하였습니다.
// <br />
// 150m 초과 시 드론원스톱을 통해 특별비행승인이 필요합니다.
// </>
// )
// });
// return false;
else if (!detailData.areaList[0].bufferZone) {
} else if (!detailData.areaList[0].bufferZone) {
setIsErrorModal({
isOpen: true,
title: '필수값 입력 오류',
@ -412,11 +354,6 @@ export default function LaancPlanContainer({
} else {
// 비행 방식 직접 입력칸 활성화 후 작성 시 조건문
if (detailData.areaList[0].selffltMethod) {
// const concatData = {};
// concatData ={
// ...detailData.areaList[0],
// fltMethod: detailData.areaList[0].selffltMethod
// }
setFinalDetailData({
...detailData,
areaList: [
@ -470,7 +407,6 @@ export default function LaancPlanContainer({
{step === 1 && (
<>
<LaancStep1
// handlerStep={handlerStep}
data={detailData}
handleChange={handleChange}
handlerNext={handlerNext}

1
src/modules/laanc/models/laancModels.ts

@ -636,6 +636,7 @@ export interface LaancAprvData {
cstmrSno: number;
memberName: string;
email: string;
pdfUrl: string;
hpno: string;
clncd: string;
schFltStDt: string;

Loading…
Cancel
Save