이준희 2 years ago
parent
commit
36b9bfc4b4
  1. 1
      .env.development
  2. 3273
      src/assets/css/custom.css
  3. 1
      src/modules/control/gp/actions/controlGpAction.ts
  4. 1
      src/modules/control/gp/apis/controlGpApi.ts
  5. 22
      src/modules/control/gp/models/controlGpModel.ts
  6. 22
      src/modules/control/gp/reducers/controlGpReducer.ts
  7. 12
      src/modules/control/gp/sagas/controlGpSaga.ts
  8. 83
      src/views/control/main/ControlMain.js

1
.env.development

@ -1,5 +1,6 @@
REACT_APP_HOST = http://localhost:8080/
REACT_APP_WS_HOST = ws://localhost:8081/ws
REACT_APP_IMAGE_HOST = https://palnet-file.s3.ap-northeast-2.amazonaws.com/
# Naver Search API HOST

3273
src/assets/css/custom.css

File diff suppressed because it is too large Load Diff

1
src/modules/control/gp/actions/controlGpAction.ts

@ -16,7 +16,6 @@ import {
ControlGpArcrftWarnList,
ControlGpWarnLogList,
ControlweatherData,
ControlGpWeatherState,
rescontrolweatherData,
ControlGpArcrftWarnRq
} from '../models/controlGpModel';

1
src/modules/control/gp/apis/controlGpApi.ts

@ -58,7 +58,6 @@ export const controlGpApi = {
...rq
}
});
return data;
},
checkPlanContains: async (rq: ControlGpPlanContainsRQ) => {

22
src/modules/control/gp/models/controlGpModel.ts

@ -5,9 +5,9 @@ export interface ControlGpState {
controlGroupAuthInfo: ControlGroupAuthData[] | undefined;
}
export interface ControlGpWeatherState {
controlWheather: rescontrolweatherData | undefined;
}
// export interface ControlGpWeatherState {
// controlWheather: rescontrolweatherData | undefined;
// }
export interface ControlGpFlightPlanState {
controlGpFltPlanList: ControlGpFlightPlanDataList | undefined;
@ -26,6 +26,7 @@ export interface ControlGpHisState {
export interface ControlGpDtlState {
controlGpDetail: ControlGpDtlData | undefined;
controlDetail: ControlDetailData | undefined;
controlWheather: rescontrolweatherData | undefined;
}
// export interface ControlGroupAuthState {
@ -195,20 +196,7 @@ export interface ControlGpArcrftWarnData {
}
export interface rescontrolweatherData {
resultCode: string;
resultMsg: string;
numOfRows: string;
pageNo: string;
totalCount: string;
dataType: string;
baseDate: string;
baseTime: string;
fcstDate: string;
fcstTime: string;
category: string;
fcstValue: string;
nx: string;
ny: string;
items: [];
}
export interface ControlGpArcrftWarnList
extends Array<ControlGpArcrftWarnData> {}

22
src/modules/control/gp/reducers/controlGpReducer.ts

@ -17,14 +17,14 @@ import {
import {
ControlGpWarnLogData,
ControlDetailData,
rescontrolweatherData,
ControlGpDtlState,
ControlGpFlightPlanState,
ControlGpLogState,
ControlGpHisState,
ControlGpState,
// ControlGroupAuthState,
initiaResponseControlGpData,
ControlGpWeatherState
initiaResponseControlGpData
} from '../models/controlGpModel';
export const controlGpReducer = createReducer<ControlGpState, ControlGpAction>(
@ -36,17 +36,6 @@ export const controlGpReducer = createReducer<ControlGpState, ControlGpAction>(
draft.controlGroupAuthInfo = controlGroupAuthInfo;
})
);
export const controlGpweatherReducer = createReducer<
ControlGpWeatherState,
ControlGpAction
>(initiaResponseControlGpData).handleAction(
controlweatherAction.success,
(state, action) =>
produce(state, draft => {
const data = action.payload;
draft.controlWheather = data;
})
);
export const controlGpFltPlanReducer = createReducer<
ControlGpFlightPlanState,
@ -115,8 +104,13 @@ export const controlGpDtlReducer = createReducer<
const data: ControlDetailData = action.payload;
draft.controlDetail = data;
})
)
.handleAction(controlweatherAction.success, (state, action) =>
produce(state, draft => {
const data: rescontrolweatherData = action.payload;
draft.controlWheather = data;
})
);
// export const controlGroupAuthReducer = createReducer<
// ControlGroupAuthState,
// ControlGpAction

12
src/modules/control/gp/sagas/controlGpSaga.ts

@ -119,6 +119,7 @@ function* controlGpRtDtlSaga(
// console.log(controlGpDetail);
yield put(
Actions.controlGpRtDtlAction.success({
controlWheather: undefined,
controlDetail: undefined,
controlGpDetail: controlGpDetail
})
@ -140,12 +141,11 @@ function* controlDtlSaga(
const lng = adress[0].lng;
const rq = {
nx: lat,
nx: lat, // 위도
ny: lng
};
//날씨 api 호출
const res = yield call(controlGpApi.apiweather, rq);
const { data } = yield call(controlGpApi.getDetail, controlId);
yield put(
Actions.controlGpDtlAction.success({
@ -209,8 +209,12 @@ function* ControlWeatherSaga(
) {
try {
const rq = action.payload;
const data = yield call(controlGpApi.apiweather, rq);
yield put(Actions.controlweatherAction.success(data.response.body.items));
const res = yield call(controlGpApi.apiweather, rq);
yield put(
Actions.controlweatherAction.success({
items: res.response.body.items
})
);
} catch (error) {
yield put(Actions.controlweatherAction.failure(error));
}

83
src/views/control/main/ControlMain.js

@ -3,13 +3,14 @@ import React, { useEffect, useState } from 'react';
import '../../../assets/css/custom.css';
import logo from '../../../assets/images/pal_logo.png';
import { Sun, Map, Bell } from 'react-feather';
import { Sun, Map, Bell, Navigation2 } from 'react-feather';
import { AiOutlinePoweroff, AiOutlineExclamation } from 'react-icons/ai';
import { IoAlertOutline } from 'react-icons/io5';
import { ReactComponent as DroneMenuIcon } from '../../../assets/images/drone_menu_icon.svg';
import {
Card
} from 'reactstrap';
import ControlAlarmNotice from '../alarm/ControlAlarmNotice';
import ControlReportList from '../report/ControlReportList';
import ControlReportDetail from '../report/ControlReportDetail';
@ -18,7 +19,7 @@ import ControlAlarmList from '../alarm/ControlAlarmList';
import ControlSetting from '../setting/ControlSetting';
import WebsocketClient from '../../../components/websocket/WebsocketClient';
import { useDispatch, useSelector } from 'react-redux';
import { controlweatherAction } from '../../../modules/control/gp/actions/controlGpAction'
import * as Actions from '../../../modules/account/login/actions/authAction';
import { objectUnClickAction } from '../../../modules/control/map/actions/controlMapActions';
@ -26,10 +27,12 @@ const ControlMain = () => {
const dispatch = useDispatch();
const { isClickObject } = useSelector(state => state.controlMapReducer);
const { controlGpList } = useSelector(state => state.controlGpState);
const { controlGpList, controlGroupAuthInfo } = useSelector(state => state.controlGpState);
const { controlDetail, controlWheather } = useSelector(
state => state.controlGpDtlState
);
const [alarm, setAlarm] = useState(false);
const { user } = useSelector(state => state.authState);
const [oepnReportList, setOpenReportList] = useState(false);
// const [openReportDetail, setOpenReportDetail] = useState(false);
// const [openWeatherList, setOpenWeatherList] = useState(false);
@ -92,7 +95,27 @@ const ControlMain = () => {
setOpenReportList(true);
dispatch(objectUnClickAction());
};
//날씨 API
const rq = {
nx: 37.4562557,
ny: 126.7052062
}
useEffect(() => {
dispatch(controlweatherAction.request(rq));
}, [])
function weathericon() {
if (controlWheather) {
let wheatherDetail = controlWheather.items.item;
let skyDetail = wheatherDetail[6].fcstValue;
if (skyDetail == 1 || skyDetail == 2 || skyDetail == 4) {
return <CloudRain size={20} />;
} else if (skyDetail == 4) {
return <CloudSnow size={20} />;
} else if (skyDetail == 0 || wheatherDetail[5].fcstValue == 1) {
return <Sun size={20} />;
} else return <Cloud size={20} />;
}
}
return (
<>
<ControlAlarmNotice />
@ -140,7 +163,49 @@ const ControlMain = () => {
{/* socket_off = 클래스명 변경시 빨간색! 접속이 원할하지않을때 */}
</ul>
</div>
<div className={(!oepnReportList && !openAlarmList && !isClickObject) ? "main-data" : "main-data main-data-test"}>
<div className='main-data-box wather-data'>
<Card>
<div className='data-box-header'>
<span className='box-ti'>{!isClickObject ? "인천광역시" : controlDetail?.stAreaNm}</span>
<span className=''>{weathericon()}</span>
</div>
<div className='data-list-box'>
<div className='data-list'>
<span>기온</span>
<span>{!isClickObject ? controlWheather?.items.item[12].fcstValue : controlDetail?.items.item[12].fcstValue}</span>
</div>
<div className='data-list'>
<span>풍향</span>
<span><Navigation2 className="navigation-icon" style={{
transform: !isClickObject ? `rotate(${controlWheather?.items.item[3].fcstValue}deg)` : `rotate(${controlDetail?.items.item[3].fcstValue}deg)`
}} /></span>
</div>
<div className='data-list'>
<span>풍속</span>
<span>{!isClickObject ? controlWheather?.items.item[4].fcstValue : controlDetail?.items.item[4].fcstValue} m/s</span>
</div>
</div>
</Card>
</div>
<div className='main-data-box flight-data'>
<Card>
<div className='data-box-header'>
<span className='box-ti'>비행중인 기체</span>
</div>
<div className='data-list-box'>
<div className='data-list'>
<span>드론</span>
<span>{controlGpList ? controlGpList.length : 0}</span>
</div>
<div className='data-list'>
<span>항공기</span>
<span>2147</span>
</div>
</div>
</Card>
</div>
</div>
{oepnReportList ? (
<ControlReportList
// openReportDetailParam={openReportDetailParam}

Loading…
Cancel
Save