From 69da5ad6c3f7d4aa457a033fa5a31d0a2915a113 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?junh=5Feee=28=EC=9D=B4=EC=A4=80=ED=9D=AC=29?= Date: Wed, 4 Sep 2024 11:00:59 +0900 Subject: [PATCH] =?UTF-8?q?feat/=20=EB=B9=84=ED=96=89=EC=8A=B9=EC=9D=B8?= =?UTF-8?q?=EB=AA=A9=EB=A1=9D=20=EB=B3=80=EA=B2=BD=EA=B0=90=EC=A7=80?= =?UTF-8?q?=EC=8B=9C=20=EC=83=88=EB=A1=9C=EA=B3=A0=EC=B9=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .env.development | 8 ++-- .env.production | 1 + .../flight/OperationApprovalsTable.js | 13 +++++- src/components/websocket/WebsocketClient.js | 40 ++++++++++++++++++- src/configs/constants.ts | 1 + .../flight/OperationApprovalsContainer.js | 23 ++++++++++- 6 files changed, 77 insertions(+), 9 deletions(-) diff --git a/.env.development b/.env.development index 4c8b48e4..c0412d56 100644 --- a/.env.development +++ b/.env.development @@ -1,11 +1,11 @@ -# REACT_APP_HOST = http://192.168.0.30:8080/ -# REACT_APP_WS_HOST = ws://192.168.0.30:8081/ws -# REACT_APP_IMAGE_HOST = https://palnet-file.s3.ap-northeast-2.amazonaws.com/ + +# REACT_APP_HOST = http://192.168.0.56:8080/ +# REACT_APP_DOS_HOST = ws://192.168.0.56:8081/dos REACT_APP_HOST = http://121.190.193.50:6081/ REACT_APP_WS_HOST = ws://121.190.193.50:6082/ws -# REACT_APP_WS_HOST = ws://pav.palntour.com:8081/ws +REACT_APP_DOS_HOST = ws://121.190.193.50:6082/dos REACT_APP_IMAGE_HOST = https://palnet-file.s3.ap-northeast-2.amazonaws.com/ # Naver Search API HOST diff --git a/.env.production b/.env.production index d061f5be..c5ed66ca 100644 --- a/.env.production +++ b/.env.production @@ -1,6 +1,7 @@ # REACT_APP_HOST = http://pav.palntour.com:8080/ REACT_APP_HOST = http://121.190.193.50:6081/ REACT_APP_WS_HOST = ws://121.190.193.50:6082/ws +REACT_APP_DOS_HOST = ws://121.190.193.50:6082/dos REACT_APP_IMAGE_HOST = https://palnet-file.s3.ap-northeast-2.amazonaws.com/ # Naver Search API HOST diff --git a/src/components/flight/OperationApprovalsTable.js b/src/components/flight/OperationApprovalsTable.js index cf07ec49..2e72ac91 100644 --- a/src/components/flight/OperationApprovalsTable.js +++ b/src/components/flight/OperationApprovalsTable.js @@ -14,6 +14,7 @@ import OperationModal from './OperationModal'; import ScrollContainer from 'react-indiana-drag-scroll'; import OperationCheckBoxModal from './OperationCheckBoxModal'; import { ConfirmModal } from '@component/modal/ConfirmModal'; +import { clientRefreshAprvListParam } from '@src/redux/features/laanc/laancSlice'; export default function OperationApprovalsTable(props) { const dispatch = useDispatch(); @@ -64,9 +65,19 @@ export default function OperationApprovalsTable(props) { }); useEffect(() => { + dispatch( + clientRefreshAprvListParam({ + searchStDt: props.startDate, + searchEndDt: props.endDate + }) + ); + }, []); + + useEffect(() => { + console.log(laancAprvList, '----list'); let approvalCdValue = { S: 0, F: 0, C: 0, U: 0 }; - laancAprvList.map(item => { + laancAprvList?.map(item => { item.areaList.map(area => { if (area.approvalCd === 'S') { approvalCdValue.S += 1; diff --git a/src/components/websocket/WebsocketClient.js b/src/components/websocket/WebsocketClient.js index 8897fefe..bc81f61a 100644 --- a/src/components/websocket/WebsocketClient.js +++ b/src/components/websocket/WebsocketClient.js @@ -2,25 +2,59 @@ import React, { useEffect, useState, useRef } from 'react'; import { VscLoading } from 'react-icons/vsc'; import { useDispatch, useSelector } from '@src/redux/store'; import { useHistory } from 'react-router-dom'; -import { WS_HOST } from '../../configs/constants'; +import { WS_HOST, DOS_HOST } from '../../configs/constants'; import { getControlGp } from '@src/redux/features/control/gp/gpThunk'; +import { getLaancAprvList } from '@src/redux/features/laanc/laancThunk'; const WebsocketClient = () => { const dispatch = useDispatch(); const history = useHistory(); const reConnectionTime = 5000; //5초 + const { laancAprvParam } = useSelector(state => state.laancState); + const laancAprvParamRef = useRef(laancAprvParam); + const [isConnection, setIsConnection] = useState(false); const websocket = useRef(null); const timeout = useRef(null); + const [isDosConnection, setIsDosConnection] = useState(false); + const dosWebsocket = useRef(null); + const dosTimeout = useRef(null); + useEffect(() => { connect(); + dosConnect(); return () => { websocket.current.close(); clearTimeout(timeout.current); + + dosWebsocket.current.close(); + clearTimeout(dosTimeout.current); }; }, []); + useEffect(() => { + laancAprvParamRef.current = laancAprvParam; + }, [laancAprvParam]); + + const dosConnect = () => { + dosWebsocket.current = new WebSocket(DOS_HOST); + + dosWebsocket.current.onopen = () => { + setIsDosConnection(true); + console.log('[DOS Websocket Open] Connection Open'); + }; + + dosWebsocket.current.onmessage = e => { + const data = e.data; + + const key = JSON.parse(data); + + console.log(key, '-------'); + dispatch(getLaancAprvList({ ...laancAprvParamRef.current })); + }; + }; + const connect = () => { websocket.current = new WebSocket(WS_HOST); @@ -60,7 +94,9 @@ const WebsocketClient = () => { } return (
- +
diff --git a/src/configs/constants.ts b/src/configs/constants.ts index 159422f5..0869a7cb 100644 --- a/src/configs/constants.ts +++ b/src/configs/constants.ts @@ -1,6 +1,7 @@ // 호스트 export const HOST = process.env.REACT_APP_HOST; export const WS_HOST = process.env.REACT_APP_WS_HOST; +export const DOS_HOST = process.env.REACT_APP_DOS_HOST; export const NAVER_SEARCH_API_HOST = process.env.NAVER_SEARCH_API_HOST; export const IMG_PATH = process.env.REACT_APP_IMAGE_HOST; diff --git a/src/containers/flight/OperationApprovalsContainer.js b/src/containers/flight/OperationApprovalsContainer.js index 310b66d7..cdfce347 100644 --- a/src/containers/flight/OperationApprovalsContainer.js +++ b/src/containers/flight/OperationApprovalsContainer.js @@ -17,7 +17,8 @@ import { useHistory } from 'react-router-dom'; import useMapType from '@hooks/useMapType'; import { clientSaveAreaCoordinateList, - clientChangeDrawType + clientChangeDrawType, + clientRefreshAprvListParam } from '@src/redux/features/laanc/laancSlice'; import { MapControl } from '../../components/map/MapControl'; import { clientSetIsMapLoading } from '@src/redux/features/laanc/laancSlice'; @@ -293,7 +294,25 @@ export default function OperationApprovalsContainer({ mode }) { : {}) }) ); - // ); + + dispatch( + clientRefreshAprvListParam({ + searchStDt: searchDate.startDate, + searchEndDt: searchDate.endDate, + ctprvn: filterArea.ctprvn === '전체' ? '' : filterArea.ctprvn, + sig: filterArea.sig === '전체' ? '' : filterArea.sig, + address: filterArea.address, + limitZoneCd: + checkState.limitZoneNm === '전체' ? '' : checkState.limitZoneNm, + ...(search !== '' ? { applyNo: search } : {}), + ...(checkState.reviewedType !== '전체' + ? { reviewedType: checkState.reviewedType } + : {}), + ...(checkState.reviewedProcType !== '전체' + ? { reviewedProcType: checkState.reviewedProcType } + : {}) + }) + ); setFilter(search); };