StoreOwnerController 매핑 및 기능 구현

[Hyeonjeong-JANG]

🐯 머스태치는 마지막에 한 번에 볼 수 있게 되어있음

✔️ 주문 상태별 리스트 화면 랜더링

StoreService

• 스토어 아이디로 전체 오더 리스트를 가져와서
• for문을 돌려서 OrderStatus에 따라 다른 리스트에 담는다.

• 두 개의 리스트를 HashMap에 담아서 리턴한다.

  public HashMap<String, Object> getCurrentOrders(int storeId) {
  // 전체 오더 리스트
  List<Order> orderList = orderRepository.findOrdersByStoreId(storeId)
          .orElseThrow();
  
  List<StoreResponse.CurrentOrderDTO> currentOrderDTOList = new ArrayList<>();
  orderList.stream().map(order -> {
      return currentOrderDTOList.add(StoreResponse.CurrentOrderDTO.builder()
              .order(order)
              .menuList(order.getOrderMenus())
              .build());
  }).toList();
  
  // 주문 상태별 오더 리스트
  List<StoreResponse.CurrentOrderDTO> pendingOrderList = new ArrayList<>();
  List<StoreResponse.CurrentOrderDTO> cookingOrderList = new ArrayList<>();
  
  for (int i = 0; i < currentOrderDTOList.size(); i++) {
      if (currentOrderDTOList.get(i).getStatus() == OrderStatus.접수대기) {
          pendingOrderList.add(currentOrderDTOList.get(i));
      }
      if (currentOrderDTOList.get(i).getStatus() == OrderStatus.조리중) {
          cookingOrderList.add(currentOrderDTOList.get(i));
      }
  }
  
  HashMap<String, Object> orderFilteredByStatus = new HashMap<>();
  orderFilteredByStatus.put("pendingOrderList", pendingOrderList);
  orderFilteredByStatus.put("cookingOrderList", cookingOrderList);
  return orderFilteredByStatus;
  }

StoreOwnerController

@GetMapping("/stores/{storeId}/orders") // TODO: 매장 관리자 - 현재 접수된 주문
private String orders(@PathVariable int storeId, Model model) { // index
    /*
    // TODO: 권한 처리
    SessionStore sessionStore = (SessionStore) session.getAttribute("sessionStore");
    if (sessionStore != null) {
        return "orders";
    } else {
        return "login-form";
    }
    */

    HashMap<String, Object> currentOrderListDTO = storeService.getCurrentOrders(storeId);

    model.addAttribute("orderList", currentOrderListDTO);
    System.out.println(currentOrderListDTO);

    return "orders";
}

✔️ 주문 상태 변경

• 주문 접수하기, 조리 완료 버튼을 누르면 상태가 변경되고 화면에 반영됨

  ⚒️ 성재의 코드를 바탕으로 if문으로 분기처리 하는 것을 추가함

  @Transactional // TODO: 매장 관리자 - 주문 업데이트
  public StoreResponse.UpdateOrderDTO updateOrder(int orderId, StoreRequest.UpdateOrderDTO reqDTO) {
  Order order = orderRepository.findById(orderId)
          .orElseThrow(() -> new Exception404("주문이 없습니다."));
  
  if (reqDTO.getStatus().equals(OrderStatus.접수대기)) {
      order.setStatus(OrderStatus.조리중);
  }
  if (reqDTO.getStatus().equals(OrderStatus.조리중)) {
      order.setStatus(OrderStatus.조리완료);
  }
  if (reqDTO.getStatus().equals(OrderStatus.조리완료)) {
      order.setStatus(OrderStatus.수령완료);
  }
  
  StoreResponse.UpdateOrderDTO respDTO = new StoreResponse.UpdateOrderDTO(order);
  return respDTO;
  }

🐯 화면 랜더링

orders.mustache

• 주문 상태별 리스트 화면 랜더링: {{#orderList.pendingOrderList}} {{/orderList.pendingOrderList}}, {{#orderList.cookingOrderList}} {{/orderList.cookingOrderList}}에 각각 다른 디자인의 레이아웃을 담고 상태별 리스트를 랜더링한다.
• 주문 상태 변경: form 태그 안에 를 심어서 버튼을 누르면 그 상태를 post할 수 있게 한다.

  {{#orderList.pendingOrderList}}
  <div class="card mb-4" style="font-size: 12px;width: 240px; padding: 0;">
      <form action="/stores/1/orders/{{orderId}}/update" method="post">
          <input type="hidden" name="status" value="{{status}}">
          <div style="padding: 10px;">
              <div class="d-flex justify-content-start" style="margin-bottom: 10px;">
                  <button type="button" class="btn btn-warning"
                          style="font-size: 12px; color:white" disabled><b>{{status}}</b>
                      11: 23분
                      수령예정
                  </button>
              </div>
              <div class="d-flex align-items-center justify-content-between"
                   style="margin-bottom: 10px;">
                  <div style="font-size: 15px;">
                      <div><b>테이크아웃</b></div>
                      <div style="font-size: 12px;">{{customerNickname}}</div>
                  </div>
                  <div>
                      <button type="button" class="btn btn-outline-primary" style="font-size: 12px;"
                              data-bs-toggle="modal"
                              data-bs-target="#orderDetailModal"
                      >상세<br/>보기
                      </button>
                  </div>
              </div>
              <div style="
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
      ">
                  {{#menuList}}
                      <span>{{name}}({{qty}})</span>
                  {{/menuList}}
              </div>
              <div>{{createdAt}}</div>
          </div>
          <div>
              <button type="submit" class="btn btn-outline-warning"
                      style="width: 100%;font-size: 12px;padding: 10px 0; box-sizing: border-box;">
                  주문접수하기
              </button>
          </div>
      </form>
  </div>
  {{/orderList.pendingOrderList}}
  {{#orderList.cookingOrderList}}
  <div class="card mb-4" style="font-size: 12px;width: 240px; padding: 0;">
      <form action="/stores/1/orders/{{orderId}}/update" method="post">
          <input type="hidden" name="status" value="{{status}}">
          <div style="padding: 10px;">
              <div class="d-flex justify-content-start" style="margin-bottom: 10px;">
                  <button type="button" class="btn btn-success"
                          style="font-size: 12px; color:white" disabled><b>{{status}}</b>
                      11: 23분
                      수령예정
                  </button>
              </div>
              <div class="d-flex align-items-center justify-content-between"
                   style="margin-bottom: 10px;">
                  <div style="font-size: 15px;">
                      <div><b>테이크아웃</b></div>
                      <div style="font-size: 12px;">{{customerNickname}}</div>
                  </div>
                  <div>
                      <button type="button" class="btn btn-outline-primary" style="font-size: 12px;"
                              data-bs-toggle="modal"
                              data-bs-target="#orderDetailModal"
                      >상세<br/>보기
                      </button>
                  </div>
              </div>
              <div style="
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
      ">
                  {{#menuList}}
                      <span>{{name}}({{qty}})</span>
                  {{/menuList}}
              </div>
              <div>{{createdAt}}</div>
          </div>
          <div>
              <button type="submit" class="btn btn-outline-success"
                      style="width: 100%;font-size: 12px;padding: 10px 0; box-sizing: border-box;">
                  조리완료
              </button>
          </div>
      </form>
  </div>
  {{/orderList.cookingOrderList}}