[Log] IF-LGSP-LOG-005 (GNB), added logic for popup display
Detail Note: 1. GroupProduct.jsx 2. SingleProduct.jsx 3. HotelProduct.jsx 4. ShowProduct.jsx 5. ThemeProduct.jsx 6. UnableProduct.jsx 7. OnSalePanel.jsx
This commit is contained in:
@@ -123,7 +123,7 @@ export const postLog = (params) => (dispatch, getState) => {
|
||||
|
||||
const onSuccess = (response) => {
|
||||
// console.log(
|
||||
// `%c Log ---------- postLog onSuccess logTpNo ${logTpNo} ----------`,
|
||||
// `%c log ---------- postLog onSuccess logTpNo ${logTpNo} ----------`,
|
||||
// "background: steelblue; color: white",
|
||||
// JSON.parse(response.config.data)
|
||||
// );
|
||||
|
||||
@@ -151,8 +151,6 @@ export const LOG_TP_NO = {
|
||||
|
||||
GNB: "300",
|
||||
|
||||
HOME: {},
|
||||
|
||||
TOP_CONTENTS: "310",
|
||||
|
||||
PRODUCT: {
|
||||
@@ -216,7 +214,7 @@ export const LOG_MENU = {
|
||||
SYSTEM_ALERT: "System Alert",
|
||||
UNKNOWN: "Unknown",
|
||||
|
||||
POP_UP: "Pop Up", // 미작업
|
||||
POP_UP: "Pop Up", // completed
|
||||
TERMS_CONDITIONS: "Terms & Conditions", // completed
|
||||
|
||||
HOME_TOP: "Home/Top", // completed
|
||||
@@ -241,7 +239,7 @@ export const LOG_MENU = {
|
||||
CATEGORY_POPULAR_SHOWS: "Category/Popular Shows", // completed
|
||||
CATEGORY_BEST_SELLER: "Category/Best Sellers", // completed
|
||||
|
||||
FEATURED_BRANDS_QUICK_MENU: "Featured Brands/Quick Menu", // completed
|
||||
FEATURED_BRANDS_QUICK_MENU: "Featured Brands/Quick Menu", // pyh todo, 문의, completed
|
||||
FEATURED_BRANDS_LIVE_CHANNELS: "Featured Brands/Live Channels", // completed
|
||||
FEATURED_BRANDS_UPCOMING: "Featured Brands/Upcoming", // completed
|
||||
FEATURED_BRANDS_TODAYS_DEALS: 'Featured Brands/Today"s Deals', // completed
|
||||
@@ -269,11 +267,11 @@ export const LOG_MENU = {
|
||||
DETAIL_PAGE_TRAVEL_THEME_DETAIL: "Detail Page/Travel Theme Detail", // completed
|
||||
DETAIL_PAGE_GROUP_DETAIL: "Detail Page/Group Detail", // completed
|
||||
|
||||
FULL: "Full",
|
||||
FULL_SHOP_NOW: "Full/Shop Now",
|
||||
FULL_YOU_MAY_LIKE: "Full/You May Like",
|
||||
FULL_LIVE_CHANNELS: "Full/Live Channels",
|
||||
FULL_FEATURED_SHOWS: "Full/Featured Shows",
|
||||
FULL: "Full", // pyh todo, 문의, completed
|
||||
FULL_SHOP_NOW: "Full/Shop Now", // completed
|
||||
FULL_YOU_MAY_LIKE: "Full/You May Like", // completed
|
||||
FULL_LIVE_CHANNELS: "Full/Live Channels", // completed
|
||||
FULL_FEATURED_SHOWS: "Full/Featured Shows", // completed
|
||||
|
||||
CHECKOUT_PIN_CODE: "Checkout/PIN Code",
|
||||
CHECKOUT_ORDER_COMPLETE: "Checkout/Order Complete",
|
||||
|
||||
@@ -33,6 +33,8 @@ export default function GroupProduct({
|
||||
sendLogShopByMobile,
|
||||
} = useLogService();
|
||||
|
||||
const popupVisible = useSelector((state) => state.common.popup.popupVisible);
|
||||
|
||||
const productData = useSelector((state) => state.main.productData);
|
||||
|
||||
const isProductSoldOut = useMemo(() => {
|
||||
@@ -44,8 +46,12 @@ export default function GroupProduct({
|
||||
}, [productData]);
|
||||
|
||||
useEffect(() => {
|
||||
sendLogGNB(LOG_MENU.DETAIL_PAGE_GROUP_DETAIL);
|
||||
if (!popupVisible) {
|
||||
sendLogGNB(LOG_MENU.DETAIL_PAGE_GROUP_DETAIL);
|
||||
}
|
||||
}, [popupVisible, sendLogGNB]);
|
||||
|
||||
useEffect(() => {
|
||||
if (productData) {
|
||||
const params = {
|
||||
befPrice: productData?.priceInfo?.split("|")[0],
|
||||
@@ -69,7 +75,7 @@ export default function GroupProduct({
|
||||
|
||||
return () => sendLogProductDetail(params);
|
||||
}
|
||||
}, [productData, sendLogGNB, sendLogProductDetail]);
|
||||
}, [productData, sendLogProductDetail]);
|
||||
|
||||
const handleIndicatorOptions = useCallback(() => {
|
||||
if (productData) {
|
||||
|
||||
@@ -33,6 +33,8 @@ export default function SingleProduct({
|
||||
sendLogShopByMobile,
|
||||
} = useLogService();
|
||||
|
||||
const popupVisible = useSelector((state) => state.common.popup.popupVisible);
|
||||
|
||||
const productData = useSelector((state) => state.main.productData);
|
||||
|
||||
const isProductSoldOut = useMemo(() => {
|
||||
@@ -44,8 +46,12 @@ export default function SingleProduct({
|
||||
}, [productData]);
|
||||
|
||||
useEffect(() => {
|
||||
sendLogGNB(LOG_MENU.DETAIL_PAGE_BILLING_PRODUCT_DETAIL);
|
||||
if (!popupVisible) {
|
||||
sendLogGNB(LOG_MENU.DETAIL_PAGE_BILLING_PRODUCT_DETAIL);
|
||||
}
|
||||
}, [popupVisible, sendLogGNB]);
|
||||
|
||||
useEffect(() => {
|
||||
if (productData) {
|
||||
const params = {
|
||||
befPrice: productData?.priceInfo?.split("|")[0],
|
||||
@@ -69,7 +75,7 @@ export default function SingleProduct({
|
||||
|
||||
return () => sendLogProductDetail(params);
|
||||
}
|
||||
}, [productData, sendLogGNB, sendLogProductDetail]);
|
||||
}, [productData, sendLogProductDetail]);
|
||||
|
||||
const handleIndicatorOptions = useCallback(() => {
|
||||
if (productData) {
|
||||
|
||||
@@ -42,6 +42,8 @@ export default function HotelOption({
|
||||
|
||||
const dispatch = useDispatch();
|
||||
|
||||
const popupVisible = useSelector((state) => state.common.popup.popupVisible);
|
||||
|
||||
const hotelInfos = useSelector(
|
||||
(state) => state.home.themeCurationHotelDetailData
|
||||
);
|
||||
@@ -69,24 +71,10 @@ export default function HotelOption({
|
||||
}, [hotelData, hotelInfos, selectedIndex]);
|
||||
|
||||
useEffect(() => {
|
||||
sendLogGNB(Config.LOG_MENU.DETAIL_PAGE_TRAVEL_THEME_DETAIL);
|
||||
|
||||
if (hotelData) {
|
||||
const { hotelInfo } = hotelData;
|
||||
|
||||
const params = {
|
||||
curationId: hotelInfo?.curationId ?? "",
|
||||
curationNm: hotelInfo?.curationNm ?? "",
|
||||
inDt: formatGMTString(new Date()),
|
||||
linkTpCd: "",
|
||||
logTpNo: Config.LOG_TP_NO.DETAIL.TRAVEL_DETAIL,
|
||||
patncNm: hotelInfo?.patncNm ?? "",
|
||||
patnrId: hotelInfo?.patnrId ?? "",
|
||||
};
|
||||
|
||||
return () => sendLogDetail(params);
|
||||
if (!popupVisible) {
|
||||
sendLogGNB(Config.LOG_MENU.DETAIL_PAGE_TRAVEL_THEME_DETAIL);
|
||||
}
|
||||
}, [hotelData, sendLogDetail, sendLogGNB]);
|
||||
}, [popupVisible, sendLogGNB]);
|
||||
|
||||
useEffect(() => {
|
||||
if (selectedHotelInfo) {
|
||||
@@ -116,6 +104,24 @@ export default function HotelOption({
|
||||
return () => clearTimeout(timerRef.current);
|
||||
}, [selectedHotelInfo, sendLogProductDetail]);
|
||||
|
||||
useEffect(() => {
|
||||
if (hotelData) {
|
||||
const { hotelInfo } = hotelData;
|
||||
|
||||
const params = {
|
||||
curationId: hotelInfo?.curationId ?? "",
|
||||
curationNm: hotelInfo?.curationNm ?? "",
|
||||
inDt: formatGMTString(new Date()),
|
||||
linkTpCd: "",
|
||||
logTpNo: Config.LOG_TP_NO.DETAIL.TRAVEL_DETAIL,
|
||||
patncNm: hotelInfo?.patncNm ?? "",
|
||||
patnrId: hotelInfo?.patnrId ?? "",
|
||||
};
|
||||
|
||||
return () => sendLogDetail(params);
|
||||
}
|
||||
}, [hotelData, sendLogDetail]);
|
||||
|
||||
useEffect(() => {
|
||||
let label = "";
|
||||
let rating = hotelInfos[selectedIndex]?.hotelDetailInfo.revwGrd;
|
||||
|
||||
@@ -19,15 +19,23 @@ const Container = SpotlightContainerDecorator(
|
||||
);
|
||||
export default function ShowOption({
|
||||
isOnTop,
|
||||
// panelInfo,
|
||||
panelInfo,
|
||||
launchedFromPlayer,
|
||||
selectedIndex,
|
||||
selectedCurationId,
|
||||
selectedCurationNm,
|
||||
// selectedPatnrId,
|
||||
setSelectedIndex,
|
||||
shopByMobileLogRef,
|
||||
}) {
|
||||
const { sendLogDetail, sendLogGNB, sendLogProductDetail } = useLogService();
|
||||
const {
|
||||
sendLogDetail,
|
||||
sendLogGNB,
|
||||
sendLogProductDetail,
|
||||
sendLogShopByMobile,
|
||||
} = useLogService();
|
||||
|
||||
const popupVisible = useSelector((state) => state.common.popup.popupVisible);
|
||||
|
||||
const productInfo = useSelector(
|
||||
(state) => state.home.themeCurationDetailInfoData
|
||||
@@ -56,8 +64,12 @@ export default function ShowOption({
|
||||
}, [productData, productInfo, selectedIndex]);
|
||||
|
||||
useEffect(() => {
|
||||
sendLogGNB(LOG_MENU.DETAIL_PAGE_TRAVEL_THEME_DETAIL);
|
||||
if (!popupVisible) {
|
||||
sendLogGNB(LOG_MENU.DETAIL_PAGE_TRAVEL_THEME_DETAIL);
|
||||
}
|
||||
}, [popupVisible, sendLogGNB]);
|
||||
|
||||
useEffect(() => {
|
||||
if (productData) {
|
||||
const themeInfo = productData?.themeInfo[0];
|
||||
|
||||
@@ -75,7 +87,7 @@ export default function ShowOption({
|
||||
|
||||
return () => sendLogDetail(params);
|
||||
}
|
||||
}, [sendLogDetail, sendLogGNB, productData]);
|
||||
}, [productData, sendLogDetail]);
|
||||
|
||||
useEffect(() => {
|
||||
if (showProductInfo) {
|
||||
@@ -131,6 +143,44 @@ export default function ShowOption({
|
||||
}
|
||||
}, [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 (
|
||||
<>
|
||||
{productInfo && (
|
||||
@@ -149,6 +199,7 @@ export default function ShowOption({
|
||||
/>
|
||||
<IndicatorOptions
|
||||
handleIndicatorOptions={handleIndicatorOptions}
|
||||
handleMobileSendPopupOpen={handleMobileSendPopupOpen}
|
||||
isCall
|
||||
isFullOption={productInfo[selectedIndex]?.pmtSuptYn === "Y"}
|
||||
isDescription={!productInfo[selectedIndex]?.pmtSuptYn === "Y"}
|
||||
|
||||
@@ -29,6 +29,7 @@ export default function ThemeProduct({
|
||||
selectedCurationNm={selectedCurationNm}
|
||||
selectedPatnrId={selectedPatnrId}
|
||||
setSelectedIndex={setSelectedIndex}
|
||||
shopByMobileLogRef={shopByMobileLogRef}
|
||||
/>
|
||||
)}
|
||||
{themeType === "hotel" && (
|
||||
|
||||
@@ -33,6 +33,8 @@ export default function UnableProduct({
|
||||
sendLogShopByMobile,
|
||||
} = useLogService();
|
||||
|
||||
const popupVisible = useSelector((state) => state.common.popup.popupVisible);
|
||||
|
||||
const productData = useSelector((state) => state.main.productData);
|
||||
|
||||
const isProductSoldOut = useMemo(() => {
|
||||
@@ -44,8 +46,12 @@ export default function UnableProduct({
|
||||
}, [productData]);
|
||||
|
||||
useEffect(() => {
|
||||
sendLogGNB(LOG_MENU.DETAIL_PAGE_PRODUCT_DETAIL);
|
||||
if (!popupVisible) {
|
||||
sendLogGNB(LOG_MENU.DETAIL_PAGE_PRODUCT_DETAIL);
|
||||
}
|
||||
}, [popupVisible, sendLogGNB]);
|
||||
|
||||
useEffect(() => {
|
||||
if (productData) {
|
||||
const params = {
|
||||
befPrice: productData?.priceInfo?.split("|")[0],
|
||||
@@ -69,7 +75,7 @@ export default function UnableProduct({
|
||||
|
||||
return () => sendLogProductDetail(params);
|
||||
}
|
||||
}, [productData, sendLogGNB, sendLogProductDetail]);
|
||||
}, [productData, sendLogProductDetail]);
|
||||
|
||||
const handleIndicatorOptions = useCallback(() => {
|
||||
if (productData) {
|
||||
|
||||
@@ -29,6 +29,8 @@ export default function OnSalePanel({ panelInfo, spotlightId }) {
|
||||
|
||||
const dispatch = useDispatch();
|
||||
|
||||
const popupVisible = useSelector((state) => state.common.popup.popupVisible);
|
||||
|
||||
const categoryInfos = useSelector(
|
||||
(state) => state.onSale.onSaleData.data.categoryInfos
|
||||
);
|
||||
@@ -70,8 +72,10 @@ export default function OnSalePanel({ panelInfo, spotlightId }) {
|
||||
// }, [panelInfo]);
|
||||
|
||||
useEffect(() => {
|
||||
sendLogGNB(LOG_MENU.ON_SALE);
|
||||
}, [sendLogGNB]);
|
||||
if (!popupVisible) {
|
||||
sendLogGNB(LOG_MENU.ON_SALE);
|
||||
}
|
||||
}, [popupVisible, sendLogGNB]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!panelInfo?.noResetFlag) {
|
||||
|
||||
Reference in New Issue
Block a user