optrader/shoptime
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[통합로그 No.3] HomeBanner 클릭 시 배너의 대한 정보를 수집하는 로그 함수 호출

Browse Source
This commit is contained in:
dongyoungKo
2025-05-09 17:23:09 +09:00
parent 2374829a13
commit e2b45bc08b
2 changed files with 114 additions and 117 deletions
Download Patch File Download Diff File Expand all files Collapse all files

119
com.twin.app.shoptime/src/views/HomePanel/HomeBanner/RandomUnit.jsx
View File

@@ -4,56 +4,45 @@ import React, {
useMemo, useMemo,
useRef, useRef,
useState, useState,
} from 'react'; } from "react";
import classNames from 'classnames'; import classNames from "classnames";
import { import { useDispatch, useSelector } from "react-redux";
useDispatch,
useSelector,
} from 'react-redux';
import Spotlight from '@enact/spotlight'; import Spotlight from "@enact/spotlight";
import SpotlightContainerDecorator import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator";
from '@enact/spotlight/SpotlightContainerDecorator'; import Spottable from "@enact/spotlight/Spottable";
import Spottable from '@enact/spotlight/Spottable'; import { getContainerId } from "@enact/spotlight/src/container";
import { getContainerId } from '@enact/spotlight/src/container';
import btnPlay from '../../../../assets/images/btn/btn-play-thumb-nor.png'; import btnPlay from "../../../../assets/images/btn/btn-play-thumb-nor.png";
import defaultLogoImg import defaultLogoImg from "../../../../assets/images/ic-tab-partners-default@3x.png";
from '../../../../assets/images/ic-tab-partners-default@3x.png'; import emptyHorImage from "../../../../assets/images/img-home-banner-empty-hor.png";
import emptyHorImage import emptyVerImage from "../../../../assets/images/img-home-banner-empty-ver.png";
from '../../../../assets/images/img-home-banner-empty-hor.png'; import defaultImageItem from "../../../../assets/images/img-thumb-empty-product@3x.png";
import emptyVerImage import liveShow from "../../../../assets/images/tag-liveshow.png";
from '../../../../assets/images/img-home-banner-empty-ver.png'; import { changeAppStatus } from "../../../actions/commonActions";
import defaultImageItem import { updateHomeInfo } from "../../../actions/homeActions";
from '../../../../assets/images/img-thumb-empty-product@3x.png';
import liveShow from '../../../../assets/images/tag-liveshow.png';
import { changeAppStatus } from '../../../actions/commonActions';
import { updateHomeInfo } from '../../../actions/homeActions';
import { import {
sendLogTopContents, sendLogTopContents,
sendLogTotalRecommend, sendLogTotalRecommend,
} from '../../../actions/logActions'; } from "../../../actions/logActions";
import { pushPanel } from '../../../actions/panelActions'; import { pushPanel } from "../../../actions/panelActions";
import { import {
finishVideoPreview, finishVideoPreview,
startVideoPlayer, startVideoPlayer,
} from '../../../actions/playActions'; } from "../../../actions/playActions";
import CustomImage from '../../../components/CustomImage/CustomImage'; import CustomImage from "../../../components/CustomImage/CustomImage";
import usePriceInfo from '../../../hooks/usePriceInfo'; import usePriceInfo from "../../../hooks/usePriceInfo";
import { import {
LOG_CONTEXT_NAME, LOG_CONTEXT_NAME,
LOG_MENU, LOG_MENU,
LOG_MESSAGE_ID, LOG_MESSAGE_ID,
LOG_TP_NO, LOG_TP_NO,
panel_names, panel_names,
} from '../../../utils/Config'; } from "../../../utils/Config";
import { import { $L, formatGMTString } from "../../../utils/helperMethods";
$L, import { TEMPLATE_CODE_CONF } from "../HomePanel";
formatGMTString, import css from "./RandomUnit.module.less";
} from '../../../utils/helperMethods';
import { TEMPLATE_CODE_CONF } from '../HomePanel';
import css from './RandomUnit.module.less';
const SpottableComponent = Spottable("div"); const SpottableComponent = Spottable("div");
@@ -153,6 +142,30 @@ export default function RandomUnit({
return {}; return {};
}, [shptmTmplCd]); }, [shptmTmplCd]);
const sendBannerLog = useCallback(() => {
const data = randomDataRef.current;
if (data && nowMenu === LOG_MENU.HOME_TOP) {
dispatch(
sendLogTotalRecommend({
contextName: LOG_CONTEXT_NAME.HOME,
messageId: LOG_MESSAGE_ID.BANNER,
curationId,
curationTitle,
contentType: data.shptmBanrTpNm,
contentId: "",
productId: data.prdtId,
productTitle: data.prdtNm,
displayType: "rolling",
partner: data.patncNm,
brand: data.brndNm, // <- 'brnad' 확인
location: data.dspyOrder,
bannerType: data.vtctpYn === "Y" ? "Vertical" : "Horizontal",
})
);
}
}, [randomDataRef, nowMenu]);
// 1. 비디오(live) 에러 감지 // 1. 비디오(live) 에러 감지
// 2. 라이브 영상이 2개 이상이면, 그 다음 영상으로 전환 // 2. 라이브 영상이 2개 이상이면, 그 다음 영상으로 전환
// 3. 라이브 영상이 1개면 그 다음 영상으로 전환을 할 수 없으므로 에러 로고 화면을 보여준다. // 3. 라이브 영상이 1개면 그 다음 영상으로 전환을 할 수 없으므로 에러 로고 화면을 보여준다.
@@ -331,6 +344,7 @@ export default function RandomUnit({
let action = linkType === "DSP00507" ? startVideoPlayer : pushPanel; let action = linkType === "DSP00507" ? startVideoPlayer : pushPanel;
dispatch(action(linkInfo)); dispatch(action(linkInfo));
sendBannerLog();
dispatch( dispatch(
sendLogTopContents({ sendLogTopContents({
...topContentsLogInfo, ...topContentsLogInfo,
@@ -362,6 +376,8 @@ export default function RandomUnit({
}) })
); );
sendBannerLog();
dispatch( dispatch(
sendLogTopContents({ sendLogTopContents({
...topContentsLogInfo, ...topContentsLogInfo,
@@ -369,7 +385,13 @@ export default function RandomUnit({
logTpNo: LOG_TP_NO.TOP_CONTENTS.CLICK, logTpNo: LOG_TP_NO.TOP_CONTENTS.CLICK,
}) })
); );
}, [dispatch, randomData?.patnrId, randomData?.prdtId, topContentsLogInfo]); }, [
dispatch,
randomData?.patnrId,
randomData?.prdtId,
randomDataRef,
topContentsLogInfo,
]);
// 비디오 클릭 // 비디오 클릭
const videoClick = useCallback(() => { const videoClick = useCallback(() => {
@@ -403,6 +425,8 @@ export default function RandomUnit({
}) })
); );
sendBannerLog();
dispatch( dispatch(
sendLogTopContents({ sendLogTopContents({
...topContentsLogInfo, ...topContentsLogInfo,
@@ -412,7 +436,7 @@ export default function RandomUnit({
); );
onBlur(); onBlur();
}, [randomData, spotlightId, topContentsLogInfo]); }, [randomData, spotlightId, topContentsLogInfo, nowMenu, randomDataRef]);
// 투데이즈 딜 가격 정보 // 투데이즈 딜 가격 정보
const { originalPrice, discountedPrice, discountRate, offerInfo } = const { originalPrice, discountedPrice, discountRate, offerInfo } =
@@ -438,26 +462,7 @@ export default function RandomUnit({
//통합로그 //통합로그
useEffect(() => { useEffect(() => {
if (randomDataRef.current && nowMenu === LOG_MENU.HOME_TOP) { sendBannerLog();
dispatch(
sendLogTotalRecommend({
contextName: LOG_CONTEXT_NAME.HOME,
messageId: LOG_MESSAGE_ID.BANNER,
curationId: curationId,
curationTitle: curationTitle,
contentType: randomDataRef.current.shptmBanrTpNm,
contentId: "",
productId: randomDataRef.current.prdtId,
productTitle: randomDataRef.current.prdtNm,
displayType: "rolling",
partner: randomDataRef.current.patncNm,
brnad: randomDataRef.current.brndNm,
location: randomDataRef.current.dspyOrder,
bannerType:
randomDataRef.current.vtctpYn === "Y" ? "Vertical" : "Horizontal",
})
);
}
}, [randomDataRef, nowMenu]); }, [randomDataRef, nowMenu]);
useEffect(() => { useEffect(() => {

112
com.twin.app.shoptime/src/views/HomePanel/HomeBanner/RollingUnit.jsx
View File

@@ -4,55 +4,41 @@ import React, {
useMemo, useMemo,
useRef, useRef,
useState, useState,
} from 'react'; } from "react";
import classNames from 'classnames'; import classNames from "classnames";
import { import { useDispatch, useSelector } from "react-redux";
useDispatch,
useSelector,
} from 'react-redux';
import Spotlight from '@enact/spotlight'; import Spotlight from "@enact/spotlight";
import SpotlightContainerDecorator import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator";
from '@enact/spotlight/SpotlightContainerDecorator'; import Spottable from "@enact/spotlight/Spottable";
import Spottable from '@enact/spotlight/Spottable'; import { getContainerId } from "@enact/spotlight/src/container";
import { getContainerId } from '@enact/spotlight/src/container';
import btnPlay from '../../../../assets/images/btn/btn-play-thumb-nor.png'; import btnPlay from "../../../../assets/images/btn/btn-play-thumb-nor.png";
import defaultLogoImg import defaultLogoImg from "../../../../assets/images/ic-tab-partners-default@3x.png";
from '../../../../assets/images/ic-tab-partners-default@3x.png'; import emptyHorImage from "../../../../assets/images/img-home-banner-empty-hor.png";
import emptyHorImage import emptyVerImage from "../../../../assets/images/img-home-banner-empty-ver.png";
from '../../../../assets/images/img-home-banner-empty-hor.png'; import defaultImageItem from "../../../../assets/images/img-thumb-empty-product@3x.png";
import emptyVerImage import liveShow from "../../../../assets/images/tag-liveshow.png";
from '../../../../assets/images/img-home-banner-empty-ver.png'; import { setBannerIndex, updateHomeInfo } from "../../../actions/homeActions";
import defaultImageItem
from '../../../../assets/images/img-thumb-empty-product@3x.png';
import liveShow from '../../../../assets/images/tag-liveshow.png';
import {
setBannerIndex,
updateHomeInfo,
} from '../../../actions/homeActions';
import { import {
sendLogTopContents, sendLogTopContents,
sendLogTotalRecommend, sendLogTotalRecommend,
} from '../../../actions/logActions'; } from "../../../actions/logActions";
import { pushPanel } from '../../../actions/panelActions'; import { pushPanel } from "../../../actions/panelActions";
import { startVideoPlayer } from '../../../actions/playActions'; import { startVideoPlayer } from "../../../actions/playActions";
import CustomImage from '../../../components/CustomImage/CustomImage'; import CustomImage from "../../../components/CustomImage/CustomImage";
import usePriceInfo from '../../../hooks/usePriceInfo'; import usePriceInfo from "../../../hooks/usePriceInfo";
import { import {
LOG_CONTEXT_NAME, LOG_CONTEXT_NAME,
LOG_MENU, LOG_MENU,
LOG_MESSAGE_ID, LOG_MESSAGE_ID,
LOG_TP_NO, LOG_TP_NO,
panel_names, panel_names,
} from '../../../utils/Config'; } from "../../../utils/Config";
import { import { $L, formatGMTString } from "../../../utils/helperMethods";
$L, import { TEMPLATE_CODE_CONF } from "../HomePanel";
formatGMTString, import css from "./RollingUnit.module.less";
} from '../../../utils/helperMethods';
import { TEMPLATE_CODE_CONF } from '../HomePanel';
import css from './RollingUnit.module.less';
const SpottableComponent = Spottable("div"); const SpottableComponent = Spottable("div");
@@ -185,6 +171,31 @@ export default function RollingUnit({
return {}; return {};
}, [shptmTmplCd, startIndex]); }, [shptmTmplCd, startIndex]);
const sendBannerLog = useCallback(() => {
if (rollingDataRef.current && nowMenu === LOG_MENU.HOME_TOP) {
dispatch(
sendLogTotalRecommend({
contextName: LOG_CONTEXT_NAME.HOME,
messageId: LOG_MESSAGE_ID.BANNER,
curationId: curationId,
curationTitle: curationTitle,
contentType: rollingDataRef.current[startIndex].shptmBanrTpNm,
contentId: "",
productId: rollingDataRef.current[startIndex].prdtId,
productTitle: rollingDataRef.current[startIndex].prdtNm,
displayType: "rolling",
partner: rollingDataRef.current[startIndex].patncNm,
brand: rollingDataRef.current[startIndex].brndNm,
location: rollingDataRef.current[startIndex].dspyOrder,
bannerType:
rollingDataRef.current[startIndex].vtctpYn === "Y"
? "Vertical"
: "Horizontal",
})
);
}
}, [nowMenu, rollingDataRef]);
useEffect(() => { useEffect(() => {
if (savedIndex !== undefined) { if (savedIndex !== undefined) {
setStartIndex(savedIndex); setStartIndex(savedIndex);
@@ -325,6 +336,7 @@ export default function RollingUnit({
if (bannerType === "Today's Deals") { if (bannerType === "Today's Deals") {
handlePushPanel(panel_names.DETAIL_PANEL, createPanelInfo(currentData)); handlePushPanel(panel_names.DETAIL_PANEL, createPanelInfo(currentData));
sendBannerLog();
dispatch( dispatch(
sendLogTopContents({ sendLogTopContents({
...topContentsLogInfo, ...topContentsLogInfo,
@@ -392,7 +404,7 @@ export default function RollingUnit({
default: default:
return; return;
} }
sendBannerLog();
dispatch( dispatch(
sendLogTopContents({ sendLogTopContents({
...topContentsLogInfo, ...topContentsLogInfo,
@@ -445,6 +457,7 @@ export default function RollingUnit({
modalClassName: css.videoModal, modalClassName: css.videoModal,
}); });
sendBannerLog();
dispatch( dispatch(
sendLogTopContents({ sendLogTopContents({
...topContentsLogInfo, ...topContentsLogInfo,
@@ -510,28 +523,7 @@ export default function RollingUnit({
}, [dispatch, entryMenu, nowMenu, startIndex, topContentsLogInfo]); }, [dispatch, entryMenu, nowMenu, startIndex, topContentsLogInfo]);
useEffect(() => { useEffect(() => {
if (rollingDataRef.current && nowMenu === LOG_MENU.HOME_TOP) { sendBannerLog();
dispatch(
sendLogTotalRecommend({
contextName: LOG_CONTEXT_NAME.HOME,
messageId: LOG_MESSAGE_ID.BANNER,
curationId: curationId,
curationTitle: curationTitle,
contentType: rollingDataRef.current[startIndex].shptmBanrTpNm,
contentId: "",
productId: rollingDataRef.current[startIndex].prdtId,
productTitle: rollingDataRef.current[startIndex].prdtNm,
displayType: "rolling",
partner: rollingDataRef.current[startIndex].patncNm,
brnad: rollingDataRef.current[startIndex].brndNm,
location: rollingDataRef.current[startIndex].dspyOrder,
bannerType:
rollingDataRef.current[startIndex].vtctpYn === "Y"
? "Vertical"
: "Horizontal",
})
);
}
}, [rollingDataRef, nowMenu, startIndex]); }, [rollingDataRef, nowMenu, startIndex]);
useEffect(() => { useEffect(() => {