(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 }); }); })();