diff --git a/src/_redux/features/dashboard/dashboardSlice.ts b/src/_redux/features/dashboard/dashboardSlice.ts new file mode 100644 index 00000000..56c9c57c --- /dev/null +++ b/src/_redux/features/dashboard/dashboardSlice.ts @@ -0,0 +1,41 @@ +import { createSlice } from '@reduxjs/toolkit'; +import { initMainDash } from './dashboardState'; +import { + getStcsAreaList, + getStcsDayList, + getAllDashboardData, + getDronOperationList +} from './dashboardThunk'; +import { + IStcsDayListRs, + IStcsAreaListRs, + IDashBoardDataRs, + IDronOperationListRs +} from './dashboardState'; + +const dashboardSlice = createSlice({ + name: 'dashboardSlice', + initialState: initMainDash, + reducers: {}, + extraReducers: builder => { + builder + .addCase(getStcsDayList.fulfilled, (state, action) => { + const data = action.payload as IStcsDayListRs[]; + state.stcsDayListRs = data; + }) + .addCase(getStcsAreaList.fulfilled, (state, action) => { + const data = action.payload as IStcsAreaListRs[]; + state.stcsAreaListRs = data; + }) + .addCase(getAllDashboardData.fulfilled, (state, action) => { + const data = action.payload as IDashBoardDataRs; + state.dashboardDataRs = { ...data }; + }) + .addCase(getDronOperationList.fulfilled, (state, action) => { + const data = action.payload as IDronOperationListRs[]; + state.dronOperationListRs = data; + }); + } +}); + +export const dashboardReducer = dashboardSlice.reducer; diff --git a/src/_redux/features/dashboard/dashboardState.ts b/src/_redux/features/dashboard/dashboardState.ts new file mode 100644 index 00000000..ce8012c7 --- /dev/null +++ b/src/_redux/features/dashboard/dashboardState.ts @@ -0,0 +1,100 @@ +export const initMainDash: MainDashState = { + stcsDayListRs: [], + stcsAreaListRs: [], + dashboardDataRs: { + dailyFlightWarn: [], + dailyFlightCount: [], + dailyFlightPlan: [], + dronSituation: [] + }, + dronOperationListRs: [] +}; + +export enum EDateType { + yesterday = '전일', + today = '금일', + tomorrow = '명일' +} + +export enum EDronStatus { + inFlight = '비행 중', + flightComplete = '비행 완료', + flightWaiting = '비행 대기 중 ' +} + +export interface MainDashState { + stcsDayListRs: IStcsDayListRs[]; + stcsAreaListRs: IStcsAreaListRs[]; + dashboardDataRs: IDashBoardDataRs; + dronOperationListRs: IDronOperationListRs[]; +} + +export interface IDronOperationListRs { + groupNm: string; + memberName: string; + idntfNum: string; + cntrlStDt: string; + cntrlEndDt: string; + totalFlightTime: string; + status: string; +} + +export interface IDronSituationRs { + typeCd: string; + count: number; +} + +export interface IDailyFlightPlanRs { + dateType: string; + plan: number; + aprvn: number; + count: number; + note: number; +} +export interface IDailyFlightWarnRs { + dateType: string; + plan: number; + altitude: number; + crash: number; + count: number; + note: number; +} + +export interface IDailyFlightCountRs { + dateType: string; + flightPlan: number; + completeFlight: number; + notFlight: number; + note: number; +} + +export interface IStcsDayListRs { + typeCd: string; + count: number; +} + +export interface IStcsAreaListRs { + typeCd: string; + count: number; +} + +export interface GroupListData { + groupNm: string; + groupId: string; + joinDt: Date; + createDt: Date; +} + +export interface DronListData { + arcrftModelNm: string; + prdctNum: string; + createDt: Date; + groupNm: string; +} + +export interface IDashBoardDataRs { + dailyFlightWarn: IDailyFlightWarnRs[]; + dailyFlightCount: IDailyFlightCountRs[]; + dailyFlightPlan: IDailyFlightPlanRs[]; + dronSituation: IDronSituationRs[]; +} diff --git a/src/_redux/features/dashboard/dashboardThunk.ts b/src/_redux/features/dashboard/dashboardThunk.ts new file mode 100644 index 00000000..b5daba7b --- /dev/null +++ b/src/_redux/features/dashboard/dashboardThunk.ts @@ -0,0 +1,162 @@ +import { createAsyncThunk } from '@reduxjs/toolkit'; +import qs from 'qs'; +import axios from '../../../modules/utils/customAxiosUtil'; +import { isError } from '../comn/message/messageSlice'; +import { ERROR_MESSAGE } from '@src/configs/constants'; +import { + EDronStatus, + IStcsDayListRs, + IStcsAreaListRs, + IDashBoardDataRs, + IDronSituationRs, + IDronOperationListRs +} from './dashboardState'; + +// 일 별 비행횟수 통계 날짜 리스트 +export const getStcsDayList = createAsyncThunk( + 'dashboard/getStcsDayList', + async (rq: string, thunkAPI) => { + try { + const queryString = qs.stringify(rq, { + addQueryPrefix: true, + arrayFormat: 'repeat' + }); + + const { data, errorCode }: { data: IStcsDayListRs[]; errorCode: string } = + await axios.get(`api/main/dash/stcs/day${queryString}`); + + if (errorCode) { + throw new Error(errorCode); + } + + return data; + } catch (error) { + thunkAPI.dispatch( + isError({ + errorCode: ERROR_MESSAGE, + errorMessage: '처리중 오류가 발생하였습니다', + isHistoryBack: false, + isRefresh: false + }) + ); + } + } +); + +// top5 지역 별 비행횟수 통계 리스트 +export const getStcsAreaList = createAsyncThunk( + 'dashboard/getStcsAreaList', + async (rq: string, thunkAPI) => { + try { + const queryString = qs.stringify(rq, { + addQueryPrefix: true, + arrayFormat: 'repeat' + }); + + const { + data, + errorCode + }: { data: IStcsAreaListRs[]; errorCode: string } = await axios.get( + `api/main/dash/stcs/area${queryString}` + ); + + if (errorCode) { + throw new Error(errorCode); + } + + return data; + } catch (error) { + thunkAPI.dispatch( + isError({ + errorCode: ERROR_MESSAGE, + errorMessage: '처리중 오류가 발생하였습니다', + isHistoryBack: false, + isRefresh: false + }) + ); + } + } +); + +// 일일 비행계획 현황, 일일 비행건수 현황, 일일 비정상상황 현황 Promise.all 처리 +export const getAllDashboardData = createAsyncThunk( + 'dashboard/getAllDashboardData', + async (_, thunkAPI) => { + try { + const allDashboardApi = [ + 'api/main/dash/current/flight-warn', + 'api/main/dash/current/flight-plan', + 'api/main/dash/stcs/dailyflight', + 'api/main/dash/stcs/dron-flight' + ]; + + const promise = allDashboardApi.map(api => axios.get(api)); + + const res = await Promise.all(promise); + + let errorCode = res.filter(i => i.hasOwnProperty('errorCode')); + if (errorCode.length > 0) { + throw new Error(); + } + + let dronSituationArr: IDronSituationRs[] = []; + + if (res[3].data) { + Object.keys(res[3].data).forEach(i => { + dronSituationArr.push({ + typeCd: EDronStatus[`${i}`], + count: Number(res[3].data[i]) + }); + }); + } + + const data: IDashBoardDataRs = { + dailyFlightWarn: res[0].data.slice(0, res[0].data.length - 1), + dailyFlightPlan: res[1].data, + dailyFlightCount: res[2].data, + dronSituation: dronSituationArr + }; + + return data; + } catch (error) { + thunkAPI.dispatch( + isError({ + errorCode: ERROR_MESSAGE, + errorMessage: '처리중 오류가 발생하였습니다', + isHistoryBack: false, + isRefresh: false + }) + ); + } + } +); + +// 드론 별 비행운항 목록 리스트 +export const getDronOperationList = createAsyncThunk( + 'dashboard/getDronOperationList', + async (rq: string, thunkAPI) => { + try { + const { + data, + errorCode + }: { data: IDronOperationListRs[]; errorCode: string } = await axios.get( + `api/main/dash/dron-flight/list?serviceType=${rq}` + ); + + if (errorCode) { + throw new Error(errorCode); + } + + return data; + } catch (error) { + thunkAPI.dispatch( + isError({ + errorCode: ERROR_MESSAGE, + errorMessage: '처리중 오류가 발생하였습니다', + isHistoryBack: false, + isRefresh: false + }) + ); + } + } +); diff --git a/src/_redux/rootReducer.ts b/src/_redux/rootReducer.ts index c5914de0..d76a2250 100644 --- a/src/_redux/rootReducer.ts +++ b/src/_redux/rootReducer.ts @@ -1,10 +1,14 @@ import { combineReducers } from '@reduxjs/toolkit'; +import { layoutReducer } from './features/layout/layoutSlice'; +import { dashboardReducer } from './features/dashboard/dashboardSlice'; import { droneReducer } from './features/basis/drone/droneSlice'; import { laancReducer } from './features/laanc/laancSlice'; import { messageReducer2 } from './features/comn/message/messageSlice'; const rootReducer = (state: any, action: any) => { const combineReducer = combineReducers({ + layout: layoutReducer, + dashboard: dashboardReducer, drone: droneReducer, laanc: laancReducer, message: messageReducer2 diff --git a/src/components/dashboard/DroneFlightSchedule.js b/src/components/dashboard/DroneFlightSchedule.js index 2bac2f37..e9f76456 100644 --- a/src/components/dashboard/DroneFlightSchedule.js +++ b/src/components/dashboard/DroneFlightSchedule.js @@ -1,4 +1,4 @@ -import { useSelector } from 'react-redux'; +import { useSelector } from '@store/storeConfig/store'; import { Plus } from 'react-feather'; import { Card, @@ -117,7 +117,9 @@ export default function DroneFlightSchedule({ handlerDronOperationChange, user }) { - const { dronOperationList } = useSelector(state => state.mainDashState); + const { dronOperationListRs: dronOperationList } = useSelector( + state => state.dashboardState + ); return (
diff --git a/src/containers/main/dash/MainDashContainer.js b/src/containers/main/dash/MainDashContainer.js index 3ff485eb..a5370519 100644 --- a/src/containers/main/dash/MainDashContainer.js +++ b/src/containers/main/dash/MainDashContainer.js @@ -1,5 +1,5 @@ import { useEffect, useState } from 'react'; -import { shallowEqual, useDispatch, useSelector } from 'react-redux'; +import { useDispatch, useSelector } from '@store/storeConfig/store'; import { useHistory } from 'react-router-dom'; import dayjs from 'dayjs'; import { Col, Row } from '@component/ui'; @@ -7,7 +7,7 @@ import DroneFlightSchedule from '../../../components/dashboard/DroneFlightSchedu import { DashboardGroupList } from '../../../components/dashboard/DashboardGroupList'; import { DashboardStcsArea } from '../../../components/dashboard/DashboardStcsArea'; import { DashboardStcsDay } from '../../../components/dashboard/DashboardStcsDay'; -import * as DashActions from '../../../modules/main/dash/actions/mainDashAction'; +import * as Actions from '../../../_redux/features/dashboard/dashboardThunk'; import { MessageErrorModal } from '../../../components/message/MessageErrorModal'; export const MainDashContainer = () => { @@ -17,12 +17,11 @@ export const MainDashContainer = () => { stcsAreaList: TOP 5 지역 별 비행횟수 */ - const [dashboardData] = useSelector( - state => [state.mainDashState.dashboardData], - shallowEqual - ); + const [dashboardData] = useSelector(state => [ + state.dashboardState.dashboardDataRs + ]); const { stcsDayList, stcsAreaList } = useSelector( - state => state.mainDashState + state => state.dashboardState ); const { user } = useSelector(state => state.authState); @@ -32,38 +31,34 @@ export const MainDashContainer = () => { useEffect(() => { // 일일 비행계획 현황, 일일 비행건수 현황, 일일 비정상상황 현황 Promise.all 처리 - dispatch(DashActions.DASHBOARD_DATA.request()); + dispatch(Actions.getAllDashboardData()); handlerStcsDaySearch(dayStartDate); handlerStcsAreaSearch(areaStartDate); }, []); useEffect(() => { - handlerDronOperationList( - user?.authId === 'SUPER' ? 'all' : user?.cptAuthCode - ); + if (user) { + handlerDronOperationList( + user?.authId === 'SUPER' ? 'all' : user?.cptAuthCode + ); + } }, [user]); // 일 별 비행횟수 통계 날짜 리스트 dispatch const handlerStcsDaySearch = date => { - dispatch( - DashActions.STCS_DAY.request({ - yyyymm: dayjs(date).format('YYYY-MM') - }) - ); + dispatch(Actions.getStcsDayList({ yyyymm: dayjs(date).format('YYYY-MM') })); }; // top5 지역 별 비행횟수 통계 리스트 dispatch const handlerStcsAreaSearch = date => { dispatch( - DashActions.STCS_AREA.request({ - yyyymm: dayjs(date).format('YYYY-MM') - }) + Actions.getStcsAreaList({ yyyymm: dayjs(date).format('YYYY-MM') }) ); }; // 드론 별 비행운항 목록 리스트 dispatch const handlerDronOperationList = data => { - dispatch(DashActions.DRON_OPERRATION_LIST.request(data)); + dispatch(Actions.getDronOperationList(data)); }; // 일 별 비행횟수 통계 날짜 변경 핸들러 diff --git a/src/redux/reducers/rootReducer.ts b/src/redux/reducers/rootReducer.ts index abba9ec0..11054579 100644 --- a/src/redux/reducers/rootReducer.ts +++ b/src/redux/reducers/rootReducer.ts @@ -34,16 +34,16 @@ import { controlMapReducer } from '../../modules/control/map'; import { faqSaga, faqReducer } from '../../modules/cstmrService/faq'; import { qnaSaga, qnaReducer } from '../../modules/cstmrService/inquiry'; // import { laancSaga, laancReducer } from '../../modules/laanc'; -import { mainDashSaga, mainDahReducer } from '../../modules/main/dash'; + import { menuReducer } from '../../modules/menu'; import { statisticsSaga, statisticsReducer } from '../../modules/statistics'; import { droneReducer } from '../../_redux/features/basis/drone/droneSlice'; import { laancReducer } from '../../_redux/features/laanc/laancSlice'; import { layoutReducer } from '../../_redux/features/layout/layoutSlice'; import { messageReducer2 } from '../../_redux/features/comn/message/messageSlice'; +import { dashboardReducer } from '../../_redux/features/dashboard/dashboardSlice'; export function* saga() { - yield all([fork(mainDashSaga)]); yield all([fork(controlGpSaga)]); yield all([fork(analysisHistorySaga)]); yield all([fork(accountSaga)]); @@ -60,7 +60,6 @@ export function* saga() { const rootReducer = combineReducers({ controlMapReducer, - mainDashState: mainDahReducer, messageState: messageReducer, groupState: groupReducer, // droneState: droneReducer, @@ -83,7 +82,7 @@ const rootReducer = combineReducers({ qnaState: qnaReducer, statisticsState: statisticsReducer, // ------------------------------------------------ - + dashboardState: dashboardReducer, droneState: droneReducer, layoutState: layoutReducer, messageState2: messageReducer2