목적

총 세 가지의 매출 리포트에 대해 server driven UI를 적용해 화면 구성을 앱 업데이트 없이 진행할 수 있도록 하며, 리포트의 내용을 서버에서 컨트롤 가능하도록 한다.

ViewType: 3가지

1. CalendarViewType(제외)

• 사용 예시 | 일별 카드 매출을 날짜별로 알려주는 기능

  → 즉, 날짜별로 값을 보여주고자 할 때 사용

• 필요한 내용 |

  → 유저에게 보여주고자 하는 내역이 뭔데? (calendarTitle)

  → 보여주고 있는 내용은 몇 년도, 몇 월에 해당하는 데이터인가? (calendarDate)

  → 내역 리스트 (items) 각 항목이 가지고 있어야 하는 내용

  • (해당하는 일자, 내역 값)
  • = (contentDate, value)

  {
          "viewType" : "calendar",
          "content" : {
            "calendarTitle" : "카드 매출",
  					"calendarDate" : "2000년 09월 09일(Date로 보내줌)",
            "calendarItems" : [
              {
  							"contentDate" : "2000년 09월 09일(Date로 보내줌)",// 값에 대한 날짜
  							"value": "2323232"
  						},
              {
  							"contentDate" : "2000년 09월 09일(Date로 보내줌)",
  							"value": "2323232"
  						},
  						...
            ]
          }
  }
  

• 고려할 부분 |

  • 값이 0인 일자에 대해서는 어떻게 처리할까?
    • 해당하는 일자를 함께 보내주기 때문에 값이 없는 일자에 대해서는 서버에서 따로 뭘 보내주지 않아도 된다.

2. PieChartViewType

• 사용 예시 | 주어진 날짜 기간 안에서 카테고리별 주문 내역을 파이차트를 통해 보여준다.

  → 즉, 전체 건수 별 특정 건수의 비율을 확인할 수 있는 항목에 대해 사용

• 필요한 내용 |

  → 유저에게 보여주고자 하는 내역이 뭔데? (pieChartTitle)

  → 전체 건수 (totalCount)

  → items 항목마다 가지고 있어야 하는 내용

  • (piechar 컬러값, 주문건수, 항목 이름)
  • = (charColor, categoryCount, categoryName)

  {
          "viewType" : "PIECHART",
          "content" : {
            "pieChartTitle" : "카테고리별 주문 내역",
  					"totalCount" : 34344, // 차트 퍼센트를 계산하는 기준으로 사용
            "pieCharItems" : [
              {
  							"categoryName": "음료",
  							"charColor" : "#343434",
  							"categoryCount": 23434,
  						},
              {
  							"categoryName": "음료",
  							"charColor" : "#343434",
  							"categoryCount": 3434,
  						},
  						...
            ]
          }
  }
  

3. GraphViewType

• 사용 예시 | 일자별 / 시간별방문 고객 수

  → 즉, 시간/일자 등 특정 기준별로 값을 확인하고 싶을 때 사용

• 필요한 내용 |

  → 유저에게 보여주고자 하는 내역이 뭔데? (graphTitle)

  → 차트 컬러 색 ( graphColor)

  → → 내역 리스트 (items) 각 항목이 가지고 있어야 하는 내용

  • (key, 값)
  • = (graphKey, graphValue)

  {
          "viewType" : "graph",
          "content" : {
            "graphTitle" : "카테고리별 주문 내역",
  					"graphColor" : "#343434",
            "graphItems" : [
              {
  							"graphKey": 34234,
  							"graphValue": 2323,
  						},
              {
  							"graphKey": 234234,
  							"graphValue": 232323,
  						},
  						...
            ]
          }
  }
  

• 고려할 부분 |

  • 값이 0인 항목에 대해서는 어떻게 처리할까?
    • 그래프에 값 하나하나 찍는 식이기 때문에 0인 값도 포함해서 보내야 함.