From dc66eb40e0117db2849a5033fb0e99c19014980f Mon Sep 17 00:00:00 2001 From: hhjk00 Date: Mon, 30 Oct 2023 15:01:52 +0900 Subject: [PATCH 1/2] =?UTF-8?q?=EC=82=AC=EC=9A=A9=EC=9E=90=20qna=20?= =?UTF-8?q?=EB=AC=B8=EC=9D=98=20=ED=8C=8C=EC=9D=BC=20=EB=93=B1=EB=A1=9D?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../cstmrService/inquiry/InquiryWrite.js | 38 +++++----- .../inquiry/UserInquiryContainer.js | 69 +++++++++++++++++-- .../cstmrService/inquiry/model/index.ts | 14 +++- 3 files changed, 90 insertions(+), 31 deletions(-) diff --git a/src/components/cstmrService/inquiry/InquiryWrite.js b/src/components/cstmrService/inquiry/InquiryWrite.js index 72949681..8123538a 100644 --- a/src/components/cstmrService/inquiry/InquiryWrite.js +++ b/src/components/cstmrService/inquiry/InquiryWrite.js @@ -26,20 +26,11 @@ function InquiryWrite({ handlerSubmitInquiryForm, memberName, inquiryForm, - handlerDeleteConfirmInquiry + handlerDeleteConfirmInquiry, + fileInputRef, + handlerFileChange, + handlerFileClear }) { - const fileInputRef = useRef(null); - const [selectedFile, setSelectedFile] = useState(null); - - const handleFileChange = event => { - const file = event.target.files[0]; - setSelectedFile(file); - }; - - const handleFileClear = () => { - setSelectedFile(null); - }; - return (
0 ? 'file-selected' : '' }`} > handleFileChange(e)} + onChange={e => handlerFileChange(e)} ref={fileInputRef} /> {/* 현재는 text만 바뀌는상태! input 초기화 작업해주세용 */} - {selectedFile && ( // Display the trash icon only if a file is selected + {inquiryForm.fileInfos.length > 0 && ( // Display the trash icon only if a file is selected handlerFileClear('edit')} /> )}
@@ -208,9 +200,11 @@ function InquiryWrite({
- + {detail.createDt && ( + + )} diff --git a/src/containers/cstmrService/inquiry/UserInquiryContainer.js b/src/containers/cstmrService/inquiry/UserInquiryContainer.js index 65fd98e6..01ab6834 100644 --- a/src/containers/cstmrService/inquiry/UserInquiryContainer.js +++ b/src/containers/cstmrService/inquiry/UserInquiryContainer.js @@ -2,7 +2,7 @@ import { Button, Badge } from 'reactstrap'; import AppCollapse from '@components/app-collapse'; import { useDispatch, useSelector } from 'react-redux'; import * as Actions from '../../../modules/cstmrService/inquiry/action'; -import { Fragment, useCallback, useEffect, useState } from 'react'; +import { Fragment, useCallback, useEffect, useRef, useState } from 'react'; import moment from 'moment'; import InquiryWrite from '../../../components/cstmrService/inquiry/InquiryWrite'; import { InfoModal } from '../../../components/modal/InfoModal'; @@ -15,13 +15,16 @@ export default function UserInquiryContainer({ memberName }) { state => state.qnaState ); + const fileInputRef = useRef(null); const [isInquiryModalOpen, setIsInquiryModalOpen] = useState(false); const [inquiryForm, setInquiryForm] = useState({ category: '칭찬', contact: '', title: '', - content: '' + content: '', + fileInfos: [] }); + const [validationModal, setValidationModal] = useState({ errorType: { isOpen: false, @@ -129,7 +132,8 @@ export default function UserInquiryContainer({ memberName }) { category: '칭찬', contact: '', title: '', - content: '' + content: '', + fileInfos: [] }); } setIsInquiryModalOpen(!isInquiryModalOpen); @@ -148,9 +152,25 @@ export default function UserInquiryContainer({ memberName }) { [inquiryForm] ); + const handlerFileChange = e => { + const file = e.target.files[0]; + setInquiryForm({ + ...inquiryForm, + fileInfos: [file] + }); + }; + + const handlerFileClear = () => { + setInquiryForm({ + ...inquiryForm, + fileInfos: [] + }); + }; + // 문의 등록 event handler const handlerSubmitInquiryForm = type => { - const { category, title, content, contact, qnaSno } = inquiryForm; + const { category, title, content, contact, fileInfos, qnaSno } = + inquiryForm; if (!contact) { setValidationModal({ @@ -192,6 +212,34 @@ export default function UserInquiryContainer({ memberName }) { } }); return; + } else if (fileInfos.length > 0) { + const allowedExtensions = ['jpg', 'png', 'jpeg', 'gif']; + const fileExtension = fileInfos[0].name.split('.').pop().toLowerCase(); + const maxFileSize = 3 * 1024 * 1024; // 3MB + + if (!allowedExtensions.includes(fileExtension)) { + setValidationModal({ + ...validationModal, + errorType: { + title: '파일 형식 오류', + isOpen: true, + desc: '파일 형식은 jpg, png, jpeg, gif 형식만 가능합니다.' + } + }); + return; + } + + if (fileInfos[0].size > maxFileSize) { + setValidationModal({ + ...validationModal, + errorType: { + title: '파일 크기 오류', + isOpen: true, + desc: '파일 크기는 3MB를 초과할 수 없습니다.' + } + }); + return; + } } if (type === 'post') { @@ -201,6 +249,10 @@ export default function UserInquiryContainer({ memberName }) { form.append('title', title); form.append('content', content); + if (fileInfos.length > 0) { + form.append('files', fileInfos[0]); + } + dispatch(Actions.USER_INQUIRY.request(form)); } else if (type === 'edit') { dispatch( @@ -249,13 +301,16 @@ export default function UserInquiryContainer({ memberName }) { Date: Mon, 30 Oct 2023 15:11:32 +0900 Subject: [PATCH 2/2] =?UTF-8?q?laanc=20=EB=B9=84=ED=96=89=EA=B5=AC?= =?UTF-8?q?=EC=97=AD=20elev=EA=B0=92=20redux=20=EB=B0=94=EB=A1=9C=20?= =?UTF-8?q?=EC=A0=80=EC=9E=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/laanc/map/LaancAreaMap.js | 9 ++---- src/components/laanc/map/LaancDrawControl.js | 32 +++++++++----------- src/modules/laanc/sagas/laancSagas.ts | 4 +-- 3 files changed, 19 insertions(+), 26 deletions(-) diff --git a/src/components/laanc/map/LaancAreaMap.js b/src/components/laanc/map/LaancAreaMap.js index b307301a..3667cbef 100644 --- a/src/components/laanc/map/LaancAreaMap.js +++ b/src/components/laanc/map/LaancAreaMap.js @@ -47,7 +47,6 @@ export default function LaancAreaMap({ const dispatch = useDispatch(); const mapControl = useSelector(state => state.controlMapReducer); const { areaCoordList } = useSelector(state => state.flightState); - const { inAirArea } = useSelector(state => state.flightState); const [mapObject, setMapObject] = useState(); const [isMapLoad, setIsMapLoad] = useState(false); @@ -82,10 +81,6 @@ export default function LaancAreaMap({ setMode(mapControl.drawType); }, [mapControl.drawType]); - // useEffect(() => { - // console.log(inAirArea, '--inairARea'); - // }, [inAirArea]); - useEffect(() => { if (areaCoordList && mapObject) { if ( @@ -301,11 +296,11 @@ export default function LaancAreaMap({ const handlerCoordinates = areaInfo => { const areaList = handlerAreaInfoToAreaList(areaInfo); + // dispatch(LaancAction.LAANC_ALTITUDE.request(areaList)); + dispatch(LaancAction.LAANC_VALID_AREA.request(areaList)); if (areaInfo.areaType === 'LINE' || areaInfo.areaType === 'POLYGON') { dispatch(FLIGHT_PLAN_AREA_BUFFER_LIST.request(areaList)); } else { - dispatch(LaancAction.LAANC_ALTITUDE.request(areaList)); - dispatch(LaancAction.LAANC_VALID_AREA.request(areaList)); setMapAreaCoordList(areaList); } }; diff --git a/src/components/laanc/map/LaancDrawControl.js b/src/components/laanc/map/LaancDrawControl.js index 503e7062..d44056dc 100644 --- a/src/components/laanc/map/LaancDrawControl.js +++ b/src/components/laanc/map/LaancDrawControl.js @@ -14,11 +14,14 @@ import { drawTypeChangeAction } from '../../../modules/control/map/actions/contr import MapboxDraw from '@mapbox/mapbox-gl-draw'; import { CircleMode } from 'mapbox-gl-draw-circle'; import axios from '../../../modules/utils/customAxiosUtil'; +import * as LaancAction from '../../../modules/laanc/actions/laancActions'; export const LaancDrawControl = props => { const dispatch = useDispatch(); const mapControl = useSelector(state => state.controlMapReducer); + const { laancElev } = useSelector(state => state.laancState); + const drawObj = props.drawObj; const mapObject = props.mapObject; @@ -32,6 +35,10 @@ export const LaancDrawControl = props => { desc: '' }); + // useEffect(() => { + // console.log(laancElev, '----elev'); + // }, [laancElev]); + useEffect(() => { const areaType = props.areaCoordList[0].areaType; const drawType = mapControl.drawType; @@ -200,38 +207,28 @@ export const LaancDrawControl = props => { const areaInfo = handlerSettingAreaInfo(coords, mode); const areaList = props.handlerAreaInfoToAreaList(areaInfo); + let isBreak = false; // 비행금지 구역 체크 console.log('unableElev'); try { const elev1 = await axios.post(`api/bas/laanc/valid/elev`, areaList); + dispatch(LaancAction.LAANC_ALTITUDE.success(elev1.data)); const elev2 = []; - if (mode === 'CIRCLE') { - const point = mapObject.project(coords); + const formatCoords = mode === 'CIRCLE' ? [coords] : coords; + for (let i = 0; i < formatCoords.length; i++) { + const point = mapObject.project(formatCoords[i]); const maine = mapObject.queryRenderedFeatures(point, { layers: ['maine'] }); + if (maine.length > 0) { if (maine[0].properties.description.includes('김포공항 비행불가')) { elev2.push(maine[0]); isBreak = true; - } - } - } else { - for (let i = 0; i < coords.length; i++) { - const point = mapObject.project(coords[i]); - const maine = mapObject.queryRenderedFeatures(point, { - layers: ['maine'] - }); - - if (maine.length > 0) { - if (maine[0].properties.description.includes('김포공항 비행불가')) { - elev2.push(maine[0]); - isBreak = true; - break; - } + break; } } } @@ -239,6 +236,7 @@ export const LaancDrawControl = props => { if (elev1.data[0] === 0 || elev2.length > 0) isBreak = true; } catch (error) { alert('에러 발생'); + return; } if (isBreak) { diff --git a/src/modules/laanc/sagas/laancSagas.ts b/src/modules/laanc/sagas/laancSagas.ts index 1f7bb3ec..a4cf2f26 100644 --- a/src/modules/laanc/sagas/laancSagas.ts +++ b/src/modules/laanc/sagas/laancSagas.ts @@ -120,8 +120,8 @@ function* postValidElevSaga( ) { try { const deail = action.payload; - const res = yield call(Apis.laancApi.postValidElev, deail); - yield put(Actions.LAANC_ALTITUDE.success(res.data)); + // const res = yield call(Apis.laancApi.postValidElev, deail); + // yield put(Actions.LAANC_ALTITUDE.success(detail)); } catch (error) { yield put( MessageActions.IS_ERROR({