(async () => {
const { EventManager, pageHelper } = ShopbySkin;
const $couponCount = $('coupon-count'); // 쿠폰 개수
const $couponTypeTabs = $('coupon-type-tabs'); // 쿠폰 탭
const $couponListItem = $('coupon-list-item'); // 쿠폰 리스트
const myCouponListHelper = pageHelper.myCouponListHelper();
const searchParams = new URLSearchParams(location.search);
const params = Object.fromEntries(searchParams.entries());
myCouponListHelper.initialize({
...params,
});
let shopbyCommonData = {};
EventManager.on('PAGE_LOAD_COMPLETED', (commonData) => {
shopbyCommonData = commonData;
});
const couponParams = {
queryString: {
pageNumber: 1,
pageSize: 100,
usable: true
},
accessTokenType: 'member',
};
// [Aaron] 상품, 주문 쿠폰 개수 추출 후 렌더
const { result: couponData } = await callShopApi(
'/coupons?',
'GET',
couponParams,
);
console.log(couponData);
// 상품 쿠폰
const productCoupon = couponData.items.filter(
(coupon) => coupon.couponType === 'PRODUCT',
);
// 주문 쿠폰
const cartCoupon = couponData.items.filter(
(coupon) => coupon.couponType === 'CART',
);
const couponCountData = {
productCouponCnt: productCoupon.length,
cartCouponCnt: cartCoupon.length,
};
const couponCountHtml = renderHtml($couponCount, couponCountData);
$couponCount.append(couponCountHtml);
// END
// [Aaron] 쿠폰 탭 렌더
const couponTypeTabsHtml = renderHtml($couponTypeTabs, couponCountData);
$couponTypeTabs.append(couponTypeTabsHtml);
// [Aaron] 쿠폰 리스트 렌더
const couponListItem = renderHtml($couponListItem, productCoupon);
$couponListItem.append(couponListItem);
const MODULE_ACTION_HANDLER = {
REGISTER: () => {
EventManager.fire('OPEN_LAYER_MODAL', {
name: 'coupon-register-form',
title: '쿠폰 번호 입력',
modalAddClass: 'coupon-registration-modal',
isFull: false,
onClose: ({ reason }) => {
if (reason === 'DID_SUBMIT') {
EventManager.fire('MODAL_ALERT_OPEN', {
noticeType: 'SUCCESS',
message: '쿠폰 등록이 완료되었습니다.',
onClose: () => {
location.reload();
},
});
}
},
});
},
COUPON_TYPE: ({ target }) => {
const couponType = target.getAttribute('coupon-type');
const couponTypeTabsEl = document.querySelector('coupon-type-tabs');
$(target).parent().children().removeClass('is-active');
target.classList.add('is-active');
let couponData;
if (couponType === 'product') couponData = productCoupon;
if (couponType === 'cart') couponData = cartCoupon;
// [Aaron] 쿠폰 리스트 렌더
$('.coupon-list').remove();
const couponListItem = renderHtml($couponListItem, couponData);
$couponListItem.append(couponListItem);
},
SEARCH_ACCUMULATION: () => {
const params = new URLSearchParams(location.search);
location.href = `${location.origin}${location.pathname}?${params.toString()}`;
},
USE_COUPON: async (target) => {
const couponListModule = document.querySelector('coupon-list');
const couponIssueNo = target.getAttribute('shopby-coupon-issue-no');
let noticeType, message;
try {
await couponListModule.useGiftCoupon(couponIssueNo);
noticeType = 'SUCCESS';
message = '혜택 지급이 완료되었습니다.';
} catch (error) {
noticeType = 'CAUTION';
message = `${error.error.serverError.message}`;
}
EventManager.fire('MODAL_ALERT_OPEN', {
noticeType,
message,
onClose: () => {
location.reload();
},
});
},
GRADE_BENEFIT: () => {
EventManager.fire('OPEN_LAYER_MODAL', {
name: 'grade-benefit-guide',
title: '등급혜택 안내',
isFull: false,
data: {
commonData: shopbyCommonData,
},
});
},
};
document
.querySelector('coupon-total-count')
?.addEventListener('click', ({ target }) => {
const action = target.getAttribute('shopby-action');
MODULE_ACTION_HANDLER[action]?.();
});
document
.querySelector('coupon-type-tabs')
?.addEventListener('click', ({ target }) => {
const actionTarget = target.getAttribute('shopby-action');
if (!actionTarget) {
return;
}
MODULE_ACTION_HANDLER[actionTarget]({ target });
});
document
.querySelector('profile-summary')
?.addEventListener('click', ({ target }) => {
const actionTarget = target.getAttribute('shopby-action');
if (!actionTarget) {
return;
}
MODULE_ACTION_HANDLER[actionTarget]({ target });
});
})();