junh_eee(이준희)
8 months ago
6 changed files with 125 additions and 0 deletions
@ -0,0 +1,51 @@
|
||||
import { createAsyncAction, ActionType, createAction } from 'typesafe-actions'; |
||||
|
||||
/** |
||||
* [Action 타입] |
||||
* 대문자와 _를 사용하여 상수 형태로 작성한다. |
||||
* 경로는 소문자로 작성한다. |
||||
* 주어를 앞에 명확하게 명시한다. |
||||
* 비동기 요청 액션이 아닐 땐 DISPATCH_ 로 시작한다. |
||||
* 목록 안에 상세 목록이 존재할 경우(ex. 비행이력) 상세 목록은 LOG로 작성한다. |
||||
* |
||||
* 기본 규칙 |
||||
* 목록 조회 - LIST |
||||
* 상세 조회(단일) - DETAIL |
||||
* 생성/추가 - CREATE |
||||
* 수정/변경 - UPDATE |
||||
* 삭제 - DELETE |
||||
* |
||||
* |
||||
* [Action 함수] |
||||
* 카멜케이스를 사용하여 작성한다. |
||||
* 작성한 Action 타입을 참고하여 작성한다. (ex. DRONE_LIST_REQUEST -> dronList) |
||||
* 비동기 요청 액션이 아닐 땐 createAction을 사용한다. |
||||
*/ |
||||
|
||||
// 드론 목록
|
||||
const DRONE_LIST_REQUEST = 'sample/DRONE_LIST_REQUEST'; |
||||
const DRONE_LIST_SUCCESS = 'sample/DRONE_LIST_SUCCESS'; |
||||
const DRONE_LIST_FAILURE = 'sample/DRONE_LIST_FAILURE'; |
||||
|
||||
// 지도 타입
|
||||
const DISPATHC_MAPTYPE = 'sample/DISPATCH_MAPTYPE'; |
||||
|
||||
// 비행 이력 목록
|
||||
const HISTORY_LIST_REQUEST = 'sample/HISTORY_LIST_REQUEST'; |
||||
|
||||
// 비행 이력 상세 목록
|
||||
const HISTORY_LOG_REQUEST = 'sample/HISTORY_LOG_REQUEST'; |
||||
|
||||
export const droneList = createAsyncAction( |
||||
DRONE_LIST_REQUEST, |
||||
DRONE_LIST_SUCCESS, |
||||
DRONE_LIST_FAILURE |
||||
)(); |
||||
|
||||
export const dispatchMapType = createAction(DISPATHC_MAPTYPE)(); |
||||
|
||||
const actions = { |
||||
droneList |
||||
}; |
||||
|
||||
export type SampleActions = ActionType<typeof actions>; |
@ -0,0 +1,14 @@
|
||||
import axios from '../../utils/customAxiosUtil'; |
||||
|
||||
/** |
||||
* 변수명은 주어 + API로 작성한다. |
||||
* api는 Action 함수명과 동일하게 작성한다. |
||||
* 특별한 경우가 아니면 return은 즉시 해준다. |
||||
*/ |
||||
|
||||
export const sampleAPI = { |
||||
// 드론 목록 조회
|
||||
droneList: async () => { |
||||
return await axios.get('api/bas/dron/list...'); |
||||
} |
||||
}; |
@ -0,0 +1,5 @@
|
||||
export * from './actions'; |
||||
export * from './apis'; |
||||
export * from './models'; |
||||
export * from './reducers'; |
||||
export * from './sagas'; |
@ -0,0 +1,24 @@
|
||||
/** |
||||
* interface는 파스칼케이스를 사용하여 작성하고 시작할 때 약자인 'I'를 붙여준다. |
||||
* 초기값의 경우 변수명을 initialState로 작성한다. |
||||
*/ |
||||
|
||||
export interface ISampleState { |
||||
droneList: IDroneDetail[] | undefined; |
||||
count: number | 0; |
||||
} |
||||
|
||||
export interface IDroneDetail { |
||||
groupId: string; |
||||
arcrftSno: number; |
||||
arcrftHght: number; |
||||
arcrftLngth: number; |
||||
arcrftModelNm: string; |
||||
arcrftTypeCd: string; |
||||
arcrftWdth: number; |
||||
} |
||||
|
||||
export const initialState: ISampleState = { |
||||
droneList: undefined, |
||||
count: 0 |
||||
}; |
@ -0,0 +1,15 @@
|
||||
import { createReducer } from 'typesafe-actions'; |
||||
import produce from 'immer'; |
||||
|
||||
import { ISampleState, initialState } from '../models'; |
||||
import * as Actions from '../actions'; |
||||
|
||||
/** |
||||
* Reducer 함수는 카멜케이스를 사용하여 작성한다. |
||||
*/ |
||||
|
||||
export const sampleReducer = createReducer<ISampleState, Actions.SampleActions>( |
||||
initialState |
||||
).handleAction(Actions.droneList.success, (state, action) => |
||||
produce(state, draft => {}) |
||||
); |
@ -0,0 +1,16 @@
|
||||
import { ActionType } from 'typesafe-actions'; |
||||
import * as Actions from '../actions'; |
||||
import { takeEvery } from 'redux-saga/effects'; |
||||
|
||||
/** |
||||
* saga 함수는 카멜케이스를 사용하여 Action 함수 + Saga로 통일한다. |
||||
*/ |
||||
|
||||
function* dronListSaga(action: ActionType<typeof Actions.droneList.request>) { |
||||
try { |
||||
} catch (error: any) {} |
||||
} |
||||
|
||||
export function* sampleSaga() { |
||||
yield takeEvery(Actions.droneList.request, dronListSaga); |
||||
} |
Loading…
Reference in new issue