[Log] IF-LGSP-LOG-111 / 카드, 주소 ADD/EDIT 이력, 반영

This commit is contained in:
younghoon100.park
2024-07-15 17:21:05 +09:00
parent bc10763f0e
commit 19493df17c
9 changed files with 178 additions and 101 deletions

View File

@@ -61,15 +61,15 @@ export const getUrlByLogTpNo = (logTpNo) => {
return URLS.LOG_PARTNERS;
// IF-LGSP-LOG-010 / Reminder - Alert On/Off
case LOG_TP_NO.MY_PAGE.ALERT_FLAG:
case LOG_TP_NO.MY_PAGE_ALERT_FLAG:
return URLS.LOG_MY_PAGE_ALERT_FLAG;
// IF-LGSP-LOG-011 / My Page Delete 버튼 클릭 이력
case LOG_TP_NO.MY_PAGE.MY_DELETE:
case LOG_TP_NO.MY_PAGE_MY_DELETE:
return URLS.LOG_MY_PAGE_MY_DELETE;
// IF-LGSP-LOG-012 / My Page Notice View
case LOG_TP_NO.MY_PAGE.NOTICE:
case LOG_TP_NO.MY_PAGE_NOTICE:
return URLS.LOG_MY_PAGE_NOTICE;
// IF-LGSP-LOG-013 / 검색 이력
@@ -98,7 +98,8 @@ export const getUrlByLogTpNo = (logTpNo) => {
return URLS.LOG_THEME_PRODUCT;
// IF-LGSP-LOG-100 / IF-LGSP-LOG-100 / TOP contents 노출 이력
case LOG_TP_NO.TOP_CONTENTS:
case LOG_TP_NO.TOP_CONTENTS.VIEW:
case LOG_TP_NO.TOP_CONTENTS.CLICK:
return URLS.LOG_TOP_CONTENTS;
// IF-LGSP-LOG-110 / Featured Brands View 이력
@@ -132,9 +133,14 @@ export const getUrlByLogTpNo = (logTpNo) => {
case LOG_TP_NO.PAYMENT_COMPLETE:
return URLS.LOG_PAYMENT_COMPLETE;
// IF-LGSP-LOG-111 / 카드, 주소 ADD/EDIT 이력
case LOG_TP_NO.MY_INFO_EDIT:
return URLS.LOG_MY_INFO_EDIT;
// IF-LGSP-LOG-112 / Check out 화면 버튼 클릭 이력
case LOG_TP_NO.CHECKOUT_BTN_CLICK:
return URLS.LOG_CHECKOUT_BTN_CLICK;
default:
return;
}

View File

@@ -225,7 +225,7 @@ export const URLS = {
LOG_BRANDS: "/lgsp/v1/log/brands.lge",
// IF-LGSP-LOG-111 log myinfo controller
LOG_MY_INFO: "/lgsp/v1/log/myinfo/edit.lge",
LOG_MY_INFO_EDIT: "/lgsp/v1/log/myinfo/edit.lge",
// IF-LGSP-LOG-112 log checkout btn click controller
LOG_CHECKOUT_BTN_CLICK: "/lgsp/v1/log/checkout/btnClick.lge",

View File

@@ -530,7 +530,7 @@ export default function useLogService() {
const newParams = {
alertFlag,
entryMenu: entryMenuRef.current,
logTpNo: LOG_TP_NO.MY_PAGE.ALERT_FLAG,
logTpNo: LOG_TP_NO.MY_PAGE_ALERT_FLAG,
nowMenu: nowMenuRef.current,
};
@@ -562,7 +562,7 @@ export default function useLogService() {
const newParams = {
...params,
entryMenu: entryMenuRef.current,
logTpNo: LOG_TP_NO.MY_PAGE.MY_DELETE,
logTpNo: LOG_TP_NO.MY_PAGE_MY_DELETE,
nowMenu: nowMenuRef.current,
};
@@ -596,7 +596,7 @@ export default function useLogService() {
const newParams = {
...params,
entryMenu: entryMenuRef.current,
logTpNo: LOG_TP_NO.MY_PAGE.NOTICE,
logTpNo: LOG_TP_NO.MY_PAGE_NOTICE,
nowMenu: nowMenuRef.current,
};
@@ -1371,6 +1371,38 @@ export default function useLogService() {
[dispatch, entryMenuRef, nowMenuRef]
);
/**
* IF-LGSP-LOG-111 / 카드, 주소 ADD/EDIT 이력
*
* (M) btnNm 버튼 이름
*
* (M) etnryMenu 진입 메뉴
*
* (M) logTpNo 로그 타입 넘버
*
* (M) nowMenu 현재 메뉴
*/
const sendLogMyInfoEdit = useCallback(
(params) => {
const { btnNm } = params;
if (!btnNm) {
console.error("sendLogMyInfoEdit invalid params", params);
return;
}
const newParams = {
...params,
entryMenu: entryMenuRef.current,
logTpNo: LOG_TP_NO.MY_INFO_EDIT,
nowMenu: nowMenuRef.current,
};
dispatch(postLog(newParams));
},
[dispatch, entryMenuRef, nowMenuRef]
);
/**
* IF-LGSP-LOG-112 / Check out 화면 버튼 클릭 이력
*
@@ -1430,6 +1462,7 @@ export default function useLogService() {
sendLogPaymentEntry,
sendLogPaymentComplete,
sendLogFeaturedBrands,
sendLogMyInfoEdit,
sendLogCheckOutBtnClick,
};
}

View File

@@ -110,6 +110,7 @@ export const MYINFO_TABS = {
};
export const LOG_TP_NO = {
// IF-LGSP-LOG-001 / Live 시청 이력
LIVE: {
HOME: "100",
FEATURED_BRANDS: "101",
@@ -117,35 +118,18 @@ export const LOG_TP_NO = {
ITEM_DETAIL: "103",
},
// TrendingNowPanel = VOD
// HomePanel = VOD, Live
// FeaturedBrandsPaenl = Live
// HotPicksPanel = Media
// DetailPanel = Media
// 150, 151, 153, 154, 155, 156
// IF-LGSP-LOG-002 / VOD 시청 이력
VOD: {
// Everywhere, Full, VOD
FULL_VOD: "150",
// TrendingNowPanel and HotPicksPanel, Modal
POPULAR_SHOWS_AND_HOT_PICKS: "151",
// * no cases *, FeaturedBrandsPanel(Recommended Shwos, Featured creators), Modal, VOD
FEATURED_BRANDS_VOD: "152",
// HomePanel(Top), Modal, VOD
HOME_VOD: "153",
ITEM_DETAIL_VOD: "154",
// Everywhere, Full, Media
FULL_MEDIA: "155",
// DetailPanel, Modal, Media
ITEM_DETAIL_MEDIA: "156",
},
// IF-LGSP-LOG-003 / Curation View 이력
CURATION: {
HOT_PICKS: "220",
SHOWROOM: "221",
@@ -154,29 +138,13 @@ export const LOG_TP_NO = {
CATEGORY: "280",
},
SEARCH: "261",
SEARCH_CLICK: "262",
UPCOMING_FLAG: "271",
// IF-LGSP-LOG-004 / 2ndLayer 이력
SECOND_LAYER: "210",
ALARM_POP: "281",
ALARM_CLICK: {
BROADCAST: "282",
KEYWORD: "283",
},
BRANDS: "290",
PARTNERS: "500",
// IF-LGSP-LOG-005 / GNB 클릭 이력
GNB: "300",
TOP_CONTENTS: "310",
// IF-LGSP-LOG-006 / Product Detail 이력
PRODUCT: {
PRODUCT_DETAIL: "400",
GROUP_DETAIL: "408",
@@ -184,20 +152,60 @@ export const LOG_TP_NO = {
PRODUCT_DETAIL_IMAGE: "410",
},
// IF-LGSP-LOG-007 / Detail 이력
DETAIL: {
THEME_DETAIL: "402",
TRAVEL_DETAIL: "406",
DETAIL_BUTTON_CLICK: "407",
},
THEME_PRODUCT: "411",
// IF-LGSP-LOG-008 / Shop By Mobile 이력
SHOP_BY_MOBILE: {
SHOP_BY_MOBILE: "450",
AGREE_AND_SEND: "452",
QR_CODE_REDIRECT_AND_CREATE_TRACKING_LOG: "453",
},
// IF-LGSP-LOG-009 / Patners 클릭 이력
PARTNERS: "500",
// IF-LGSP-LOG-010 / Reminders - Alert on / off
MY_PAGE_ALERT_FLAG: "250",
// IF-LGSP-LOG-011 / MyPage Delete 버튼 클릭 이력
MY_PAGE_MY_DELETE: "251",
// IF-LGSP-LOG-012 / MyPage Notice View
MY_PAGE_NOTICE: "252",
// IF-LGSP-LOG-013 / 검색 이력
SEARCH: "261",
// IF-LGSP-LOG-014 / 검색 결과 클릭 이력
SEARCH_CLICK: "262",
// IF-LGSP-LOG-015 / Upcoming - on / off
UPCOMING_FLAG: "271",
// IF-LGSP-LOG-017 / 알람 팝업
ALARM_POP: "281",
// IF-LGSP-LOG-018 / 알람 팝업 OK/NO 클릭
ALARM_CLICK: {
BROADCAST: "282",
KEYWORD: "283",
},
// IF-LGSP-LOG-020 / 테마 상품 상세 이력
THEME_PRODUCT: "411",
// IF-LGSP-LOG-100 / TOP contents 노출 이력
TOP_CONTENTS: {
VIEW: "310",
CLICK: "311",
},
// IF-LGSP-LOG-101 / 약관 동의/미동의 클릭 이력
TERMS: {
AGREE: "650",
DO_NOT_AGREE: "651",
@@ -205,30 +213,30 @@ export const LOG_TP_NO = {
PRIVACY_POLICY: "653",
},
MY_INFO: {},
MY_PAGE: {
ALERT_FLAG: "250",
MY_DELETE: "251",
NOTICE: "252",
},
COUPON: {},
CART: {},
CHECK_OUT: {},
// IF-LGSP-LOG-102 / LG Account 로그인 이력
LG_ACCOUNT_LOGIN: "700",
// IF-LGSP-LOG-103 / Order 화면 버튼 클릭 이력
ORDER_BTN_CLICK: "702",
// IF-LGSP-LOG-104 / Order 취소 / 반품 / 교환 이력 (반품, 교환 = 삭제)
ORDER_CHANGE: "703",
// IF-LGSP-LOG-105 / 쿠폰 사용 이력, Backend 미작업
// IF-LGSP-LOG-108 / 결제 페이지 진입 이력
PAYMENT_ENTRY: "900",
// IF-LGSP-LOG-109 / 결제 완료 이력
PAYMENT_COMPLETE: "901",
// IF-LGSP-LOG-110 / Featured Brands View 이력
BRANDS: "290",
// IF-LGSP-LOG-111 / 카드, 주소 ADD/EDIT 이력
MY_INFO_EDIT: "704",
// IF-LGSP-LOG-112 / Check out 화면 버튼 클릭 이력
CHECKOUT_BTN_CLICK: "902",
};

View File

@@ -39,8 +39,12 @@ import OrderItemsSideBar from "./container/OrderItemsSideBar";
import SummaryContainer from "./container/SummaryCotainer";
export default function CheckOutPanel({ panelInfo }) {
const { sendLogCheckOutBtnClick, sendLogGNB, sendLogPaymentEntry } =
useLogService();
const {
sendLogCheckOutBtnClick,
sendLogGNB,
sendLogPaymentEntry,
sendLogMyInfoEdit,
} = useLogService();
const dispatch = useDispatch();
const panels = useSelector((state) => state.panels.panels);
const { userNumber } = useSelector(
@@ -300,6 +304,13 @@ export default function CheckOutPanel({ panelInfo }) {
}
}, [panelInfo?.logInfo]);
const doSendLogMyInfoEdit = useCallback(
(btnNm) => {
sendLogMyInfoEdit({ btnNm });
},
[sendLogMyInfoEdit]
);
return (
<>
<TPanel
@@ -329,6 +340,7 @@ export default function CheckOutPanel({ panelInfo }) {
toggleOrderSideBar={toggleOrderSideBar}
toggleOfferSideBar={toggleOfferSideBar}
scrollTopBody={scrollTopBody}
doSendLogMyInfoEdit={doSendLogMyInfoEdit}
/>
</div>
</TBody>

View File

@@ -28,10 +28,24 @@ const Container = SpotlightContainerDecorator(
const BtnSpot = Spottable("p");
const getBtnNmByIndex = (index) => {
switch (index) {
case 0:
return "SHIPPING ADDRESS";
case 1:
return "BILLING ADDRESS";
case 2:
return "PATMENT METHOD";
default:
return "";
}
};
export default function InformationContainer({
toggleOfferSideBar,
toggleOrderSideBar,
scrollTopBody,
doSendLogMyInfoEdit,
}) {
const dispatch = useDispatch();
@@ -95,10 +109,16 @@ export default function InformationContainer({
const handleButtonClick = useCallback(
(index) => {
const btnNm = getBtnNmByIndex(index);
if (btnNm && doSendLogMyInfoEdit) {
doSendLogMyInfoEdit(btnNm);
}
setTab(index);
dispatch(setShowPopup(Config.ACTIVE_POPUP.qrPopup));
},
[dispatch]
[dispatch, doSendLogMyInfoEdit]
);
const handleCancel = useCallback(() => {

View File

@@ -304,7 +304,7 @@ export default function RandomUnit({
expsOrd: bannerDataRef.current?.banrLctnNo ?? "",
inDt: formatGMTString(new Date()),
linkTpCd: "",
logTpNo: LOG_TP_NO.TOP_CONTENTS,
logTpNo: LOG_TP_NO.TOP_CONTENTS.VIEW,
patncNm: randomDataRef.current?.patncNm ?? "",
patnrId: randomDataRef.current?.patnrId ?? "",
tmplCd: shptmTmplCd,

View File

@@ -4,41 +4,29 @@ import React, {
useMemo,
useRef,
useState,
} from 'react';
} from "react";
import classNames from 'classnames';
import {
useDispatch,
useSelector,
} from 'react-redux';
import classNames from "classnames";
import { useDispatch, useSelector } from "react-redux";
import SpotlightContainerDecorator
from '@enact/spotlight/SpotlightContainerDecorator';
import Spottable from '@enact/spotlight/Spottable';
import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator";
import Spottable from "@enact/spotlight/Spottable";
import btnPlay from '../../../../assets/images/btn/btn-play-thumb-nor.png';
import defaultLogoImg
from '../../../../assets/images/ic-tab-partners-default@3x.png';
import emptyHorImage
from '../../../../assets/images/img-home-banner-empty-hor.png';
import emptyVerImage
from '../../../../assets/images/img-home-banner-empty-ver.png';
import defaultImageItem
from '../../../../assets/images/img-thumb-empty-product@3x.png';
import liveShow from '../../../../assets/images/tag-liveshow.png';
import { pushPanel } from '../../../actions/panelActions';
import { startVideoPlayer } from '../../../actions/playActions';
import CustomImage from '../../../components/CustomImage/CustomImage';
import useLogService from '../../../hooks/useLogService';
import usePriceInfo from '../../../hooks/usePriceInfo';
import useScrollReset from '../../../hooks/useScrollReset';
import {
LOG_MENU,
LOG_TP_NO,
panel_names,
} from '../../../utils/Config';
import { formatGMTString } from '../../../utils/helperMethods';
import css from './RollingUnit.module.less';
import btnPlay from "../../../../assets/images/btn/btn-play-thumb-nor.png";
import defaultLogoImg from "../../../../assets/images/ic-tab-partners-default@3x.png";
import emptyHorImage from "../../../../assets/images/img-home-banner-empty-hor.png";
import emptyVerImage from "../../../../assets/images/img-home-banner-empty-ver.png";
import defaultImageItem from "../../../../assets/images/img-thumb-empty-product@3x.png";
import liveShow from "../../../../assets/images/tag-liveshow.png";
import { pushPanel } from "../../../actions/panelActions";
import { startVideoPlayer } from "../../../actions/playActions";
import CustomImage from "../../../components/CustomImage/CustomImage";
import useLogService from "../../../hooks/useLogService";
import usePriceInfo from "../../../hooks/usePriceInfo";
import useScrollReset from "../../../hooks/useScrollReset";
import { LOG_MENU, LOG_TP_NO, panel_names } from "../../../utils/Config";
import { formatGMTString } from "../../../utils/helperMethods";
import css from "./RollingUnit.module.less";
const SpottableComponent = Spottable("div");
@@ -382,7 +370,7 @@ export default function RollingUnit({
expsOrd: bannerDataRef.current?.banrLctnNo ?? "",
inDt: formatGMTString(new Date()),
linkTpCd: "",
logTpNo: LOG_TP_NO.TOP_CONTENTS,
logTpNo: LOG_TP_NO.TOP_CONTENTS.VIEW,
patncNm: currentRollingData?.patncNm ?? "",
patnrId: currentRollingData?.patnrId ?? "",
tmplCd: shptmTmplCd,

View File

@@ -76,7 +76,7 @@ export default function MyInfo({ title, cbScrollTo }) {
buttonTabList = getButtonTabList();
}
const { sendLogLgAccountLogin } = useLogService();
const { sendLogLgAccountLogin, sendLogMyInfoEdit } = useLogService();
const dispatch = useDispatch();
@@ -225,8 +225,18 @@ export default function MyInfo({ title, cbScrollTo }) {
}, [dispatch]);
const handleClickEditButton = useCallback(() => {
let btnNm = "";
if (tab === 0) {
btnNm = "PAYMENT";
} else if (tab === 1) {
btnNm = "BILLING ADDRESS";
} else if (tab === 2) {
btnNm = "SHIPPING ADDRESS";
}
sendLogMyInfoEdit({ btnNm });
dispatch(setShowPopup(Config.ACTIVE_POPUP.qrPopup));
}, [dispatch]);
}, [dispatch, sendLogMyInfoEdit, tab]);
useEffect(() => {
Spotlight.focus();