대시보드(드론 별 비행운항 목록) api 작업 및 error 처리

src/components/dashboard/DroneFlightSchedule.js

@@ -4,75 +4,63 @@ import { GridDatabase } from '../../components/crud/grid/GridDatatable';
 
 const columns = [
   {
-    id: 'a',
+    id: 'groupNm',
     name: '그룹 몇',
     minWidth: '50px',
     center: true,
-    cell: (row, i) => <div>{row.a}</div>
+    cell: (row, i) => <div>{row.groupNm}</div>
   },
   {
-    id: 'b',
+    id: 'memberName',
     name: '조종자',
     minWidth: '50px',
     center: true,
-    cell: (row, i) => <div>{row.b}</div>
+    cell: (row, i) => <div>{row.memberName}</div>
   },
   {
-    id: 'c',
+    id: 'idntfNum',
     name: '기체 신고 번호',
     minWidth: '50px',
     center: true,
     cell: row => {
-      return <div>{row.c}</div>;
+      return <div>{row.idntfNum}</div>;
     }
   },
   {
-    id: 'd',
+    id: 'cntrlStDt',
     name: '비행 시작 시간',
     minWidth: '50px',
     center: true,
     cell: row => {
-      return <div>{row.d}</div>;
+      return <div>{row.cntrlStDt}</div>;
     }
   },
   {
-    id: 'e',
+    id: 'cntrlEndDt',
     name: '비행 종료 시간',
     left: true,
     cell: row => {
-      return <div>{row.e}</div>;
+      return <div>{row.cntrlEndDt}</div>;
     }
   },
   {
-    id: 'e',
+    id: 'totalFlightTime',
     name: '총 예상 비행시간',
     left: true,
     cell: row => {
-      return <div>{row.f}</div>;
+      return <div>{row.totalFlightTime}</div>;
     }
   },
   {
-    id: 'e',
+    id: 'status',
     name: '상태',
     left: true,
     cell: row => {
-      return <div>{row.g}</div>;
+      return <div>{row.status}</div>;
     }
   }
 ];
 
-const dummyData = [
-  {
-    a: '공항공사',
-    b: '홍길동',
-    c: 'PA123456',
-    d: '2023-11-11 10:00',
-    e: '2023-11-11 11:00',
-    f: '01:00',
-    g: '비행완료'
-  }
-];
-
 export default function DroneFlightSchedule({ pageMove, data }) {
   return (
     <Card>
@@ -90,11 +78,7 @@ export default function DroneFlightSchedule({ pageMove, data }) {
         </div>
       </CardHeader>
       <CardBody>
-        <GridDatabase
-          data={dummyData}
-          count={dummyData.length}
-          columns={columns}
-        />
+        <GridDatabase data={data} count={data.length} columns={columns} />
       </CardBody>
     </Card>
   );

src/containers/main/dash/MainDashContainer.js

@@ -8,6 +8,7 @@ import { DashboardGroupList } from '../../../components/dashboard/DashboardGroup
 import { DashboardStcsArea } from '../../../components/dashboard/DashboardStcsArea';
 import { DashboardStcsDay } from '../../../components/dashboard/DashboardStcsDay';
 import * as Actions from '../../../modules/main/dash/actions/mainDashAction';
+import { MessageErrorModal } from '../../../components/message/MessageErrorModal';
 import '@styles/react/libs/flatpickr/flatpickr.scss';
 import '@styles/react/libs/tables/react-dataTable-component.scss';
 import '../../../assets/css/custom.css';
@@ -85,7 +86,11 @@ export const MainDashContainer = () => {
     history.push(url);
   };
   useEffect(() => {
-    dispatch(Actions.DASHBOARD_DATA.request());
+    dispatch(
+      Actions.DASHBOARD_DATA.request({
+        serviceType: 'all'
+      })
+    );
     handlerStcsDaySearch(dayStartDate);
     handlerStcsAreaSearch(areaStartDate);
     // handlerGroupSearch();
@@ -122,7 +127,10 @@ export const MainDashContainer = () => {
       <div className='dashboard-section'>
         <Row>
           <Col lg={8} md={12} className='dashboard-chart'>
-            <DroneFlightSchedule pageMove={handlerGroupDetail} data={[]} />
+            <DroneFlightSchedule
+              pageMove={handlerGroupDetail}
+              data={dashboardData?.dronOperationList || []}
+            />
           </Col>
 
           <Col lg={4} md={12} className='dashboard-chart'>
@@ -173,6 +181,7 @@ export const MainDashContainer = () => {
           </Col>
         </Row>
       </div> */}
+      <MessageErrorModal />
     </div>
   );
 };

src/modules/main/dash/apis/mainDashApi.ts

@@ -44,6 +44,11 @@ export const mainDashAPI = {
     return await axios.get('api/main/dash/stcs/dailyflight');
   },
   dronSituation: async () => {
-    return await axios.get('api/main/dash/stcs/dron-flight/');
+    return await axios.get('api/main/dash/stcs/dron-flight');
+  },
+  dronOperationList: async (serviceType: string) => {
+    return await axios.get(
+      `api/main/dash/dron-flight/list?serviceType=${serviceType}`
+    );
   }
 };

src/modules/main/dash/models/mainDashModel.ts

@@ -18,6 +18,16 @@ export enum EDronStatus {
   flightWaiting = '비행 대기 중 '
 }
 
+export interface IDronOperationList {
+  groupNm: string;
+  memberName: string;
+  idntfNum: string;
+  cntrlStDt: string;
+  cntrlEndDt: string;
+  totalFlightTime: string;
+  status: string;
+}
+
 export interface IDronSituation {
   typeCd: string;
   count: number;
@@ -76,10 +86,11 @@ export interface IDashBoardData {
   dailyFlightCount: IDailyFlightCount[];
   dailyFlightPlan: IDailyFlightPlan[];
   dronSituation: IDronSituation[];
+  dronOperationList: IDronOperationList[];
 }
 
 export interface IDashBoardRq {
-  stcsDay: string;
+  serviceType: string;
 }
 
 export const initMainDash = {

src/modules/main/dash/sagas/mainDashSaga.ts

@@ -122,50 +122,54 @@ function* dashboardData(
   action: ActionType<typeof Actions.DASHBOARD_DATA.request>
 ) {
   try {
+    const { serviceType } = action.payload;
+
     /*
+      dailyFlightWarn: 일일 비정상상황 현황 통계
       dailyFlightPlan: 일일 비행계획 현황 통계
       dailyFlightCount: 일일 비행건수 현황 통계
-      dailyFlighWarn: 일일 비정상상황 현황 통계
+      dronSituation: 드론 현황
+      dronOperationList: 드론 별 비행운항 목록
     */
-    const { dailyFlighWarn, dailyFlightPlan, dailyFlightCount, dronSituation } =
-      yield all({
-        dailyFlighWarn: call(Apis.mainDashAPI.dailyFlightWarn),
-        dailyFlightPlan: call(Apis.mainDashAPI.dailyFlightPlan),
-        dailyFlightCount: call(Apis.mainDashAPI.dailyFlightCount),
-        dronSituation: call(Apis.mainDashAPI.dronSituation)
-      });
+    const res = yield all([
+      call(Apis.mainDashAPI.dailyFlightWarn),
+      call(Apis.mainDashAPI.dailyFlightPlan),
+      call(Apis.mainDashAPI.dailyFlightCount),
+      call(Apis.mainDashAPI.dronSituation),
+      call(Apis.mainDashAPI.dronOperationList, serviceType)
+    ]);
 
-    // if (errorCode) {
-    //   // 오류메시지 호출
-    //   yield put(
-    //     MessageActions.IS_ERROR({
-    //       errorCode: errorCode,
-    //       errorMessage: '처리중 오류가 발생하였습니다',
-    //       isHistoryBack: false,
-    //       isRefresh: false
-    //     })
-    //   );
+    let errorCheck = res.filter(i => i.hasOwnProperty('errorCode'));
+    if (errorCheck.length > 0) {
+      // 오류메시지 호출
+      yield put(
+        MessageActions.IS_ERROR({
+          errorCode: errorCheck[0].errorCode,
+          errorMessage: '처리중 오류가 발생하였습니다',
+          isHistoryBack: false,
+          isRefresh: false
+        })
+      );
 
-    //   return;
-    // }
+      return;
+    }
     let dronSituationArr: { typeCd: string; count: number }[] = [];
-
-    Object.keys(dronSituation.data).forEach(i => {
-      dronSituationArr.push({
-        typeCd: EDronStatus[`${i}`],
-        count: Number(dronSituation.data[i])
+    if (res[3].data) {
+      Object.keys(res[3].data).forEach(i => {
+        dronSituationArr.push({
+          typeCd: EDronStatus[`${i}`],
+          count: Number(res[3].data[i])
+        });
       });
-    });
-
+    }
+    console.log(res);
     yield put(
       Actions.DASHBOARD_DATA.success({
-        dailyFlightWarn: dailyFlighWarn.data.slice(
-          0,
-          dailyFlightPlan.data.length - 1
-        ),
-        dailyFlightCount: dailyFlightCount.data,
-        dailyFlightPlan: dailyFlightPlan.data,
-        dronSituation: dronSituationArr
+        dailyFlightWarn: res[0].data.slice(0, res[0].data.length - 1),
+        dailyFlightPlan: res[1].data,
+        dailyFlightCount: res[2].data,
+        dronSituation: dronSituationArr,
+        dronOperationList: res[4].data
       })
     );
   } catch (error) {