[Log] Log, IF-LGSP-LOG-008 / Shop By Mobile 이력 (logTpNo: “450”, “452”) 수정

This commit is contained in:
younghoon100.park
2024-06-07 15:34:28 +09:00
parent e3081f0cb0
commit bdb3ed9b75
10 changed files with 206 additions and 96 deletions

View File

@@ -59,7 +59,7 @@ export default function MobileSendPopUp({
hotelId,
hotelNm,
hotelDtlUrl,
logParams,
shopByMobileLogRef,
}) {
const { sendLogShopByMobile } = useLogService();
const deviceInfo = useSelector((state) => state.device.deviceInfo);
@@ -343,22 +343,32 @@ export default function MobileSendPopUp({
useEffect(() => {
setSmsRetCode(smsRetCodeResData);
let timer;
if (smsRetCodeResData === 0 || regDeviceInfoRetCode === 0) {
setTimeout(() => {
timer = setTimeout(() => {
dispatch(setHidePopup());
if (logParams) {
if (shopByMobileLogRef) {
let params = {
...logParams,
...shopByMobileLogRef.current,
logTpNo: LOG_TP_NO.SHOP_BY_MOBILE.AGREE_AND_SEND,
mbphNoFlag: "Y",
trmsAgrFlag: "Y",
};
sendLogShopByMobile(params);
shopByMobileLogRef.current = null;
}
}, 3000);
return () => clearTimeout(timer);
}
}, [logParams, sendLogShopByMobile, smsRetCodeResData, regDeviceInfoRetCode]);
}, [
sendLogShopByMobile,
shopByMobileLogRef,
smsRetCodeResData,
regDeviceInfoRetCode,
]);
useEffect(() => {
// smsRetCode initialize

View File

@@ -337,34 +337,18 @@ export default function useLogService() {
*/
const sendLogShopByMobile = useCallback(
(params) => {
const { logTpNo } = params;
const { logTpNo, patncNm, patnrId, prdtId, prdtNm } = params;
if (!logTpNo || !patncNm || !patnrId || !prdtId || !prdtNm) {
console.error("sendLogShopByMobile invalid params", params);
return;
}
const newParams = {
befPrice: params?.befPrice ?? "",
curationId: params?.curationId ?? "",
curationNm: params?.curationNm ?? "",
...params,
entryMenu: entryMenuRef.current,
evntId: params?.eventId ?? "",
evntNm: params?.evntNm ?? "",
lastPrice: params?.lastPrice ?? "",
lgCatCd: params?.lgCatCd ?? "",
lgCatNm: params?.lgCatNm ?? "",
liveFlag: params?.liveFlag ?? "",
logTpNo,
mbphNoFlag: params?.mbphNoFlag ?? "",
nowMenu: nowMenuRef.current,
patncNm: params?.patncNm ?? "",
patnrId: params?.patnrId ?? "",
prdtId: params?.prdtId ?? "",
prdtNm: params?.prdtNm ?? "",
revwGrd: params?.revwGrd ?? "",
rewdAplyFlag: params?.rewdAplyFlag ?? "",
shopByMobileFlag: params?.shopByMobileFlag ?? "",
shopTpNm: params?.shopTpNm ?? "",
showId: params?.showId ?? "",
showNm: params?.showNm ?? "",
trmsAgrFlag: params?.trmsAgrFlag ?? "",
tsvFlag: params?.tsvFlag ?? "",
};
dispatch(postLog(newParams));

View File

@@ -43,7 +43,6 @@ import YouMayLike from "./YouMayLike/YouMayLike";
export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
const [lgCatCd, setLgCatCd] = useState("");
const [selectedIndex, setSelectedIndex] = useState(0);
const logParamsRef = useRef(null);
const productData = useSelector((state) => state.main.productData);
const themeData = useSelector((state) => state.home.productData);
const hotelData = useSelector((state) => state.home.hotelData);
@@ -64,6 +63,8 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
);
const dispatch = useDispatch();
const shopByMobileLogRef = useRef(null);
const {
themeHotelId,
themePrdtId,
@@ -292,13 +293,13 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
productData?.grPrdtProcYn === "N" &&
prdtId && (
<SingleProduct
isOnTop={isOnTop}
panelInfo={panelInfo}
selectedPatnrId={patnrId}
selectedPrdtId={prdtId}
selectedIndex={selectedIndex}
setSelectedIndex={setSelectedIndex}
logParamsRef={logParamsRef}
isOnTop={isOnTop}
shopByMobileLogRef={shopByMobileLogRef}
/>
)}
{/* 그룹상품 영역 */}
@@ -306,36 +307,38 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
productData?.grPrdtProcYn === "Y" &&
groupInfos && (
<GroupProduct
isOnTop={isOnTop}
panelInfo={panelInfo}
selectedPatnrId={patnrId}
selectedPrdtId={prdtId}
selectedIndex={selectedIndex}
setSelectedIndex={setSelectedIndex}
logParamsRef={logParamsRef}
isOnTop={isOnTop}
shopByMobileLogRef={shopByMobileLogRef}
/>
)}
{/* 구매불가상품 영역 */}
{productData?.pmtSuptYn === "N" && prdtId && (
<UnableProduct
isOnTop={isOnTop}
panelInfo={panelInfo}
selectedPatnrId={patnrId}
selectedPrdtId={prdtId}
selectedIndex={selectedIndex}
setSelectedIndex={setSelectedIndex}
isOnTop={isOnTop}
shopByMobileLogRef={shopByMobileLogRef}
/>
)}
{/* 테마그룹상품 영역*/}
{curationId && (hotelInfos || themeData) && (
<ThemeProduct
// isOnTop={isOnTop}
isOnTop={isOnTop}
panelInfo={panelInfo}
selectedCurationId={curationId}
selectedCurationNm={curationNm}
selectedIndex={selectedIndex}
selectedPatnrId={patnrId}
setSelectedIndex={setSelectedIndex}
shopByMobileLogRef={shopByMobileLogRef}
themeType={type}
/>
)}
@@ -376,7 +379,7 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
hotelInfos[selectedIndex]?.hotelDetailInfo?.hotelDtlUrl
}
productPrice={type === "hotel" && Price()}
logParams={logParamsRef.current}
shopByMobileLogRef={shopByMobileLogRef}
/>
)}
</>

View File

@@ -18,15 +18,20 @@ const Container = SpotlightContainerDecorator(
"div"
);
export default function GroupProduct({
isOnTop,
panelInfo,
selectedPatnrId,
selectedPrdtId,
selectedIndex,
setSelectedIndex,
logParamsRef,
panelInfo,
isOnTop,
shopByMobileLogRef,
}) {
const { sendLogDetail, sendLogGNB, sendLogProductDetail } = useLogService();
const {
sendLogDetail,
sendLogGNB,
sendLogProductDetail,
sendLogShopByMobile,
} = useLogService();
const productData = useSelector((state) => state.main.productData);
@@ -82,21 +87,59 @@ export default function GroupProduct({
}
}, [productData, sendLogDetail]);
const handleMobileSendPopupOpen = useCallback(() => {
if (productData) {
const params = {
befPrice: productData?.priceInfo?.split("|")[0],
curationId: productData?.curationId ?? "",
curationNm: productData?.curationNm ?? "",
evntId: "",
evntNm: "",
lastPrice: productData?.priceInfo?.split("|")[1],
lgCatCd: productData?.catCd ?? "",
lgCatNm: productData?.catNm ?? "",
liveFlag: panelInfo?.liveFlag ?? "N",
logTpNo: LOG_TP_NO.SHOP_BY_MOBILE.SHOP_BY_MOBILE,
mbphNoFlag: "N",
patncNm: productData?.patncNm,
patnrId: productData?.patnrId,
prdtId: productData?.prdtId,
prdtNm: productData?.prdtNm,
revwGrd: productData?.rewd ?? "",
rewdAplyFlag: productData?.priceInfo?.split("|")[2],
shopByMobileFlag: "Y",
shopTpNm: "product",
showId: productData?.showId ?? "",
showNm: productData?.showNm ?? "",
trmsAgrFlag: "N",
tsvFlag: productData?.todaySpclFlag ?? "",
};
sendLogShopByMobile(params);
shopByMobileLogRef.current = params;
}
}, [
panelInfo?.liveFlag,
productData,
sendLogShopByMobile,
shopByMobileLogRef,
]);
return (
<>
<Container className={css.container}>
<Indicator
isOnTop={isOnTop}
launchedFromPlayer={panelInfo?.launchedFromPlayer}
productInfo={productData}
selectedIndex={selectedIndex}
setSelectedIndex={setSelectedIndex}
productInfo={productData}
soldoutFlag={isProductSoldOut}
launchedFromPlayer={panelInfo?.launchedFromPlayer}
isOnTop={isOnTop}
/>
<IndicatorOptions
handleIndicatorOptions={handleIndicatorOptions}
handleMobileSendPopupOpen={handleMobileSendPopupOpen}
isFullOption
logParamsRef={logParamsRef}
panelInfo={panelInfo}
productInfo={productData}
thumbnailUrl={productData.imgUrls600[0]}

View File

@@ -18,15 +18,20 @@ const Container = SpotlightContainerDecorator(
"div"
);
export default function SingleProduct({
isOnTop,
panelInfo,
selectedPatnrId,
selectedPrdtId,
selectedIndex,
setSelectedIndex,
logParamsRef,
panelInfo,
isOnTop,
shopByMobileLogRef,
}) {
const { sendLogDetail, sendLogGNB, sendLogProductDetail } = useLogService();
const {
sendLogDetail,
sendLogGNB,
sendLogProductDetail,
sendLogShopByMobile,
} = useLogService();
const productData = useSelector((state) => state.main.productData);
@@ -82,21 +87,59 @@ export default function SingleProduct({
}
}, [productData, sendLogDetail]);
const handleMobileSendPopupOpen = useCallback(() => {
if (productData) {
const params = {
befPrice: productData?.priceInfo?.split("|")[0],
curationId: productData?.curationId ?? "",
curationNm: productData?.curationNm ?? "",
evntId: "",
evntNm: "",
lastPrice: productData?.priceInfo?.split("|")[1],
lgCatCd: productData?.catCd ?? "",
lgCatNm: productData?.catNm ?? "",
liveFlag: panelInfo?.liveFlag ?? "N",
logTpNo: LOG_TP_NO.SHOP_BY_MOBILE.SHOP_BY_MOBILE,
mbphNoFlag: "N",
patncNm: productData?.patncNm,
patnrId: productData?.patnrId,
prdtId: productData?.prdtId,
prdtNm: productData?.prdtNm,
revwGrd: productData?.rewd ?? "",
rewdAplyFlag: productData?.priceInfo?.split("|")[2],
shopByMobileFlag: "Y",
shopTpNm: "product",
showId: productData?.showId ?? "",
showNm: productData?.showNm ?? "",
trmsAgrFlag: "N",
tsvFlag: productData?.todaySpclFlag ?? "",
};
sendLogShopByMobile(params);
shopByMobileLogRef.current = params;
}
}, [
panelInfo?.liveFlag,
productData,
sendLogShopByMobile,
shopByMobileLogRef,
]);
return (
<>
<Container className={css.container}>
<Indicator
isOnTop={isOnTop}
launchedFromPlayer={panelInfo?.launchedFromPlayer}
productInfo={productData}
selectedIndex={selectedIndex}
setSelectedIndex={setSelectedIndex}
productInfo={productData}
soldoutFlag={isProductSoldOut}
launchedFromPlayer={panelInfo?.launchedFromPlayer}
isOnTop={isOnTop}
/>
<IndicatorOptions
handleIndicatorOptions={handleIndicatorOptions}
handleMobileSendPopupOpen={handleMobileSendPopupOpen}
isFullOption
logParamsRef={logParamsRef}
panelInfo={panelInfo}
productInfo={productData}
thumbnailUrl={productData.imgUrls600[0]}
@@ -105,8 +148,8 @@ export default function SingleProduct({
<div>
<ProductOption productInfo={productData}>
<SingleOption
productInfo={productData}
isSpotlight
productInfo={productData}
selectedPatnrId={selectedPatnrId}
selectedPrdtId={selectedPrdtId}
soldoutFlag={isProductSoldOut}

View File

@@ -11,7 +11,7 @@ import { useDispatch, useSelector } from "react-redux";
import Spotlight from "@enact/spotlight";
import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator";
import { setHidePopup, setShowPopup } from "../../../actions/commonActions";
import { setShowPopup } from "../../../actions/commonActions";
import TButton from "../../../components/TButton/TButton";
import TQRCode from "../../../components/TQRCode/TQRCode";
import useLogService from "../../../hooks/useLogService";
@@ -31,6 +31,7 @@ export default function HotelOption({
launchedFromPlayer,
selectedIndex,
setSelectedIndex,
shopByMobileLogRef,
}) {
const {
sendLogDetail,
@@ -49,7 +50,6 @@ export default function HotelOption({
const [label, setLabel] = useState("");
const [amenitiesInfos, setAmenitiesInfos] = useState();
const logParamsRef = useRef(null);
const timerRef = useRef(null);
const tooltipDes = $L("Scan for more information about the product.");
@@ -170,8 +170,8 @@ export default function HotelOption({
};
sendLogShopByMobile(params);
logParamsRef.current = params;
}, [dispatch, selectedHotelInfo]);
shopByMobileLogRef.current = params;
}, [dispatch, selectedHotelInfo, shopByMobileLogRef]);
const Price = () => {
return (

View File

@@ -7,15 +7,15 @@ import ShowProduct from "./ShowProduct";
import css from "./ThemeProduct.module.less";
export default function ThemeProduct({
// isOnTop,
isOnTop,
panelInfo,
selectedCurationId,
selectedCurationNm,
selectedIndex,
selectedPatnrId,
setSelectedIndex,
shopByMobileLogRef,
themeType,
isOnTop,
}) {
return (
<div className={css.container}>
@@ -38,6 +38,7 @@ export default function ThemeProduct({
launchedFromPlayer={panelInfo?.launchedFromPlayer}
selectedIndex={selectedIndex}
setSelectedIndex={setSelectedIndex}
shopByMobileLogRef={shopByMobileLogRef}
/>
)}
</div>

View File

@@ -15,6 +15,7 @@ import FavoriteBtn from "../components/FavoriteBtn";
import css from "./UnableOption.module.less";
export default function UnableOption({
handleMobileSendPopupOpen,
patnrName,
productInfo,
selectedPatnrId,
@@ -68,7 +69,11 @@ export default function UnableOption({
const handleSMSClick = useCallback(() => {
dispatch(setShowPopup(Config.ACTIVE_POPUP.smsPopup));
}, [dispatch]);
if (handleMobileSendPopupOpen) {
handleMobileSendPopupOpen();
}
}, [dispatch, handleMobileSendPopupOpen]);
const renderPriceItem = useCallback(() => {
if (productInfo) {

View File

@@ -18,15 +18,20 @@ const Container = SpotlightContainerDecorator(
"div"
);
export default function UnableProduct({
isOnTop,
panelInfo,
selectedPatnrId,
selectedPrdtId,
selectedIndex,
setSelectedIndex,
logParamsRef,
panelInfo,
isOnTop,
shopByMobileLogRef,
}) {
const { sendLogDetail, sendLogGNB, sendLogProductDetail } = useLogService();
const {
sendLogDetail,
sendLogGNB,
sendLogProductDetail,
sendLogShopByMobile,
} = useLogService();
const productData = useSelector((state) => state.main.productData);
@@ -82,6 +87,44 @@ export default function UnableProduct({
}
}, [productData, sendLogDetail]);
const handleMobileSendPopupOpen = useCallback(() => {
if (productData) {
const params = {
befPrice: productData?.priceInfo?.split("|")[0],
curationId: productData?.curationId ?? "",
curationNm: productData?.curationNm ?? "",
evntId: "",
evntNm: "",
lastPrice: productData?.priceInfo?.split("|")[1],
lgCatCd: productData?.catCd ?? "",
lgCatNm: productData?.catNm ?? "",
liveFlag: panelInfo?.liveFlag ?? "N",
logTpNo: LOG_TP_NO.SHOP_BY_MOBILE.SHOP_BY_MOBILE,
mbphNoFlag: "N",
patncNm: productData?.patncNm,
patnrId: productData?.patnrId,
prdtId: productData?.prdtId,
prdtNm: productData?.prdtNm,
revwGrd: productData?.rewd ?? "",
rewdAplyFlag: productData?.priceInfo?.split("|")[2],
shopByMobileFlag: "Y",
shopTpNm: "product",
showId: productData?.showId ?? "",
showNm: productData?.showNm ?? "",
trmsAgrFlag: "N",
tsvFlag: productData?.todaySpclFlag ?? "",
};
sendLogShopByMobile(params);
shopByMobileLogRef.current = params;
}
}, [
panelInfo?.liveFlag,
productData,
sendLogShopByMobile,
shopByMobileLogRef,
]);
return (
<>
<Container
@@ -89,18 +132,17 @@ export default function UnableProduct({
spotlightId="unableproduct_container"
>
<Indicator
isOnTop={isOnTop}
launchedFromPlayer={panelInfo?.launchedFromPlayer}
productInfo={productData}
selectedIndex={selectedIndex}
setSelectedIndex={setSelectedIndex}
productInfo={productData}
soldoutFlag={isProductSoldOut}
launchedFromPlayer={panelInfo?.launchedFromPlayer}
isOnTop={isOnTop}
/>
<IndicatorOptions
handleIndicatorOptions={handleIndicatorOptions}
isCall
isDescription
logParamsRef={logParamsRef}
productInfo={productData}
thumbnailUrl={productData.imgUrls600[0]}
/>
@@ -108,9 +150,11 @@ export default function UnableProduct({
<div>
<ProductOption productInfo={productData}>
<UnableOption
handleMobileSendPopupOpen={handleMobileSendPopupOpen}
productInfo={productData}
selectedPatnrId={selectedPatnrId}
selectedPrdtId={selectedPrdtId}
shopByMobileLogRef={shopByMobileLogRef}
soldoutFlag={isProductSoldOut}
/>
</ProductOption>

View File

@@ -25,7 +25,7 @@ const SpottableComponent = Spottable("div");
export default function IndicatorOptions({
address,
handleIndicatorOptions,
logParamsRef,
handleMobileSendPopupOpen,
isCall,
isDescription,
isFullOption,
@@ -51,33 +51,10 @@ export default function IndicatorOptions({
const handleSMSClick = useCallback(() => {
dispatch(setShowPopup(Config.ACTIVE_POPUP.smsPopup));
const params = {
befPrice: productInfo?.price2,
curationId: productInfo?.curationId,
curationNm: productInfo?.curationNm,
lastPrice: productInfo?.price3,
lgCatCd: productInfo?.catCd,
lgCatNm: productInfo?.catNm,
liveFlag: panelInfo?.liveFlag ?? "N",
logTpNo: Config.LOG_TP_NO.SHOP_BY_MOBILE.SHOP_BY_MOBILE,
mbphNoFlag: "N",
patncNm: productInfo?.patncNm,
patnrId: productInfo?.patnrId,
prdtId: productInfo?.prdtId,
prdtNm: productInfo?.prdtNm,
revwGrd: productInfo?.revwGrd,
rewdAplyFlag: productInfo?.priceInfo.split("|")[2],
shopByMobileFlag: "Y",
shopTpNm: "product",
showId: panelInfo?.showId,
showNm: panelInfo?.showNm,
trmsAgrFlag: "N",
tsvFlag: productInfo?.todaySpclFlag,
};
sendLogShopByMobile(params);
logParamsRef.current = params;
}, [dispatch, panelInfo, productInfo, sendLogShopByMobile]);
if (handleMobileSendPopupOpen) {
handleMobileSendPopupOpen();
}
}, [dispatch, handleMobileSendPopupOpen]);
const descriptionClick = useCallback(
(label, description) => {