(async () => {
  const { pageHelper, EventManager, utils, actions } = ShopbySkin;

  const $couponList = $('coupon-list-item'); // 쿠폰 리스트 컴포넌트

  let couponType = 'ALL'; // [Jay] 쿠폰 타입 전역변수
  let pageNumber = 1; // [Jay] 현재 페이지 전역 변수
  const pageSize = 20; // [Jay] 페이징 사이즈 전역 변수

  const redirectLoginPage = () => {
    const nextUrl = `${location.origin}/pages/sign-in/sign-in.html`;

    location.href = `${nextUrl}?from=${encodeURIComponent(location.href)}`;
  };

  // [Jay] 비회원인 경우 로그인 페이지로 이동
  if (!utils.isSignIn()) {
    EventManager.on('PAGE_LOAD_COMPLETED', () => {
      EventManager.fire('MODAL_ALERT_OPEN', {
        noticeType: 'CAUTION',
        message: '<em>로그인 후 이용할 수 있습니다.</em>',
        onClose: redirectLoginPage,
      });
    });
    return;
  }

  // [Jay] 발급가능한 쿠폰 데이터 조회
  const couponParams = {
    accessTokenType: 'member',
    data: {
      channelType: '다운로드',
    },
  };
  const couponListRes = await callShopApi(
    '/coupons/issuable',
    'GET',
    couponParams,
  );
  const coupons = couponListRes.result;

  // [Jay] 쿠폰 데이터 내림차순으로 재정렬(최신순)
  let couponListData = coupons.sort((a, b) => b.couponNo - a.couponNo);

  // [Jay] 다운로드 쿠폰 중에서 카드할인 쿠폰은 제외
  couponListData = couponListData.filter((coupon) => {
    const cardDiscountCoupon =
      coupon.useConstraint.limitPayTypes.includes('CREDIT_CARD');
    if (!cardDiscountCoupon) {
      return coupon;
    }
  });

  // [Jay] 쿠폰 리스트 렌더
  fnCouponListRender($couponList, couponListData);

  const ACTION_HANDLER_MAP = {
    COUPON_TYPE: async ({ event }) => {
      // [Jay] 상단탭 클릭시 pageNumber 1로 초기화
      pageNumber = 1;

      // [Jay] 상단탭 active 설정
      $('.btn-switch span').removeClass('active');
      $(event.target).addClass('active');

      // [Jay] 상단탭 클릭시 정렬탭 최신순 active
      $('.sort-item').removeClass('active');
      $('.sort-item').eq(0).addClass('active');

      // 쿠폰 타입
      couponType = $(event.target).data('coupon-type');

      // [Jay] 쿠폰 데이터 내림차순으로 재정렬(최신순)
      const couponList = coupons.sort((a, b) => b.couponNo - a.couponNo);

      let couponListData;

      if (couponType === 'ALL') {
        // 모든 쿠폰
        couponListData = couponList;
      } else if (couponType === 'PRODUCT') {
        // 상품 쿠폰
        couponListData = couponList.filter(
          (coupon) => coupon.couponType === 'PRODUCT',
        );
      } else if (couponType === 'CART') {
        // 장바구니 쿠폰
        couponListData = couponList.filter(
          (coupon) => coupon.couponType === 'CART',
        );
      }

      // [Jay] 다운로드 쿠폰 중에서 카드할인 쿠폰은 제외
      couponListData = couponListData.filter((coupon) => {
        const cardDiscountCoupon =
          coupon.useConstraint.limitPayTypes.includes('CREDIT_CARD');
        if (!cardDiscountCoupon) {
          return coupon;
        }
      });

      // [Jay] 쿠폰 리스트 렌더
      fnCouponListRender($couponList, couponListData);
    },
    COUPON_DOWNLOAD: async ({ event }) => {
      const couponNo = $(event.target).data('coupon-no');

      const channelType = '다운로드';
      const couponDownParams = {
        data: JSON.stringify({ channelType: '다운로드' }),
        accessTokenType: 'member',
      };

      const couponDownloadRes = await callShopApi(
        `/coupons/${couponNo}/download`,
        'POST',
        couponDownParams,
      );

      if (couponDownloadRes.statusCode === 200) {
        $(event.target).text('발급완료');
        EventManager.fire('MODAL_ALERT_OPEN', {
          noticeType: 'SUCCESS',
          message: '쿠폰이 발급되었습니다.',
          onClose: () => {
            location.reload();
          },
        });
      } else {
        EventManager.fire('MODAL_ALERT_OPEN', {
          noticeType: 'WARNING',
          message: `${couponDownloadRes.result.message}`,
          onClose: () => {
            location.reload();
          },
        });
      }
    },
    SORT_LATEST: ({ event }) => {
      // [Jay] 상단탭 클릭시 pageNumber 1로 초기화
      pageNumber = 1;

      // 정렬탭 active 설정
      $('.sort-item').removeClass('active');
      $(event.target).addClass('active');

      // [Jay] 쿠폰 데이터 내림차순으로 재정렬(최신순)
      const couponList = coupons.sort((a, b) => b.couponNo - a.couponNo);

      let couponListData;

      if (couponType === 'ALL') {
        // 모든 쿠폰
        couponListData = couponList;
      } else if (couponType === 'PRODUCT') {
        // 상품 쿠폰
        couponListData = couponList.filter(
          (coupon) => coupon.couponType === 'PRODUCT',
        );
      } else if (couponType === 'CART') {
        // 장바구니 쿠폰
        couponListData = couponList.filter(
          (coupon) => coupon.couponType === 'CART',
        );
      }

      // [Jay] 다운로드 쿠폰 중에서 카드할인 쿠폰은 제외
      couponListData = couponListData.filter((coupon) => {
        const cardDiscountCoupon =
          coupon.useConstraint.limitPayTypes.includes('CREDIT_CARD');
        if (!cardDiscountCoupon) {
          return coupon;
        }
      });

      // [Jay] 쿠폰 리스트 렌더
      fnCouponListRender($couponList, couponListData);
    },
    SORT_DEADLINE: ({ event }) => {
      // [Jay] 상단탭 클릭시 pageNumber 1로 초기화
      pageNumber = 1;

      // 정렬탭 active 설정
      $('.sort-item').removeClass('active');
      $(event.target).addClass('active');

      // [Jay] 쿠폰 데이터 오름차순으로 재정렬(마감순)
      const couponList = coupons.sort(
        (a, b) =>
          new Date(a.dateInfo.issueEndYmdt) - new Date(b.dateInfo.issueEndYmdt),
      );

      let couponListData;

      if (couponType === 'ALL') {
        // 모든 쿠폰
        couponListData = couponList;
      } else if (couponType === 'PRODUCT') {
        // 상품 쿠폰
        couponListData = couponList.filter(
          (coupon) => coupon.couponType === 'PRODUCT',
        );
      } else if (couponType === 'CART') {
        // 장바구니 쿠폰
        couponListData = couponList.filter(
          (coupon) => coupon.couponType === 'CART',
        );
      }

      // [Jay] 다운로드 쿠폰 중에서 카드할인 쿠폰은 제외
      couponListData = couponListData.filter((coupon) => {
        const cardDiscountCoupon =
          coupon.useConstraint.limitPayTypes.includes('CREDIT_CARD');
        if (!cardDiscountCoupon) {
          return coupon;
        }
      });

      // [Jay] 쿠폰 리스트 렌더
      fnCouponListRender($couponList, couponListData);
    },
    MORE_COUPON: ({ event }) => {
      fnPagination();
    },
  };

  function fnCouponListRender(template, data) {
    // [Jay] 쿠폰 갯수 카운트 변경
    $('#total-count__data').text(data.length);

    // [Jay] 쿠폰 리스트 렌더
    $('.coupon-list').remove();
    $('#noData').remove();
    const couponListHtml = renderHtml(template, data);
    $couponList.append(couponListHtml);

    // [Jay] 더보기 페이징 (데이터 다 뿌리고 display none 으로 처리)
    $('.coupon').each((index, elem) => {
      if (pageSize <= index) {
        $(elem).css('display', 'none');
      } else {
        $(elem).css('opacity', '1');
      }
    });

    // velocity
    $couponList.css('opacity', '0');
    $couponList.velocity({ opacity: 1 }, { duration: 500 });

    // [Jay] 페이지에서 보여주는 값보다 totalCount가 작으면 더보기 숨김
    if (data.length <= pageNumber * pageSize) {
      $('.more-event').hide();
    } else {
      $('.more-event').show();
    }
  }

  function fnPagination() {
    // 이전 페이지 마지막 인덱스
    const prevPageIndex = pageNumber * pageSize - 1;
    // 다음 페이지 넘버
    let nextPageNumber = pageNumber + 1;
    // 더보기 클릭시 pageNumber + 1
    pageNumber = pageNumber + 1;
    // 다음 페이지 시작 인덱스
    const nextIndex = nextPageNumber * pageSize - 1;

    $('.coupon').each((index, elem) => {
      if (prevPageIndex <= index) {
        if (index <= nextIndex) {
          $(elem).css('display', 'block');
          $(elem).velocity({ opacity: 1 }, { duration: 500 });
        }
      }
    });

    // [Jay] 쿠폰 총 갯수
    const totalCount = $('#total-count__data').text();

    // [Jay] 페이지에서 보여주는 값보다 totalCount가 작으면 더보기 숨김
    if (totalCount <= pageNumber * pageSize) {
      $('.more-event').hide();
    } else {
      $('.more-event').show();
    }
  }

  const clickEventListener = (e) => {
    if (!e?.target) {
      return;
    }

    const btn =
      e?.target?.closest?.('[shopby-action]') ||
      e?.target?.parentElement?.closest?.('[shopby-action]');
    const action = btn?.getAttribute('shopby-action');

    if (!btn) {
      return;
    }

    ACTION_HANDLER_MAP[action]?.({
      event: e,
    });
  };

  document.addEventListener('click', clickEventListener);
})();