Schedule

Info

• 일정 데이터.
• class 형태로 구현.
• TIME/TASK 으로 type이 구분됨.
  • TIME: 년/월/일/시/분 단위로 일정을 관리
  • TASK: 년/월/일 단위로 일정을 관리

Schedule

• DB에서 관리되는 Schedule 데이터 자체.
• FE에서 다양한 형태로 사용하기 위해 최대한 기본 형태로 구현.
• 날짜 필드는 string 타입으로 "YYYY/MM/DD HH:mm:ss" 형태
  • 사용 시, dayjs를 사용 하여, 포멧 필요.

Structure

• Schedule 객체는 포괄적인 날짜 형태를 가지고 있기 때문에 각각의 날짜에 대한 일정이 필요한 경우에는 ScheduleOfDate 객체로 변환 필요.
• Schedule 내부의 getScheduleOfDateList() function을 통해 ScheduleOfDate로 변환 가능
• getScheduleOfDateList()는 일정이 길수록 성능에 영향을 받음. O(n)

Schedule.ts

import { ScheduleOfDate } from '@typings/ScheduleOfDate'  
import dateFormatUtil from '@utils/date/dateFormatUtil'  
import { scheduleType, ScheduleType } from '@typings/constants/ScheduleType'  
  
// if date format DateFormat.ts -> use DateFormat  
export class Schedule {  
  id: number  
  type: ScheduleType  
  startedAt: string  
  endedAt: string  
  title: string  
  contents: string  
  
  isImportant: boolean  
  
  createdAt: string  
  updatedAt: string  
  
  constructor(schedule: {  
    id: number | null  
    type?: ScheduleType  
    startedAt: string  
    endedAt: string  
    title: string  
    contents: string  
    isImportant?: boolean  
    createdAt: string  
    updatedAt: string  
  }) {  
    const { dateToString, getDate } = dateFormatUtil  
  
    const now = dateToString(getDate())  
  
    const {  
      id,  
      type = scheduleType.TIME,  
      startedAt,  
      endedAt,  
      title,  
      contents,  
      isImportant = false,  
      createdAt = now,  
      updatedAt = now,  
    } = schedule  
  
    this.id = id  
    this.type = type  
    this.startedAt = startedAt  
    this.endedAt = endedAt  
    this.title = title  
    this.contents = contents  
    this.createdAt = createdAt  
    this.updatedAt = updatedAt  
    this.isImportant = isImportant  
  }  
  
  getScheduleOfDateList(index: number) {  
    if (this._isOneDaySchedule()) {  
      const { stringToDate } = dateFormatUtil  
      const startedAt = stringToDate(this.startedAt)  
      const endedAt = stringToDate(this.endedAt)  
      return [  
        new ScheduleOfDate({  
          isMultiple: false,  
  
          id: this.id,  
          type: this.type,  
          year: startedAt.year(),  
          month: startedAt.month() + 1,  
          day: startedAt.date(),  
          startHour: startedAt.hour(),  
          startMinute: startedAt.minute(),  
          endHour: endedAt.hour(),  
          endMinute: endedAt.minute(),  
          title: this.title,  
          contents: this.contents,  
          createdAt: this.createdAt,  
          updatedAt: this.updatedAt,  
          startedAt: this.startedAt,  
          endedAt: this.endedAt,  
          isImportant: this.isImportant,  
        }),  
      ] as ScheduleOfDate[]  
    }  
    return this._calculateSchedule(index)  
  }  
  
  private _isOneDaySchedule: () => boolean = () => {  
    const { stringToDate } = dateFormatUtil  
    return stringToDate(this.startedAt).isSame(stringToDate(this.endedAt), 'date')  
  }  
  
  private _calculateSchedule: (index: number) => ScheduleOfDate[] = index => {  
    const scheduleOfDateList: ScheduleOfDate[] = []  
    const { stringToDate } = dateFormatUtil  
    const startedAt = stringToDate(this.startedAt)  
    const endedAt = stringToDate(this.endedAt)  
  
    let start = startedAt.clone()  
    const end = endedAt.clone().add(1, 'day')  
  
    while (!start.isSame(end, 'date')) {  
      let startHour: number  
      let startMinute: number  
      let endHour: number  
      let endMinute: number  
      if (start.isSame(endedAt, 'date')) {  
        startHour = 0  
        startMinute = 0  
        endHour = endedAt.hour()  
        endMinute = endedAt.minute()  
      } else if (start.isSame(startedAt, 'date')) {  
        startHour = startedAt.hour()  
        startMinute = startedAt.minute()  
        endHour = 23  
        endMinute = 59  
      } else {  
        startHour = 0  
        startMinute = 0  
        endHour = 23  
        endMinute = 59  
      }  
  
      scheduleOfDateList.push(  
        new ScheduleOfDate({  
          isMultiple: true,  
  
          id: this.id,  
          type: this.type,  
          year: start.year(),  
          month: start.month() + 1,  
          day: start.date(),  
          startHour: startHour,  
          startMinute: startMinute,  
          endHour: endHour,  
          endMinute: endMinute,  
          title: this.title,  
          contents: this.contents,  
          createdAt: this.createdAt,  
          updatedAt: this.updatedAt,  
          startedAt: this.startedAt,  
          endedAt: this.endedAt,  
          isImportant: this.isImportant,  
          order: index,  
        }),  
      )  
  
      start = start.add(1, 'day')  
    }  
  
    if (scheduleOfDateList.length) {  
      scheduleOfDateList[0].isStart = true  
      scheduleOfDateList[scheduleOfDateList.length - 1].isEnd = true  
    }  
    return scheduleOfDateList  
  }  
}
 

ScheduleOfDate

• 각각의 날짜에 해당하는 Schedule 데이터.
• 조회 목적으로만 사용됨. (조회 이외의 목적에는 Schedule 자체를 변경해야함.)

Structure

• 시작 또는 종료 년/월/일/시/분 각각의 데이터를 분리하여 필드로 관리.
• Schedule 데이터를 각각의 날짜에 따라 분리하였으며, 날짜는 여러 ScheduleOfDate를 가질 수 있음. (중복 X)
• Schedule 기본 데이터와 관계없이 사용되는 내용들을 get()을 통해 따로 분리하여 사용.

ScheduleOfDate.ts

import { ScheduleType } from '@typings/constants/ScheduleType'  
  
export class ScheduleOfDate {  
  id: number  
  type: ScheduleType  
  year: number  
  month: number  
  day: number  
  
  startHour: number  
  startMinute: number  
  
  endHour: number  
  endMinute: number  
  
  title: string  
  contents: string  
  
  order: number = 0  
  isMultiple: boolean  
  
  isStart: boolean = false  
  isEnd: boolean = false  
  
  isImportant: boolean = false  
  
  startedAt: string  
  endedAt: string  
  
  createdAt: string  
  updatedAt: string  
  
  constructor(schedule: {  
    id: number  
    type: ScheduleType  
    year: number  
    month: number  
    day: number  
    startHour: number  
    startMinute: number  
    endHour: number  
    endMinute: number  
    title: string  
    contents: string  
    isMultiple: boolean  
    createdAt: string  
    updatedAt: string  
    startedAt: string  
    endedAt: string  
    order?: number  
    isStart?: boolean  
    isEnd?: boolean  
    isImportant?: boolean  
  }) {  
    this.id = schedule.id  
    this.type = schedule.type  
    this.year = schedule.year  
    this.month = schedule.month  
    this.day = schedule.day  
    this.startHour = schedule.startHour  
    this.startMinute = schedule.startMinute  
    this.endHour = schedule.endHour  
    this.endMinute = schedule.endMinute  
    this.title = schedule.title  
    this.contents = schedule.contents  
    this.isMultiple = schedule.isMultiple  
    this.createdAt = schedule.createdAt  
    this.updatedAt = schedule.updatedAt  
    this.startedAt = schedule.startedAt  
    this.endedAt = schedule.endedAt  
    if (schedule.order) this.order = schedule.order  
    if (schedule.isStart) this.isStart = schedule.isStart  
    if (schedule.isEnd) this.isEnd = schedule.isEnd  
    if (schedule.isImportant) this.isImportant = schedule.isImportant  
  }  
  
  get startPercentage() {  
    return ((this.startHour * 60 + this.startMinute) / 1440) * 100  
  }  
  
  get endPercentage() {  
    return ((this.endHour * 60 + this.endMinute) / 1440) * 100  
  }  
  
  get isAllDay() {  
    return (  
      this.startHour == 0 && this.startMinute == 0 && this.endHour == 23 && this.endMinute == 59  
    )  
  }  
}

Repository

• BE API를 통해 DB의 값을 제공 받음.
• 기본적인 CRUD 기능.

ScheduleRepository.ts

import { ApiResponse } from '@utils/api/models/ApiResponse'  
import { Schedule } from '@typings/Schedule'  
import api from '@utils/api/api'  
import ApiError from '@utils/error/ApiError'  
  
type ScheduleRepository = {  
  findAll: () => Promise<Schedule[]>  
  findById: (id: number) => Promise<Schedule>  
  findByDate: (date: { year: number; month?: number; day?: number }) => Promise<Schedule[]>  
  add: (schedule: Schedule) => Promise<null | number>  
  delete: (id: number) => Promise<void>  
  modify: (id: number, schedule: Schedule) => Promise<void>  
}  
  
const scheduleRepository: ScheduleRepository = {  
  findAll: async () => {  
    const response = await api().get('schedule')  
  
    const body = response.data.body.map(schedule => new Schedule(schedule))  
    const apiResponse = new ApiResponse<Schedule[]>().parseClass(response, body)  
  
    if (apiResponse.isFailure) throw new ApiError(apiResponse.code)  
  
    return apiResponse.body  
  },  
  findById: async (id: number) => {  
    const response = await api().get(`schedule/${id}`)  
    const apiResponse = new ApiResponse<Schedule>().parseData(response)  
  
    if (apiResponse.isFailure) throw new ApiError(apiResponse.code)  
  
    return apiResponse.body  
  },  
  findByDate: async (date: { year: number; month?: number; day?: number }) => {  
    const response = await api().get('schedule', { params: date })  
    const body = response.data.body.map(schedule => new Schedule(schedule))  
    const apiResponse = new ApiResponse<Schedule[]>().parseClass(response, body)  
  
    if (apiResponse.isFailure) throw new ApiError(apiResponse.code)  
    return apiResponse.body  
  },  
  add: async (schedule: Schedule) => {  
    const apiResponse: ApiResponse<number | null> = new ApiResponse<number | null>().parseData(  
      await api().post('schedule', schedule),  
    )  
    if (apiResponse.isFailure) return null  
    return apiResponse.body  
  },  
  delete: async id => {  
    const apiResponse: ApiResponse<null> = new ApiResponse<null>().parseData(  
      await api().delete(`schedule/${id}`),  
    )  
    if (apiResponse.isFailure) throw new ApiError(apiResponse.code)  
  },  
  modify: async (id, schedule) => {  
    const apiResponse: ApiResponse<null> = new ApiResponse<null>().parseData(  
      await api().put(`schedule/${id}`, schedule),  
    )  
    if (apiResponse.isFailure) throw new ApiError(apiResponse.code)  
  },  
}  
  
export default scheduleRepository